.testride {
position: relative;
display: flex;
}
.testride__map {
width: 50%;
height: 100vh;
}
@media (max-width: 991.98px) {
.testride__map {
display: none;
}
}
.testride__map .gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom {
bottom: 100rem !important;
right: 113rem !important;
}
@media (max-width: 991.98px) {
.testride__map .gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom {
bottom: 270rem !important;
right: 60rem !important;
}
}
@media (max-width: 575.98px) {
.testride__map .gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom {
bottom: 251rem !important;
right: 50rem !important;
}
}
.testride__contact {
width: 100%;
height: 100vh;
background-color: #ffffff;
padding: 139rem 29rem 121.5rem 129rem;
counter-reset: stepNo;
position: relative;
}
@media (max-width: 991.98px) {
.testride__contact {
padding: 84rem 27rem 72rem 27rem;
height: auto;
}
}
.testride__contact .os-scrollbar.os-scrollbar-vertical {
top: 11%;
}
.testride__contact__container {
width: 951rem;
flex-shrink: 0;
position: relative;
z-index: 1;
}
@media (max-width: 991.98px) {
.testride__contact__container {
width: 100%;
}
}
.testride__contact__title {
font-size: 34rem;
line-height: 54rem;
letter-spacing: 0.01em;
font-weight: 700;
color: #000000;
font-family: "GEELY", Arial, Helvetica, sans-serif;
}
@media (max-width: 991.98px) {
.testride__contact__title {
font-size: 18rem;
line-height: 28rem;
letter-spacing: 0.02em;
}
}
* + .testride__contact__excerpt {
margin-top: 22rem;
}
.testride__contact__excerpt {
font-size: 16rem;
line-height: 24rem;
letter-spacing: 0.03em;
color: #000000;
}
@media (max-width: 991.98px) {
.testride__contact__excerpt {
display: none;
}
}
* + .testride__contact__steps {
margin-top: 55rem;
}
@media (max-width: 991.98px) {
* + .testride__contact__steps {
margin-top: 22rem;
}
}
.testride__contact__steps {
padding-right: 83rem;
}
@media (max-width: 991.98px) {
.testride__contact__steps {
padding-right: 0rem;
}
}
* + .testride__contact__step {
margin-top: 55rem;
}
@media (max-width: 991.98px) {
* + .testride__contact__step {
margin-top: 35rem;
}
}
.testride__contact__step {
position: relative;
counter-increment: stepNo;
}
@media (max-width: 991.98px) {
.testride__contact__step--mobreverse {
display: flex;
flex-direction: column;
align-items: flex-start;
}
}
.testride__contact__step__title {
font-size: 14rem;
line-height: 24rem;
font-weight: 800;
letter-spacing: 0.03em;
color: #000000;
text-transform: uppercase;
}
@media (max-width: 991.98px) {
.testride__contact__step__title {
font-size: 16rem;
line-height: 23rem;
font-weight: 700;
letter-spacing: 0em;
font-family: "GEELY", Arial, Helvetica, sans-serif;
text-transform: none;
}
}
.testride__contact__step__title::before {
content: counter(stepNo) ". ";
display: inline-block;
}
* + .testride__contact__step__excerpt {
margin-top: 17.5rem;
}
@media (max-width: 991.98px) {
* + .testride__contact__step__excerpt {
margin-top: 26.5rem;
}
}
.testride__contact__step__excerpt {
font-size: 12rem;
line-height: 18rem;
letter-spacing: 0.03em;
color: #000000;
}
* + .testride__contact__step__modelsnav {
margin-top: 26.5rem;
}
.testride__contact__step__modelsnav {
display: none;
}
@media (max-width: 991.98px) {
.testride__contact__step__modelsnav {
display: flex;
}
}
.testride__contact__step__modelsnav__item {
width: 50%;
display: flex;
align-items: center;
gap: 10rem;
font-size: 12rem;
line-height: 24rem;
letter-spacing: 0.01em;
color: #000000;
font-weight: 800;
}
.testride__contact__step__modelsnav__item::before {
content: "";
display: block;
width: 20rem;
height: 20rem;
border-radius: 9999px;
border: 1px solid #E3E0DB;
}
.testride__contact__step__modelsnav__item::after {
content: "";
width: 24rem;
height: 24rem;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
background-image: url(//www.geelyauto.pl/wp-content/themes/customtheme/assets/images/global/check_slim.svg);
display: none;
}
.testride__contact__step__modelsnav__item > div {
order: 1;
}
.testride__contact__step__modelsnav__item.active::before {
display: none;
}
.testride__contact__step__modelsnav__item.active::after {
display: block;
}
* + .testride__contact__step__models {
margin-top: 20rem;
}
@media (max-width: 991.98px) {
* + .testride__contact__step__models {
margin-top: 14.5rem;
}
}
.testride__contact__step__models {
display: flex;
gap: 10rem;
}
.testride__contact__step__models__item {
position: relative;
width: calc(50% - 5rem);
display: flex;
flex-direction: column;
gap: 10rem;
border-radius: 10rem;
border: 1px solid #F5F4F4;
padding: 9rem 0rem 18rem 0rem;
}
.testride__contact__step__models__item::before {
content: "";
display: block;
width: 100%;
height: 100%;
border-radius: inherit;
border: 2px solid #3a7ff8;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
pointer-events: none;
transition: opacity 0.2s linear;
opacity: 0;
}
.testride__contact__step__models__item::after {
content: "";
display: block;
width: 24rem;
height: 24rem;
position: absolute;
top: -7rem;
right: -7rem;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
background-image: url(//www.geelyauto.pl/wp-content/themes/customtheme/assets/images/global/check_slim.svg);
filter: drop-shadow(4rem 10rem 20rem rgba(62, 62, 62, 0.13));
transition: opacity 0.2s linear;
opacity: 0;
}
.testride__contact__step__models__item.error::before {
opacity: 1;
border-color: #F20E0E;
}
.testride__contact__step__models__item__img {
width: 103.8%;
height: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
object-fit: contain;
}
@media (max-width: 991.98px) {
.testride__contact__step__models__item__img {
height: 106.27%;
}
}
.testride__contact__step__models__item__img__container {
position: relative;
width: 100%;
height: 237rem;
}
@media (max-width: 991.98px) {
.testride__contact__step__models__item__img__container {
height: 223rem;
}
}
.testride__contact__step__models__item__title {
font-size: 14rem;
line-height: 24rem;
letter-spacing: 0.03em;
font-weight: 800;
color: #000000;
text-align: center;
transition: color 0.2s linear;
}
@media (max-width: 991.98px) {
.testride__contact__step__models__item__title {
display: none;
}
}
.testride__contact__step__models__item.active {
box-shadow: 2rem 7rem 20rem rgba(149, 149, 149, 0.1);
border-color: transparent;
}
.testride__contact__step__models__item.active::before {
opacity: 1;
border-color: #3a7ff8;
}
.testride__contact__step__models__item.active::after {
opacity: 1;
}
.testride__contact__step__models__item.active .testride__contact__step__models__item__title {
color: #3a7ff8;
}
@media (max-width: 991.98px) {
.testride__contact__step__models__item {
box-shadow: 2rem 7rem 20rem rgba(149, 149, 149, 0.1);
border-color: transparent;
}
.testride__contact__step__models__item::before {
opacity: 1;
border-color: #3a7ff8;
}
.testride__contact__step__models__item::after {
opacity: 1;
}
.testride__contact__step__models__item .testride__contact__step__models__item__title {
color: #3a7ff8;
}
.testride__contact__step__models__item {
width: 100%;
padding: 0rem;
}
}
* + .testride__contact__step__buttons {
margin-top: 23.5rem;
}
.testride__contact__step__buttons {
display: flex;
gap: 18rem;
}
@media (max-width: 991.98px) {
.testride__contact__step__buttons {
display: none;
}
}
.testride__contact__step__buttons__item {
position: relative;
width: calc(50% - 9rem);
}
@media (max-width: 991.98px) {
.testride__contact__step__buttons__item--mobile {
width: calc(100% - 32rem);
position: absolute;
top: 16rem;
left: 50%;
transform: translateX(-50%);
}
}
.testride__contact__step__buttons__item .input {
width: 100%;
}
@media (max-width: 991.98px) {
.testride__contact__step__buttons__item .input {
border-color: transparent;
background-color: #ffffff;
box-shadow: 20rem 20rem 34rem rgba(62, 62, 62, 0.16);
letter-spacing: 0em;
line-height: 18rem;
}
}
@media (max-width: 991.98px) {
.testride__contact__step__buttons__item .input::placeholder {
color: #000000;
letter-spacing: 0em;
line-height: 18rem;
}
}
.testride__contact__step__buttons__item .button-new {
width: 100%;
}
* + .testride__contact__step__fields {
margin-top: 21.2rem;
}
@media (min-width: 992px) {
.testride__contact__step .footer__contact__form__add {
margin-top: 31.5rem;
}
}
.testride__contact__step .input__container {
display: block;
}
.testride__contact__step * + .input__container {
margin-top: 15rem;
}
@media (max-width: 991.98px) {
.testride__contact__step * + .input__container {
margin-top: 10.2rem;
}
}
.testride__contact__step .input {
padding-left: 31.5rem;
font-size: 12rem;
line-height: 23rem;
letter-spacing: 0.03em;
}
@media (max-width: 991.98px) {
.testride__contact__step .input {
padding: 12.5rem 31.5rem 12.5rem 15rem;
}
}
.testride__contact__step .input::placeholder {
font-size: 12rem;
line-height: 23rem;
letter-spacing: 0.03em;
}
@media (max-width: 991.98px) {
.testride__contact__step .input::placeholder {
color: #595A5A;
}
}
* + .testride__contact__step__submit {
margin-top: 34.2rem;
}
@media (max-width: 991.98px) {
* + .testride__contact__step__submit {
margin-top: 24rem;
}
}
@media (max-width: 991.98px) {
.testride__contact__step__submit .button-new {
width: 100%;
}
}
.testride__contact__step__map {
width: 100%;
height: 486rem;
border-radius: 8rem;
}
* + .testride__contact__step__map__container {
margin-top: 30rem;
}
.testride__contact__step__map__container {
width: 100%;
position: relative;
display: none;
}
@media (max-width: 991.98px) {
.testride__contact__step__map__container {
display: block;
}
}
.testride__contact__step__map__container * + .button-new {
margin-top: 15rem;
}
.testride__contact__step__map__container .button-new {
width: 100%;
}
@media (max-width: 991.98px) {
.testride__contact__step__map__container--mob1 {
order: 1;
}
}
.testride__panels {
position: absolute;
top: 120rem;
right: 27rem;
display: flex;
flex-direction: column;
gap: 24rem;
}
@media (min-width: 992px) {
.testride__panels--lifted {
top: 71rem;
}
}
.testride__panels__title {
font-size: 24rem;
line-height: 32rem;
letter-spacing: 0.01em;
font-weight: 700;
color: #000000;
font-family: "GEELY", Arial, Helvetica, sans-serif;
}
@media (max-width: 991.98px) {
.testride__panels__title {
font-size: 18rem;
line-height: 28rem;
letter-spacing: 0.02em;
}
}