@charset "UTF-8";

html.active {
    overflow: hidden;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.breadcrumbs {
    padding-top: 180px;
}

.breadcrumbs ul {
    display: flex;
    align-items: center;
    gap: 8px;

}

@media (max-width:768px) {
    .breadcrumbs ul {
        white-space: nowrap;
        width: 100%;
        overflow: scroll;
    }
}

.breadcrumbs ul li {
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    color: #284157;
}

.breadcrumbs ul li a {
    color: #284157;
}

.breadcrumbs ul li a:hover {
    color: #284157;
}

.hero .breadcrumbs {
    padding: 0 20px;
    position: absolute;
    z-index: 5;
    top: 180px;
}

.logo,
.logo-color {
    max-width: 100px;
}

.logo img,
.logo-color img {
    width: 100%;
}

/* .wrapper .logo-color {
    display: none;
}

.wrapper.color-header .logo-color {
    display: block;
}

.wrapper.color-header .logo {
    display: none;
}

.wrapper.color-header .header a {
    color: #1E1E1E;
}

.wrapper.color-header .header__soc button {
    background: #284157;
    color: #fff;
}

.wrapper.color-header .header__soc svg path {
    fill: #284157;
}

.wrapper.color-header .header__lang span {
    color: #1E1E1E;
}

.wrapper.color-header .header.scrolled {
    background: #fff;
} */

.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    padding: 15px 0;
    transition: 0.3s;
    background: #284157;
}


.header__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.header__container {
    display: flex;
    justify-content: space-between;
    /* flex-direction: column; */
    gap: 8px;
    width: 100%;
}

.header__soc {
    display: flex;
    align-items: center;
    gap: 24px;
    justify-content: end;
}

.header__tel {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #FFF;
    font-family: Raleway;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px;
    /* 116.667% */
    padding-bottom: 5px;
    position: relative;
}
.header__tel::after {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    height: 2px;
    width: 0;
    background: #fff;
    transition: .3s;
}
.header__tel:hover::after {
    width: 100%;
}

.header__soc ul {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header__soc ul svg path {
    transition: 0.3s;
}

/* .header.scrolled svg.scroll path {
    fill: #fff;
}

.wrapper.color-header .header.scrolled svg.scroll path {
    fill: #007185;
} */

.header__soc ul a:hover svg path {
    fill: #fff;
    fill-opacity: 1;
}

.header__nav .header__soc ul a:hover {
    background-color: transparent;
}

.header__soc button {
    display: flex;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: #FFF;
    font-family: Raleway;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px;
    /* 116.667% */
    border-radius: 16px;
    background: #d0be5a;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.header__soc button:hover {
    background-color: #284157;
}

.header__nav {
    width: 100%;
}

.header__wrapp {
    display: flex;
    align-items: center;
    gap: 30px;
}

.header__nav ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.header__nav ul a {
    color: #FFF;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    border-radius: 2px;
    position: relative;
    padding-bottom: 3px;
}

.header__nav ul a::after {
    position: absolute;
    content: '';
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background: #fff;
    transition: .3s;
}

.header__nav ul a:hover::after {
    width: 100%;
}

.header__lang {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    position: relative;
    cursor: pointer;
}

.header__lang span {
    color: #FFF;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.header__lang button {
    background: transparent;
}

.header__lang-group {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 35px;
    left: 0;
    background: #fff;
    width: 62px;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    box-shadow: -8px 5px 10px 2px rgba(34, 60, 80, 0.2);
}

.header__lang-group.active {
    opacity: 1;
    visibility: visible;
}

.header__lang-group a {
    color: #007185;
    padding: 10px;
}

.header__lang-group a:hover {
    background: #007185;
    color: #fff;
}

.header__lang svg g {
    transition: 0.3s;
}

.header__lang:hover svg g {
    transform: rotate(45deg) translate(6px, -15px);
}

.header .burger {
    position: relative;
    width: 48px;
    height: 48px;
    cursor: pointer;
    display: none;
}

.header .burger::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #284157;
}

.header .burger span {
    position: absolute;
    content: "";
    width: 60%;
    height: 2px;
    background-color: #fff;
    transition: 0.3s;
    z-index: 5;
    border-radius: 5px;
}

.header .burger span:first-of-type {
    top: 18px;
}

.header .burger span:nth-last-of-type(2) {
    top: 51%;
}

.header .burger span:last-of-type {
    bottom: 15px;
}

.header .burger.active span:first-of-type {
    transform: rotate(-45deg);
    top: 21px;
    background-color: #fff;
}

.header .burger.active span:last-of-type {
    transform: rotate(45deg);
    bottom: 25px;
    background-color: #fff;
}

.header .burger.active span:nth-last-of-type(2) {
    display: none;
}

.header__nav p {
    display: none;
    position: fixed;
    top: 50px;
    left: 30px;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 120% */
}

@media (max-width: 1240px) {
    .header .burger {
        display: flex;
        justify-content: center;
        z-index: 1000;
        order: 3;
    }

    .header .hero__slide h2 {
        font-size: 50px;
    }

    .header__nav {
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: -100%;
        background: #fff;
        transition: 0.3s;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        z-index: 100;
        padding: 24px;
        overflow: auto;
    }

    .header__nav.active {
        left: 0;
    }

    .header__nav.active p {
        display: block;
    }

    .header__nav.active ul a {
        color: #1E1E1E;
        font-family: Raleway;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        /* 125% */
    }

    .header__wrapp {
        flex-direction: column;
        align-items: baseline;
        position: relative;
    }

    .header__wrapp ul {
        padding-top: 200px;
        position: relative;
    }

    .header__lang {
        margin-left: 0;
    }

    .header__lang span {
        color: #1E1E1E;
    }

    .header__nav ul {
        flex-direction: column;
        align-items: baseline;
    }

    .header__soc {
        order: 3;
        flex-direction: column;
        align-items: baseline;
    }

    .header__soc svg path {
        fill: #284157;
        fill-opacity: 1;
    }

    .header__soc ul {
        flex-direction: row;
        order: 2;
    }

    .header__soc button {
        border-radius: 30px;
        background: #284157;
        margin-top: 24px;
    }

    .header__tel {
        color: #1E1E1E;
        font-variant-numeric: lining-nums proportional-nums;
        font-family: Raleway;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        /* 125% */
        order: 3;
    }
}

@media (max-width: 768px) {
    .header .hero__slide h2 {
        font-size: 38px;
    }
}

.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 13, 15, 0.5);
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}

.modal.active {
    opacity: 1;
    visibility: visible;
}

.modal__wrapper {
    background: #F3F3F3;
    width: 100%;
    max-width: 640px;
    margin: auto;
    padding: 35px;
    position: relative;
}

