/* ------------------------------- BANNER ------------------------------- */ #banner {padding-top: 40px;} .banner_items {display: flex;} .banner_items > div {width: 33.333%;} .banner_items > div:nth-of-type(1) {padding-right: 24px;} .banner_items > div:nth-of-type(2) {padding-left: 12px; padding-right: 12px;} .banner_items > div:nth-of-type(3) {padding-left: 24px;} .banner_items > div:nth-of-type(1) > .banner_item {background: linear-gradient(90deg, #1FAFC1 0%, #12818F 100%);} .banner_items > div:nth-of-type(2) > .banner_item {background: linear-gradient(270deg, #2056BC 0%, #4480F3 100%);} .banner_items > div:nth-of-type(3) > .banner_item {background: linear-gradient(90deg, #9867F9 0%, #6939C8 100%);} .banner_item { border-radius: 8px; padding: 32px 28px 24px 28px; color: #FFFFFF; height: 100%; min-height: 100%; position: relative; user-select: none; } .banner_item > div:nth-of-type(1) {font-weight: 600; font-size: 20px; line-height: 130%; letter-spacing: 0.2px; padding-bottom: 86px;} .banner_item > div:nth-of-type(1) > span {display: block;} .banner_item > div:nth-of-type(1) > span:nth-of-type(2) {font-weight: 400;} .banner_item > div:nth-of-type(2) {position: absolute; left: 28px; bottom: 24px;} .banner_item > div:nth-of-type(2) > span:nth-of-type(1) { font-weight: 500; font-size: 28px; line-height: 130%; letter-spacing: 0.2px; padding-right: 12px; } .banner_item > div:nth-of-type(2) > span:nth-of-type(2) {font-weight: 500; font-size: 50px; line-height: 130%; letter-spacing: 0.2px;} .banner_item > div:nth-of-type(2) > span:nth-of-type(3) { font-weight: 500; font-size: 40px; line-height: 130%; letter-spacing: 0.2px; padding-left: 4px; } @media only screen and (max-width: 800px) { .banner_items {flex-direction: column;} .banner_items > div {width: 100%;} .banner_items > div:nth-of-type(1) {padding-right: 0;} .banner_items > div:nth-of-type(2) {padding-top: 14px; padding-left: 0; padding-right: 0;} .banner_items > div:nth-of-type(3) {padding-top: 14px; padding-left: 0;} .banner_item > div:nth-of-type(2) > span:nth-of-type(1) {font-size: 20px;} .banner_item > div:nth-of-type(2) > span:nth-of-type(2) {font-size: 50px;} .banner_item > div:nth-of-type(2) > span:nth-of-type(3) {font-size: 36px;} } /* back to main */ #back_to_main {padding-top: 132px; display: flex; align-items: center;} #back_to_main > a {color: #8F97A6; text-decoration: none; margin-right: 8px; font-size: 16px;} #back_to_main > i {color: #8F97A6; margin-right: 8px; font-size: 8px; top: 1px; position: relative; transform: rotate(180deg);} @media only screen and (max-width: 1024px) { #back_to_main {padding-top: 120px;} #back_to_main > a {font-size: 14px; white-space: nowrap; max-width: 140px; overflow: hidden; text-overflow: ellipsis;} #back_to_main > i {font-size: 8px;} } /* preloader card */ .loading {pointer-events: none; position: relative; overflow: hidden;} .loading::before { content: ''; position: absolute; top: -100%; height: 300%; max-width: 45px; width: 45px; transform: rotate(45deg); z-index: 5; left: -150%; background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.4)); animation: flare_animation 1s infinite linear; } @keyframes flare_animation { 0% {left: -150%;} 100% {left: 150%;} } /* settlements */ #settlements {margin-top: 40px;} #settlements .wrap {display: flex; flex-direction: column;} #settlements .filters {display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 30px;} #settlements .filters > .btn { margin-right: 14px; border-radius: 30.5px; border: 1px solid #D7D9E0; background: #FFF; color: #1A222A; margin-bottom: 10px; } #settlements .filters > .btn:hover, #settlements .filters > .btn.active {background: #2CAFF9; color: #FFFFFF;} .more_picture { width: 53px; border-radius: 24px; background: #E4E0E0; height: 44px; color: #1A222A; cursor: pointer; text-align: center; font-size: 14px; font-weight: 700; position: absolute; bottom: -4px; right: -7px; line-height: 44px; z-index: 3; transition: 0.2s; } .more_picture:hover {color: #2CAFF9;} .settlement { width: 100%; height: 392px; position: relative; display: flex; padding: 30px; border-radius: 8px; background: url(/images/regions/background.svg) right bottom / cover no-repeat; filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.10)); } .settlement .block_name {padding: 0; color: #898989; font-size: 12px; font-weight: 500; text-transform: uppercase;} .settlement h2 {padding: 0; color: #1A222A; font-size: 24px; font-weight: 700;} .settlement h2.loading {color: transparent; border-radius: 12px; background: #EFF1F6;} .settlement:not(.region) h2 {cursor: pointer; transition: .3s ease-in-out;} .settlement:not(.region) h2:hover {color: #2CAFF9;} .settlement:not(.region) .main {border-radius: 20px; width: 100%; cursor: pointer;} .settlement:not(.region) .additional {display: flex; flex-direction: column; width: 131px; height: 100%;} .settlement:not(.region) .additional > div {margin-top: 20px; border-radius: 20px; width: 131px; height: 94px; cursor: pointer;} .settlement:not(.region) .additional > div:first-child {margin-top: 0; position: relative;} .settlement:not(.region) .additional > div:last-child {position: relative;} .settlement:not(.region) .main {transition: .3s ease-in-out;} .settlement:not(.region) .main:hover {-webkit-filter: brightness(77%);} .settlement:not(.region) .additional > div {position: relative;} .settlement:not(.region) .additional > div::after { transition: .3s ease-in-out; border-radius: 20px; content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0); z-index: 2; } .settlement:not(.region) .additional > div:hover::after {background: rgba(0,0,0,.23)} .settlement:not(.region) .main.loading {background: #EFF1F6;} .settlement:not(.region) .main.loading .sticker {display: none;} .settlement:not(.region) .additional > div.loading {background: #EFF1F6 !important;} .settlement:not(.region) .additional > div.loading .more_picture {display: none;} .settlement:not(.region) .additional > div.loading .video_play {display: none;} .settlement > div:nth-of-type(1) {display: flex; width: calc(50% - 60px); height: 100%; margin-right: 60px;} .settlement > div:nth-of-type(2) {width: 50%; display: flex; flex-direction: column;} .settlement > div:nth-of-type(2) > div:nth-of-type(2) { margin-top: 16px; color: #1A222A; font-size: 14px; font-weight: 400; white-space: nowrap; } .settlement > div:nth-of-type(2) > div:nth-of-type(3) {display: flex; align-items: center; margin-top: 8px;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(3) i {font-size: 16px; color: #1A222A; margin-right: 8px;} .settlement > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(1) { margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400; } .settlement > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(2) { margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400; } .settlement > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(3) { color: #555966; font-size: 14px; font-weight: 400; } .settlement > div:nth-of-type(2) > div:nth-of-type(4) {display: flex; margin-top: 40px;} .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) {margin-right: 60px;} .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(1) {color: #555966; font-size: 12px; font-weight: 400;} .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(1).loading { border-radius: 12px; background: #EFF1F6; color: transparent; width: fit-content; } .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(2) { margin-top: 9px; color: #1A222A; font-size: 14px; font-weight: 400; } .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(2).loading { border-radius: 12px; background: #EFF1F6; color: transparent !important; width: fit-content; } .settlement > div:nth-of-type(2) > div:nth-of-type(4) {order: 5;} .settlement > div:nth-of-type(2) > div:nth-of-type(5) {margin-top: 16px; display: flex; order: 4;} .settlement > div:nth-of-type(2) > div:nth-of-type(5).loading {color: transparent; border-radius: 12px; background: #EFF1F6;} .settlement > div:nth-of-type(2) > div:nth-of-type(5) > div { display: flex; margin-right: 14px; flex-direction: column; width: 70px; height: 70px; text-align: center; border-radius: 12px; background: #F5F5F5; } .settlement > div:nth-of-type(2) > div:nth-of-type(5) > div:last-child {margin-right: 0;} .settlement > div:nth-of-type(2) > div:nth-of-type(5) > div > i {line-height: 50px; font-size: 30px;} .settlement > div:nth-of-type(2) > div:nth-of-type(5) > div:last-child > i {font-size: 24px;} .settlement > div:nth-of-type(2) > div:nth-of-type(5) > div > div {color: #1A222A; font-size: 12px; font-weight: 400;} .settlement > div:nth-of-type(2) > div:nth-of-type(5) {position: relative;} .settlement.region > div:nth-of-type(2) {cursor: pointer; min-width: 690px;} .settlement_price {margin-left: auto; text-align: right;} .settlement_price > div:nth-of-type(1) {color: #555966; font-size: 12px; font-weight: 400;} .settlement_price > div:nth-of-type(2) {color: #2CAFF9 !important; font-size: 24px !important; font-weight: 700 !important;} .settlement_price > div:nth-of-type(3) {color: #555966; font-size: 12px; font-weight: 400;} .settlement_price.sold {border-radius: 8px; border: 1px solid #C74022; background: #FFE2DB; padding: 18px 40px; font-size: 16px; color: #C74022; margin-bottom: 10px !important;} .settlement_price.occupied {border-radius: 8px; border: 1px solid #E6AB38; background: #FFF7E7; padding: 18px 40px; font-size: 16px; color: #E6AB38; margin-bottom: 10px !important;} .settlement_price.loading {border-radius: 12px; background: #EFF1F6; border: none; color: transparent; width: fit-content;} .settlement .btn { position: absolute; bottom: 0; right: 0; width: 271px; height: 52px; white-space: nowrap; display: flex; cursor: pointer; align-items: center; color: #FFF; border-radius: 8px; background: #2CAFF9; padding: 14px 24px; font-size: 18px; font-weight: 500; transition: 0.2s; } .settlement .btn > div {text-align: center; width: 100%; user-select: none;} .settlement .btn.loading {color: transparent; background: #FFF;} /* regions houses */ #houses_list {margin-top: 100px;} #houses_list h2 {font-size: 32px; font-weight: 500; margin-bottom: 40px; text-align: left;} @media only screen and (max-width: 1024px) { #houses_list {margin-top: 42px;} #houses_list h2 {font-size: 24px; margin-bottom: 20px;} } /* region */ .region_map {margin-top: 50px;} .region_map > div:first-child {display: flex; align-items: baseline; margin-bottom: 34px;} .region_map > div:first-child > div:first-child { margin-left: 9px; width: 30%; color: #1A2A41; font-size: 24px; font-weight: 700; margin-right: 20px; } .region_map > div:first-child > div:last-child {color: #555966; width: 35%; font-size: 16px; font-weight: 400;} .region_map > div:last-child {display: flex;} .region_map > div:last-child > div:first-child { width: 60%; max-height: 479px; min-height: 235px; border-radius: 20px; background: #FFF; padding: 9px; margin-right: 20px; } .region_map > div:last-child > div:last-child {border-radius: 20px; width: 40%; min-height: 100%; background: #FFF; padding: 44px;} .region_map > div:last-child > div:last-child > div {display: flex; margin-bottom: 32px;} .region_map > div:last-child > div:last-child > div > div:first-child { margin-right: 16px; min-width: 48px; min-height: 48px; max-width: 48px; max-height: 48px; border-radius: 50%; line-height: 48px; text-align: center; background: #EFF9FF; } .region_map > div:last-child > div:last-child > div > div:first-child i {color: #2CAFF9;} #tab_3 > div:last-child > div:last-child > div > div:last-child > div:first-child { color: #1A2A41; font-size: 18px; font-weight: 700; margin-bottom: 4px; } #tab_3 > div:last-child > div:last-child > div > div:last-child > div:nth-of-type(2) { color: #555966; font-size: 16px; margin-bottom: 8px; } #tab_3 > div:last-child > div:last-child > div > div:last-child > a {color: #2CAFF9; text-decoration: none; font-size: 14px;} @media only screen and (max-width: 1024px) { .region_map > div:first-child {flex-direction: column; margin-bottom: 16px;} .region_map > div:first-child > div:first-child {margin-left: 0; width: 100%; font-size: 20px;} .region_map > div:first-child > div:last-child {width: 100%; font-size: 14px; margin-top: 12px;} #tab_3 > div:last-child > div:last-child > div > div:last-child > div:first-child {font-size: 14px;} #tab_3 > div:last-child > div:last-child > div > div:last-child > div:nth-of-type(2) {font-size: 14px;} #tab_3 > div:last-child > div:last-child > div > div:last-child > a {font-size: 14px;} .region_map > div:last-child {flex-direction: column;} .region_map > div:last-child > div:first-child {width: 100%;} .region_map > div:last-child > div:last-child {width: 100%; padding: 16px;} } /* ------------------- MORTGAGE WHY -------------------- */ #mortgage_expert {margin-top: 40px;} #mortgage_expert .mortgage_expert {padding: 64px; border-radius: 8px; background: linear-gradient(75deg, #001623 0%, #01A3FF 100%); display: flex; -webkit-justify-content: center;} #mortgage_expert .mortgage_expert > img {max-width: 400px; width: 40%; border-radius: 8px; margin-right: 40px; object-fit: cover;} #mortgage_expert .mortgage_expert > div {max-width: 600px; width: 60%; color: #FFFFFF;} #mortgage_expert h2 {color: #FFFFFF; font-size: 32px; font-weight: 500; line-height: 130%; margin-bottom: 30px;} #mortgage_expert .desc {font-size: 18px; margin-bottom: 60px;} #mortgage_expert .header_info_btn {margin: 0 0 70px;} #mortgage_expert .line {background: #FFF; height: 1px; width: 100%; margin-bottom: 32px;} #mortgage_expert .expert_name {font-size: 18px;} #mortgage_expert .expert_name span {font-weight: 700;} @media only screen and (max-width: 1024px) { #mortgage_expert {margin-bottom: 40px;} #mortgage_expert h2 {font-size: 24px; margin-bottom: 20px;} #mortgage_expert {background: linear-gradient(75deg, #001623 0%, #01A3FF 100%);} #mortgage_expert .mortgage_expert {padding: 40px 0; flex-direction: column; border-radius: 0; background: none;} #mortgage_expert .mortgage_expert > div {display: flex; flex-direction: column; max-width: 500px; width: 100%;} #mortgage_expert .mortgage_expert > img {width: 100%; height: 260px; object-position: top; max-width: 500px; margin-right: 0; margin-bottom: 40px;} #mortgage_expert .desc {margin-bottom: 30px; font-size: 14px;} #mortgage_expert .line {margin-bottom: 20px;} #mortgage_expert .expert_name {margin-bottom: 30px; font-size: 14px;} #mortgage_expert .header_info_btn {order: 1; max-width: 400px; margin: 0;} } /* ------------------- MORTGAGE CARDS -------------------- */ #mortgage_cards {margin-top: 40px;} #mortgage_cards .items {display: flex; } #mortgage_cards .items > div {width: 33.3%; margin-right: 40px; border-radius: 8px; padding: 32px 20px; color: #FFFFFF; display: flex; flex-direction: column;} #mortgage_cards .items > div:nth-child(1) {background: linear-gradient(90deg, #1FAFC1 0.59%, #12818F 100%);} #mortgage_cards .items > div:nth-child(2) {background: linear-gradient(270deg, #2056BC 0.09%, #4480F3 99.9%);} #mortgage_cards .items > div:nth-child(3) {background: linear-gradient(90deg, #9867F9 0%, #6939C8 100%);} #mortgage_cards .items > div:nth-child(3) > div:last-child {display: flex; align-items: center;} #mortgage_cards .items > div:nth-child(3) > div:last-child .desc {font-size: 16px; padding-bottom: 0; margin-bottom: 0;} #mortgage_cards .items > div:last-child {margin-right: 0;} #mortgage_cards .items > div .title {font-size: 24px; font-weight: 500; margin-bottom: 8px;} #mortgage_cards .items > div .desc {font-size: 18px; padding-bottom: 20px; margin-bottom: auto;} #mortgage_cards .items > div .percent {font-weight: 500; font-size: 60px;} #mortgage_cards .items > div .percent > span:first-child {font-size: 32px; margin-right: 10px;} #mortgage_cards .items > div .percent > span:last-child {font-size: 46px; margin-left: 10px;} @media only screen and (max-width: 1024px) { #mortgage_cards .items {flex-direction: column;} #mortgage_cards .items > div {width: 100%; margin-right: 0; margin-bottom: 10px;} } @media only screen and (max-width: 600px) { #mortgage_cards .items > div {padding: 20px;} #mortgage_cards .items > div .title {font-size: 20px;} #mortgage_cards .items > div .desc {font-size: 14px;} #mortgage_cards .items > div .percent {font-weight: 500; font-size: 50px;} #mortgage_cards .items > div .percent > span:first-child {font-size: 24px; margin-right: 10px;} #mortgage_cards .items > div .percent > span:last-child {font-size: 32px; margin-left: 10px;} #mortgage_cards .items > div:nth-child(3) > div:last-child .desc {font-size: 14px;} } /* ------------------- MORTGAGE WHY -------------------- */ #mortgage_why {margin-top: 40px;} #mortgage_why h2 {color: #1A2A41; font-size: 40px; font-weight: 700; line-height: 120%; margin-bottom: 40px;} #mortgage_why .items {display: flex;} #mortgage_why .items > div {width: 25%; margin-right: 20px; line-height: 140%;} #mortgage_why .items > div:last-child {margin-right: 0;} #mortgage_why .items > div svg {margin-bottom: 20px; width: 64px; height: 64px;} #mortgage_why .items > div .title {font-size: 26px; font-weight: 500; color: #1A2A41; margin-bottom: 20px; line-height: 140%;} #mortgage_why .items > div .desc {font-size: 18px; line-height: 140%;} @media only screen and (max-width: 1024px) { #mortgage_why h2 {font-size: 24px;} #mortgage_why .items {flex-direction: column;} #mortgage_why .items > div {width: 100%; margin-right: 0; margin-bottom: 20px; display: flex; align-items: flex-start;} #mortgage_why .items > div br {display: none;} #mortgage_why .items > div svg {width: 48px; height: 48px; margin-right: 20px;} #mortgage_why .items > div .title {font-size: 18px; margin-bottom: 6px;} #mortgage_why .items > div .desc {font-size: 14px;} } /* ------------------- MORTGAGE PRODUCTS -------------------- */ #mortgage_products {margin-top: 40px; padding: 40px 0; background: rgba(44, 175, 249, 0.08);} #mortgage_products h2 {color: #1A2A41; font-size: 40px; font-weight: 700; line-height: 120%; margin-bottom: 40px;} #mortgage_products .items {display: flex;} #mortgage_products .items > div {border-radius: 8px; width: 33.3%; margin-right: 40px; padding: 40px; color: #FFFFFF; font-size: 26px; font-weight: 500; line-height: 140%;} #mortgage_products .items > div .desc {margin-top: 320px;} #mortgage_products .items > div:nth-child(1) {background: url(/images/ipoteka/ipoteka_1.jpg) center / cover no-repeat;} #mortgage_products .items > div:nth-child(2) {background: url(/images/ipoteka/ipoteka_2.jpg) center / cover no-repeat;} #mortgage_products .items > div:nth-child(3) {background: url(/images/ipoteka/ipoteka_3.jpg) center / cover no-repeat; margin-right: 0;} @media only screen and (max-width: 1024px) { #mortgage_products h2 {font-size: 24px;} #mortgage_products .items {flex-direction: column;} #mortgage_products .items > div {padding: 24px; width: 100%; margin-right: 0; margin-bottom: 10px;} #mortgage_products .items > div .desc {margin-top: 240px;} } /* ------------------- MORTGAGE HOW WORK -------------------- */ #mortgage_how_work {margin-top: 40px;} #mortgage_how_work h2 {color: #1A2A41; font-size: 40px; font-weight: 700; line-height: 120%; margin-bottom: 40px;} #mortgage_how_work .items {display: flex;} #mortgage_how_work .items > div {display: flex; flex-direction: column; padding: 24px 26px; border-radius: 8px; border: 1px solid #D1D4DA; margin-right: 30px; font-size: 18px;} #mortgage_how_work .items > div .desc {margin-bottom: 90px;} #mortgage_how_work .items > div .desc span {font-weight: 700; color: #2CAFF9;} #mortgage_how_work .items > div .num {margin-top: auto; border-radius: 8px; background: #2CAFF9; width: 60px; height: 60px; display: flex; align-items: center; -webkit-justify-content: center; color: #FFFFFF; font-size: 32px; font-weight: 500; margin-left: auto;} #mortgage_how_work .items > div:last-child {margin-right: 0;} @media only screen and (max-width: 1024px) { #mortgage_how_work h2 {font-size: 24px;} #mortgage_how_work .items {flex-direction: column;} #mortgage_how_work .items > div {padding: 24px 20px; font-size: 14px; margin-right: 0; margin-bottom: 30px;} #mortgage_how_work .items > div .desc {margin-bottom: 8px;} #mortgage_how_work .items > div .num {width: 48px; height: 48px; font-size: 20px;} } /* ------------------- MORTGAGE CALCULATOR -------------------- */ #mortgage_calculator {margin-top: 40px;} .mortgage_calculator {display: flex; margin-top: 32px; overflow: hidden;} .mortgage_calculator iframe {pointer-events: auto; width: 100%; border: none; min-height: 200px; overflow: hidden; height: 1351px;} #mortgage_calculator h2 {padding-left: 24px; color: #1A2A41; font-size: 40px; font-weight: 700; padding-top: 10px; line-height: 120%;} .block_name { padding-left: 24px; color: #9497A2; font-size: 12px; font-weight: 500; line-height: 130%; text-transform: uppercase; } html.has-scroll-scrolling .mortgage_calculator iframe {pointer-events: none;} @media only screen and (max-width: 1024px) { #mortgage_calculator {margin-top: 42px;} #mortgage_calculator h2 {font-size: 24px; padding-left: 0;} .block_name {padding-left: 0; font-size: 11px;} } /* regions */ #regions {margin-top: 20px; overflow: hidden;} #regions .container_primary > h1 {margin-bottom: 40px; font-size: 56px; line-height: 64px; font-weight: 500; padding-left: 24px;} #regions .filters {padding-left: 24px;} #regions .filters > div.highway {display: flex; flex-wrap: wrap; margin-bottom: 16px;} #regions .filters > div.highway .btn { white-space: nowrap; display: flex; cursor: pointer; align-items: center; font-weight: 400; transition: .2s; height: 32px; width: auto; font-size: 14px; margin-bottom: 12px; border-radius: 24px; border: 1px solid #D7D9E0; color: #1A222A; background: #FFF; padding: 7px 12px; margin-right: 12px; } #regions .filters > div.highway .btn span.count {color: #9497A2; margin-left: 5px; font-weight: 600;} #regions .filters > div.highway .btn:hover {background: #2CAFF9; color: #FFFFFF;} #regions .filters > div.highway .btn:hover span.count {color: #FFFFFF;} #regions .filters > div.highway .btn.active {background: #2CAFF9; color: #FFFFFF;} #regions .filters > div.highway .btn.active span.count {color: #FFFFFF;} #regions .filters > div.sort {display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 30px;} #regions .filters > div.sort .title {color: #555966; font-size: 16px; margin-right: 20px;} #regions .filters > div.sort .price {color: #2CAFF9; font-size: 16px; font-weight: 700; margin-right: 8px;} #regions .filters > div.sort .price_up { background: url(/images/regions/price.svg); transition: .5s; cursor: pointer; width: 24px; height: 24px; margin-right: 8px; } #regions .filters > div.sort .price_down { background: url(/images/regions/price.svg); transition: .5s; transform: rotate(180deg); cursor: pointer; width: 24px; height: 24px; margin-right: 20px; } #regions .filters > div.sort .price_up:hover {background: url(/images/regions/price_hover.svg);} #regions .filters > div.sort .price_up.active {background: url(/images/regions/price_active.svg);} #regions .filters > div.sort .price_down:hover {background: url(/images/regions/price_hover.svg);} #regions .filters > div.sort .price_down.active {background: url(/images/regions/price_active.svg);} #regions .filters > div.sort .price_sort { cursor: pointer; color: #2CAFF9; transition: .3s ease-in-out; font-size: 16px; font-weight: 400; border-bottom: 1px solid #1A222A; margin-right: 20px; } #regions .filters > div.sort .price_sort.active {font-weight: 700; color: #2CAFF9; border-bottom: 1px solid #2CAFF9;} #regions .filters > div.sort .price_sort:hover, #regions .filters > div.sort .mkad:active { color: #1A222A; border-bottom: 1px solid #1A222A; } #regions .filters > div.sort .mkad { cursor: pointer; color: #1A222A; transition: .3s ease-in-out; font-size: 16px; font-weight: 400; border-bottom: 1px solid #1A222A; margin-right: 20px; } #regions .filters > div.sort .mkad.active {font-weight: 700; color: #1A222A; border-bottom: 1px solid #2CAFF9;} #regions .filters > div.sort .mkad:hover, #regions .filters > div.sort .mkad:active {color: #1A222A; border-bottom: 1px solid #1A222A;} #regions .filters > div.sort .default { display: flex; align-items: center; cursor: pointer; color: #1A222A; margin-right: 20px; transition: .3s ease-in-out; font-size: 16px; font-weight: 400; } #regions .filters > div.sort .default.reset {color: #1A222A !important; font-weight: 400 !important;} #regions .filters > div.sort .default > div {border-bottom: 1px solid #1A222A;} #regions .filters > div.sort .default i {font-size: 14px; text-decoration: none; margin-left: 8px;} #regions .filters > div.sort .default.active {font-weight: 700; color: #1A222A;} #regions .filters > div.sort .default.active > div {border-bottom: 1px solid #1A222A;} #regions .filters > div.sort .default:hover > div, #regions .filters > div.sort .default:active > div {color: #1A222A; border-bottom: 1px solid #1A222A;} #regions .filters > div.sort .preloader_sites { margin-left: auto; opacity: 0; display: flex; align-items: center; transition: 0.3s ease-in-out; } #regions .filters > div.sort .preloader_sites.active {opacity: 1;} #regions .filters > div.sort .preloader_sites .name {font-size: 16px; color: #555966; margin-left: 20px;} .settlement.region {margin-bottom: 50px;} .settlement.region > div:nth-of-type(1) {min-width: 360px; margin-right: 20px; display: flex; } .settlement.region > div:nth-of-type(1) .main {width: 70%; height: 100%; position: relative; } .main > div.photo_switch:nth-child(1) { cursor: pointer; position: absolute; right: 10px; color: #FFFFFF; font-size: 18px; top: calc(50% - 15px); z-index: 10; } .main > div.photo_switch:nth-child(2) { cursor: pointer; position: absolute; left: 10px; color: #FFFFFF; font-size: 18px; top: calc(50% - 15px); z-index: 10; } .main > div.photo_switch i {font-size: 16px;} .settlement.region > div:nth-of-type(1) .main.loading::after { content: ''; background: #EFF1F6; width: 100%; height: 100%; border-radius: 8px; position: absolute; top: 0; left: 0; display: block; } .settlement.region > div:nth-of-type(1) .additional { overflow: hidden; margin-left: 20px; display: flex; flex-direction: column; min-width: 131px; height: 100%; } .settlement.region > div:nth-of-type(1) .additional > div { width: 100%; max-width: 133px; height: 100%; margin-bottom: 20px; position: relative; margin-right: 20px; } .settlement.region > div:nth-of-type(1) .additional > div.loading {overflow: unset;} .settlement.region > div:nth-of-type(1) .additional > div.loading::after { content: ''; background: #EFF1F6; width: 100%; height: 100%; border-radius: 8px; position: absolute; top: 0; left: 0; display: block; } .settlement.region > div:nth-of-type(1) .additional > div:last-child {margin-right: 0; margin-bottom: 0;} .settlement.region > div:nth-of-type(1) img {width: 100%; height: 100%; object-fit: cover; border-radius: 8px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(1) {display: flex; flex-wrap: wrap; margin-top: 10px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(1).loading {background: #EFF1F6; border-radius: 12px; width: fit-content;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(1).loading > a {color: transparent;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(1).loading > div {color: transparent;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(1) > a { margin-right: 12px; text-decoration-line: underline; font-size: 14px; color: #2CAFF9; } .settlement.region > div:nth-of-type(2) > div:nth-of-type(1) > div {font-size: 14px; color: #1A222A;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) {display: flex; align-items: center; margin-top: 8px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2).loading {background: #EFF1F6; border-radius: 12px; width: fit-content;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2).loading > i {color: transparent;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2).loading > div {color: transparent;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2).loading > div:last-child {color: transparent;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) i {font-size: 16px; color: #1A222A; margin-right: 8px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) > div { margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400; } .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child { color: #555966; font-size: 14px; margin-right: 0; font-weight: 400; } .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {display: flex; flex-wrap: wrap; margin-top: 20px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div { display: flex; margin-right: 10px; margin-bottom: 10px; flex-direction: column; min-width: 76px; height: 76px; text-align: center; border-radius: 8px; background: #F5F5F5; } .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div:last-child {margin-right: 0;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div.loading {background: #EFF1F6;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div.loading > i {color: transparent;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div.loading > div.square {color: transparent;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div.loading > div {color: transparent;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div > i {line-height: 50px; font-size: 30px; color: #2CAFF9;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) i.icon_lake {font-size: 20px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) i.icon_water {font-size: 36px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) i.icon_bulb {font-size: 36px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) i.icon_gas {font-size: 36px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div > div.square { line-height: 16px; min-width: 70px; color: #2CAFF9; white-space: nowrap; max-width: 40px; margin: 14px 0 1px; font-size: 18px; text-align: center; font-weight: 700; } .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div > div.square span {font-size: 12px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div > div {color: #1A222A; font-size: 12px; font-weight: 400;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {position: relative;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {margin-top: auto; flex-wrap: wrap;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) a {text-decoration: none;} .settlement.region .settlement_price {margin-left: 0; margin-right: 0; text-align: left;} .open_filters { width: 100% !important; -webkit-justify-content: center; margin-bottom: 33px; font-size: 18px; display: none !important; white-space: nowrap; height: 64px; cursor: pointer; align-items: center; color: #FFF; border-radius: 12px; background: #2CAFF9; padding: 14px 24px; font-weight: 500; transition: 0.2s; } .open_filters i {margin-right: 10px; font-size: 13px;} #regions .paginator {display: flex; -webkit-justify-content: center;} #regions .paginator > div { cursor: pointer; margin-right: 12px; padding: 12px 16px; background: #FFFFFF; border-radius: 4px; border: 1px solid #EFF1F6; font-size: 16px; color: #1A222A; transition: .5s ease-in-out; white-space: nowrap; user-select: none; } #regions .paginator > div.active {color: #FFFFFF; background: #2CAFF9;} #regions .paginator > div:first-child, #regions .paginator > div:last-child {width: 140px;} #regions .paginator > div:last-child {text-align: right;} #regions .paginator > div:hover {color: #FFFFFF; background: #2CAFF9;} #regions .paginator > div:hover > i {color: #FFFFFF;} #regions .paginator > div i {font-size: 14px; color: #555966; transition: .5s ease-in-out;} #regions .paginator > div:first-child > i:last-child {position: relative; left: -8px;} #regions .paginator > div:last-child > i:first-child {position: relative; left: 8px;} @media only screen and (max-width: 1400px) { .settlement .btn {width: 261px;} .settlement.region .btn {width: 261px;} } @media only screen and (max-width: 1260px) { .settlement {border-radius: 20px;} .settlement.region > div:nth-of-type(2) {min-width: 0;} .settlement.region > div:nth-of-type(1) {min-width: 353px; height: auto; flex-direction: column;} .settlement.region > div:nth-of-type(1) .main {width: 100%;} .settlement.region > div:nth-of-type(1) .additional { width: 100%; height: 30%; min-height: 100px; flex-direction: row; margin-left: 0; } .settlement.region > div:nth-of-type(1) .additional > div { min-width: calc(33.3% - 6px); max-width: 140px; min-height: 90px; height: 90px; max-height: 90px; margin-bottom: 0; margin-right: 8px; } .settlement.region .main {height: 100%; width: 100%;} .settlement.region .additional > div {margin-top: 8px !important; margin-right: 8px; max-width: 111px; max-height: 79px;} .settlement.region .additional > div:last-child {margin-right: 0;} .settlement.region .additional {flex-direction: row; width: 100%; height: auto;} .settlement.region {background: white; height: auto;} .settlement.region .btn {position: relative;} } @media only screen and (max-width: 1000px) { .settlement:not(.region) > div:nth-of-type(1) {width: 353px; flex-direction: column; margin-right: 20px;} .settlement:not(.region) .main {width: 353px; height: 282px;} .settlement:not(.region) .additional > div {margin-top: 8px !important; margin-right: 8px; max-width: 111px; max-height: 79px;} .settlement:not(.region) .additional > div:last-child {margin-right: 0;} .settlement:not(.region) .additional {flex-direction: row; width: 100%; height: auto;} .settlement:not(.region) > div:nth-of-type(2) {width: 100%;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) {margin-right: 30px;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(3) {flex-wrap: wrap;} .settlement.region h2 {font-size: 20px;} #regions .filters {padding-left: 0;} .settlement:not(.region), .settlement.region { flex-direction: column; height: auto; background: #FFFFFF; padding: 8px 8px 24px 8px; margin-bottom: 36px; } .settlement:not(.region) > div:nth-of-type(1), .settlement.region > div:nth-of-type(1) { height: auto; width: 100%; margin-right: 0; margin-bottom: 16px; } .settlement:not(.region) > div:nth-of-type(2), .settlement.region > div:nth-of-type(2) {width: 100%; padding: 0 8px;} .settlement:not(.region) .main, .settlement.region .main {width: 100%; min-height: 282px;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(2), .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) {margin-top: 12px; white-space: normal;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(3), .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {margin-top: 12px;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(3) > div:nth-of-type(3), .settlement.region > div:nth-of-type(3) > div:nth-of-type(3) {margin-top: 8px; flex-basis: 100%;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(4), .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {display: flex; margin-top: 24px; flex-wrap: wrap;} .more_picture {width: 42px; height: 34px; position: absolute; bottom: -2px; right: 0; line-height: 34px;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(5), .settlement.region > div:nth-of-type(2) > div:nth-of-type(5) {margin-top: 24px;} .settlement:not(.region) > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1), .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(1) {margin-right: 68px; order: 0;} .settlement_price {width: 100%; margin-left: 0; margin-bottom: 24px; text-align: left; order: -1;} .settlement_price > div:last-child {margin-top: 1px !important;} .settlement:not(.region) .btn, .settlement.region .btn { max-width: 337px; margin-bottom: 16px; position: static; width: 100%; bottom: unset; left: unset; right: unset; margin-top: 24px; } .settlement.region .btn {margin: 0; width: 100%;} .settlement.region .additional {display: none;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {flex-direction: column;} #regions .wrap > h1 {margin-bottom: 32px; font-size: 24px; padding-left: 0;} #regions .container_primary > h1 {font-size: 24px; padding-left: 0; line-height: 140%; margin-bottom: 20px;} } @media only screen and (max-width: 800px) { #settlements {margin-top: 32px;} .region_map {margin-top: 32px;} #regions .filters > div.sort .preloader_sites {display: none;} #regions .filters > div.sort .mkad {margin-top: 10px;} #regions .filters > div.sort .default {margin-top: 10px;} .settlement.region > div:nth-of-type(1) .main {height: 325px;} .settlement:not(.region):nth-of-type(1) {margin-bottom: 24px;} .settlement:not(.region):nth-of-type(2) {margin-bottom: 24px;} .settlement:not(.region):nth-of-type(3) {margin-bottom: 24px;} .settlement.region > div:nth-of-type(1) {min-width: 100%;} .settlement.region .main {margin-right: 0; width: 100%;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(1) {margin-top: 10px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(1) > a {margin-bottom: 10px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) {margin-top: 10px; flex-wrap: wrap;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(3) {margin-top: 5px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) > div:last-child {margin-top: 5px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {margin-top: 25px; max-width: 400px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {margin-top: 15px;} .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) > div {margin-bottom: 10px;} .settlement.region .settlement_price {display: flex; align-items: baseline; margin-right: 0 !important; max-width: 420px;} .settlement.region .settlement_price > div:first-child {margin-right: auto;} #regions .filters > div.highway {margin-bottom: 20px;} #regions .paginator > div {display: none;} #regions .paginator > div:first-child, #regions .paginator > div:last-child {display: block;} #regions .filters > div.highway .btn.filter {display: none;} #regions .filters > div.highway .btn.filter.open {display: block;} .open_filters {display: flex !important;} .settlement.region .btn {max-width: 420px;} } .seo {margin-top: 100px;} .seo h3 {font-size: 18px; margin-bottom: 20px;} .seo p {font-size: 16px; margin-bottom: 20px;} .seo h2 {margin-bottom: 20px;} .seo ul {font-size: 16px; margin-bottom: 20px; display: block; list-style-type: disc; padding-inline-start: 20px;} .seo ul > li {display: list-item !important; list-style-type: disc;} @media only screen and (max-width: 1024px) { .seo {margin-top: 18px;} } /* ------------------------ REGIONS INFO -------------------------- */ #info {margin-top: 112px;} #info .info {border-radius: 20px; background: #FFF; padding: 30px 24px;} #info .info h2 {padding-left: 0; font-size: 24px; color: #1A222A; margin-bottom: 12px;} #info .info h3 {font-weight: 700;} #info .info p {margin-bottom: 1rem;} #info .info div {font-size: 16px; color: #000000; max-height: 140px; overflow: hidden; position: relative; margin-bottom: 16px;} #info .info div::after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background: linear-gradient(0deg, #FDFDFD 25.52%, rgba(255, 255, 255, 0.00) 92.07%); } #info .info.active div {max-height: 100%;} #info .info.active div::after {background: none;} #info .info a {font-size: 16px; text-decoration-line: underline; color: #2CAFF9; cursor: pointer; transition: .3s ease-in-out;} #info .info a:hover {color: #015719;} @media only screen and (max-width: 600px) { #info {margin-top: 32px;} } /* -------------------------------- VIDEOS --------------------------------- */ #videos {margin-top: 100px;} #videos h2 {font-size: 32px; font-weight: 500; margin-bottom: 40px;} .videos {display: flex; margin-top: 32px;} .video_item .video_background {width: 100%; height: 100%; object-fit: cover; border-radius: 8px; position: relative; display: block;} .videos .video_item {overflow: hidden; width: 50%; position: relative;} .video_item.bayside_1 {margin-right: 20px;} .videos .video_item .background { top: 0; left: 0; position: absolute; border-radius: 8px; width: 100%; height: 100%; object-position: center; object-fit: cover; transition: background-size .5s ease-in-out; cursor: pointer; } .video_item.bayside_1 .background {background: url(/images/regions/bayside_1.jpg) no-repeat center / cover; } .video_item.bayside_2 .background {background: url(/images/regions/bayside_2.jpg) no-repeat center / cover; } .video_play { cursor: pointer; z-index: 2; border-radius: 20px; position: absolute; top: calc(50% - 32px); left: calc(50% - 32px); width: 64px; height: 64px; transition: 0.3s ease-in-out; } .video_play:hover {transform: scale(1.05);} @media only screen and (max-width: 1024px) { #videos {margin-top: 42px;} #videos h2 {font-size: 24px; margin-bottom: 20px;} } @media only screen and (max-width: 600px) { .videos {margin-top: 12px; flex-direction: column;} .videos .video_item {width: 100%;} .video_item.bayside_1 {margin-right: 0; margin-bottom: 12px;} } /* ----------------------- SIMILAR REGIONS ------------------------ */ #similar_regions {margin-top: 100px;} #similar_regions h2 {margin-bottom: 30px; padding-top: 0; font-size: 40px; font-weight: 700;} .similar_regions {display: flex; flex-wrap: wrap;} .similar_regions > div { display: flex; flex-direction: column; width: calc(33.3% - 15px); box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.10); padding: 22px; background: #FFFFFF; border-radius: 8px; margin-bottom: 22px; margin-right: 22px; } .similar_regions > div a {text-decoration: none;} .similar_regions > div:nth-child(3n) {margin-right: 0;} .similar_regions > div img {width: 100%; border-radius: 8px; margin-bottom: 24px;} .similar_regions > div > div:nth-of-type(1) {color: #1A222A; font-size: 18px; font-weight: 700; margin-bottom: auto;} .similar_regions > div > div:nth-of-type(2) {font-size: 14px; color: #1A222A; margin-top: 27px;} .similar_regions > div > div:nth-of-type(3) {display: flex; flex-wrap: wrap; align-items: center; margin-top: 12px; margin-bottom: 32px;} .similar_regions > div > div:nth-of-type(3) i {font-size: 16px; color: #2CAFF9; margin-right: 8px;} .similar_regions > div > div:nth-of-type(3) > div:nth-of-type(1) {margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;} .similar_regions > div > div:nth-of-type(3) > div:nth-of-type(2) {margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;} .similar_regions > div > div:nth-of-type(3) > div:nth-of-type(3) {color: #555966; font-size: 14px; font-weight: 400;} .similar_regions > div > div:nth-of-type(4) {display: flex; align-items: center; margin-bottom: 32px;} .similar_regions > div > div:nth-of-type(4) > i {font-size: 16px; color: #2CAFF9; margin-right: 8px;} .similar_regions > div > div:nth-of-type(4) > div:nth-of-type(1) {font-size: 14px;} .similar_regions > div > div:nth-of-type(4) > div:nth-of-type(2) {margin-left: auto; font-size: 14px; font-weight: 700;} .similar_regions > div > div:nth-of-type(5) {display: flex; align-items: center; margin-bottom: 32px;} .similar_regions > div > div:nth-of-type(5) > div:first-child {font-size: 14px; color: #555966; margin-right: auto;} .similar_regions > div > div:nth-of-type(5) > div:last-child {font-size: 24px; font-weight: 700; color: #2CAFF9;} .similar_regions > div .btn {height: 52px; line-height: 52px; width: 100%; -webkit-justify-content: center;} @media only screen and (max-width: 1000px) { .similar_regions > div {width: calc(50% - 6px); margin-right: 12px;} .similar_regions > div:nth-child(3n) {margin-right: 12px;} .similar_regions > div:nth-child(2n) {margin-right: 0;} } @media only screen and (max-width: 600px) { #similar_regions {margin-top: 42px;} #similar_regions h2 {margin-bottom: 12px; font-size: 24px;} .similar_regions > div {width: 100%; margin-right: 0; margin-bottom: 12px;} .similar_regions > div:nth-child(3n) {margin-right: 0;} .similar_regions > div:nth-child(2n) {margin-right: 0;} } /* btn */ .btn { white-space: nowrap; width: 288px; height: 64px; display: flex; cursor: pointer; align-items: center; color: #FFF; border-radius: 8px; background: #2CAFF9; padding: 14px 24px; font-size: 18px; font-weight: 500; transition: 0.2s; } /* ----------------------- REGION INFO ------------------------ */ .region_info { display: flex; padding: 30px; background: #FFFFFF; border-radius: 8px; margin-top: 30px; margin-bottom: 30px; filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.10)); } .region_info > div:first-child {min-width: 400px; max-width: 460px; margin-right: 50px; display: flex; flex-direction: column;} .region_info > div:first-child .main {width: 100%; height: 322px; position: relative;} .region_info > div:first-child .additional {display: flex; width: 100%; height: auto; overflow: hidden; margin-top: 20px;} .region_info > div:first-child .additional > div {min-width: calc(33.3% - 14px); height: 95px; position: relative; margin-right: 20px;} .region_info > div:first-child .additional > div:last-child {margin-right: 0;} .region_info > div:first-child img {width: 100%; height: 100%; object-fit: cover; border-radius: 8px;} .region_info > div:last-child {width: 100%; display: flex; flex-direction: column;} .region_info h1 { font-size: 24px; padding-left: 0; padding-top: 0; margin-bottom: 20px; margin-right: 20px; font-weight: 700; line-height: 130%; } .region_info > div:last-child > div:nth-of-type(1) {display: flex;} .region_info > div:last-child > div:nth-of-type(1) > a { margin-left: auto; cursor: pointer; color: #2CAFF9; font-size: 24px; font-weight: 600; text-decoration-line: underline; } .region_info > div:last-child > div:nth-of-type(2) {display: flex; flex-wrap: wrap;} .region_info > div:last-child > div:nth-of-type(2) > a { text-decoration-line: underline; color: #2CAFF9; font-size: 14px; margin-right: 8px; } .region_info > div:last-child > div:nth-of-type(2) > div {font-size: 14px; color: #1A222A;} .region_info > div:last-child > div:nth-of-type(3) { display: flex; flex-wrap: wrap; align-items: center; margin-top: 12px; margin-bottom: 18px; } .region_info > div:last-child > div:nth-of-type(3) i {font-size: 16px; color: #1A222A; margin-right: 8px;} .region_info > div:last-child > div:nth-of-type(3) > div {margin-right: 8px; color: #1A222A; font-size: 14px; font-weight: 400;} .region_info > div:last-child > div:nth-of-type(3) > div:last-child {color: #555966; font-size: 14px; font-weight: 400;} .region_info > div:last-child > a { display: flex; text-decoration: none; transition: .3s ease-in-out; align-items: center; padding: 8px 16px; width: fit-content; border-radius: 8px; color: #2CAFF9; border: 1px solid #2CAFF9; } .region_info > div:last-child > a > i {margin-right: 10px; color: #2CAFF9; transition: .3s ease-in-out;} .region_info > div:last-child > a:hover {background: #2CAFF9; color: #FFFFFF;} .region_info > div:last-child > a:hover i {color: #FFFFFF;} .region_info > div:last-child > div:nth-of-type(4) {display: flex; flex-wrap: wrap; margin-top: 20px;} .region_info > div:last-child > div:nth-of-type(4) > div { display: flex; margin-right: 14px; margin-bottom: 10px; flex-direction: column; min-width: 69px; height: 76px; text-align: center; border-radius: 12px;background: #F5F5F5; } .region_info > div:last-child > div:nth-of-type(4) > div:last-child {margin-right: 0;} .region_info > div:last-child > div:nth-of-type(4) > div > i {line-height: 50px; font-size: 30px;} .region_info > div:last-child > div:nth-of-type(4) i.icon_lake {font-size: 20px;} .region_info > div:last-child > div:nth-of-type(4) i.icon_water {font-size: 36px;} .region_info > div:last-child > div:nth-of-type(4) i.icon_bulb {font-size: 36px;} .region_info > div:last-child > div:nth-of-type(4) i.icon_gas {font-size: 36px;} .region_info > div:last-child > div:nth-of-type(4) > div:last-child > i {font-size: 24px;} .region_info > div:last-child > div:nth-of-type(4) > div > div.square { line-height: 16px; min-width: 70px; color: #2CAFF9; white-space: nowrap; max-width: 40px; margin: 14px 0 1px; font-size: 18px; text-align: center; font-weight: 700; } .region_info > div:last-child > div:nth-of-type(4) > div > div.square span {font-size: 12px;} .region_info > div:last-child > div:nth-of-type(4) > div > div {color: #1A222A; font-size: 12px; font-weight: 400;} .region_info > div:last-child > div:nth-of-type(4) {position: relative;} .region_info > div:last-child > div:nth-of-type(5) a {text-decoration: none;} .region_info > div:last-child > div:nth-of-type(5) {display: flex; flex-wrap: wrap; align-items: flex-end; margin-top: 30px; order: 6;} .region_info > div:last-child > div:nth-of-type(5) .settlement_price { margin-right: auto; margin-bottom: 20px; text-align: left; flex-wrap: nowrap; margin-left: 0; } .region_info > div:last-child > div:nth-of-type(5) .btn {height: 52px; line-height: 52px; width: 226px;} .region_info > div:last-child > div:nth-of-type(5) > div:last-child {display: flex; margin-bottom: 10px;} .region_info > div:last-child > div:nth-of-type(5) > div:last-child > a:nth-of-type(1) {margin-right: 20px;} .region_info > div:last-child > div:nth-of-type(5) > div:last-child > a:nth-of-type(2) .btn { background: #FFFFFF; border: 1px solid #2CAFF9; color: #2CAFF9; } .region_info > div:last-child > div:nth-of-type(6) {order: 5; padding-top: 6px; font-size: 14px; line-height: 18px;} @media only screen and (max-width: 1120px) { .region_info {flex-direction: column;} .region_info > div:first-child .additional > div {width: 140px;} .region_info > div:first-child {margin-bottom: 20px; margin-right: 0;} } @media only screen and (max-width: 800px) { #region_info {margin-top: 16px;} .region_info > div:last-child > div:nth-of-type(4) > div {min-width: calc(25% - 8px); width: calc(20% - 6px); margin-right: 8px;} .region_info > div:first-child {min-width: 0;} .region_info > div:first-child .additional {display: none;} .region_info {padding: 0; margin-top: 16px;} .region_info > div:first-child .main {width: 100%;} .region_info > div:last-child {padding: 0 20px 32px;} .region_info > div:last-child > div:nth-of-type(1) > a {display: none;} .region_info h1 {margin-bottom: 10px; font-size: 20px;} .region_info > div:last-child > div:nth-of-type(2) > a {margin-bottom: 10px;} .region_info > div:last-child > div:nth-of-type(3) {margin-top: 10px; margin-bottom: 25px;} .region_info > div:last-child > div:nth-of-type(4) {margin-top: 25px;} .region_info > div:last-child > div:nth-of-type(5) {margin-top: 25px;} .settlement_price > div:nth-child(3) {display: none;} .region_info > div:last-child > div:nth-of-type(5) .settlement_price { display: flex; align-items: center; margin-bottom: 25px; max-width: 471px; } .settlement_price > div:nth-of-type(1) {margin-right: auto;} .region_info > div:last-child > div:nth-of-type(5) > div:last-child {flex-direction: column-reverse; margin-bottom: 0; width: 100%;} .region_info > div:last-child > div:nth-of-type(5) > div:last-child > a:nth-of-type(1) {margin-right: 0; margin-top: 10px;} .region_info > div:last-child > div:nth-of-type(5) .btn {width: 100%; justify-content: center;} } /* ------------------------------- BANNER 2 ------------------------------- */ #banner_2 {margin-top: 80px;} .banner_2_group { display: flex; border-radius: 8px; position: relative; overflow: hidden; background: linear-gradient(263deg, rgba(26, 42, 65, 0.00) 39.97%, rgba(26, 42, 65, 0.50) 56.55%, #1A2A41 82.03%), url(/images/home/banner_5_1.jpg?3) center / cover no-repeat; } .banner_3_group { display: flex; border-radius: 8px; position: relative; overflow: hidden; background: linear-gradient(263deg, rgba(26, 42, 65, 0.00) 39.97%, rgba(26, 42, 65, 0.50) 56.55%, #1A2A41 82.03%), url(/images/home/banner_4_1.jpg?3) center / cover no-repeat; } .banner_2_group > div, .banner_3_group > div {width: 100%;} .banner_2_info {padding: 42px 0 42px 54px;} .banner_2_title { font-family: 'roboto', serif; color: #fff; font-size: 50px; font-weight: 500; line-height: 110%; letter-spacing: 0.5px; position: relative; z-index: 1; padding-top: 16px; } .banner_2_subtitle { font-family: 'roboto', serif; display: inline-flex; color: #fff; font-size: 13px; line-height: 1.3; text-transform: uppercase; letter-spacing: 0.16px; } .banner_2_title > span.price {white-space: nowrap;} .banner_2_title > span.price > span { font-family: 'roboto', serif; position: relative; top: -7px; left: 6px; font-size: 34px; font-weight: 500; } .banner_2_desc {font-family: 'roboto', serif; display: flex; padding-top: 32px;} .banner_2_desc > div { font-family: 'roboto', serif; display: flex; flex-direction: row; margin-right: 20px; padding: 12px 21px; background: rgba(255, 255, 255, 0.20); backdrop-filter: blur(7px); border-radius: 8px; } .banner_2_desc > div:last-child {margin-right: 0;} .banner_2_desc > div > div:first-child {font-size: 39px; color: #FFFFFF; font-weight: 500; margin-right: 16px;} .banner_2_desc > div > div:first-child > span {font-size: 24px; position: relative; left: 4px;} .banner_2_desc > div > div:last-child {margin-left: 0; position: relative; bottom: -4px; white-space: nowrap;} .banner_2_desc > div > div:last-child > div:first-child {font-size: 14px; color: #FFFFFF; font-weight: 400; margin-bottom: 2px;} .banner_2_desc > div > div:last-child > div:last-child {font-size: 14px; color: #FFFFFF; font-weight: 500; letter-spacing: -0.3px;} .banner_2_desc > div:last-child > div:last-child > div:last-child {font-weight: 400; letter-spacing: unset;} .banner_3_desc {font-family: 'roboto', serif; font-size: 26px; color: #FFFFFF; margin-top: 32px;} .banner_2_controls {padding-top: 32px;} .banner_2_btn { font-family: 'roboto', serif; height: 56px; border-radius: 8px; line-height: 56px; font-weight: 500; padding: 0 50px; font-size: 18px; letter-spacing: 0.25px; } @media only screen and (max-width: 1200px) { .banner_2_desc > div > div:last-child {margin-left: 0;} } @media only screen and (max-width: 800px) { #banner_2 {margin-top: 50px;} .banner_2_subtitle {margin-bottom: 12px; font-size: 10px; max-width: 200px;} .banner_2_group, .banner_3_group {flex-direction: column-reverse; border-radius: 8px;} .banner_2_group > div, .banner_3_group > div {width: 100%;} .banner_2_group > div:nth-of-type(2):before, .banner_3_group > div:nth-of-type(2):before {display: none;} .banner_2_info {padding: 0;} .banner_2_info > div:first-child { padding: 160px 16px 0; background: linear-gradient(180deg, rgba(26, 42, 65, 0.00) 26.14%, rgba(26, 42, 65, 0.70) 66.1%, #1A2A41 100%), url(/images/home/banner_5_1.jpg?3) top right / cover no-repeat; } .banner_3_group .banner_2_info > div:first-child {padding: 60px 16px 270px; background: none;} .banner_3_group { background: linear-gradient(0, rgba(26, 42, 65, 0.00) 26.14%, rgba(26, 42, 65, 0.70) 66.1%, #1A2A41 100%), url(/images/home/banner_4_1.jpg?3) center / cover no-repeat; } .banner_3_desc {font-size: 18px; margin-top: 14px;} .banner_2_title {font-size: 28px; padding-top: 0; line-height: 1.1;} .banner_2_title > span.price {line-height: 1.3;} .banner_2_title > span.price > span {font-size: 16px; top: -7px; left: 4px; font-weight: 400;} .banner_2_controls {padding-top: 20px;} .banner_2_btn {width: 100%; max-width: 400px; border-radius: 2px;} .banner_2_desc {flex-wrap: wrap; padding: 12px 16px 16px; background: #1A2A41;} .banner_2_btn {font-size: 16px;} .banner_2_desc > div {width: 100%; -webkit-justify-content: center; margin-right: 0; margin-bottom: 16px; padding: 12px 20px;} .banner_2_desc > div:nth-child(2) {margin-right: 0;} .banner_2_desc > div:last-child {width: 100%; margin-bottom: 0; flex-direction: row; -webkit-justify-content: center;} .banner_2_desc > div > div:last-child {bottom: 0;} .banner_2_desc > div > div:last-child > div:first-child {font-size: 12px;} .banner_2_desc > div > div:last-child > div:last-child {font-size: 12px;} .banner_2_desc > div > div:first-child {height: 32px; line-height: 1;} .banner_2_desc > div > div:first-child {font-size: 32px;} .banner_2_desc > div > div:first-child > span {font-size: 20px;} } @media only screen and (max-width: 600px) { .banner_3_group { background: linear-gradient(0, rgba(26, 42, 65, 0.00) 26.14%, rgba(26, 42, 65, 0.70) 66.1%, #1A2A41 100%), url(/images/home/banner_4_1.jpg?3) -800px 0 / cover no-repeat; } } /* ------------------------------- GALLERY ------------------------------- */ .section_photos_top {padding-top: 88px;} .time_line_photos_block {display: flex; width: 100%;} .time_line_photos_block > section {width: 50%; padding-right: 12px; display: table-cell; vertical-align: top; height: 462px;} .time_line_photos_block > section > div {height: 100%; cursor: pointer;} .time_line_photos_block > section > div > video {object-fit: cover; height: 100%; border-radius: 8px;} .time_line_photos_block > div {width: 50%; display: table-cell; flex-wrap: wrap; padding-left: 12px; vertical-align: top; height: 462px;} .time_line_photos_block > div > section {width: 50%; display: table-cell} .photos_extra {display: flex; flex-wrap: wrap; height: 100%;} .photos_extra > section {width: 50%; height: 50%;} .photos_extra > section > div {height: 100%; cursor: pointer;} .photos_extra > section:nth-child(1) {padding-right: 12px; padding-bottom: 12px;} .photos_extra > section:nth-child(2) {padding-left: 12px; padding-bottom: 12px;} .photos_extra > section:nth-child(3) {padding-right: 12px; padding-top: 12px;} .photos_extra > section:nth-child(4) {padding-left: 12px; padding-top: 12px; position: relative;} .photos_extra > section:nth-child(4)::after { display: block; content: ''; position: absolute; top: 12px; left: 12px; bottom: 0; right: 0; border-radius: 8px; z-index: 0; pointer-events: none; background-image: linear-gradient(230.75deg, rgba(14, 14, 14, 0) -31.56%, rgba(0, 0, 0, 0.50) 91.11%); } .photos_extra > section:nth-child(4) > div > article { position: absolute; transform: translate(-55%, -50%); top: 55%; left: 50%; display: flex; flex-direction: column; z-index: 1; margin-left: 12px; } .photos_extra > section:nth-child(4) > div > article > div { display: flex; border: 1px solid #FFFFFF; background: #FFFFFF; height: 54px; width: 54px; cursor: pointer; align-items: center; justify-content: center; margin: 0 auto; border-radius: 50%; transition: all 0.35s ease-out; } .photos_extra > section:nth-child(4) > div > article > div > .icon_arrow { color: #8F97A6; font-size: 14px; margin-left: 1px; margin-top: 1px; } .photos_extra > section:nth-child(4) > div > article > span { font-weight: 600; font-size: 16px; line-height: 160%; color: #FFFFFF; text-align: center; } .photos_extra > section > div > img {width: 100%; object-fit: cover; height: 100%; border-radius: 8px; pointer-events: none;} @media only screen and (max-width: 1080px) { .time_line_photos_block {flex-wrap: wrap;} .time_line_photos_block > section:first-child {width: 100%; padding-right: 0; max-height: 257px; padding-bottom: 16px;} .time_line_photos_block > div {width: 100%; padding-left: 0; height: auto;} .photos_extra > section {max-height: 125px;} .photos_extra > section:nth-child(1) {padding-left: 0; padding-right: 8px; padding-bottom: 8px;} .photos_extra > section:nth-child(2) {padding-left: 8px; padding-bottom: 8px;} .photos_extra > section:nth-child(3) {padding-left: 0; padding-right: 8px; padding-top: 8px;} .photos_extra > section:nth-child(4) {padding-left: 8px; padding-top: 8px;} .photos_extra > section:nth-child(4) > div > article {margin-left: 8px; text-align: center;} .photos_extra > section:nth-child(4) > div > article > div {width: 30px; height: 30px;} .photos_extra > section:nth-child(4) > div > article > div > .icon_arrow {font-size: 10px; margin-bottom: 1px;} .photos_extra > section:nth-child(4) > div > article > span {font-size: 10px;} .photos_extra > section:nth-child(4)::after {left: 8px; top: 8px;} } @media only screen and (max-width: 800px) { .section_photos_top {padding-top: 0; margin-top: 48px;} .section_photos_top .col {width: 100%;padding-left: 52px;padding-top: 0;} .section_photos_top .col_sm {width: 0;} .section_photos_top .block_right {width: 100%; margin-top: 17px;} .section_photos_top .block_middle {width: 100%; margin-right: 0; padding-left: 0;} } #photos_top_gallery_overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #111; z-index: 1999; opacity: 1; visibility: visible; overflow-y: auto; display: flex; flex-direction: column; height: 100vh; transition: opacity 0.35s ease; } #photos_top_gallery_overlay.collapse {opacity: 0; pointer-events: none;} #photos_top_gallery_overlay > .top_block { height: 54px; min-height: 54px; border-bottom: 1px solid rgba(141, 151, 166, 0.5); display: flex; justify-content: space-between; align-items: center; padding: 0 14px 0 30px; top: 0; left: 0; right: 0; margin-bottom: 20px; } #photos_top_gallery_overlay > .top_block > p {color: #FFFFFF; font-weight: 600; font-size: 16px;} #photos_top_gallery_overlay > .top_block > .icon_logo {display: none; font-size: 50px; color: #FFFFFF;} #photos_top_gallery_overlay > .top_block > span {padding: 4px; cursor: pointer; color: #FFFFFF;} #photos_top_slider_images { height: calc(100vh - 85px - 100px); width: 80%; margin: 0 auto; display: flex; align-items: center; position: relative; } #photos_top_slider_images > div {padding-bottom: 10px;} #photos_top_slider_images > div > img {max-height: 100%; width: auto; max-width: 100%; margin: 0 auto; border-radius: 8px;} .photos_slide_img { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; opacity: 0; z-index: 1; display: flex; align-items: center; transition: all 0.2s ease-out; } .photos_slide_img.visible {z-index: 5;} .photos_slide_img.active {opacity: 1;} .photo_slide_img > img {transition: all 0.2s ease-out;} .gallery_modal_thumbs {height: 60px; margin-top: 20px; margin-bottom: 20px; padding: 0 20px;} .gallery_modal_thumbs > div {overflow: auto; padding-bottom: 10px; text-align: center;} .gallery_modal_thumbs > div > div {max-height: 60px; display: inline-flex; justify-content: center;} .gallery_modal_thumbs > div > div > span { display: flex; width: 60px; height: auto; border-radius: 2px; overflow: hidden; position: relative; padding: 0 3px; } .gallery_modal_thumbs > div > div > span:not(.active) {position: relative;} .gallery_modal_thumbs > div > div > span:not(.active)::before { display: block; content: ''; position: absolute; height: 100%; width: 100%; background: rgba(0, 0, 0, 0.4); border-radius: 2px; } .gallery_modal_thumbs > div > div > span.active:after { content: ''; border: 4px solid #2CAFF9; position: absolute; top: 0; bottom: 0; left: 3px; right: 3px; border-radius: 4px; } .gallery_modal_thumbs > div > div > span:hover {cursor: pointer;} .gallery_modal_thumbs > div > div > span > img {width: 100%; height: auto; border-radius: 4px;} #photos_top_slide_paginator { position: absolute; transform: translate(-50%, -50%); top: 50%; left: 50%; width: 98vw; display: flex; justify-content: space-between; } #photos_top_slide_paginator > .slide_paginator {border-radius: 50%; height: 44px; width: 44px;} #photos_top_slide_paginator > .slide_paginator:hover {background: rgba(188, 192, 198, 0.2);} #photos_top_slide_paginator > .slide_paginator > i {color: #FFFFFF; line-height: 44px;} #photos_top_slide_paginator > .slide_paginator.next > i {margin-left: 3px;} #photos_top_slide_paginator > .slide_paginator.prev > i {margin-right: 3px;} @media only screen and (max-width: 800px) { #photos_top_gallery_overlay {background: #160F0F;} #photos_top_gallery_overlay > .top_block { border-bottom: 1px solid rgba(255, 255, 255, 0.2); padding: 20px 26px 20px 20px; height: auto; } #photos_top_gallery_overlay > .top_block > #photos_top_slider_title {display: none;} #photos_top_gallery_overlay > .top_block > .icon_logo {display: block; height: 32px; line-height: 32px;} #photos_top_slide_paginator {display: none;} #photos_top_slider_images {width: 100%;} #photos_top_slider_images > div > img {border-radius: 0;} .gallery_modal_thumbs {margin-top: 20px; margin-bottom: 50px; height: 60px; padding: 0; overflow: hidden;} .gallery_modal_thumbs > div {padding: 0 20px 10px 20px;} .gallery_modal_thumbs > div > div {justify-content: start;} .gallery_modal_thumbs > div > div > span {width: 60px; min-width: 60px; height: 52px; min-height: 52px;} .photos_top_gallery_content {width: 100%; height: 100%; justify-content: unset; position: relative;} } /* ------------------------------- MORTGAGE ------------------------------- */ #mortgage {padding-top: 80px;} #mortgage .section_brief {flex-direction: row;} .mortgage_items {display: flex; padding: 46px 0;} .mortgage_items > div {padding-right: 50px; display: flex; align-items: center;} .mortgage_items > div:last-child {padding-right: 0;} .mortgage_items > div > img {max-height: 30px; width: auto;} .mortgage_btn_msg_group_m {display: none;} .mortgage_items_m {display: none;} @media only screen and (max-width: 800px) { #mortgage {padding-bottom: 42px;} .mortgage_items {padding: 0 0 36px 0;} .mortgage_items > div {padding-right: 26px; padding-bottom: 20px;} .mortgage_items > div:last-child {padding-right: 0;} .mortgage_items > div > img {max-height: 30px; min-width: 40px; max-width: 100px;} .mortgage_items > div:nth-child(1) > img {max-height: 24px;} .mortgage_items_d {display: none;} .mortgage_items_m {display: flex; flex-wrap: wrap;} .mortgage_btn_msg_group_d {display: none;} .mortgage_btn_msg_group_m {display: flex;} } @media only screen and (max-width: 400px) { .mortgage_items > div {padding-right: 20px;} } /* ---------------------------- SILENCE ----------------------------- */ #silence {margin-top: 100px;} #silence .title {font-size: 44px; font-weight: 500; line-height: 130%; margin-bottom: 16px; color: #090A14; max-width: 1050px;} #silence .desc {font-size: 16px; margin-bottom: 60px; color: #1A2A41; max-width: 660px;} #silence .desc span {display: block; margin-top: 8px; font-weight: 700;} #silence .items {display: flex; flex-wrap: wrap;} #silence .items > div {width: calc(50% - 20px); margin-right: 40px; margin-bottom: 40px;} #silence .items > div:nth-child(2n) {margin-right: 0;} #silence .items > div img {width: 100%; margin-bottom: 30px;} #silence .items > div .title {font-size: 26px; font-weight: 500; color: #1A2A41; margin-bottom: 20px;} #silence .items > div .desc {font-size: 16px; color: #727272; margin-bottom: 0;} @media only screen and (max-width: 1024px) { #silence {margin-top: 50px;} #silence .title {font-size: 24px; margin-bottom: 12px;} #silence .desc {margin-bottom: 30px;} #silence .items > div img {margin-bottom: 20px;} #silence .items > div .title {margin-bottom: 6px; font-size: 18px;} #silence .items > div .desc {font-size: 14px;} } @media only screen and (max-width: 600px) { #silence .items {flex-direction: column; max-width: 400px;} #silence .items > div {width: 100%; margin-right: 0; margin-bottom: 30px;} } /* ------------------------------- MORTGAGE 2 ------------------------------- */ #mortgage_2 {margin-top: 100px;} .mortgage_2 { display: flex; align-items: center; padding: 15px 15px 15px 60px; background: rgba(44, 175, 249, 0.08); border-radius: 8px; margin-top: 50px; } .mortgage_2 > div {padding-right: 20px; max-width: 400px; margin-right: auto;} .mortgage_2 > div h4 {color: #2CAFF9; text-transform: uppercase; font-size: 16px; font-weight: 400; margin-bottom: 30px;} .mortgage_2 > div h2 {font-size: 32px; font-weight: 500; margin-bottom: 24px; color: #111418;} .mortgage_2 > div p {font-size: 16px; color: #1A2A41;} .mortgage_2.silence {margin-top: 0;} .mortgage_2.silence > div p {margin-bottom: 24px;} .mortgage_2 > div .mortgage_items {flex-wrap: wrap; padding: 26px 0 0;} .mortgage_2 > div .mortgage_items > div {margin-bottom: 24px;} .mortgage_2 > img {width: 50%; height: 100%; max-height: 500px; object-fit: cover; border-radius: 8px;} .mortgage_2 img.mobile {display: none;} @media only screen and (max-width: 1024px) { #mortgage_2 {background: rgba(44, 175, 249, 0.20); margin-top: 30px;} .mortgage_2 {padding: 24px 0; background: none; margin-top: 0;} .mortgage_2 > div {padding-right: 0; max-width: 100%;} .mortgage_2 > img {display: none;} .mortgage_2 img.mobile {display: block; width: 100%; margin-bottom: 30px; border-radius: 8px;} .mortgage_2 > div h4 {font-size: 12px; margin-bottom: 4px;} .mortgage_2 > div h2 {font-size: 24px; margin-bottom: 12px; line-height: 130%;} .mortgage_2 > div .mortgage_items_d {display: flex !important; padding: 30px 0;} .mortgage_2 .mortgage_btn_msg_group_d {display: block;} .mortgage_2 .mortgage_btn_msg_group_d .btn_primary {width: 100%; max-width: 350px;} } /* ---------------------------- SETTLEMENT ----------------------------- */ #settlement {padding-top: 80px;} #settlement .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(1) {font-size: 14px;} #settlement .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(2) {font-size: 18px !important;} #settlement .settlement.region > div:nth-of-type(2) > div:nth-of-type(2) {flex-wrap: wrap;} #settlement .settlement.region > div:nth-of-type(2) > div:nth-of-type(3) {order: 4;} #settlement .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {order: 3; margin-top: 40px;} #settlement .settlement > div:nth-of-type(2) > div:nth-of-type(5) {margin-top: auto;} #settlement .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div:nth-of-type(2) {margin-right: auto;} #settlement .settlement > div:nth-of-type(2) a {text-decoration: none; display: block; order: 5; margin-top: 24px;} @media only screen and (max-width: 1024px) { #settlement {padding-top: 50px;} #settlement .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {margin-top: 24px;} #settlement .settlement.region .settlement_price {width: 100%; display: block !important; max-width: 100%;} #settlement .settlement.region > div:nth-of-type(2) > div:nth-of-type(4) {display: flex; flex-direction: row-reverse;} #settlement .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(1) {font-size: 12px;} #settlement .settlement > div:nth-of-type(2) > div:nth-of-type(4) > div > div:nth-of-type(2) { font-size: 14px !important; margin-top: 9px !important; } } /* ------------------------------- PLAN ------------------------------- */ #plan_section {padding-top: 100px; padding-bottom: 100px;} #plan_section .container_primary {padding: 0 20px;} .plan_section {overflow: inherit; position: relative;} .plan_title {display: none;} #plan_wrapper {width: 100%; display: block;} #plan_left {width: 100%; padding-bottom: 10px;} #plan_left > .header_info_btn { margin: auto 0 0 0; height: 50px; line-height: 50px; width: 100%; padding: 0 10px; font-size: 14px; white-space: nowrap; max-width: 210px; } #plan_right {width: 100%; overflow: hidden;} .plan_menu {padding-top: 20px; text-align: center; max-width: 1000px; margin: 0 auto; display: flex; flex-wrap: wrap;} .plan_menu > a { border: 1px solid rgba(0, 0, 0, 0.3); line-height: 30px; font-size: 12px; padding: 0 14px; margin-right: 8px; border-radius: 18px; position: relative; margin-bottom: 10px; cursor: pointer; text-decoration: none; color: #333; display: flex; align-items: center; transition: all 0.35s ease-out; } .plan_menu > a.new {width: fit-content; border: 1px solid #FF7700;} .plan_menu > a.new > img {width: 12px; display: block; margin-right: 8px;} .plan_menu > a.new:hover {background-color: #FF770033; border-color: #FF7700;} .plan_menu > a.new.active, .plan_menu > a.new:hover.active {background-color: #FF7700; border-color: #FF7700; color: #FFFFFF;} .plan_menu > a:hover {background-color: #c7eafe; border-color: #c7eafe;} .plan_menu > a.active, .plan_menu > a:hover.active {color: #fff; background-color: #34A8E9; border-color: #34A8E9;} #block_small_responsive {display: none;} @media only screen and (max-width: 1250px) { .plan_bg {z-index: -2000;} } @media only screen and (max-width: 1000px) { #plan_section {padding-top: 0; margin-top: 50px; padding-bottom: 40px; overflow: hidden;} .plan_section {padding: 0;} .plan_bg {bottom: -20px; width: 100%; top: 50px; border-radius: 0;} #plan_left {display: none;} #plan_right {width: 100%; display: block;} .plan_menu {width: 100%; user-select: none; text-align: left; padding-top: 10px;} .plan_menu a { margin-right: 5px; border: 1px solid #84A7BD; padding: 2px 12px; border-radius: 22px; left: 0; margin-bottom: 10px !important; font-size: 11px; } .plan_menu .active {border: 1px solid #34A8E9;} #block_small_responsive {display: block;} } @media only screen and (max-width: 800px) { .plan_title {padding: 0 15px; margin-bottom: 20px; font-weight: 600; font-size: 22px; display: block;} .plan_menu a {margin-bottom: 30px;} /* #plan_right {overflow-x: auto;} */ } #plan_block {width: 100%; height: 100%; position: relative; display: block; z-index: 11;} #plan_block.modal {width: calc(80% - 64px); height: auto; overflow: hidden;} #plan_wrap {width: 100%; height: 100%;} #block_plan {cursor: default; width: 100%; height: auto;} #plan_pan {width: 100%; min-width: 100%; height: auto; overflow: hidden;} @media only screen and (min-width: 1830px) { #block_plan {height: 100%; width: 100%;} } @media only screen and (max-width: 1080px) { #block_plan {width: 100%; border-radius: 0;} #plan_block {height: 100%; max-width: 100vw;} } @media only screen and (max-width: 1000px) { #block_plan {width: 100%; height: auto;} #plan_wrap {width: 100%; min-width: 100%; height: auto; overflow: hidden;} } @media only screen and (max-width: 800px) { #block_plan {width: 100%;} #plan_block.modal {width: 100%;} } @media only screen and (max-width: 800px) { /* #plan_block {width: calc(100vh * 16 / 9); max-width: none;} */ } .land-free {fill: rgba(39, 199, 107, 0); stroke: rgba(39, 199, 107, 0);} .selected-free {fill: rgba(39, 199, 107, 0.4); stroke: rgba(39, 199, 107, 1);} .land-occupied {fill: rgba(241, 193, 0, 0); stroke: rgba(241, 159, 0, 0);} .number-occupied {fill: rgba(241, 193, 0, 1); stroke: #f19f00;} .selected-occupied {fill: rgba(241, 193, 0, 1); stroke: rgba(241, 159, 0, 1);} .land-sold {fill: rgba(255, 12, 28, 0); stroke: rgba(255, 58, 61, 0);} .selected-sold {fill: rgba(150, 149, 153, 1); stroke: rgba(96, 100, 111, 1);} .number-sold {fill: rgba(189, 189, 190, 1); stroke: rgba(129, 132, 138, 1);} .info_block { position: absolute; background: #fff; padding: 10px; font-size: 14px; line-height: 16px; border-radius: 8px; opacity: 0; visibility: hidden; -webkit-transition: opacity .7s ease-in-out; transition: opacity .7s ease-in-out; user-select: none; } .info_block.active { display: block; visibility: visible; opacity: 1; -webkit-transition: opacity .7s ease-in-out; transition: opacity .7s ease-in-out; } .info_block .title {color: #000; display: block; font-size: 14px; font-weight: 600; margin-bottom: 0;} .info_block .text-grey {display: block; color: #828282; font-size: 12px;} .info_block .text-green {display: block; color: #2B983C; font-size: 14px; font-weight: 600; margin-top: 8px; text-transform: uppercase;} .info_block .text-red {display: block; color: #C74022; font-size: 14px; font-weight: 600; margin-top: 8px; text-transform: uppercase;} .info_block .text-orange {display: block; color: #E6AB38; font-size: 14px; font-weight: 600; margin-top: 8px; text-transform: uppercase;} .info_block .price {color: #2B983C; font-size: 14px; font-weight: 600;} .info_block .btn_primary {display: none;} .info_block .modal_popup_close {display: none;} .info_block_photo {padding: 3px; border-radius: 9px;} .info_block .photo {display: flex;} .info_block .photo > img {display: flex; max-width: 200px; width: 100%; border-radius: 8px; overflow: hidden;} .info_block_photo .title {max-width: 200px; padding: 7px 10px 5px 10px; font-weight: 400; line-height: 120%;} .info_block.mobile {padding: 32px 24px; width: 300px; display: flex; flex-direction: column;} .info_block.mobile .title {color: #1A2A41; font-size: 22px; margin-bottom: 5px; font-weight: 600; line-height: 130%; order: 2;} .info_block.mobile .text-grey {font-size: 22px; margin-bottom: 5px; font-weight: 500; line-height: 130%; order: 3;} .info_block.mobile .price {font-size: 28px; color: #2CAFF9; line-height: 130%; order: 4; margin-bottom: 16px;} .info_block.mobile .text-green { width: fit-content; font-size: 16px !important; font-weight: 500; color: #2B983C; line-height: 110%; border-radius: 16px; border: 1px solid #2B983C; background: #E0FFE4; padding: 6px 10px; order: 1; margin-top: 0; margin-bottom: 16px; } .info_block.mobile .text-red { width: fit-content; font-size: 16px !important; font-weight: 500; color: #C74022; line-height: 110%; border-radius: 16px; border: 1px solid #C74022; background: #FFE2DB; padding: 6px 10px; order: 1; margin-top: 0; margin-bottom: 16px; } .info_block.mobile .text-orange { width: fit-content; font-size: 16px !important; font-weight: 500; color: #E6AB38; line-height: 110%; border-radius: 16px; border: 1px solid #E6AB38; background: #FFF7E7; padding: 6px 10px; order: 1; margin-top: 0; margin-bottom: 16px; } .info_block.mobile .btn_primary { display: block; order: 5; height: 54px; line-height: 54px; transition: none; } .info_block.mobile .modal_popup_close {right: 16px; top: 16px; display: flex;} #zoom_block {position: absolute; top: 20px; left: 1%; z-index: 100;} #zoom_in, #zoom_out {cursor: pointer; width: 36px; height: 36px; display: block;} #zoom_in {margin-bottom: 10px;} #swipe_block {display: none; z-index: 999;} @media only screen and (max-width: 1080px) { #plan_block_small {display: none;} #block_small_responsive {width: 100%; overflow: hidden; padding: 20px 15px 15px 15px;} #zoom_block {top: 10%;} #swipe_block { display: none; width: 48px; height: 48px; position: absolute; bottom: 10%; left: 50%; transform: translate(-50%, 0); } } @media only screen and (max-width: 800px) { #zoom_block {display: none;} #swipe_block {display: none;} .info_block {padding: 6px 8px;} .info_block .title {font-size: 10px; border-radius: 3px;} .info_block .text-green, .info_block .text-grey, .info_block .text-red, .info_block .text-orange, .info_block .price {font-size: 10px; line-height: 120%;} .info_block .text-green, .info_block .text-red, .info_block .text-orange {margin-top: 4px;} .text-grey {margin-bottom: 8px;} .info_block_photo {padding: 1px; border-radius: 3px;} .info_block .photo > img {max-width: 90px; border-radius: 2px; overflow: hidden;} .info_block_photo .title {padding: 3px 6px 3px 6px; max-width: 90px; font-size: 10px; line-height: 120%;} .info_block_photo.mobile .title {padding: 0; max-width: 100%;} } @media only screen and (max-width: 420px) { #zoom_block {top: 25px; right: 25px; left: auto;} #swipe_block {bottom: 20px;} #zoom_in, #zoom_out {width: 46px; height: 46px;} #zoom_in {margin-bottom: 14px;} } /* ---------------------------- REELS MODAL ---------------------------- */ #reels_modal {padding: 0 15px; width: 100vw; max-width: 1500px; margin: 0 auto;} .progress_reels { position: relative; margin: 0 auto 5px auto; overflow: hidden; width: 100%; height: 4px; border-radius: 20px; background: #7C7878; } .progress_reels_value {position: absolute; left: 0; top: 0; height: 100%; border-radius: 20px; background: #FFF;} .reels_modal_item {opacity: .75; max-height: 80vh; width: 33.3vw; height: calc(33.3vw * 16 / 9); transition: padding .3s;} .reels_modal_item > div {width: 100%; height: 100%; display: flex; align-items: center;} .reels_modal_item > div > div:last-child { max-height: 80vh; height: 75%; margin-left: auto; margin-right: auto; background: #000000; border-radius: 8px; overflow: hidden; } .reels_modal_item video {width: 100%; height: 100%; object-fit: cover;} .reels_modal_item.is-selected { display: flex; align-items: center; opacity: 1; padding: 0 !important; margin: 0 !important; flex-direction: column; } .reels_modal_item.is-selected > div {max-height: 80vh; width: auto; flex-direction: column; } .reels_modal_item.is-selected > div > div:last-child {margin-right: auto; height: calc(100% - 10px) !important;} .reels_modal_item.is-selected ~ .reels_modal_item > div > div:last-child {margin-left: auto; margin-right: auto;} #reels_modal .flickity-prev-next-button {background: #BCC0C6; border-radius: 50%; width: 24px; height: 24px;} .flickity-prev-next-button .flickity-button-icon {left: 25%; width: 50%;} #reels_modal .flickity-prev-next-button.next {right: 31%;} #reels_modal .flickity-prev-next-button.previous {left: 31%;} @media only screen and (max-width: 800px) { #reels_modal {width: 60vw;} .reels_modal_item {width: calc(60vw - 30px); height: calc((60vw - 30px) * 16 / 9);} #reels_modal .flickity-button {display: none;} } @media only screen and (max-width: 600px) { #reels_modal {width: 100vw;} .reels_modal_item {width: calc(100vw - 30px); height: calc((100vw - 30px) * 16 / 9);} } /* ------------------------------- REELS ------------------------------- */ #reels {padding-top: 70px; overflow: hidden;} #reels .container_primary {overflow: initial;} .reels_group {position: relative; left: -10px; right: -10px; width: calc(100% + 20px);} .reels_wrap {width: 100%; display: flex; flex-direction: column; align-items: flex-start;} .reels_title {padding: 0 10px; margin-bottom: 50px;} .reels_title > div {font-size: 32px; font-weight: 600;} #reels_items {width: 100%; margin-left: auto;} #reels_items > div {overflow: hidden;} #reels_items .flickity-button {box-shadow: 0 0 150px;} #reels_items .flickity-prev-next-button {width: 64px; height: 64px; background: #fff; border-radius: 50%; transition: .3s;} #reels_items .flickity-prev-next-button:active .arrow {fill: #FFFFFF;} #reels_items .flickity-prev-next-button:active {background: #2CAFF9; opacity: 1;} #reels_items .flickity-prev-next-button.next {right: -30px;} #reels_items .flickity-prev-next-button.previous {left: -30px;} #reels_items .flickity-prev-next-button .flickity-button-icon {left: 35%; width: 30%;} .new_video { width: 90px; height: 31px; border-radius: 8px; border: 2px solid #FFF; background: #2CAFF9; color: #FFF; text-align: center; padding: 5px 0; position: absolute; right: 0; top: 0; } .reels_item {width: 16.6666%; padding: 15px 10px 0; position: relative; cursor: auto;} .reels_item img {position: absolute; width: 60px; height: 41px; top: calc(50% - 30px); left: calc(50% - 30px);} .reels_item > div { width: 100%; transition: .3s; border-radius: 8px; cursor: pointer; box-shadow: inset 0 0 1000px 1000px rgba(0, 0, 0, 0.4); padding-top: 177.7%; } .reels_item > div:hover {box-shadow: inset 0 0 1000px 1000px rgba(0, 0, 0, 0.26);} .reels_item:nth-of-type(1) > div {background: url(/images/reels/reels_23.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(2) > div {background: url(/images/reels/reels_24.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(3) > div {background: url(/images/reels/reels_25.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(4) > div {background: url(/images/reels/reels_26.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(5) > div {background: url(/images/reels/reels_17.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(6) > div {background: url(/images/reels/reels_18.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(7) > div {background: url(/images/reels/reels_19.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(8) > div {background: url(/images/reels/reels_20.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(9) > div {background: url(/images/reels/reels_21.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(10) > div {background: url(/images/reels/reels_22.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(11) > div {background: url(/images/reels/reels_1.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(12) > div {background: url(/images/reels/reels_2.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(13) > div {background: url(/images/reels/reels_3.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(14) > div {background: url(/images/reels/reels_4.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(15) > div {background: url(/images/reels/reels_5.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(16) > div {background: url(/images/reels/reels_6.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(17) > div {background: url(/images/reels/reels_7.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(18) > div {background: url(/images/reels/reels_8.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(19) > div {background: url(/images/reels/reels_9.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(20) > div {background: url(/images/reels/reels_10.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(21) > div {background: url(/images/reels/reels_11.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(22) > div {background: url(/images/reels/reels_12.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(23) > div {background: url(/images/reels/reels_13.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(24) > div {background: url(/images/reels/reels_14.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(25) > div {background: url(/images/reels/reels_15.jpg?2) 0 / cover no-repeat;} .reels_item:nth-of-type(26) > div {background: url(/images/reels/reels_16.jpg?2) 0 / cover no-repeat;} @media only screen and (max-width: 1024px) { .reels_item > div {border-radius: 4px;} #reels_items .flickity-prev-next-button {width: 32px; height: 32px;} #reels_items .flickity-prev-next-button.next {right: 0;} #reels_items .flickity-prev-next-button.previous {left: 0;} } @media only screen and (max-width: 800px) { #reels {padding-top: 0;} .reels_wrap {flex-direction: column; align-items: normal;} #reels_items {margin-left: 0; width: 100%;} #reels_items .flickity-prev-next-button {display: none;} .reels_item {width: 33.3%;} .reels_item img {width: 30px; height: 20px; top: calc(50% - 15px); left: calc(50% - 15px);} .reels_title {margin-bottom: 20px; display: flex;} .reels_title > div {margin-right: auto; font-size: 24px;} } /* ------------------------------- VIDEO ------------------------------- */ #video {padding-bottom: 20px; padding-top: 38px;} #video video {width: 100%; border-radius: 8px; margin-top: 54px;} .video_group {display: flex; align-items: end;} .video_group > div:nth-of-type(1) { width: 70%; font-weight: 500; font-size: 32px; line-height: 130%; letter-spacing: 0.2px; color: #111318; } .video_group > div:nth-of-type(2) {width: 30%; display: flex; justify-content: end; padding-bottom: 8px;} .video_group .btn_primary {padding: 0 40px;} @media only screen and (max-width: 800px) { #video {padding-bottom: 0; padding-top: 0;} #video video {margin-top: 20px;} .video_group {flex-direction: column;} .video_group > div:nth-of-type(1) {width: 100%; font-size: 22px; line-height: 28px;} .video_group > div:nth-of-type(2) {display: none;} } /* ------------------------------- FEATURES ------------------------------- */ #features {position: relative; padding-top: 60px; overflow: hidden;} #features .btn_msg_group_2 {padding-bottom: 62px;} .features_info {display: flex; flex-direction: column; margin: 0 auto; width: 100%; max-width: 1600px; padding: 0 80px;} .features_info > .section_photo {display: flex; margin-top: 62px; margin-bottom: 15px; max-height: 630px;} .features_info > .section_photo > img {object-fit: cover; width: 100%; max-height: 630px; border-radius: 8px;} .features_info > .section_photo > img:last-child {display: none;} .features_info > .section_p {width: 55%; margin-bottom: 0;} #features .h2 {margin-bottom: 16px;} #features .col {padding-left: 178px; padding-right: 20%;} #features .number {height: 280px; margin-left: auto;} @media only screen and (max-width: 1080px) { .features_info {padding: 0 30px;} } @media only screen and (max-width: 800px) { #features .btn_msg_group_2 {padding-bottom: 34px;} #features .section_brief {padding: 0 15px;} .features_info {width: 100%; padding: 0;} .features_info > .section_p, .features_info > .h2 {padding: 0 15px;} .features_info > .section_photo {margin-top: 30px; margin-bottom: 30px;} .features_info > .section_p {width: 100%;} .features_info > .section_photo > img:first-child {display: none;} .features_info > .section_photo > img:last-child {display: block; height: 100%; border-radius: 0;} } /* slider */ #features_slider_section {padding-left: calc(80px + (100% - 1600px) * 0.5);} .features_slides {width: 100%; overflow: hidden;} .features_slide {padding-right: 20px;} .features_slide > div::before { content: ''; display: block; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, #000000 100%); border-radius: 8px; z-index: -2001; } .features_slide > div {height: 400px; position: relative; border-radius: 8px; max-width: 516px; width: 516px;} .features_slide_info {color: #fff; position: absolute; bottom: 32px; left: 32px; right: 32px;} .features_slide_info > div:nth-child(1) {font-size: 22px; font-weight: 600; letter-spacing: 0.3px; color: #FFFFFF;} .features_slide_info > div:nth-child(2) {padding-top: 14px; font-size: 14px; line-height: 140%; color: #D1D4DA;} .features_slide_1 {background: url('/images/home/features_1.jpg?2') 50% 50%; background-size: cover;} .features_slide_2 {background: url('/images/home/features_2.jpg') 50% 50%; background-size: cover;} .features_slide_3 {background: url('/images/home/features_3.jpg') 50% 50%; background-size: cover;} .features_slide_4 {background: url('/images/home/features_4.jpg') 50% 50%; background-size: cover;} .features_slide_5 {background: url('/images/home/features_5.jpg') 50% 50%; background-size: cover;} .features_slide_6 {background: url('/images/home/features_6.jpg') 50% 50%; background-size: cover;} .features_slide_7 {background: url('/images/home/features_7.jpg') 50% 50%; background-size: cover;} .features_slide_8 {background: url('/images/home/features_8.jpg') 50% 50%; background-size: cover;} .features_slides_paginator {display: table; margin-bottom: 40px;} .features_slides_paginator_btn {display: table-cell; vertical-align: middle; width: 0;} .features_slides_paginator_arrow {color: #AEB3BB; font-size: 20px;} .features_slides_paginator_arrow.active {color: #2BAFF9; cursor: pointer;} #features_slides_paginator_prev {margin-right: 25px;} #features_slides_paginator_next {margin-left: 25px;} #features_slides_paginator_progress {width: 14.28%; height: 2px; background: #2BAFF9; transition: all 0.35s ease-in-out;} @media only screen and (max-width: 1620px) { #features_slider_section {padding-left: 80px;} } @media only screen and (max-width: 1080px) { #features {padding-top: 42px;} #features_slider_section {padding-left: 30px;} #features_slides_paginator_prev {margin-right: 15px;} #features_slides_paginator_next {margin-left: 15px;} } @media only screen and (max-width: 800px) { #features_slider_section {width: 100%; padding: 30px 0 0 0;} .features_slides {padding-left: 15px;} .features_slides_paginator {margin-bottom: 30px;} .features_slides_paginator_arrow {color: #AEB3BB; font-size: 18px;} .features_slide > div {height: 400px; width: 260px;} .features_slide_info > div:nth-child(2) {font-size: 14px; line-height: 140%; padding-top: 8px;} .features_slide_info {left: 16px; bottom: 28px;} } /* ------------------------------- APP ------------------------------- */ .app_page_wrap_1 {max-width: 1600px; margin: 0 auto; padding: 100px 0 50px 0;} .app_page_wrap_1 > .container_primary {overflow: inherit;} .app_page_1 {display: flex; width: 100%; flex-direction: row-reverse; padding-top: 50px;} .app_page_1 > div {width: 50%; align-items: flex-start;} .app_phone_1 {max-height: 500px; width: auto; position: absolute; top: -50px; right: 200px; z-index: 10;} .app_phone_2 {max-height: 550px; width: auto; position: absolute; top: 0; right: 0; z-index: 11;} .app_page_label {text-transform: uppercase; color: #2CAFF9; font-size: 13px; font-weight: 500;} .app_page_title {font-size: 32px; margin-top: 20px; color: #111418; font-weight: 500;} .app_table {display: flex; flex-wrap: wrap; width: 100%; max-width: 600px; margin-top: 30px;} .app_table > div {flex-grow: 1; width: calc(50% - 8px); padding: 25px; background: #EEF9FF; border-radius: 8px; position: relative;} .app_table > div:nth-child(2n+1) {margin-right: 8px;} .app_table > div:nth-child(2n) {margin-left: 8px;} .app_table > div:nth-child(1), .app_table > div:nth-child(2) {margin-bottom: 16px;} .app_table_icon {width: 50px; height: 50px; border-radius: 50%; text-align: center; background: #C9ECFF;} .app_table_icon i {position: relative; line-height: 50px; font-size: 20px; color: #0052CC;} .app_table_icon i.icon_time_2 {top: -1px; left: -2px;} .app_table_icon i.icon_food {top: -2px; left: 1px;} .app_table_title {font-size: 18px; font-weight: 600; margin-top: 10px;} .app_table_desc {font-size: 13px; line-height: 150%; margin-top: 12px; color: #5A5C60;} @media only screen and (min-width: 1400px) { .app_phone_1 {height: 600px;} .app_phone_2 {height: 650px;} } @media only screen and (max-width: 1000px) { .app_phone_1 {right: 150px;} } @media only screen and (max-width: 800px) { .app_page_wrap_1 {padding: 20px 0 50px 0;} .app_page_1 {display: block;} .app_page_1 > div:nth-child(1) {height: 430px;} .app_page_1 > div {width: 100%; padding-top: 120px;} .app_phone_1 {right: auto; left: 0; max-height: 500px;} .app_phone_2 {right: auto; left: 180px; top: -20px; max-height: 550px;} .app_page_title {font-size: 24px;} .app_table {margin-top: 30px;} .app_table > div {width: calc(50% - 5px); padding: 15px;} .app_table > div:nth-child(2n+1) {margin-right: 5px;} .app_table > div:nth-child(2n) {margin-left: 5px;} .app_table > div:nth-child(1), .app_table > div:nth-child(2) {margin-bottom: 10px;} } @media only screen and (max-width: 530px) { .app_page_1 > div {padding-top: 160px;} .app_phone_1 {max-height: 530px;} .app_phone_2 {max-height: 580px; right: 0; left: auto;} } @media only screen and (max-width: 460px) { .app_page_1 > div {padding-top: 70px;} .app_phone_1 {max-height: 450px;} .app_phone_2 {max-height: 500px;} } @media only screen and (max-width: 400px) { .app_page_1 > div {padding-top: 0;} .app_phone_1 {max-height: 400px;} .app_phone_2 {max-height: 440px;} } /* ------------------------------- SERVICES ------------------------------- */ .services_m_slides {height: 100%;} #services_m_slider_images {display: flex; flex-wrap: wrap; height: 100%;} #services_m_slider_images > div > img {width: 100%; height: 100%; object-fit: cover; border-radius: 8px;} .services_section {padding-top: 80px;} .services_section .container .right {width: 630px; margin-left: 80px;} .services_section > .container_primary_flex > .number {height: 280px;} .services_section .block_middle {width: 70%; padding-left: 5%; overflow: hidden;} .services_section .block_right {width: 20%; vertical-align: bottom; padding-left: 20px;} .services_table_wrap { width: 100%; max-width: 1600px; position: relative; display: table; vertical-align: top; padding: 0 80px; margin: 0 auto; } .services_table {display: table; width: 100%;} .services_table div.services_m_slide {display: table-cell; width: 33.33%;} .services_table div.services_m_slide:nth-child(1) {padding-right: 10px;} .services_table div.services_m_slide:nth-child(2) {padding-left: 5px; padding-right: 5px;} .services_table div.services_m_slide:nth-child(3) {padding-left: 10px; padding-right: 15px;} .services_table div.services_m_slide > a { display: block; height: 300px; width: 100%; border-radius: 8px; transition: 0.3s ease-in-out; position: relative; } .services_table div.services_m_slide > a:hover {box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.50);} .services_table div.services_m_slide > a:hover i {opacity: 1;} .services_table_title { font-size: 24px; font-weight: 600; letter-spacing: 0.2px; color: #fff; position: absolute; bottom: 50px; left: 20px; } .services_table_goto {font-size: 14px; color: #D1D4DA; position: absolute; bottom: 20px; left: 20px;} .services_table_goto i {font-size: 9px; margin-left: 8px; position: relative; top: -1px; opacity: 0; transition: .3s ease-in-out;} .services_m_slides_paginator {margin-top: 32px; margin-bottom: 28px; display: none;} .services_m_slides_paginator_btn {display: table-cell; vertical-align: middle; width: 0;} .services_m_slides_paginator_arrow {color: #AEB3BB; font-size: 20px;} .services_m_slides_paginator_arrow.active {color: #2BAFF9; cursor: pointer;} #services_m_slides_paginator_prev {margin-right: 12px;} #services_m_slides_paginator_next {margin-left: 12px;} #services_m_slides_paginator_progress {width: 25%; height: 2px; background: #2BAFF9; transition: all 0.35s ease-in-out;} @media only screen and (max-width: 1080px) { .services_table_wrap {padding: 0 30px;} } @media only screen and (max-width: 800px) { .services_section {padding-top: 20px;} .services_section > .container_primary_flex > .number {height: auto;} .services_table_wrap {padding: 0 0 0 15px; display: block;} .services_table {display: block;} .services_table_title {font-size: 18px;} .services_table > div {display: block; width: 100%;} .services_table > div:nth-child(1) {padding-right: 0;} .services_table > div:nth-child(2) {padding-left: 0; padding-right: 0;} .services_table > div:nth-child(3) {padding-left: 0; padding-right: 0;} .services_table > div > a {height: 200px;} #services_m_slider_images {width: 100%; transition: all 0.35s ease-in-out; flex-wrap: nowrap;} #services_m_slider_images > div.services_m_slide {padding: 0 10px 0 0; height: 200px; min-width: 243px;} .services_m_slides {width: 100%; overflow: hidden;} .services_m_slides_paginator {display: table;} .services_m_slides_paginator_arrow {color: #AEB3BB; font-size: 14px;} .services_table div.services_m_slide > a {height: 100%;} } @media only screen and (max-width: 700px) { .services_section .number {position: relative; height: 255px; min-width: 118px; width: 118px; margin-right: 14px;} } /* ------------------------------- MEETINGS ------------------------------- */ #meetings {margin-top: 80px;} #meetings > .container_primary {display: block;} #meetings .section_p {max-width: 600px;} .meetings_content_container {display: flex; height: 430px;} .meetings_content_container > .left_section {overflow: hidden; min-width: 50%; max-width: 50%; position: relative;} .meetings_content_container > .left_section > div {display: none; max-width: 100%; max-height: 100%; width: 100%; height: 100%;} .meetings_content_container > .left_section > div.active {display: flex;} .meetings_content_container > .left_section .left_section_controls {display: block;} .meetings_content_container > .left_section .left_section_controls > img:first-child { display: block; position: absolute; left: 12px; top: calc(50% - 12px); z-index: 12; width: 24px; transform: rotate(180deg); cursor: pointer; } .meetings_content_container > .left_section .left_section_controls > img:last-child { display: block; position: absolute; right: 12px; top: calc(50% - 12px); z-index: 12; width: 24px; cursor: pointer; } .meetings_content_container > .left_section .left_section_controls > img.dn {display: none;} .meetings_content_container > .left_section video { max-width: 100%; max-height: 100%; width: 100%; height: 100%; display: block; border-radius: 8px; } .meetings_content_container > .left_section video[poster] {object-fit: cover} .meetings_content_container > .right_section {width: 50%; padding-left: 8px} .meetings_slides {height: 100%;} #meetings_slider_images {display: flex; flex-wrap: wrap; height: 100%;} #meetings_slider_images > div {width: 50%; height: 50%;} #meetings_slider_images > div:nth-child(1) {padding-right: 8px; padding-bottom: 8px;} #meetings_slider_images > div:nth-child(2) {padding-left: 8px; padding-bottom: 8px;} #meetings_slider_images > div:nth-child(3) {padding-right: 8px; padding-top: 8px;} #meetings_slider_images > div:nth-child(4) {padding-left: 8px; padding-top: 8px;} #meetings_slider_images > div > img {width: 100%; height: 100%; object-fit: cover; border-radius: 8px;} .meetings_slides_paginator {margin-top: 30px; margin-bottom: 42px; display: none;} .meetings_slides_paginator_btn {display: table-cell; vertical-align: middle; width: 0;} .meetings_slides_paginator_arrow {color: #AEB3BB; font-size: 20px;} .meetings_slides_paginator_arrow.active {color: #2BAFF9; cursor: pointer;} #meetings_slides_paginator_prev {margin-right: 12px;} #meetings_slides_paginator_next {margin-left: 12px;} #meetings_slides_paginator_progress {width: 25%; height: 2px; background: #2BAFF9; transition: all 0.35s ease-in-out;} @media only screen and (max-width: 800px) { #meetings {margin-top: 0; margin-bottom: 0;} #meetings > .container_primary {padding: 0;} #meetings > .container_primary > .h2, #meetings > .container_primary > .section_p, #meetings > .container_primary .left_section {padding: 0 15px;} #meetings > .container_primary .right_section {padding-left: 15px;} #meetings .h2 {font-size: 22px;} .meetings_content_container {flex-direction: column; height: auto; margin-top: 30px;} .meetings_content_container > .left_section {width: 100%; min-width: 100%; max-width: 100%; display: flex;} .meetings_content_container > .left_section > div {min-width: 100%; width: 100%; margin-bottom: 10px;} .meetings_content_container > .left_section video {width: 100%; max-height: 250px; margin-right: 0; display: block;} .meetings_content_container > .right_section {width: 100%; padding-left: 0;} .meetings_content_container > .left_section .left_section_controls > img:first-child {left: 24px;} .meetings_content_container > .left_section .left_section_controls > img:last-child {right: 24px;} .meetings_slides {width: 100%; overflow: hidden;} .meetings_slides_paginator {display: table;} .meetings_slides_paginator_arrow {color: #AEB3BB; font-size: 14px;} #meetings_slider_images {width: 100%; transition: all 0.35s ease-in-out; flex-wrap: nowrap;} #meetings_slider_images > div.meetings_slide {padding: 0 10px 0 0; height: 166px; min-width: 184px;} } /* ------------------------------- INFRASTRUCTURE ------------------------------- */ #infrastructure_slider_section {padding-left: 80px;} #flickity_infrastructures {display: block;} .infrastructure_slides {width: 100%; overflow: hidden;} .infrastructure_slide {padding-right: 20px; min-width: 30%;} .infrastructure_slide > div::before { content: ''; display: block; width: 100%; height: 100%; border-radius: 8px; z-index: -2001; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 20%, rgba(0,0,0,0.8) 100%); } .infrastructure_slide > div {height: 400px; position: relative; border-radius: 8px; max-width: 516px; width: 100%;} .infrastructure_slide_info {color: #fff; position: absolute; bottom: 32px; left: 32px; right: 32px;} .infrastructure_slide_info > div:nth-child(1) {font-size: 22px; font-weight: 600; letter-spacing: 0.3px; color: #FFFFFF;} .infrastructure_slide_info > div:nth-child(2) {line-height: 140%; padding-top: 14px; font-size: 14px; color: #D1D4DA;} .infrastructure_slides_paginator {display: table; margin-top: 0px; margin-bottom: 40px;} .infrastructure_slides_paginator_btn {display: table-cell; vertical-align: middle; width: 0;} .infrastructure_slides_paginator_arrow {color: #AEB3BB; font-size: 20px;} .infrastructure_slides_paginator_arrow.active {color: #2BAFF9; cursor: pointer;} #infrastructure_slides_paginator_prev {margin-right: 25px;} #infrastructure_slides_paginator_next {margin-left: 25px;} #infrastructure_slides_paginator_progress {width: 25%; height: 2px; background: #2BAFF9; transition: all 0.35s ease-in-out;} .infrastructure_slide_1 {background: url('/images/home/infrastructure_1.jpg?2') 50% 50%; background-size: cover;} .infrastructure_slide_2 {background: url('/images/home/infrastructure_2.jpg?2') 50% 50%; background-size: cover;} .infrastructure_slide_3 {background: url('/images/home/infrastructure_3.jpg?2') 50% 50%; background-size: cover;} .infrastructure_slide_4 {background: url('/images/home/infrastructure_4.jpg?2') 50% 50%; background-size: cover;} .infrastructure_slide_5 {background: url('/images/home/infrastructure_5.jpg?2') 50% 50%; background-size: cover;} @media only screen and (max-width: 1080px) { #infrastructure_slider_section {padding-left: 30px;} #infrastructure_slides_paginator_prev {margin-right: 15px;} #infrastructure_slides_paginator_next {margin-left: 15px;} } @media only screen and (max-width: 800px) { .infrastructure_slide {min-width: unset;} #infrastructure_slider_section {padding-left: 0;} #infrastructure_slider_section {width: 100%; margin: 0;} .infrastructure_slide > div {height: 400px; width: 260px;} .infrastructure_slides {padding-left: 15px;} .infrastructure_slides_paginator {margin-top: 0; margin-bottom: 40px;} .infrastructure_slides_paginator_arrow {color: #AEB3BB; font-size: 18px;} .infrastructure_slide_info > div:nth-child(2) {font-size: 14px; line-height: 140%; padding-top: 8px;} .infrastructure_slide_info {left: 16px; bottom: 28px;} } /* ------------------------------- SECURITY ------------------------------- */ /* common */ #security {max-width: 1600px; width: 100%; margin: 0 auto; position: relative; padding: 80px 80px 0; overflow: hidden;} #security .btn_primary {height: 54px; line-height: 54px; font-size: 16px;} #security .btn_msg_group {padding-top: 30px;} @media only screen and (max-width: 1080px) { #security {padding: 80px 30px 56px 30px;} } @media only screen and (max-width: 800px) { #security {padding: 40px 15px 0 15px;} #security .btn_msg_group {display: none;} } /* items */ .security_section > div { width: 100%; max-width: 1600px; position: relative; display: table; vertical-align: top; padding: 0 80px; margin: 0 auto; } .security_table {display: table; width: 100%;} .security_table > div {display: table-cell; width: 33.333%;} .security_table > div:nth-child(1) {padding-right: 10px;} .security_table > div:nth-child(2) {padding-left: 5px; padding-right: 5px;} .security_table > div:nth-child(3) {padding-left: 10px;} .security_table > div > div {display: block; height: 300px; width: 100%; border-radius: 8px; position: relative;} .security_table_text {position: absolute; bottom: 20px; left: 34px;} .security_table_title {font-size: 32px; font-weight: 600; letter-spacing: 0.2px; color: #fff; padding-right: 20px;} .security_table_desc {font-size: 14px; color: #D1D4DA; padding-right: 20px; padding-top: 20px; max-width: 300px;} @media only screen and (max-width: 1080px) { .security_section > div {padding: 0 30px;} .security_table_text {left: 16px;} .security_table_title {font-size: 22px;} .security_table_desc {font-size: 12px; padding-top: 14px;} } @media only screen and (max-width: 800px) { .security_section > div {margin-top: 0; padding: 0 15px;} } @media only screen and (max-width: 600px) { .security_table {display: block;} .security_table > div {display: block; width: 100%; padding-bottom: 20px;} .security_table > div:nth-child(1) {padding-right: 0;} .security_table > div:nth-child(2) {padding-left: 0; padding-right: 0;} .security_table > div:nth-child(3) {padding-left: 0;} .security_table > div > div {height: 200px;} } /* ------------------------------- OWNERS ------------------------------- */ #company {padding-top: 80px; overflow: hidden;} #owners {padding-bottom: 20px; overflow: hidden;} #owners .container_primary {display: flex;} #owners .block_middle {width: 62%; text-align: left;} #owners .block_right {width: 24%;} #owners .quotes_block {padding-top: 10px; margin-top: auto; margin-bottom: 4%;} #owners .fs-24 {font-size: 22px; line-height: 130%; font-weight: 600; color: #002033;} .face {width: 100%; display: table; text-align: left; vertical-align: top;} .face_item {display: table-cell; vertical-align: top; padding: 0 15px; width: 30%;} .face_img {margin-bottom: 28px; overflow: hidden;} .face_img > img {border-radius: 8px;} .face_name {font-size: 18px; font-weight: 600;} .mc-3 {color: #002033;} .quotes {font-family: 'DM Serif Display', serif; font-size: 100px; line-height: 24px; font-weight: 600;} #quotes_resp {display: none;} #quotes_resp > p {display: flex; flex-direction: column; font-size: 14px; width: 74%; text-align: justify-all;} #quotes_resp > p > span {display: block; font-size: 20px; line-height: 130%; font-weight: 600; color: #160F0F;} #quotes_resp > p > strong {display: block; font-size: 40px; line-height: 130%; font-weight: 600;} @media only screen and (max-width: 1250px) { #owners .quotes_block {margin-bottom: 0;} } @media only screen and (max-width: 1080px) { #company {padding-top: 40px;} #owners .block_right {width: 100%;} #owners .container_primary {flex-direction: column;} #owners .quotes_block {display: none;} .face_img {margin-bottom: 10px;} .face_item {padding: 0 8px;} .face_name {font-size: 12px;} .face_name > span {display: block;} .fs-24 {padding-left: 35px;} #quotes_resp {display: flex; width: 100%;} #quotes_resp .quotes {width: 30%; text-align: right; margin-top: 10px;} } @media only screen and (max-width: 800px) { #owners {padding-bottom: 10px; top: -30px;} #owners .block_middle {margin-bottom: 42px; width: 100%;} } /* ------------------------------- PROJECTS ------------------------------- */ #projects {overflow: hidden; padding-top: 80px;} #projects h2 {font-weight: 500; font-size: 32px; line-height: 42px; margin-bottom: 30px; text-align: center;} #project_container {padding-left: 80px;} .project_group {width: 100%;} .project { max-width: 100%; width: 100%; padding-bottom: 8px; transition: all 0.35s ease-in-out; } .project_item { display: block; min-width: 16.67%; width: 16.67%; padding-right: 10px; position: relative; -webkit-transition: filter 0.8s ease; -o-transition: filter 0.8s ease; transition: filter 0.8s ease; cursor: pointer; } .project_slides_paginator {display: table; margin: 20px auto;} #project_slides_paginator_prev {margin-right: 15px;} #project_slides_paginator_next {margin-left: 15px;} #project_slides_paginator_progress {width: 100%; height: 2px; background: #2BAFF9; transition: all 0.35s ease-in-out;} .project_item:hover img {-webkit-filter: grayscale(0) brightness(1); filter: grayscale(0) brightness(1);} .project_item > img { width: 100%; height: auto; border-radius: 8px; -webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: all 0.8s ease; -o-transition: all 0.8s ease; transition: all 0.8s ease; } .project-logo { position: absolute; top: 0; left: 0; right: 10px; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 70%; margin: 0 auto; } .project-logo > img { max-height: 70px; filter: grayscale(1) brightness(1000%); -webkit-filter: grayscale(1) brightness(1000%); -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .project > div.project_item:nth-child(1) > .project-logo > img {max-height: 60px;} .project > div.project_item:nth-child(2) > .project-logo > img, .project > div.project_item:nth-child(3) > .project-logo > img {max-height: 95px;} .project > div.project_item:nth-child(4) > .project-logo > img {max-height: 40px;} .project > div.project_item:nth-child(5) > .project-logo > img {max-height: 20px;} .project > div.project_item:nth-child(6) > .project-logo > img {max-height: 45px; max-width: 80px} .project > div.project_item:nth-child(7) > .project-logo > img {max-height: 32px;} .project > div.project_item:nth-child(8) > .project-logo > img {max-height: 32px;} .project > div.project_item:nth-child(9) > .project-logo > img {max-height: 40px;} @media only screen and (max-width: 1080px) { #projects h2 {font-size: 18px; margin-bottom: 16px; text-align: left;} #projects .container_block {width: 100%; display: flex;} #project_container {padding: 0 30px; overflow: unset;} } @media only screen and (max-width: 800px) { #projects {padding: 0 15px; overflow: hidden;} #projects > .container_primary {padding: 0;} #project_container {padding-left: 0; padding-right: 0;} #projects .flickity-viewport {overflow: unset;} .project_item {min-width: 33.3%; width: 33.3%;} .project_slides_paginator {display: table; padding: 0; margin: 20px auto;} } /* ------------------------------- OPTIONS ------------------------------- */ #options {padding-top: 90px; overflow: hidden;} @media only screen and (max-width: 700px) { #options {padding-top: 60px;} } /* ------------------------------- REQUEST ------------------------------- */ #request_2 {margin-top: 80px; overflow: unset; padding: 0 80px;} #request_2 > div { display: flex; padding: 40px 50px 40px 70px; border-radius: 8px; background: linear-gradient(75deg, #001623 0%, #01A3FF 100%); min-height: 480px; } #request_2 > div > div:first-child {position: relative; width: calc(100% - 360px);} #request_2 > div > div:first-child .title {font-size: 32px; font-weight: 600; color: #FFFFFF; max-width: 500px;} #request_2 > div > div:first-child img {position: absolute; max-width: 930px; width: 48vw; bottom: -168px; left: -45px;} #request_2 > div > div:last-child {width: 360px;} #request_2 > div > div:last-child .title {font-size: 16px; font-weight: 600; color: #FFFFFF; margin-bottom: 20px; margin-top: 16px;} #request_2 > div > div:last-child .social {display: flex; margin-bottom: 50px;} #request_2 .modal_request_form_inputs {margin-bottom: 20px;} #request_2 .modal_request_form_inputs > div:nth-child(1) {padding-right: 0;} #request_2 .modal_request_form_inputs > div:nth-child(1) input {background: #FFFFFF;} #request_2 > div > div:last-child a.btn_msg { font-size: 14px; color: #FFFFFF; border-radius: 4px; padding: 4px 6px; margin-right: 12px; line-height: 30px; height: 30px; border: 1px solid #B8E5FF; background: rgba(255, 255, 255, 0); transition: 0.3s; } #request_2 > div > div:last-child a.btn_msg:hover {background: rgba(255, 255, 255, 0.10);} #request_2 > div > div:last-child a.btn_msg > img {width: 20px; height: 20px; top: 0;} #request_2 button {margin-bottom: 20px;} #request_2 .confirm {font-size: 12px; text-align: center; color: #FFFFFF; max-width: 300px; margin: 0 auto;} #request, #request_modal {background-color: rgba(52, 168, 233, 0.08); text-align: center; padding-top: 60px; position: relative;} #request_modal.modal_request_2 { padding: 37px 22px 50px; background: linear-gradient(75deg, #001623 0%, #01A3FF 100%); border-radius: 8px; color: #FFFFFF; } #request_modal.modal_request_2 .btn_msg {border-radius: 4px;} #request_modal.modal_request_2 .request_pets {top: 80px; left: 80%;} #request_modal.modal_request_2 .modal_request_subtitle {color: #FFFFFF;} #request_modal.modal_request_2 .modal_request_title, #request_modal.modal_request_2 .modal_request_desc {max-width: 490px; margin: 0 auto 30px;} #request_modal.modal_request_2 .modal_request_form_inputs input {border-radius: 4px; background: #FFF; color: #092E44 !important;} #request_modal.modal_request_2 #modal_btn_send, #modal_btn_send_2 {border-radius: 2px;} #request_modal.modal_request_2 .btn_msg.wa_dark {color: #FFFFFF;} #request_modal.modal_request_2 .btn_msg.tg_dark {color: #FFFFFF;} #request_modal.modal_request_2.success img {width: 100px; display: block; margin: 0 auto 38px;} #request .container, #request_modal .container {padding: 64px 15px;} #request .h2, #request_modal .h2 {margin-bottom: 16px;} .request_pets {position: absolute; top: -35px; left: 68%; width: 100px; height: auto;} .contact_form {margin-top: 50px; align-items: center;} .form_group_item {display: inline-block;} .form_item {line-height: 17px; vertical-align: middle; margin-top: 20px; text-align: center;} .form_btn {text-align: center;} .input_border_error {border-color: #EB5757 !important;} @media only screen and (max-width: 1800px) { #request_2 > div {min-height: 400px;} } @media only screen and (max-width: 1300px) { #request_2 > div {min-height: 380px;} } @media only screen and (max-width: 1100px) { #request_2 {padding: 0 30px;} #request_2 > div {flex-direction: column;} #request_2 > div {padding: 110px 90px 40px 110px;} #request_2 > div > div:first-child img {width: 342px; position: absolute; bottom: unset; left: 0; top: -148px; margin-top: 0;} #request_2 > div > div:first-child {width: 100%;} #request_2 > div > div:first-child .title {font-size: 22px;} } @media only screen and (max-width: 800px) { #request_2 > div {padding: 110px 16px 30px 16px; border-radius: 0;} #request_2 {padding: 0;} #request_2 > div > div:last-child {width: 100%; max-width: 360px;} } @media only screen and (max-width: 700px) { #request_modal.modal_request_2 .modal_request_subtitle {text-align: left; padding-bottom: 12px;} #request_modal.modal_request_2 .modal_request_title, #request_modal.modal_request_2 .modal_request_desc {margin: 0 0 8px; text-align: left;} #request_modal.modal_request_2 {margin: 0 16px;} #request_modal.modal_request_2 .request_pets {display: none;} #request_modal.modal_request_2 .modal_request_form_inputs_msg {padding-bottom: 18px !important; padding-top: 0 !important;} #request_modal.modal_request_2 .modal_request_form_inputs_msg > div:nth-child(1) { display: flex; flex-direction: column-reverse; margin-top: 18px; } #request_modal.modal_request_2 .wa_label {font-size: 15px; padding-top: 0; padding-bottom: 18px; text-align: center;} #request_modal.modal_request_2 .modal_request_form_inputs_msg > div:nth-child(2) {display: flex; flex-direction: column-reverse;} #request_modal.modal_request_2 .modal_request_form_inputs_msg > div:nth-child(2) > div:last-child {padding-bottom: 18px !important;} #request {margin-bottom: 30px;} .request_pets {width: 80px;} .contact_form {width: fit-content; margin: 0 auto;} .form_group_item {display: block; width: 100%; position: relative; margin-bottom: 20px; margin-right: 0; vertical-align: middle;} .form_item {margin-top: 0;} } /* ------------------------------- ADVANTAGES ------------------------------- */ #advantages {padding-top: 80px;} #advantages .section_brief {flex-direction: row;} #advantages .container_image > img {width: 100%; border-radius: 8px;} @media only screen and (max-width: 800px) { #advantages {padding-top: 30px;} #advantages .container_image {max-height: initial; height: auto;} } /* ------------------------------- INFRASTRUCTURE ------------------------------- */ #infrastructure {padding-top: 80px; overflow: hidden;} #infrastructure .section_brief > div:nth-of-type(1) {display: none;} @media only screen and (max-width: 700px) { #infrastructure {padding-top: 10px;} } /* ------------------------------- MAP ------------------------------- */ #map_header {padding-top: 80px; overflow: hidden;} @media only screen and (max-width: 800px) { #map_header {padding-top: 54px;} } #home_map {width: 100%; padding: 0; margin: 0;} #home_map > div > div {display: table; width: 100%;} #home_map > div > div > div {display: table-cell; vertical-align: top;} #home_map > div > div > div:nth-child(1) {width: 75%; border-radius: 8px; overflow: hidden;} #home_map > div > div > div:nth-child(2) {width: 25%; padding-left: 35px;} .home_map_title {font-size: 22px; font-weight: 500; line-height: 135%;} .home_map_title > span {display: block;} .home_map_list {padding-top: 66px;} .home_map_item {display: table; margin-bottom: 24px;} .home_map_item > i {display: table-cell; vertical-align: top; font-size: 26px;} .home_map_item > i > img {height: 20px; width: auto;} .home_map_item > div { display: table-cell; width: 100%; vertical-align: top; padding-left: 20px; font-size: 18px; font-weight: 500; color: #111418; } .home_map_item > div > span {display: block; padding-bottom: 10px;} .home_map_item > div > span:nth-child(2) {color: #8F97A6; font-size: 14px; font-weight: 400;} .home_map_item.blue > i {color: #56CCF2;} .home_map_item.green > i {color: #09B25E;} .home_map_item.orange > i {color: #F2994A;} .home_map_item.red > i {color: #EB5757;} .home_map_item.violet > i {color: #9B51E0;} #mymap {width: 100%; height: 640px; border: none;} #mymap #zoom-in img {box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1); border-radius: 50%;} #mymap #zoom-out img {box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1); border-radius: 50%;} @media only screen and (max-width: 1080px) { #home_map {padding-top: 0; padding-bottom: 30px;} #home_map > div > div {display: block; overflow: hidden;} #home_map > div > div > div {display: block;} #home_map > div > div > div:nth-child(1) {width: 100%; border-radius: 0;} #home_map > div > div > div:nth-child(2) {width: 100%; padding: 0 15px;} #mymap {height: 450px; margin-bottom: 20px;} .home_map_list {display: flex; flex-wrap: wrap; flex-direction: row; padding-top: 20px;} .home_map_item { border: 1px solid #DEDFE3; display: inline-block; border-radius: 8px; width: auto; padding: 10px; margin: 0 10px 10px 0; } .home_map_item > i {font-size: 20px;} .home_map_item > i > img {height: 20px;} .home_map_item > div {font-size: 14px; font-weight: 500; padding-left: 5px;} .home_map_item > div > span {padding-bottom: 5px;} .home_map_item > div > span:nth-child(2) {font-size: 13px; padding-bottom: 0;} } @media only screen and (max-width: 800px) { #home_map > .container_primary {padding: 0;} } /* ------------------------------- DOCUMENTS ------------------------------- */ #docs {padding-top: 80px; overflow: hidden;} #docs .section_brief {padding-bottom: 0;} #docs .btn_primary > div:nth-of-type(2) {display: none;} .docs_items {display: flex;} .docs_items {display: flex; flex-wrap: wrap; padding-top: 30px;} .docs_items > div {flex: 1 0 33.333%; padding-bottom: 12px;} .docs_items > div:nth-of-type(3n+1) {padding-right: 6px;} .docs_items > div:nth-of-type(3n+2) {padding-left: 6px; padding-right: 6px;} .docs_items > div:nth-of-type(3n) {padding-left: 6px;} .docs_items > div > a { text-decoration: none; display: block; height: 100%; border: 1px solid #2CAFF9; padding: 18px 24px; border-radius: 8px; transition: all 0.2s ease-in-out; } .docs_items > div > a:hover {background: rgba(44,175,249,0.15);} .docs_items > div > a > div:nth-of-type(1) { color: #2CAFF9; font-weight: 500; font-size: 32px; line-height: 100%; letter-spacing: 0.2px; } .docs_items > div > a > div:nth-of-type(2) {font-size: 14px; line-height: 130%; color: #111418; padding-top: 6px;} #open_nav {display: none;} @media only screen and (max-width: 800px) { #open_nav {display: block; color: #34A8E9;} #docs {padding-top: 30px} .docs_items > div {flex: 1 0 50%; padding-bottom: 12px;} .docs_items > div:nth-of-type(3n+1) {padding-right: 0;} .docs_items > div:nth-of-type(3n+2) {padding-left: 0; padding-right: 0;} .docs_items > div:nth-of-type(3n) {padding-left: 0;} .docs_items > div:nth-of-type(2n+1) {padding-right: 6px;} .docs_items > div:nth-of-type(2n) {padding-left: 6px;} .docs_items > div:last-child {padding-right: 0;} .docs_items > div:last-child {padding-bottom: 0;} .docs_items > div > a {padding: 14px 12px;} } @media only screen and (max-width: 360px) { #docs .btn_primary > div:nth-of-type(1) {display: none;} #docs .btn_primary > div:nth-of-type(2) {display: block;} } /* ------------------------------- MEDIA ------------------------------- */ #media {background: #EEF9FE; padding-bottom: 75px; margin-top: 80px;} #media > h2 {text-align: center; letter-spacing: 0.2px; font-size: 32px; font-weight: 500; padding-top: 63px; padding-bottom: 56px;} #media > .container_primary_flex {flex-direction: column;} .media_items_row {display: flex;} .media_items_row:not(:last-child) {margin-bottom: 45px;} .media_items_row > section { width: 33.33%; background: #FFFFFF; border-radius: 8px; padding: 44px 30px 24px 30px; display: flex; flex-direction: column; height: 255px; } .media_items_row > section:last-child {width: calc(33.3% - 20px);} .media_items_row > section > p {font-weight: 400; font-size: 16px; line-height: 130%; flex: 1; margin-top: 20px;} .media_items_row > section > a {font-weight: 400; font-size: 16px; line-height: 130%; color: #2CAFF9;} .media_items_row > section > a:hover {text-decoration: none;} .media_items_row > section > div:first-child {height: 36px;} .media_items_row > section > div:first-child > img {width: auto; height: 100%;} .media_items_row:not(:last-child) > section:nth-child(1) {margin-right: 20px} .media_items_row:not(:last-child) > section:nth-child(2) {margin-right: 20px; margin-left: 20px;} .media_items_row:not(:last-child) > section:nth-child(3) {margin-left: 20px;} .media_items_row:nth-child(3) {justify-content: center} .media_items_row:last-child > section:nth-child(1) {margin-right: 20px;} .media_items_row:last-child > section:nth-child(2) {margin-left: 20px;} .media_items_container > button { background: transparent; color: #2CAFF9; display: none; text-align: center; width: auto; padding: 0 20px; font-weight: 600; height: 54px; border: 1px solid #2CAFF9; margin: 23px auto 0; border-radius: 8px; font-size: 14px; } .media_items_container > button:hover {cursor: pointer;} @media only screen and (max-width: 1300px) { .media_items_row > section:last-child {width: calc(33.3% - 8px);} .media_items_row:last-child > section:nth-child(1) {margin-right: 8px;} .media_items_row:last-child > section:nth-child(2) {margin-left: 8px;} .media_items_row:not(:last-child) {margin-bottom: 16px;} .media_items_row:not(:last-child) > section:nth-child(1) {margin-right: 8px} .media_items_row:not(:last-child) > section:nth-child(2) {margin-right: 8px; margin-left: 8px;} .media_items_row:not(:last-child) > section:nth-child(3) {margin-left: 8px;} } @media only screen and (max-width: 800px) { .media_items_row > section:last-child {width: 100%;} #media {padding-bottom: 34px; margin-top: 30px;} #media > h2 {font-size: 22px; padding-top: 27px; padding-bottom: 15px;} #media .inc_img {max-width: initial;} #media .forbs_img {margin-top: initial;} #media .ria_img {margin-top: initial;} #media .pro_img {max-width: initial;} #media .vc_img {height: 18px !important;} .media_items_row > section > div:first-child {height: 22px; max-width: 72px} .media_items_row {flex-direction: column;} .media_items_row:not(:last-child) {margin-bottom: 0;} .media_items_row > section {width: 100%; margin: 0 0 16px 0 !important; padding: 20px; height: 160px;} .media_items_row > section > p {font-size: 14px;} .media_items_row > section > a {font-size: 14px; font-weight: 300;} .media_items_container > button {display: block;} .media_items_container > .media_items_row:not(:nth-child(1)) {display: none;} } /* ------------------------------- CONTACTS ------------------------------- */ #contacts {padding: 80px 0; margin-top: 40px; background: #FAFBFC;} #contacts .container_primary_flex > div {width: 50%;} #contacts .container_primary_flex > div:nth-child(1) {margin-right: 55px;} #contacts .container_primary_flex > div:nth-child(1) > span { filter: drop-shadow(0px 8px 16px rgba(85, 94, 112, 0.18)) drop-shadow(4px 12px 32px rgba(85, 94, 112, 0.15)); border-radius: 4px; display: block; overflow: hidden; } #contacts .container_primary_flex > div:nth-child(2) {margin-left: 55px;} .contacts_info {width: 100%;} .contacts_info > h2 {font-weight: 500; font-size: 32px; line-height: 130%; color: #111418; margin-bottom: 12px;} .contacts_info > .header_info_btn {max-height: 54px; line-height: 54px; font-size: 16px; width: 100%;} .contacts_info > section {display: flex; width: 100%; flex-wrap: wrap;} .contacts_info > section > a { text-decoration: none; color: #1B1F26; font-size: 18px; line-height: 130%; margin-bottom: 26px; font-weight: 600; } .contacts_info > section > *:nth-of-type(even) {width: 65%; padding-left: 32px;} .contacts_info > section > *:nth-of-type(odd) {width: 35%;} .contacts_info > section > div { font-weight: 400; font-size: 16px; line-height: 130%; height: 84px; display: flex; flex-direction: column; } .contacts_info > section > div > span {flex: 1;} .contacts_info > section > div > a { display: block; color: #0091FF; font-size: 16px; font-weight: 400; line-height: 130%; margin-top: 16px; text-decoration: none; } .contacts_controls {max-width: 300px;} .contacts_controls_wa_label {font-size: 16px; line-height: 130%; padding: 26px 0 14px 0;} .contacts_controls_row {display: flex; flex-direction: column;} .contacts_controls_row > .header_info_btn {margin-bottom: 16px;} .contacts_controls_row > .petrol {width: 100%; background: none; border: 1px solid #2CAFF9;} .contacts_controls_row > .petrol > div:nth-child(2) {color: #111418;} @media only screen and (max-width: 1300px) { #contacts .container_primary_flex > div:nth-child(1) {margin-right: 25px;} #contacts .container_primary_flex > div:nth-child(2) {margin-left: 25px;} .contacts_info {padding: 0 0 36px 0;} .contacts_info > section > *:nth-of-type(even) {width: 50%;} .contacts_info > section > *:nth-of-type(odd) {width: 50%;} } @media only screen and (max-width: 1080px) { #contacts {background: #FFFFFF; padding: 10px 0 44px 0;} #contacts .container_primary_flex {flex-direction: column; padding: 0;} #contacts .container_primary_flex > div {width: 100%;} #contacts .container_primary_flex > div:nth-child(1) {order: 1;} #contacts .container_primary_flex > div:nth-child(2) {order: 0; margin-left: 0;} .contacts_info {padding: 0 30px 36px 30px; max-width: 1600px; margin: 0 auto;} .contacts_info > h2 {margin-bottom: 14px;} .contacts_info > .header_info_btn {margin-top: 36px; width: 100%; max-width: 280px;} .contacts_info > section > * {width: 100% !important;} .contacts_info > section > *:nth-of-type(even) {padding-left: 0;} .contacts_info > section > div:not(:last-child) {margin-bottom: 26px;} .contacts_info > section > a {font-size: 18px;} } @media only screen and (max-width: 800px) { #contacts {margin-top: 0;} .contacts_info {padding: 0 15px 36px 15px;} #contacts .container_primary_flex > div:nth-child(1) > span {border-radius: 0;} .contacts_controls {max-width: 420px;} .contacts_controls > .header_info_btn.big {margin-top: 0;} } /* ------------------------------- INNER PAGES ------------------------------- */ .common_wrap {max-width: 1600px; margin: 0 auto; padding: 0 80px;} .style_wrap {max-width: 1600px; margin: 0 auto; padding: 30px 80px;} @media only screen and (max-width: 1000px) { .common_wrap {max-width: 100%; margin: 0 auto; padding: 0 20px;} .style_wrap {max-width: 100%; margin: 0 auto; padding: 10px 20px 40px 20px;} } /* ------------------------------- STYLE ------------------------------- */ .style_table_photo_description {display: table; width: 100%; margin-top: 40px; margin-bottom: 40px;} .style_table_photo_description--image {display: table-cell; vertical-align: top; width: 50%;} .style_table_photo_description--image img {width: 100%;} .style_table_photo_description--description {display: table-cell; vertical-align: top; width: 50%; padding-left: 60px;} .style_table_photo_description--description > div {max-width: 400px;} .style_table_photo_description--description--blue_header { text-transform: uppercase; color: #2CAFF9; font-size: 13px; font-weight: 600; } .style_table_photo_description--description--header {margin-top: 20px; color: #111418; font-size: 32px; font-weight: 600;} .style_table_photo_description--description--desc {font-size: 16px; line-height: 150%; color: #111418; margin-top: 20px;} @media only screen and (max-width: 800px) { .style_table_photo_description {display: block;} .style_table_photo_description--image {display: block; width: 100%;} .style_table_photo_description--image img {padding-top: 30px;} .style_table_photo_description--description {display: block; padding: 0; width: 100%;} .style_table_photo_description--description > div {max-width: 100%;} .style_table_photo_description-reverse {display: flex; flex-direction: column-reverse;} } .style_table_doc {display: table; padding-top: 20px;} .style_table_doc > a {display: table-row; text-decoration: none;} .style_table_doc > a > div {display: table-cell; vertical-align: middle; padding: 10px;} .style_table_doc > a > div:nth-child(1) {padding-left: 0;} .style_table_doc > a > div:nth-child(1) > img {width: 30px;} .style_table_doc > a > div:nth-child(2) {color: #1B1F26;} .style_table_doc > a > div:nth-child(2) > div:nth-child(2) {color: #929BAD; font-size: 12px; padding-top: 5px;} .style_table_doc > a > div:nth-child(3) {padding-left: 20px;} .style_table_doc > a > div:nth-child(3) > i {font-size: 20px; color: #929BAD;} @media only screen and (max-width: 800px) { .style_table_doc {display: none;} } .style_table {display: table; width: 100%;} .style_table > div {display: table-row;} .style_table > div:nth-child(2) > div > .style_table_item {margin-top: 30px;} .style_table > div > div {display: table-cell; width: 33.333%;} .style_table_item {padding: 25px; min-height: 230px; background: #fff; border-radius: 8px; transition: all 0.35s ease-out;} .style_table_item:hover {box-shadow: 0 8px 16px rgba(85, 94, 112, 0.18), 4px 12px 32px rgba(85, 94, 112, 0.15);} .style_table > div > div:nth-child(1) > .style_table_item {margin-right: 20px;} .style_table > div > div:nth-child(2) > .style_table_item {margin-left: 10px; margin-right: 10px;} .style_table > div > div:nth-child(3) > .style_table_item {margin-left: 20px;} @media only screen and (max-width: 800px) { .style_table {display: block;} .style_table > div {display: block;} .style_table > div > div > .style_table_item {margin-top: 30px;} .style_table > div > div {display: block; width: 100%;} .style_table_item {padding: 25px; min-height: 230px; background: #fff; border-radius: 8px; transition: all 0.35s ease-out;} .style_table_item:hover {box-shadow: none;} .style_table > div > div:nth-child(1) > .style_table_item {margin-right: 0;} .style_table > div > div:nth-child(2) > .style_table_item {margin-left: 0; margin-right: 0;} .style_table > div > div:nth-child(3) > .style_table_item {margin-left: 0;} } .style_table_icon {width: 50px; height: 50px; border-radius: 50%; text-align: center;} .style_table_icon i {line-height: 50px; font-size: 20px;} .style_table_icon.service_1 {background: #EAFAF3;} .style_table_icon.service_1 i {color: #219653;} .style_table_icon.service_2 {background: #FFF2D8;} .style_table_icon.service_2 i {color: #FFBE3D;} .style_table_icon.service_3 {background: #E5F1FF;} .style_table_icon.service_3 i {color: #377DFF;} .style_table_icon.service_4 {background: #FFE3DE;} .style_table_icon.service_4 i {color: #FF725C;} .style_table_icon.service_5 {background: #E3EEFD;} .style_table_icon.service_5 i {color: #387EFF;} .style_table_icon.service_6 {background: #EAFAF3;} .style_table_icon.service_6 i {color: #219653;} .style_table_title {font-size: 18px; font-weight: 600; margin-top: 10px;} .style_table_desc {font-size: 13px; line-height: 150%; margin-top: 20px; color: #929BAD;} .btn_style {} @media only screen and (max-width: 800px) { .style_table_title {font-size: 24px;} .style_table_desc {font-size: 14px;} .btn_style {text-align: center;} } /* ------------------------------- SERVICES ------------------------------- */ .service_items {max-width: 1600px; margin: 0 auto; padding: 30px 60px 0 60px;} .service_item {padding: 20px; margin-top: 40px; border-radius: 8px; transition: all 0.35s ease-out;} .service_item:hover {box-shadow: 0 8px 16px rgba(85, 94, 112, 0.1), 4px 12px 32px rgba(85, 94, 112, 0.08);} .service_item:nth-child(1) {margin-top: 0;} .service_item:nth-child(2n) > div {flex-direction: row-reverse;} .service_item:nth-child(2n) .service_item_img {padding-left: 50px; padding-right: 0;} .service_item:nth-child(4) {margin-bottom: 40px;} .service_item > div {display: flex;} .service_item_img {width: 40%; padding-right: 50px;} .service_item_img > img {border-radius: 8px;} .service_item_text {width: 60%;} @media only screen and (max-width: 800px) { .service_items {padding: 30px 20px 0 20px;} .service_item { padding: 0; margin-bottom: 20px; box-shadow: 0 8px 16px rgba(85, 94, 112, 0.1), 4px 12px 32px rgba(85, 94, 112, 0.08); } .service_item:nth-child(2n) .service_item_img {padding-left: 0;} .service_item > div {display: block;} .service_item_img {width: 100%; padding-left: 0; padding-right: 0;} .service_item_img > img {border-radius: 8px 8px 0 0;} .service_item_text {width: 100%; padding: 20px;} } .services_page {background: #eef9ff; padding: 80px 0 100px 0;} .services_page_wrap {width: 100%; max-width: 1600px; margin: 0 auto; padding: 0 80px;} .services_page_table_1 {display: flex; width: 100%; flex-direction: row-reverse; align-items: flex-end;} .services_page_table_1 > div {width: 50%;} .services_page_table_1 > div:nth-child(1) {padding-left: 30px;} .services_page_table_1 > div:nth-child(2) {padding-right: 30px;} .services_page_table {display: flex; flex-wrap: wrap; width: 100%; margin-top: 30px;} .services_page_table > div { flex-grow: 1; width: calc(50% - 10px); padding: 25px; background: #fff; border-radius: 8px; position: relative; } .services_page_table > div:nth-child(2n+1) {margin-right: 10px;} .services_page_table > div:nth-child(2n) {margin-left: 10px;} .services_page_table > div:nth-child(1), .services_page_table > div:nth-child(2) {margin-bottom: 20px;} .services_page_icon {width: 50px; height: 50px; border-radius: 50%; text-align: center; background: #E5F1FF;} .services_page_icon i {line-height: 50px; font-size: 20px; color: #377DFF;} .services_page_title {font-size: 18px; font-weight: 600; margin-top: 10px;} .services_page_desc {font-size: 13px; line-height: 150%; margin-top: 20px; color: #929BAD;} @media only screen and (max-width: 800px) { .services_page {padding: 80px 0 40px 0;} .services_page_wrap {padding: 0 20px;} .services_page_table_1 {display: block;} .services_page_table_1 > div {width: 100%;} .services_page_table_1 > div:nth-child(1) {padding-left: 0;} .services_page_table_1 > div:nth-child(2) {padding-right: 0;} .services_page_table {margin-top: 30px;} .services_page_table > div {width: calc(50% - 5px); padding: 15px;} .services_page_table > div:nth-child(2n+1) {margin-right: 5px;} .services_page_table > div:nth-child(2n) {margin-left: 5px;} .services_page_table > div:nth-child(1), .services_page_table > div:nth-child(2) {margin-bottom: 10px;} } .services_inner_table {display: flex;} .services_inner_table > div {width: 50%;} .services_inner_table > div:nth-child(1) {padding-right: 60px;} @media only screen and (max-width: 800px) { .services_inner_table {display: block;} .services_inner_table > div {width: 100%;} .services_inner_table > div:nth-child(1) {padding-right: 0; padding-bottom: 30px;} } /* ------------------------------- SERVICES (INNER) ------------------------------- */ /* items */ .services_items {display: flex; margin: 50px 0 50px 0;} .services_item {display: flex; width: 33.333%;} .services_item > div { border: 1px solid #ECEEF3; padding: 30px; user-select: none; transition: box-shadow 0.35s ease-in-out, border-color 0.15s ease-in-out; } .services_item > div:hover {border-color: #fff; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);} .services_item:nth-child(1) {padding-right: 10px;} .services_item:nth-child(2) {padding-left: 10px; padding-right: 10px;} .services_item:nth-child(3) {padding-left: 10px;} .services_item_title {color: #8F97A6; text-transform: uppercase; font-weight: 600; font-size: 13px;} .services_item_title.green {color: #09B25E;} .services_item_title.blue {color: #2F80ED;} .services_item_price {padding: 20px 0 10px 0;} @media only screen and (max-width: 800px) { .services_items {display: block; margin: 50px 0 30px 0;} .services_item {display: block; width: 100%; padding-bottom: 20px;} .services_item:nth-child(1) {padding-right: 0;} .services_item:nth-child(2) {padding-left: 0; padding-right: 0;} .services_item:nth-child(3) {padding-left: 0;} } /* slider */ .services_slider_wrap {margin: 60px auto 60px auto; padding-top: 120px;} .services_slider {display: flex; flex-direction: row-reverse;} .services_slider > div:nth-child(1) {width: 40%; position: relative;} .services_slider > div:nth-child(2) {width: 60%; position: relative;} .services_slider_img {width: 100%; position: relative; z-index: 5;} .services_slider_img > img:first-child {position: relative; top: auto; left: auto;} .services_slider_img > img {position: absolute; top: 0; left: 0; opacity: 0; z-index: 1; transition: all 0.35s ease-in-out;} .services_slider_img > img.visible {z-index: 10;} .services_slider_img > img.active {opacity: 1;} .services_slider_info { position: absolute; background: #eef9ff; top: -80px; bottom: 120px; left: -35%; right: 0; padding-left: 35%; z-index: 1; } .services_slider_info > div {padding: 80px 30px 30px 30px; background: #eef9ff;} .services_slider_paginator {position: absolute; right: 0; bottom: 0; user-select: none;} .services_slider_paginator_mobile {display: none; text-align: right; user-select: none;} .services_slider.services_slider_right {flex-direction: row;} .services_slider.services_slider_right .services_slider_info {right: -35%; left: 0; padding-right: 35%;} .services_slider.services_slider_right .services_slider_paginator {position: absolute; right: auto; left: 0;} @media only screen and (max-width: 800px) { .services_slider_wrap {margin: 180px 0 60px 0; padding-top: 120px;} .services_slider {display: block;} .services_slider > div:nth-child(1) {width: 100%;} .services_slider > div:nth-child(2) {width: 100%;} .services_slider_info { position: absolute; background: #eef9ff; top: -260px; bottom: -180px; left: -20px; right: 10%; padding-left: 0; } .services_slider.services_slider_right .services_slider_info {left: -20px; right: 60px; padding-left: 0; padding-right: 0;} .services_slider_info > div {padding: 20px 20px 20px 20px;} .services_slider_paginator {display: none;} .services_slider_paginator_mobile {display: block; padding-top: 35px;} } /* ------------------------------- SERVICES (LANDSCAPE) ------------------------------- */ .landscape_chart {display: flex; margin-top: 60px;} .landscape_chart > div:nth-child(1) {width: 45%;} .landscape_chart > div:nth-child(2) {width: 35%; padding-right: 30px;} .landscape_chart > div:nth-child(3) {width: 20%;} .landscape_chart_items {display: flex; flex-wrap: wrap; font-size: 13px; margin-top: 50px;} .landscape_chart_items > div {display: flex; width: 100%; margin-bottom: 20px;} .landscape_chart_items > div > span {display: inline-block; width: 14px; height: 14px; margin-right: 12px;} .landscape_chart_items > div:nth-child(1) > span {background: #38B964;} .landscape_chart_items > div:nth-child(2) > span {background: #CBF7B0;} .landscape_chart_items > div:nth-child(3) > span {background: #A7E9AA;} .landscape_chart_items > div:nth-child(4) > span {background: #9BCF9D;} .landscape_chart_items > div:nth-child(5) > span {background: #80B977;} .landscape_chart_items > div:nth-child(6) > span {background: #5EA253;} .landscape_chart_items > div:nth-child(7) > span {background: #2F8B3E;} .landscape_chart_items > div:nth-child(8) > span {background: #98E277;} @media only screen and (max-width: 800px) { .landscape_chart {display: block;} .landscape_chart > div:nth-child(1) {width: 100%;} .landscape_chart > div:nth-child(2) {width: 100%; padding-right: 0; padding-top: 30px;} .landscape_chart > div:nth-child(3) {width: 100%;} .landscape_chart_items > div {max-width: 50%; padding-right: 20px;} } /* ------------------------------- FAQ ------------------------------- */ .faq_page {max-width: 1600px; margin: 0 auto; padding: 30px 80px 0 80px;} .faq_item {padding: 20px; background: #fff; cursor: pointer; transition: all 0.35s ease-out; position: relative;} .faq_item i {position: absolute; top: 26px; right: 20px; font-size: 8px; color: #555E70; transition: all 0.35s ease-out;} .faq_item:hover {box-shadow: 0 8px 16px rgba(85, 94, 112, 0.18), 4px 12px 32px rgba(85, 94, 112, 0.15); z-index: 10;} .faq_item_title {font-weight: 600; font-size: 16px; line-height: 130%; padding-right: 80px;} .faq_item_desc { max-height: 0; font-size: 14px; padding-right: 80px; line-height: 150%; color: #717578; overflow: hidden; transition: all 0.35s ease-out; } .faq_item_desc > div {padding-top: 15px; padding-bottom: 15px;} .faq_item.active .faq_item_desc {max-height: 200px;} .faq_item.active i {transform: rotate(180deg);} @media only screen and (max-width: 800px) { .faq_page {padding: 20px 15px;} } /* ------------------------------- CONTACTS ------------------------------- */ .contacts_page_1 {max-width: 1600px; margin: 0 auto; padding: 70px 80px;} .contacts_page_1_table {display: flex; width: 100%;} .contacts_page_1_table > div {vertical-align: top; width: 50%;} .contacts_page_1_table > div:nth-child(2) {padding-left: 60px;} .contacts_page_1_table img { width: 100%; border-radius: 2px; box-shadow: 0 8px 16px rgba(85, 94, 112, 0.1), 4px 12px 32px rgba(85, 94, 112, 0.08); } .contacts_page_1_title {text-transform: uppercase; color: #2CAFF9; font-size: 13px; font-weight: 600;} @media only screen and (max-width: 800px) { .contacts_page_1 {padding: 20px 15px 30px 15px;} .contacts_page_1_table {display: block;} .contacts_page_1_table img {transform: translateY(-50px);} .contacts_page_1_table > div {width: 100%;} .contacts_page_1_table > div:nth-child(2) {padding-left: 0;} } .contacts_page_2 {max-width: 1600px; margin: 0 auto; padding: 50px 80px 50px 80px;} .contacts_page_2_table {display: flex; width: 100%; flex-direction: row-reverse;} .contacts_page_2_table > div {vertical-align: top; width: 50%;} .contacts_page_2_table > div:nth-child(2) {padding-right: 60px;} .contacts_page_2_table img { width: 100%; border-radius: 2px; box-shadow: 0 8px 16px rgba(85, 94, 112, 0.1), 4px 12px 32px rgba(85, 94, 112, 0.08); } .contacts_page_2_title {text-transform: uppercase; color: #2CAFF9; font-size: 13px; font-weight: 600;} @media only screen and (max-width: 800px) { .contacts_page_2 {padding: 30px 15px 40px 15px; background: #F2F2F2;} .contacts_page_2_table {display: block;} .contacts_page_2_table > div {display: block; width: 100%;} .contacts_page_2_table > div:nth-child(2) {padding-right: 0; padding-top: 30px;} } .contacts_page_coordinates {font-size: 16px; line-height: 130%; text-decoration: underline; color: #2CAFF9; margin-top: 6px;} .contacts_page_coordinates.desktop {display: block;} .contacts_page_coordinates.mobile {display: none;} @media only screen and (max-width: 800px) { .contacts_page_coordinates.desktop {display: none;} .contacts_page_coordinates.mobile {display: block;} } /* ------------------------------- TERMS ------------------------------- */ .terms_container {width: 100%; overflow: auto; font-size: 12px; padding: 10% 25%;} .terms--h2 {line-height: 135%; text-align: center; font-size: 35px; margin-bottom: 80px;} .terms--h4 {font-size: 16px; line-height: 135%; margin-bottom: 30px;} .terms_container p {padding-left: 20px; margin-bottom: 20px;} .terms_container .list {padding-left: 40px; list-style: disc inside; margin-bottom: 30px;} .list li {margin-bottom: 20px;} @media only screen and (max-width: 800px) { .terms_container {padding: 60px 15px;} .terms--h2 {font-size: 20px; font-weight: 600; margin-bottom: 40px;} } /* --------------------------- PRELOADER SITES ---------------------------- */ #circular {position: relative; width: 39px; height: 39px; margin: auto;} .circular { position: absolute; background-color: rgb(148,151,162); width: 9px; height: 9px; border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; animation-name: bounce_circular; -o-animation-name: bounce_circular; -ms-animation-name: bounce_circular; -webkit-animation-name: bounce_circular; -moz-animation-name: bounce_circular; animation-duration: 0.96s; -o-animation-duration: 0.96s; -ms-animation-duration: 0.96s; -webkit-animation-duration: 0.96s; -moz-animation-duration: 0.96s; animation-iteration-count: infinite; -o-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-direction: normal; -o-animation-direction: normal; -ms-animation-direction: normal; -webkit-animation-direction: normal; -moz-animation-direction: normal; } #circular_1 { left: 0; top: 16px; animation-delay: 0.36s; -o-animation-delay: 0.36s; -ms-animation-delay: 0.36s; -webkit-animation-delay: 0.36s; -moz-animation-delay: 0.36s; } #circular_2 { left: 4px; top: 4px; animation-delay: 0.48s; -o-animation-delay: 0.48s; -ms-animation-delay: 0.48s; -webkit-animation-delay: 0.48s; -moz-animation-delay: 0.48s; } #circular_3 { top: 0; left: 16px; animation-delay: 0.6s; -o-animation-delay: 0.6s; -ms-animation-delay: 0.6s; -webkit-animation-delay: 0.6s; -moz-animation-delay: 0.6s; } #circular_4 { right: 4px; top: 4px; animation-delay: 0.72s; -o-animation-delay: 0.72s; -ms-animation-delay: 0.72s; -webkit-animation-delay: 0.72s; -moz-animation-delay: 0.72s; } #circular_5 { right: 0; top: 16px; animation-delay: 0.84s; -o-animation-delay: 0.84s; -ms-animation-delay: 0.84s; -webkit-animation-delay: 0.84s; -moz-animation-delay: 0.84s; } #circular_6 { right: 4px; bottom: 4px; animation-delay: 0.96s; -o-animation-delay: 0.96s; -ms-animation-delay: 0.96s; -webkit-animation-delay: 0.96s; -moz-animation-delay: 0.96s; } #circular_7 { left: 16px; bottom: 0; animation-delay: 1.08s; -o-animation-delay: 1.08s; -ms-animation-delay: 1.08s; -webkit-animation-delay: 1.08s; -moz-animation-delay: 1.08s; } #circular_8 { left: 4px; bottom: 4px; animation-delay: 1.2s; -o-animation-delay: 1.2s; -ms-animation-delay: 1.2s; -webkit-animation-delay: 1.2s; -moz-animation-delay: 1.2s; } @keyframes bounce_circular{ 0% {transform: scale(1);} 100% {transform: scale(.3);} } @-o-keyframes bounce_circular { 0% {-o-transform: scale(1);} 100% {-o-transform: scale(.3);} } @-ms-keyframes bounce_circular { 0% {-ms-transform: scale(1);} 100% {-ms-transform: scale(.3);} } @-webkit-keyframes bounce_circular { 0% {-webkit-transform: scale(1);} 100% {-webkit-transform: scale(.3);} } @-moz-keyframes bounce_circular { 0% {-moz-transform: scale(1);} 100% {-moz-transform: scale(.3);} } /* ----------------- YMAPS -------------- */ .ymaps_site_baloon { display: flex; align-items: center; font-family: "SF Pro", sans-serif; font-size: 18px; font-weight: 500; color: #FFF; line-height: 130%; } .ymaps_site_baloon img { width: 30px !important; object-fit: none !important; height: auto !important; min-height: 0 !important; border-radius: 0 !important; margin-right: 12px !important; } .ymaps-2-1-79-balloon__tail {display: none !important;} .ymaps-2-1-79-balloon {box-shadow: none !important;} .ymaps-2-1-79-balloon__layout {background: none !important;} .ymaps-2-1-79-gototech {display: none!important;} .ymaps-2-1-79-balloon__content { display: flex !important; align-items: center !important; padding: 0 12px !important; max-width: 130px !important; height: 48px !important; border-radius: 12px !important; background: #2CAFF9 !important; }