@import 'mixins'; @import 'variables'; body { background-color: #f8f7f3; } .page-data { overflow: hidden; } .container { @include respond-above(xxl) { max-width: 1530px; } } .h2 { font-size: 50px; font-weight: 250; line-height: 1; letter-spacing: 2px; font-family: $font3; @include respond-below(xs) { font-size: 34px; } } .h3 { font-size: 34px; font-weight: 300; line-height: 1; letter-spacing: 2px; font-family: $font3; color: #1d1d1e; @include respond-below(xs) { font-size: 24px; } } .h4 { font-size: 24px; font-weight: 300; line-height: 1; letter-spacing: 2px; font-family: $font3; color: #1d1d1e; } .p { font-size: 16px; font-weight: 300; line-height: 24.8px; strong { font-weight: 700; } } .box-mb { margin-bottom: 120px; @include respond-below(xs) { margin-bottom: 60px; } } #scontainer-144 { @extend .box-mb; h2 { @extend .h2; margin-bottom: 48px; padding-bottom: 48px; border-bottom: 1px solid #000000; @include respond-below(sm) { margin-bottom: 30px; padding-bottom: 30px; } } p { @extend .p; &:last-child { margin-bottom: 0; } } .col-left { width: 100%; max-width: 566px; @include respond-below(sm) { margin-bottom: 30px; } } } #scontainer-145 { @extend .box-mb; h3 { @extend .h3; margin-bottom: 48px; @include respond-below(xs) { margin-bottom: 30px; } } p { @extend .p; text-transform: uppercase; } ul { li { @extend .p; &:not(:last-child) { margin-bottom: 20px; } } } .row { @include respond-below(sm) { flex-direction: column-reverse; } } .col-left { display: flex; justify-content: flex-end; @include respond-below(sm) { justify-content: center; } img { max-width: unset !important; @include respond-above(sm) { width: auto !important; } @include respond-below(sm) { width: 100vw !important; } } } .col-right { position: relative; margin: 0 auto; max-width: fit-content; @include respond-above(sm) { padding-bottom: 48px; &::before { content: ''; position: absolute; bottom: 0; left: 0; height: 1px; width: 260px; background-color: #000000; } } @include respond-below(sm) { padding-bottom: 20px; } } } #scontainer-146 { @extend .box-mb; .row { &:nth-child(1) { margin-bottom: 48px; h3 { @extend .h3; @include respond-above(sm) { text-align: center; } } } } .col-md-4 { &:nth-child(1) { background: #1d1d1e; .tile { h3, p { color: #fff; } } } &:nth-child(2) { background: #ffffff; } &:nth-child(3) { background: #ffed00; } } .tile { padding: 60px 20px; h3 { @extend .h4; text-transform: uppercase; margin-bottom: 30px; } p { @extend .p; &:last-child { margin-bottom: 0; } strong { display: block; } } } } #scontainer-147 { @extend .box-mb; h3 { @extend .h3; margin-bottom: 30px; text-transform: uppercase; } h4 { @extend .h4; margin-bottom: 30px; margin-top: 30px; text-transform: uppercase; } p { @extend .p; } ul { li { @extend .p; &:not(:last-child) { margin-bottom: 20px; } } } .col-right { display: flex; justify-content: flex-start; @include respond-below(sm) { justify-content: center; } img { max-width: unset !important; @include respond-above(sm) { width: auto !important; } @include respond-below(sm) { width: 100vw !important; } } } .col-left { position: relative; max-width: 620px; @include respond-above(sm) { padding-bottom: 48px; &::before { content: ''; position: absolute; bottom: 0; left: 0; height: 1px; width: 260px; background-color: #000000; } } @include respond-below(sm) { padding-bottom: 20px; } } }