.modal__close {
    position: absolute;
    top: 0;
    right: 0;
    width: 36px;
    height: 36px;
}

.modal__wrapper p {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin-top: 8px;
}

.modal__wrapper form {
    display: flex;
    flex-direction: column;
}

.modal__wrapper form label,
.modal__wrapper form p {
    margin-top: 24px;
    margin-bottom: 8px;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.modal__wrapper form label span,
.modal__wrapper form p span {
    color: #F71515;
}

.modal__wrapper form input {
    border: 1px solid #D9D9D9;
    padding: 10px 16px;
    background: transparent;
    color: #1E1E1E;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.modal__wrapper form input::-moz-placeholder {
    color: #B2B2B2;
}

.modal__wrapper form input::placeholder {
    color: #B2B2B2;
}

.modal__wrapper form select {
    border: 1px solid #1E1E1E;
    padding: 10px 16px;
    color: #1E1E1E;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    cursor: pointer;
}

.modal__wrapper form button {
    margin-top: 24px;
    padding: 10px 16px;
}

.modal__wrapper .control-label p {
    margin: 0;
}

.modal__wrapper .control-label p a {
    color: #284157;
}

.modal__wrapper .control-label p a:hover {
    text-decoration: underline;
}

.control-label {
    position: relative;
    display: flex;
    gap: 8px;
}

.control-mark {
    position: relative;
    border: 1px solid #284157;
    width: 100%;
    max-width: 15px;
    height: 15px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.control-mark::after {
    position: absolute;
    content: "";
    left: -1px;
    width: 15px;
    height: 15px;
    background: url("../img/control-icon.svg") center no-repeat;
    display: none;
}

input[type=checkbox]:checked+.control-mark::after {
    display: block;
}

.hero {
    position: relative;
    padding-top: 94px;
}

.hero__slider .swiper-button-prev::after,
.hero__slider .swiper-button-next::after {
    content: "";
}

.hero__slider .swiper-button-prev,
.hero__slider .swiper-button-next {
    top: -106px;
}

.hero__slider .swiper-button-prev {
    left: 93%;
}

.hero__btn {
    position: relative;
}

/* .hero__slider .swiper-slide-active img {
    animation: scale 10s linear infinite;
}

@keyframes scale {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.2);
    }
} */

.hero__wrapper {
    position: relative;
    z-index: 5;
    padding: 21% 20px;
}

.hero__slide {
    position: relative;
}

.hero__slide .mob-img {
    display: none;
}

/*
.hero__slide::after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    background: rgba(0, 13, 15, 0.5019607843);
} */

.hero__slide p {
    color: #FFF;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    /* 125% */
}

.hero__slide h2 {
    color: #FFF;
    font-family: Raleway;
    font-size: 56px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.hero__slide a {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #FFF;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    opacity: 0;
    visibility: hidden;
}

.hero__slide:hover a {
    opacity: 1;
    visibility: visible;
}

.hero__container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 250px;
    width: 100%;
    max-width: 950px;
}

.hero__group {
    border-top: 1px solid #fff;
    padding-top: 33px;
    cursor: pointer;
}

.hero__group span,
.hero__group p {
    color: #FFF;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

@media (max-width: 1180px) {
    .hero__container {
        max-width: 850px;
    }

    .hero .hero__slide h2 {
        font-size: 50px;
    }
}

@media (max-width: 992px) {
    .hero__slider .swiper-button-prev {
        left: 88%;
    }

    .hero__container {
        max-width: 550px;
    }

    .hero .hero__slide h2 {
        font-size: 46px;
    }
}

@media (max-width: 768px) {

    .hero__slider .swiper-button-prev,
    .hero__slider .swiper-button-next {
        top: -156px;
    }

    .hero__slider .swiper-button-prev {
        left: 3%;
    }

    .hero__slider .swiper-button-next {
        right: 85%;
    }

    .hero__wrapper {
        padding-top: 140%;
    }

    .hero .hero__slide h2 {
        font-size: 38px;
    }

    .hero__slide .mob-img {
        display: block;
    }

    .hero__slide .desc-img {
        display: none;
    }
}

@media (max-width: 540px) {
    .hero__slider .swiper-button-next {
        right: 80%;
    }

    .hero__group {
        display: none;
    }
}

.project {
    margin-top: 56px;
    /* Убираем стандартные стили */
    /* Основная линия */
    /* Круглые ручки (ползунки) */
    /* Убираем псевдоэлементы ручек */
    /* Ховер эффект */
}

.project__link {
    max-width: 280px;
    margin-top: 10px;
}

.project form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-top: 24px;
}

.project__filter-btn-mob {
    display: none;
}

.project__filter-btn-mob button {
    padding: 12px 24px;
}

.project__filter-desc {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: rgba(0, 116, 132, 0.05);
    border-radius: 40px;
    overflow: hidden;
}

.project__filter-wrapp {
    background: rgba(0, 116, 132, 0.05);
    position: relative;
    transition: 0.3s;
    cursor: pointer;
}

.project__filter-wrapp:hover {
    background: #284157;
}

.project__filter-wrapp.active {
    background: #284157;
}

.project__filter-wrapp.active p {
    color: #fff;
}

.project__filter-wrapp p {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    padding: 12px 24px;
}

.project__filter-wrapp:hover p {
    color: #fff;
}

.project__filter-wrapp svg {
    position: absolute;
    top: 38%;
    right: 10px;
    width: 10px;
    height: 10px;
    z-index: 6;
}

.project__filter-wrapp svg {
    transition: 0.3s;
}

.project__filter-wrapp svg path {
    transition: 0.3s;
}

.project__filter-wrapp:hover svg path {
    stroke: #fff;
}

.project__filter-wrapp.active svg path {
    stroke: #fff;
}

.project__filter-wrapp.active svg {
    transform: rotate(180deg);
}

.project__filter-wrapp:not(:last-child)::after {
    position: absolute;
    content: "";
    top: 30%;
    right: 0;
    margin: auto;
    width: 1px;
    height: 16px;
    background: rgba(0, 116, 132, 0.2);
}

.project__filter-btn {
    display: flex;
    align-items: center;
}

.project__filter-btn button:first-of-type {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    /* 114.286% */
    padding: 12px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    border-radius: 40px;
}

.project__filter-btn button:first-of-type p {
    opacity: 0;
    visibility: hidden;
}

.project__filter-btn button:first-of-type span:first-of-type {
    transition: 0.3s;
    position: absolute;
    top: 29%;
    left: 0;
    right: 0;
    margin: auto;
}

.project__filter-btn button:first-of-type:hover span:first-of-type {
    top: -50%;
}

.project__filter-btn button:first-of-type span:last-of-type {
    position: absolute;
    bottom: -50%;
    transition: 0.3s;
}

.project__filter-btn button:first-of-type:hover span:last-of-type {
    bottom: 29%;
    color: #284157;
    text-decoration: underline;
}

.project__filter-btn button:last-of-type {
    padding: 12px 24px;
    color: #FFF;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    position: relative;
    display: flex;
    align-items: center;
    width: 220px;
    overflow: hidden;
}

.project__filter-btn button:last-of-type p {
    position: absolute;
    transition: 0.3s;
    top: 29%;
    left: 0;
    right: 0;
    margin: auto;
}

.project__filter-btn button:last-of-type p span {
    opacity: 1;
    visibility: visible;
}

.project__filter-btn button:last-of-type:hover p:first-of-type {
    top: -50%;
}

.project__filter-btn button:last-of-type p:last-of-type {
    top: 100%;
}

.project__filter-btn button:last-of-type:hover p:last-of-type {
    top: 29%;
    text-decoration: underline;
}

.project__filter-btn button:last-of-type span {
    font-weight: 800;
    margin-left: auto;
    opacity: 0;
    visibility: hidden;
}

.project__filter_item {
    width: 400px;
    position: absolute;
    background: #fff;
    left: 0;
    padding: 20px;
    top: 40px;
    z-index: 10;
}

.project .inputs {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.project input[type=number] {
    width: 20%;
    padding: 5px;
    text-align: center;
    border: 1px solid #d0d0d0;
    margin-top: 15px;
    margin-bottom: 10px;
}

.project .noUi-connects {
    height: 2px;
}

.project .range-slider .noUi-target {
    background: transparent;
    border: none;
    box-shadow: none;
}

.project .range-slider .noUi-base {
    height: 3px;
    background-color: #d0d0d0;
}

.project .range-slider .noUi-connect {
    background-color: #007185;
    /* Цвет активной линии */
}

.project .range-slider .noUi-handle {
    width: 20px;
    height: 20px;
    top: -9px;
    /* Центровка по оси */
    border: 3px solid #007185;
    /* Цвет рамки */
    background: white;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: none;
    transition: border 0.3s ease;
}

.project .range-slider .noUi-handle::before,
.project .range-slider .noUi-handle::after {
    display: none;
}

.project .range-slider .noUi-handle:hover {
    border-color: #004c5a;
}

.project .noUi-target {
    height: 1px;
}

.project__filter_item {
    display: none;
    box-shadow: 0px 5px 10px 2px rgba(34, 60, 80, 0.2);
}

.project__filter_item.active {
    display: block;
}

.project__tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: 1px solid #d0d0d0;
}

.project__tabs .build-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    padding: 12px 24px;
}

.project__tabs a.active {}

input[type="checkbox"]:checked+.build-mark {
    background: #007185;
    color: #fff;
}

.project__wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px 24px;
    margin-top: 24px;
}

