section.gt-block.why-live-with-us-section {
padding: 10rem 0;
}
@media screen and (max-width: 600px) {
section.gt-block.why-live-with-us-section {
padding: 6rem 0;
}
}
section.gt-block.why-live-with-us-section .container {
position: relative;
}
section.gt-block.why-live-with-us-section .container .inner {
position: relative;
z-index: 2;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 5rem;
}
@media screen and (max-width: 680px) {
section.gt-block.why-live-with-us-section .container .inner {
gap: 4rem;
}
}
section.gt-block.why-live-with-us-section .container > svg {
position: absolute;
top: -3.3rem;
right: 0;
-webkit-transform: translateX(43%);
transform: translateX(43%);
width: 50rem;
height: auto;
z-index: 1;
}
@media screen and (max-width: 1720px) {
section.gt-block.why-live-with-us-section .container > svg {
right: 10rem;
}
}
@media screen and (max-width: 1530px) {
section.gt-block.why-live-with-us-section .container > svg {
right: 20rem;
}
}
@media screen and (max-width: 1315px) {
section.gt-block.why-live-with-us-section .container > svg {
width: 30rem;
}
}
@media screen and (max-width: 550px) {
section.gt-block.why-live-with-us-section .container > svg {
right: auto;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
}
@media screen and (max-width: 680px) {
section.gt-block.why-live-with-us-section .section-header__button {
display: none;
}
}
.why-live-with-us-section__footer {
display: none;
text-align: right;
}
@media screen and (max-width: 680px) {
.why-live-with-us-section__footer {
display: block;
}
}
.why-live-with-us-section__footer .link-with-arrow {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
}
.reasons-items {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 7rem 2rem;
}
@media screen and (max-width: 1024px) {
.reasons-items {
gap: 6rem 4rem;
}
}
@media screen and (max-width: 740px) {
.reasons-items {
grid-template-columns: repeat(3, 1fr);
gap: 3rem;
}
}
@media screen and (max-width: 550px) {
.reasons-items {
grid-template-columns: repeat(2, 1fr);
}
}
@media screen and (max-width: 490px) {
.reasons-items {
grid-template-columns: 1fr;
gap: 2.2rem;
}
}