You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

121 lines
2.0 KiB

@import "../../src/scss/variables.scss";
@import "../../src/scss/mixins.scss";
.component-header {
width: 100%;
background: $light-grey;
.image {
width: 100%;
}
.title {
display: block;
font-size: $font-40;
font-weight: 300;
line-height: 45px;
color: $blue;
padding: 10px 0 5px 0;
margin: 0;
&:after {
display: block;
content: '';
height: 2px;
margin-top: 20px;
width: 100%;
background: linear-gradient(to right, $blue, $light-grey);
}
}
.suptitle {
font-size: $font-18;
font-weight: bold;
line-height: 20px;
color: $black;
padding: 25px 0 0 0;
margin: 0;
text-transform: uppercase;
}
.subtitle {
font-size: $font-18;
font-weight: bold;
line-height: 20px;
color: $dark-grey;
padding: 25px 0;
margin: 0;
text-transform: uppercase;
}
.text {
font-size: $font-18;
font-weight: normal;
line-height: 25px;
padding-bottom: 50px;
margin: 0;
color: $dark-grey;
}
.line {
background: $yellow;
min-height: 70px;
text-align: center;
.container {
min-height: 70px;
.line-text {
display: inline-block;
color: $black;
font-size: $font-18;
text-transform: uppercase;
font-weight: normal;
padding: 20px 0;
}
.code {
display: inline-block;
color: $black;
font-size: $font-32;
font-weight: bold;
}
}
}
}
@media (min-width: map-get($grid-breakpoints, 'md')) {
.component-header {
.title {
//font-size: $font-50;
//line-height: 60px;
font-size: $font-44;
line-height: $font-50;
}
.subtitle {
//font-size: $font-18;
font-size: $font-16;
padding-bottom: 15px;
}
.text {
//font-size: $font-18;
font-size: $font-16;
}
.line {
.container {
.line-text {
font-size: $font-18;
}
.code {
font-size: $font-32;
}
}
}
}
}