.project__img {
    position: relative;
    padding: 39%;
    transition: 0.3s;
    overflow: hidden;
    border-radius: 25px;
}

.project__card {
    position: relative;
    height: 430px;
}

.project__card-content {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-top: 24px;
    /* max-height: 52px;
    overflow: hidden; */
    transition: 0.3s;
}

.project__card-content svg {
    transition: .3s;
}

.project__text {
    position: absolute;
    max-height: 52px;
    overflow: hidden;
    bottom: 0;
    transition: 0.3s;
}

.project__card:hover .project__img {
    padding: 16%;
    opacity: 0;
}

.project__card:hover .project__card-content svg {
    opacity: 0;
    visibility: hidden;
}

.project__card:hover .project__text {
    max-height: fit-content;
}

.project__card-content h3 {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 100% */
    margin-bottom: 4px;
}

.project__card-content p {
    overflow: hidden;
    color: #1E1E1E;
    text-overflow: ellipsis;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 171.429% */
    margin-bottom: 20px;
}

.project__card-content .project__text ul p {
    font-weight: 700;
    margin-bottom: 5px;
}

.project__card-content .project__text ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-top: 1px solid #d0d0d0;
    border-bottom: 1px solid #d0d0d0;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-bottom: 24px;
}

.project__card-content .project__text ul li p {
    color: #284157;
    margin-bottom: 0;
}

.project__card-content .project__text ul li span:first-of-type {
    color: #a0a0a0;
}

.project__card-content .project__text ul li span:last-of-type {
    color: #1E1E1E;
}

.project__text ul li {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
}

.project__filter_item select {
    border: 1px solid #d0d0d0;
    padding: 12px 24px;
    width: 100%;
    color: #1E1E1E;
    text-overflow: ellipsis;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 171.429% */
}

.project__filter-wrapp .project__filter_item p {
    color: #1E1E1E;
    padding: 0;
    margin-bottom: 10px;
}

.project__filter-wrapp .project__filter_item p:not(:first-of-type) {
    margin-top: 10px;
}

