.slogan {padding-top: 2.7777777778rem;padding-bottom: 1.3888888889rem; } .slogan h2 {line-height: 1;margin-bottom: 0;text-align: center;color: var(--black);font-size: 2.2222222222rem; } .slogan h2.footer-title {margin-bottom: 1.6666666667rem; } .slogan .banner-content {text-align: center; } .slogan .banner-content .col-auto {display: flex;flex-direction: column;justify-content: center; } @media (max-width: 767.98px) {.slogan .banner-content .col-auto {flex-grow: 1;} } .slogan .banner-content h3 {font-size: 2.2222222222rem;font-weight: 400;text-align: center; } .slogan .col-img {display: flex;align-items: center; } .slogan .col-img.col-img-left {justify-content: flex-end;padding-right: 1.6666666667rem; } @media (max-width: 767.98px) {.slogan .col-img.col-img-left {justify-content: center;} } .slogan .col-img.col-img-right {justify-content: flex-start;padding-left: 1.6666666667rem; } @media (max-width: 767.98px) {.slogan .col-img.col-img-right {justify-content: center;} } .slogan .bg-red {background-color: var(--primary) !important;padding-top: 2.2222222222rem;border-radius: 1rem;color: var(--white); } .slogan .bg-red h2 {color: var(--white);margin-bottom: 1.6666666667rem; } .slogan .bg-red h2 span {display: inline-block;position: relative;max-width: 70%; } @media (max-width: 991.98px) {.slogan .bg-red h2 span {max-width: 90%;} } .slogan .bg-red h2 span::before {content: " ";position: absolute;left: -100px;height: 2px;background: var(--white);top: 50%;transform: translateY(-50%);right: 100%;margin-right: 2.2222222222rem; } .slogan .bg-red h2 span::after {content: " ";position: absolute;right: -100px;height: 2px;background: var(--white);top: 50%;transform: translateY(-50%);left: 100%;margin-left: 2.2222222222rem; } @media (max-width: 991.98px) {.slogan .bg-red h2 span::after, .slogan .bg-red h2 span::before {display: none;} } .slogan .bg-red .banner-content {text-align: left; } .slogan .bg-red .row .col:first-child {padding: 0 0.8333333333rem 0 1.6666666667rem; } @media (max-width: 767.98px) {.slogan .bg-red .row .col:first-child {padding: 0.8333333333rem 1.6666666667rem;} } .slogan .bg-red .row .col:last-child {padding: 1.6666666667rem; } @media (max-width: 767.98px) {.slogan .bg-red .row .col:last-child {padding: 0.8333333333rem 1.6666666667rem;} }