.section.slogan {padding-bottom: 1.7916666667rem;position: relative;padding-top: 1.0555555556rem; } @media (min-width: 768px) {.section.slogan {padding-top: 1.6666666667rem;} } .section.slogan .container > .row {position: relative;background: linear-gradient(to right, rgba(255, 237, 152, 0.5), rgba(254, 246, 193, 0.5));border-radius: 2.2222222222rem;padding: 1.2222222222rem 0.4444444444rem 1.1666666667rem 0.4444444444rem;margin-left: 0;margin-right: 0; } .section.slogan .container > .row::before {content: "";width: 100%;height: 100%;background: url("/static/img/background.png");background-size: cover;position: absolute;top: 0;left: 0; } @media (min-width: 389px) {.section.slogan .container > .row {margin-left: 1.1111111111rem;margin-right: 1.1111111111rem;} } @media (min-width: 576px) {.section.slogan .container > .row {border-radius: 1.6666666667rem;margin-left: 0;margin-right: 0;padding: 4.1666666667rem 2.2083333333rem 4.1666666667rem 2.4166666667rem;} } .section.slogan h1, .section.slogan .h1 {padding-top: 0;padding-bottom: 0;margin-bottom: 1.2777777778rem; } @media (min-width: 576px) {.section.slogan h1, .section.slogan .h1 {text-align: left;margin-bottom: 1rem;} } .section.slogan p {text-align: center;font-size: 1.1111111111rem;line-height: 1.5;margin-bottom: 0.8888888889rem; } @media (min-width: 576px) {.section.slogan p {text-align: left;font-size: 1rem;line-height: 1.3333333333;margin-bottom: 0.6666666667rem;} } .section.slogan .content {margin-bottom: 1.3333333333rem; } @media (min-width: 576px) {.section.slogan .content {margin-bottom: 1rem;} } .section.slogan .col-text {order: 1;margin: 0;display: flex;flex-direction: column;align-items: baseline;justify-content: center; } @media (max-width: 991.98px) {.section.slogan .col-text {text-align: center;} } .section.slogan .col-img {display: flex;align-items: center;flex-direction: column;order: 2; } @media (min-width: 576px) {.section.slogan .col-img {padding-top: 3.0416666667rem;order: 2;} } .section.slogan .col-img .img-fluid {width: 100%;max-width: 17.5rem; } @media (min-width: 576px) {.section.slogan .col-img .img-fluid {max-width: 13.1666666667rem;} } .section.slogan .col-btn {display: flex;flex-direction: column;align-items: center;order: 2; } @media (min-width: 576px) {.section.slogan .col-btn {flex-direction: row;order: 3;} }