.project__room {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.project__type {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.project__type label {
    width: 100%;
    cursor: pointer;
}

.project .type-control {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #D9D9D9;
    background: #FFF;
    padding: 10px 16px;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.project__filter-mob {
    display: none;
}

.project input[type=radio]:checked+.type-control {
    color: #fff;
    background-color: #007185;
}

@media (max-width: 1200px) {
    .project__filter-wrapp p {
        font-size: 12px;
    }

    .project form {
        flex-wrap: wrap;
    }
}

@media (max-width: 992px) {
    .project__wrapper {
        grid-template-columns: 1fr 1fr;
    }

    .project__filter-mob-btn {
        display: block;
    }

    .project__filter-desc {
        display: none;
    }

    .project__filter {
        width: 100%;
    }

    .project__filter-mob.active {
        display: flex;
        flex-direction: column;
        background: #fff;
        box-shadow: 0px 5px 10px 2px rgba(34, 60, 80, 0.2);
        height: 550px;
        overflow: auto;
        width: 100%;
    }

    .project__filter-mob .project__filter-close {
        background: transparent;
        width: 36px;
        height: 36px;
        margin-left: auto;
    }

    .project__filter_item.active {
        position: relative;
        display: block;
        top: 0;
        border-bottom: 1px solid #d0d0d0;
        box-shadow: none;
        width: 100%;
    }

    .project__filter-btn {
        display: none;
    }

    .project__filter-btn-mob {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .project__filter-btn-mob button {
        display: flex;
        align-items: center;
    }

    .project__filter-btn-mob button:last-of-type {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 12px 24px;
        color: #1E1E1E;
        font-family: Raleway;
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 20px;
        /* 125% */
    }
}

@media (max-width: 992px) and (max-width: 768px) {
    .project__filter-btn-mob button {
        font-size: 12px;
        padding: 12px;
    }

    .project__filter-btn-mob button:last-of-type {
        font-size: 12px;
        padding: 12px;
        border-radius: 40px;
    }
}

@media (max-width: 992px) and (max-width: 600px) {
    .project__wrapper {
        grid-template-columns: 1fr;
    }
}

@media (max-width:600px) {
    .project__img {
        padding: 28%;
    }
}

@media (max-width:540px) {
    .project__img {
        padding: 32%;
    }
}

@media (max-width:480px) {
    .project__img {
        padding: 36%;
    }
}

@media (max-width:420px) {
    .project__img {
        padding: 40%;
    }
}

.advantages {
    background: #284157;
    color: #fff;
}

.advantages__wrapper {
    padding: 80px;
    display: flex;
    justify-content: space-between;
    gap: 50px;
}

.advantages__left {
    width: 50%;
}

.advantages__left h2 {
    color: #fff;
}

.advantages__left p {
    color: #FFF;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin-top: 16px;
}

.advantages__left p:last-child {
    font-weight: 700;
}

.advantages__right {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 36px;
}

.advantages__card {
    border-bottom: 1px solid rgba(217, 217, 217, 0.5019607843);
    padding-bottom: 36px;
    cursor: pointer;
}

.advantages__title {
    display: flex;
    align-items: center;
    gap: 30px;
}

.advantages__card img {
    width: 52px;
    height: 52px;
}

.advantages__svg {
    background: #fff;
    width: 30px;
    height: 30px;
    margin-left: auto;
    transition: 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.advantages__card svg {
    transition: 0.3s;
}

.advantages__card.active svg {
    transform: rotate(45deg);
}

.advantages__content {
    margin-left: 82px;
    margin-top: 20px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
}

@media (max-width: 992px) {
    .advantages__wrapper {
        flex-direction: column;
        padding: 20px;
    }

    .advantages__left {
        width: 100%;
    }

    .advantages__right {
        width: 100%;
    }
}

.form__wrapper {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    padding: 36px;
    background: #F3F3F3;
    border-radius: 25px;
    overflow: hidden;
}

.form__left {
    width: 50%;
}

.form__left p {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin-top: 8px;
}

.form__right {
    width: 50%;
}

.form__right form {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.form__right form label {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin-bottom: 8px;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.form__right form input {
    border: 1px solid #D9D9D9;
    padding: 16px;
    background: transparent;
    width: 100%;
}

.form__group {
    display: flex;
    gap: 24px;
}

.form__right p {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin-top: 8px;
}

@media (max-width: 992px) {
    .form__wrapper {
        flex-direction: column;
    }

    .form__left {
        width: 100%;
    }

    .form__right {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .form__group {
        flex-direction: column;
    }
}

.method__wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 24px;
}

.method__card {
    background: #FFF;
    box-shadow: 78px 114px 39px 0px rgba(3, 28, 33, 0), 50px 73px 35px 0px rgba(3, 28, 33, 0.01), 28px 41px 30px 0px rgba(3, 28, 33, 0.05), 12px 18px 22px 0px rgba(3, 28, 33, 0.08), 3px 5px 12px 0px rgba(3, 28, 33, 0.09);
    padding: 24px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 25px;
}

.method__card img {
    width: 72px;
    height: 72px;
    margin-bottom: 24px;
}

.method__card h3 {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 36px;
    /* 150% */
    margin-bottom: 8px;
}

.method__card p {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media (max-width: 992px) {
    .method__wrapper {
        grid-template-columns: 1fr;
    }

    .method__card h3 {
        font-size: 20px;
    }
}

.swiper-button-prev::after,
.swiper-button-next::after {
    content: "";
}

.news__slider {
    margin-top: 24px;
}

.news__slide {
    display: flex;
    flex-direction: column;
    height: 420px;
}

.news__img {
    position: relative;
    padding: 29%;
    border-radius: 25px;
    overflow: hidden;
}

.news__img span {
    position: absolute;
    top: 16px;
    left: 16px;
    background: #fff;
    padding: 8px;
}

.news__slider .swiper-button-prev,
.news__slider .swiper-button-next {
    top: 50%;
}

.news__slider .swiper-button-prev {
    left: auto;
    right: 50px;
}

.news__wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.news__wrapper a {
    margin-right: 90px;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.news__wrapper a:hover {
    text-decoration: underline;
}

.news__slide p {
    color: #444;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 171.429% */
    margin-top: 24px;
}

.news__slide h3 {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 120% */
    margin-bottom: 16px;
}

.news__slide a {
    display: flex;
    align-items: center;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    gap: 8px;
    margin-top: auto;
}

.news__arrow {
    width: 30px;
    height: 30px;
    background: #284157;
    display: flex;
    align-items: center;
    justify-content: center;
}

.news__slide a svg {
    transition: 0.3s;
}

.news__slide a:hover {
    text-decoration: underline;
}

.news__slide a:hover svg {
    transform: rotate(45deg);
}

@media (max-width: 540px) {
    .news__wrapper {
        flex-direction: column;
        align-items: baseline;
    }
}

@media (max-width: 480px) {
    .news__wrapper h2 {
        padding-right: 90px;
    }
}

.life__slide {
    position: relative;
    padding-top: 130%;
    cursor: zoom-in;
    border-radius: 25px;
    overflow: hidden;
}

.life__slide.fullscreen {
    cursor: zoom-out;
}

.life__slide.fullscreen {
    padding: 35%;
}

.life__slide.fullscreen .bg-img {
    -o-object-fit: contain;
    object-fit: contain;
}

.life__slide::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 116, 132, 0.5490196078);
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}

.life__slide.fullscreen::after {
    display: none;
}

.life__slide:hover::after {
    opacity: 1;
    visibility: visible;
}

.life__slider .swiper-button-prev,
.life__slider .swiper-button-next {
    top: 50%;
}

.life__slider .swiper-button-prev {
    left: auto;
    right: 50px;
}

.life__wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.life__slider {
    height: fit-content;
}

.life__wrapper p {
    margin-top: 20px;
    color: #000;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    max-width: 500px;
}

.life__wrapper a {
    margin-right: 90px;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.life__img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}

.life__slide:hover .life__img {
    opacity: 1;
    visibility: visible;
}

.life__slide.fullscreen .life__img {
    display: none;
}

.life__wrapper a:hover {
    text-decoration: underline;
}

@media (max-width:768px) {

    .life__slider .swiper-button-prev,
    .life__slider .swiper-button-next {
        top: 30%;
    }
}

@media (max-width: 650px) {
    .life__wrapper {
        flex-direction: column;
        align-items: baseline;
    }
}

@media (max-width: 540px) {
    .life__wrapper h2 {
        padding-right: 90px;
    }
}

.footer {
    background: #284157;
}

.footer__wrapper {
    padding: 53px 20px 20px;
}

.footer__top {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.footer__soc {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
}

.footer__soc a svg path {
    transition: 0.3s;
}

.footer__soc a svg {
    transition: 0.3s;
}

.footer__soc a:hover svg {
    transform: scale(1.05);
}

.footer__soc a:hover svg path {
    fill: #67edff;
}

.footer__link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 120% */
    padding: 16px 24px;
    background: #fff;
    max-width: 280px;
    margin-top: 48px;
    position: relative;
    border-radius: 40px;
}

.footer__link svg path {
    transition: 0.3s;
}

.footer__link:hover svg path {
    stroke: #fff;
}

.footer__link:hover {
    background: #00a7bd;
    color: #fff;
}

.footer__nav {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.footer__nav a {
    color: #FFF;
    font-family: Raleway;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    /* 140% */
    position: relative;
}

.footer__hov a::after {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: #fff;
    transition: 0.3s;
}

.footer__hov a:hover::after {
    width: 100%;
}

.footer__cont {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.footer__cont span {
    color: rgba(255, 255, 255, 0.5019607843);
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.footer__cont li {
    display: flex;
    flex-direction: column;
}

.footer__cont li a,
.footer__cont li p {
    color: #FFF;
    font-family: Raleway;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    /* 140% */
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
}

.footer__cont li:not(:first-child) {
    margin-top: 16px;
}

.footer__bot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 40px;
}

.footer__bot a,
.footer__bot span {
    color: #FFF;
    font-family: Raleway;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px;
    /* 116.667% */
    position: relative;
}

@media (max-width: 992px) {
    .footer__top {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .footer__bot {
        flex-direction: column;
        align-items: baseline;
        gap: 12px;
    }
}

.complexe-inner .hero__group {
    border: none;
}

.complexe-inner .hero__wrapper {
    padding: 9% 20px 3%;
}

.complexe-inner .hero__slide a {
    opacity: 1;
    visibility: visible;
}

.complexe-inner .breadcrumbs ul li {
    color: #fff;
}
.complexe-inner .breadcrumbs ul li a {
    color: #fff;
}
.complexe-inner .hero__slider .swiper-button-prev,
.complexe-inner .hero__slider .swiper-button-next {
    top: -50px;
}

.complexe-block {
    margin-top: 56px;
}

.complexe-block__wrapper {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin-top: 48px;
}

.complexe-block__left {
    width: 50%;
}

.complexe-block__right {
    width: 50%;
}

.complexe-block__right p,
.complexe-block__left p,
.complexe-block__left ul li {
    color: #000;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.complexe-block__right p:not(:first-child) {
    margin-top: 20px;
}

.complexe-block__container {
    margin-top: 48px;
}

.complexe-block__container h4 {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
    /* 150% */
    text-transform: uppercase;
    margin-bottom: 16px;
}

.complexe-block__advantages {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.complexe-block__card {
    background: #284157;
    padding: 24px;
    border-radius: 25px;
    overflow: hidden;
}

.complexe-block__card h5 {
    color: #FFF;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 36px;
    /* 150% */
}

.complexe-block__card p {
    color: #FFF;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media (max-width: 992px) {
    .complexe-block__wrapper {
        flex-direction: column;
    }

    .complexe-block__left {
        width: 100%;
    }

    .complexe-block__right {
        width: 100%;
    }

    .complexe-block__container h4 {
        font-size: 20px;
    }

    .complexe-block__advantages {
        grid-template-columns: 1fr 1fr;
    }

    .complexe-block__card h5 {
        font-size: 20px;
    }
}

@media (max-width: 540px) {
    .complexe-block__advantages {
        grid-template-columns: 1fr;
    }
}

.map iframe {
    border-radius: 25px;
    overflow: hidden;
    width: 100%;
    max-height: 500px;
}

.map iframe .popup__content {
    display: none;
}

.infrastructure__title {
    display: flex;
    gap: 24px;
    justify-content: space-between;
}

.infrastructure__title p {
    color: #000;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    max-width: 628px;
}

.infrastructure__wrapper {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-top: 32px;
}

.infrastructure__left {
    position: relative;
    padding: 16%;
    width: 50%;
    border-radius: 25px;
    overflow: hidden;
}

.infrastructure__left img {
    cursor: zoom-in;
}

.infrastructure__left img.fullscreen {
    cursor: zoom-out;
}

.infrastructure__right {
    position: relative;
    width: 50%;
    padding: 16%;
}

.infrastructure__img {
    position: relative;
    padding: 16%;
    margin-top: 24px;
    border-radius: 25px;
    overflow: hidden;
}

.infrastructure__slide {
    position: relative;
    padding: 28%;
}

.infrastructure__slider {
    display: none;
    padding-top: 48px;
    margin-top: 24px;
}

.infrastructure__slider .swiper-button-prev,
.infrastructure__slider .swiper-button-next {
    top: 15px;
}

.infrastructure__slider .swiper-button-prev {
    left: auto;
    right: 50px;
}

@media (max-width: 992px) {
    .infrastructure__title {
        flex-direction: column;
    }

    .infrastructure__slider {
        display: block;
    }

    .infrastructure__wrapper {
        display: none;
    }

    .infrastructure__img {
        display: none;
    }
}

@media (max-width: 767px) {
    .infrastructure__slide {
        padding: 50%;
    }
}

.layouts__wrapper {
    display: flex;
    gap: 24px;
    margin-top: 24px;
}

.layouts__left {
    width: 32%;
    background: #F3F3F3;
    padding: 36px;
    border-radius: 25px;
    overflow: hidden;
}

.layouts__tabs ul {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}

.layouts__tabs ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #D9D9D9;
    background: #FFF;
    padding: 10px 16px;
    color: #1E1E1E;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.layouts__tabs ul li a.active {
    background: #284157;
    color: #fff;
    border-color: #284157;
}

.layouts__img img {
    width: 100%;
    height: 100%;
    max-width: 90px;
    max-height: 100px;
    -o-object-fit: cover;
    object-fit: cover;
}

.layouts__container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px 8px;
    margin-top: 16px;
}

.layouts__container h3 {
  grid-column: 3 span;
}

.layouts__card {
    border: 1px solid #284157;
    background: #FFF;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    cursor: zoom-in;
}

.layouts__card span {
    color: #1E1E1E;
    text-align: center;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 16px;
}

.layouts__content {
    margin-top: 56px;
}

.layouts__content h3 {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 100% */
}

.layouts__right {
    width: 60%;
    background: #F3F3F3;
    padding: 36px;
    border-radius: 25px;
    overflow: hidden;
}

.layouts__slider {
    height: 100%;
}

.layouts__slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 10px;
}

.layouts__slide img {
    width: 100%;
    height: 100%;
    max-width: 260px;
    max-height: 300px;
    margin-top: auto;
    object-fit: cover;
}

.layouts__info {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 24px;
    background: #FFF;
    padding: 16px;
    margin-top: auto;
}

.layouts__info span {
    color: #B2B2B2;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 171.429% */
}

.layouts__info p {
    color: #1E1E1E;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 120% */
}

@media (max-width:992px) {
    .layouts__wrapper {
        flex-direction: column;
    }

    .layouts__left {
        width: 100%;
    }

    .layouts__right {
        width: 100%;
    }

    .layouts__slide img {
        max-width: 100%;
    }
}

@media (max-width:768px) {
    .layouts__info {
        grid-template-columns: 1fr;
        width: 100%;
    }
    .news__wrapper .swiper-button-prev,
    .news__wrapper .swiper-button-next {
      top: unset!important;
      bottom: 0;
    }
    .news__wrapper .title {
      padding-bottom: 50px;
    }
}

@media (max-width:540px) {
    .layouts__container {
        grid-template-columns: 1fr 1fr;
    }
    .layouts__container h3 {
      grid-column: 2 span;
    }
}

.stock__wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24px;
    margin-top: 24px;
}

.stock__main-slider {
    height: 520px;
    margin-top: 30px;
}

.stock__card {
    max-width: 100%;
    width: 100%;
}

.stock__slider {
    width: 100%;
    max-width: 360px;
    box-sizing: border-box;
}

.stock__slider .swiper-wrapper {
    width: 100%;
    box-sizing: border-box;
}

.stock__slider .swiper-slide {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.stock__slider .swiper-horizontal>.swiper-pagination-bullets,
.stock .swiper-pagination-bullets.swiper-pagination-horizontal,
.stock .swiper-pagination-custom,
.stock .swiper-pagination-fraction {
    bottom: auto;
    top: 65%;
}

.stock__slider .swiper-pagination-bullet {
    background: #007185;
}

.stock__card {
    border: 1px solid #D9D9D9;
    background: #FFF;
    padding: 24px;
    height: 100%;
    border-radius: 25px;
    overflow: hidden;
}

.stock__card.last {
    background: #284157;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 25px;
    overflow: hidden;
}

.stock__card.last h3 {
    color: #FFF;
    text-align: center;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
    /* 133.333% */
    margin-top: 31px;
}

.stock__card.last a {
    background: #fff;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 24px;
    width: 100%;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    position: relative;
}

.stock__card.last a:hover {
    color: #284157;
    text-decoration: underline;
}

.stock__info {
    display: flex;
    align-items: center;
    gap: 8px;
}

.stock__info span {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    color: #444;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    border: 1px solid #D9D9D9;
}

.stock__info span:first-child {
    background: #284157;
    color: #fff;
}

.stock__info span:last-child {
    margin-left: auto;
}

.stock__slide img {
    width: 100%;
    height: 100%;
    max-width: 226px;
    max-height: 250px;
    display: flex;
    margin: auto;
    margin-top: 16px;
}

.stock__content h3 {
    color: #444;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
    /* 133.333% */
    margin-top: 40px;
}

.stock__content h3 span {
    color: #D9D9D9;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    /* 125% */
    text-decoration: line-through;
    display: inline;
    margin: 0;
}

.stock__content ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
    border-bottom: 1px solid #d9d9d9;
    padding-bottom: 16px;
}

.stock__content ul li {
    display: flex;
    align-items: center;
    gap: 8px;
}

.stock__content ul li span {
    color: #284157;
    margin: 0;
    font-weight: 700;
}

.stock__content ul li span {
    display: flex;
}

.stock__content span {
    color: #444;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    margin-top: 16px;
    display: block;
}

.feedback__wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    background: #F3F3F3;
    padding: 36px;
    border-radius: 25px;
    overflow: hidden;
}

.feedback__left p {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin-top: 8px;
}

.feedback__right form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.feedback__right form div {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.feedback__right form input {
    border: 1px solid #D9D9D9;
    padding: 10px 16px;
    background: transparent;
    color: #1E1E1E;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.feedback__right form input::-moz-placeholder {
    color: #B2B2B2;
}

.feedback__right form input::placeholder {
    color: #B2B2B2;
}

.feedback__right form select {
    border: 1px solid #444;
    padding: 10px 16px;
}

.feedback__right form button {
    background: #284157;
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    height: -moz-fit-content;
    height: fit-content;
    position: relative;
    overflow: hidden;
    border-radius: 40px;
}

.feedback__right form button p {
    opacity: 0;
    visibility: hidden;
}

.feedback__right form button span {
    position: absolute;
    transition: 0.3s;
}

.feedback__right form button:hover span:first-of-type {
    top: -50%;
}

.feedback__right form button span:first-of-type {
    top: 30%;
}

.feedback__right form button span:last-of-type {
    bottom: -50%;
    text-decoration: underline;
}

.feedback__right form button:hover span:last-of-type {
    bottom: 30%;
}

.feedback__right form label,
.feedback__right form p {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.feedback__right form label span,
.feedback__right form p span {
    color: #F71515;
}

.feedback__right form .control-label p a {
    color: #1E1E1E;
    text-decoration: underline;
}

.feedback__right form .control-label p a:hover {
    color: #284157;
}

@media (max-width: 992px) {
    .feedback__wrapper {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 540px) {
    .feedback__right form {
        grid-template-columns: 1fr;
    }

    .feedback__right form .control-label {
        order: 3;
    }
}

.commerce__tabs {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    max-width: 720px;
    margin: auto;
    margin-top: 24px;
    margin-bottom: 24px;
    border-radius: 40px;
    overflow: hidden;
}

.commerce__tabs a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid #D9D9D9;
    background: #FFF;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.commerce__tabs a.active {
    background: #284157;
    color: #fff;
    border-color: #284157;
}

.commerce__wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 24px;
}

.commerce__wrapper .stock__slider .swiper-pagination {
    bottom: 115px;
}

.commerce .stock__slider .swiper-pagination {
    top: 65%;
    bottom: auto;
}

.commerce .project {
    margin-bottom: 24px;
}

.career__title {
    display: flex;
    justify-content: space-between;
    gap: 24px;
}

.career__title div {
    max-width: 630px;
}

.career__title h3 {
    color: #000;
    font-family: Raleway;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    /* 120% */
    margin-bottom: 8px;
}

.career__title p {
    color: #000;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.career__img {
    width: 100%;
    height: 100%;
    max-height: 400px;
    -o-object-fit: cover;
    object-fit: cover;
    margin-top: 56px;
    border-radius: 25px;
    overflow: hidden;
}

.career-life__slider .swiper-button-prev {
    right: auto;
    left: 10px;
}

@media (max-width: 992px) {
    .career__title {
        flex-direction: column;
    }
}

.vacancies__wrapper {
    position: relative;
    margin-bottom: 24px;
}

.vacancies__wrapper h2 {
    padding-right: 90px;
}

.vacancies .swiper-button-prev {
    left: auto;
    right: 50px;
}

.vacancies__card h3 {
    color: #444;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
    /* 133.333% */
    margin-bottom: 16px;
    margin-top: 16px;
}

.vacancies__card p {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #444;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    margin-bottom: 16px;
}

.vacancies__card p span {
    display: flex;
}

.vacancies__card ul {
    padding: 16px 0;
}

.vacancies__card ul:first-of-type {
    border-top: 1px solid #d9d9d9;
}

.vacancies__card ul:last-of-type {
    border-bottom: 1px solid #d9d9d9;
}

.vacancies__card ul p {
    font-weight: 700;
    margin-bottom: 8px;
}

.vacancies__card ul li {
    color: #444;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.vacancies__card a {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 133.333% */
    margin-top: 16px;
}

.news__tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 640px;
    margin: 24px auto;
    border-radius: 40px;
    overflow: hidden;
}

.news__tabs a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid #D9D9D9;
    background: #FFF;
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
}

.news__tabs a.active {
    background: #284157;
    color: #fff;
    border-color: #284157;
}

.news__wrapper-inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px 24px;
    margin-top: 24px;
    align-items: baseline;
}

@media (max-width:992px) {
    .news__wrapper-inner {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width:540px) {
    .news__wrapper-inner {
        grid-template-columns: 1fr;
    }
}

.news__other {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 48px;
}

.news__other:hover {
    color: #284157;
    text-decoration: underline;
}

.date-form {
    background: #2841570d;
    padding: 12px 24px;
    max-width: 320px;
    display: flex;
    align-items: center;
    width: 100%;
    gap: 20px;
    margin-top: 24px;
    justify-content: center;
}

@media (max-width:992px) {
    .date-form {
        max-width: 100%;
    }
}

.date-form input,
.date-form select {
    color: #1E1E1E;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    background: transparent;
    cursor: pointer;
}

@media (max-width: 992px) {
    .news__wrapper {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 540px) {
    .news__wrapper {
        grid-template-columns: 1fr;
    }
}

.news-inner__wrapper {
    display: flex;
    gap: 24px;
}

.news-inner__img {
    position: relative;
    padding: 20%;
}

.news-inner__left {
    width: 70%;
}

.news-inner__left span {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1E1E1E;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    background: rgba(217, 217, 217, 0.4784313725);
    max-width: 120px;
    padding: 10px;
    margin: 24px 0;
}

.news-inner__left p {
    color: #000;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin-top: 24px;
}

.news-inner__right {
    width: 30%;
    background: #F3F3F3;
    padding: 36px;
    height: -moz-fit-content;
    height: fit-content;
    border-radius: 25px;
}

.news-inner__right h2 {
    color: #000;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
    /* 150% */
}

.news-inner__right p {
    margin-top: 24px;
    color: #000;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.news-inner__right label {
    align-items: center;
}

.news-inner__right label p {
    margin-top: 8px;
    font-size: 14px;
}

.news-inner__right form {
    display: flex;
    flex-direction: column;
}

.news-inner__right form div {
    display: flex;
    flex-direction: column;
    margin-top: 24px;
}

.news-inner__right form p {
    margin: 0;
}

.news-inner__right form label {
    margin-bottom: 8px;
    margin-top: 16px;
}

.news-inner__right form label span {
    color: #F71515;
}

.news-inner__right form input {
    border: 1px solid #D9D9D9;
    background: transparent;
    padding: 10px 16px;
}

.news-inner__right form label div {
    gap: 8px;
}

.news-inner__right form button {
    background: #284157;
    color: #FFF;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    /* 114.286% */
    padding: 12px 24px;
    margin-top: 24px;
    border-radius: 40px;
}

.news-inner__right form p:last-child {
    font-size: 14px;
}

@media (max-width: 992px) {
    .news-inner__wrapper {
        flex-direction: column;
    }

    .news-inner__left {
        width: 100%;
    }

    .news-inner__right {
        width: 100%;
    }
}

.about__wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 56px;
}

.about__card {
    background: #284157;
    padding: 24px;
    border-radius: 25px;
    overflow: hidden;
}

.about__card h2 {
    color: #FFF;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 48px;
    font-style: normal;
    font-weight: 800;
    line-height: 56px;
    /* 116.667% */
}

.about__card p {
    color: #FFF;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 36px;
    /* 150% */
    margin-top: 24px;
}

.about__img {
    position: relative;
    padding: 20%;
    margin-top: 200px;
}

.about__video {
    position: relative;
    padding: 20%;
}

.about__video iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

.play-btns {
    display: flex;
    align-items: center;
    justify-content: center;
}

.control-btn {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    cursor: pointer;
}

.stop-btn {
    display: none;
}

@media (max-width: 992px) {
    .about__wrapper {
        grid-template-columns: 1fr;
    }
}

.history .advantages__svg {
    background: #284157;
}

.history__card svg {
    transition: 0.3s;
}

.history__card.active svg {
    transform: rotate(45deg);
}

.history__left p {
    color: #000;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
    margin: 24px 0;
}

.history__content {
    margin-left: 82px;
    margin-top: 20px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
}

.history__wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.history .advantages__right {
    width: 100%;
}

@media (max-width:992px) {
    .history__wrapper {
        grid-template-columns: 1fr;
    }
}

.partners__wrapper {
    position: relative;
}

.partners__wrapper h2 {
    padding-right: 70px;
}

.partners__wrapper .swiper-button-prev {
    left: auto;
    right: 50px;
}

.partners .js-marquee {
    display: flex;
    align-items: center;
    gap: 24px;
}

.partners__marquee {
    margin-top: 48px;
}

.contacts__wrapper {
    display: flex;
    gap: 24px;
    margin-top: 48px;
}

.contacts__left {
    width: 30%;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.contacts__left a {
    color: #000;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.contacts__left a:hover {
    color: #284157;
}

.contacts__left ul {
    display: flex;
    align-items: center;
    gap: 12px;
}

.contacts__left ul a path {
    transition: .3s;
}

.contacts__left ul a:hover path {
    fill: #284157;
    fill-opacity: 1;
}

.contacts__group {
    display: flex;
    gap: 15px;
    flex-direction: column;
}

.contacts__group div {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contacts__group div p {
    font-size: 14px;
    line-height: 22px;
}

.contacts__right {
    width: 70%;
}

.contacts__right iframe {
    width: 100%;
    height: 500px;
}

@media (max-width: 992px) {
    .contacts__wrapper {
        flex-direction: column;
    }

    .contacts__left {
        width: 100%;
    }

    .contacts__right {
        width: 100%;
    }
}

.calc__wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-top: 24px;
}

.calc__left {
    background: #F6F6F6;
    padding: 36px;
}

.calc form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.calc form label {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.calc form input,
.calc form select {
    border: 1px solid #D9D9D9;
    padding: 16px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent;
    width: 100%;
}

.calc__group {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.calc .select-wrapper {
    display: flex;
    flex-direction: column;
    gap: 8px;
    position: relative;
}

.calc .select-wrapper::after {
    position: absolute;
    top: 40px;
    right: 20px;
    content: "";
    width: 7px;
    height: 13px;
    background: url("../img/select-apper.svg") center no-repeat;
}

.calc__right {
    background: #284157;
    padding: 36px;
    color: #fff;
}

.calc__right h2 {
    color: #FFF;
    font-family: Raleway;
    font-size: 36px;
    font-style: normal;
    font-weight: 400;
    line-height: 48px;
    /* 133.333% */
    margin-bottom: 36px;
}

.calc__item {
    border-bottom: 1px solid #D9D9D9;
    padding-bottom: 24px;
    margin-top: 24px;
}

.calc__item:first-of-type {
    border-top: 1px solid #D9D9D9;
    padding-top: 24px;
}

.calc__table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 48px;
}

.calc__table thead {
    background: #284157;
    color: #fff;
}

.calc__table td {
    padding: 24px 16px;
    font-variant-numeric: lining-nums proportional-nums;
    font-family: Raleway;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

@media (max-width: 992px) {
    .calc__wrapper {
        grid-template-columns: 1fr;
    }

    .calc__right h2 {
        font-size: 28px;
    }

    .calc__table td {
        padding: 10px;
        font-size: 12px;
    }
}

@media (max-width: 540px) {
    .calc__group {
        grid-template-columns: 1fr;
    }

    .calc__table td {
        padding: 10px;
        font-size: 10px;
        line-height: 14px;
    }
}


/*alert*/

.box-size {
    box-sizing: border-box;
}

.alert--fixed {
    position: fixed;
    width: 100%;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    top: 0px;
    left: 0px;
    z-index: 999;
}

.alert--error,
.alert--warning,
.alert--active {
    display: flex;
}

.alert--width {
    width: 400px;
}

.alert--img__item svg {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
}

.alert--img__item {
    display: none;
    flex-shrink: 0;
}

.alert--active .active {
    display: block;
}

.alert--warning .warning {
    display: block;
}

.alert--error .error {
    display: block;
}

.alert--content {
    position: relative;
    z-index: 12;
    border-radius: 15px;
    display: flex;
    align-items: center;
    flex-direction: column;
    background-color: white;
    padding: 30px;
    color: #333333;
    margin-bottom: 10%;
}

.alert--bg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 0.6;
    z-index: 11;
    top: 0px;
    left: 0px;
}

.alert-text {
    margin-top: 15px;
    text-align: center;
}

.alert--active .active path {
    fill: #4ad395;
}

.alert--warning .warning path {
    fill: #e5e75d;
}

.alert--error .error path {
    fill: #f81919;
}

.alert--title {
    font-size: 28px;
    font-weight: 500;
}

.alert--subtitle {
    font-weight: 400;
    font-size: 20px;
    padding-top: 8px;
    margin-top: 8px;
    border-top: 1px solid #ccbbbb;
}

.alert--x {
    position: absolute;
    width: 30px;
    height: 30px;
    padding: 8px;
    right: 10px;
    top: 10px;
    cursor: pointer;
}

.alert--x svg {
    width: 100%;
    height: 100%;
}

.alert--x svg path {
    fill: #968787;
    transition: all 0.3s ease;
}

.alert--x:hover path {
    fill: black;
}

@media (max-width:1200px) {
    .alert--width {
        width: 370px;
    }

    .alert--content {
        padding: 25px;
    }

    .alert--img__item svg {
        width: 75px;
        height: 75px;
    }

    .alert-text {
        margin-top: 10px;
    }

    .alert--title {
        font-size: 24px;
    }

    .alert--subtitle {
        font-size: 18px;
    }
}

@media (max-width:500px) {
    .alert--content {
        width: 92%;
    }

    .alert--img__item svg {
        width: 60px;
        height: 60px;
    }

    .alert--title {
        font-size: 22px;
    }
}


/*alert*/


.spinner {
    border: 5px solid #f3f3f3;
    border-top: 5px solid #333;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


.feedback__right form .phone-mask {
    display: flex;
    align-items: center;
    flex-direction: row;
    border: 1px solid #D9D9D9;
    padding: 10px 16px;
}

.feedback__right form .phone-mask select {
    appearance: none;
    padding: 5px;
}

.feedback__right form .phone-mask input {
    border: none;
    padding: 0;
}

.phone-fixed {
    position: fixed;
    bottom: 95px;
    right: 35px;
    animation: shake 2.6s infinite ease-in-out;
    transform-origin: center;
    z-index: 100;
    background: #284157;
    border-radius: 50%;
    padding: 3px;
}

@keyframes shake {

    0%,
    90%,
    100% {
        transform: rotate(0deg);
    }

    91% {
        transform: rotate(-15deg);
    }

    93% {
        transform: rotate(15deg);
    }

    95% {
        transform: rotate(-10deg);
    }

    97% {
        transform: rotate(10deg);
    }

    99% {
        transform: rotate(0deg);
    }
}

.what {
    position: fixed;
    bottom: 20px;
    right: 35px;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    z-index: 100;
}

.anim {
    position: relative;
}

.circle-animation {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border: 1px solid #00ef17;
    border-radius: 50%;
    animation: widgetPulse infinite 1.5s;
    width: 40px;
    height: 40px;
    background: #00ef17;
}

@keyframes widgetPulse {
    0% {
        -webkit-transform: scale(0.5, 0.5);
        transform: scale(0.5, 0.5);
        opacity: 0.3;
    }

    50% {
        -webkit-transform: scale(1.5, 1.5);
        transform: scale(1.5, 1.5);
        opacity: 0.3;
    }

    100% {
        -webkit-transform: scale(2.3, 2.3);
        transform: scale(2.3, 2.3);
        opacity: 0;
    }
}