@font-face {

    font-family: 'Mariah';

    src: url('../fonts/mariah/Mariah.eot');

    src: url('../fonts/mariah/Mariah.eot?#iefix') format('embedded-opentype'),

        url('../fonts/mariah/Mariah.woff2') format('woff2'),

        url('../fonts/mariah/Mariah.woff') format('woff'),

        url('../fonts/mariah/Mariah.ttf') format('truetype');

    font-weight: 100;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'Kiev';

    src: url('../fonts/kiev/Kiev-Normal.eot');

    src: url('../fonts/kiev/Kiev-Normal.eot?#iefix') format('embedded-opentype'),

        url('../fonts/kiev/Kiev-Normal.woff2') format('woff2'),

        url('../fonts/kiev/Kiev-Normal.woff') format('woff'),

        url('../fonts/kiev/Kiev-Normal.ttf') format('truetype');

    font-weight: normal;

    font-style: normal;

    font-display: swap;

}





@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



body {

    color: var(--black);

    font-weight: 400;

    font-family: "Poppins", sans-serif;

}



html,

body {

    height: 100%;

}



body:before,

body:after {

    content: none !important

}

.cover-p {
    font-family: Mariah;
}
.in-play {
    font-family: Kiev;   
    text-transform: none;    
    margin-left: 2px;
}
@media (max-width: 768px) {
    #header .action_btn .orderBtn, #header .action_btn .orderBtn * {
      display: block !important;
      margin-right: 20px;
    }
    .action_btn * {
      display: none !important;
    }
    }

iframe {

    margin-bottom: 0;

}



img {

    max-width: 100%;

    vertical-align: top;

}



h1,

h2,

h3,

h4,

h5,

h6,

span,

p,

ul {

    margin: 0;

    padding: 0;

    border: 0;

    outline: 0;

    font-size: 100%;

    background: transparent;

    clear: none;

}



figure {

    margin: 0;

}



label {

    font-weight: normal;

}



*:focus {

    outline: none;

}



a,

a:hover,

a:focus,

a:active {

    text-decoration: none;

    outline: none;

}



a:hover,

a:focus {

    color: var(--hover);

}



.btn {

    transition: all 0.4s ease-in-out;

    transform: translateY(0px);

}



.btn:hover {

    -webkit-transform: translateY(-4px);

    transform: translateY(-4px);

}



a,

input[type="submit"] {

    -webkit-transition: all 0.4s ease-in-out;

    transition: all 0.4s ease-in-out;

}



input[type="text"],

input[type="email"],

input[type="password"],

input[type="url"],

input[type="tel"],

input[type="number"],

textarea,

select {

    -webkit-appearance: none;

    -moz-appearance: none;

    appearance: none;

}



input:focus,

select:focus,

button:focus {

    box-shadow: none;

    outline: none;

}



select::-ms-expand {

    display: none;

}



h1 {

    font-size: 38px;

    line-height: 60px;

}



h2 {

    font-size: 34px;

}



h3 {

    font-size: 38px;

    color: var(--black);

}



h4 {

    font-size: 28px;

}



h5 {

    font-size: 26px;

}



h6 {

    font-size: 20px;

}



p {

    font-size: 16px;

    color: var(--black);

    font-weight: 400;

    line-height: 1.7;

    margin-bottom: 15px;

}



a {

    transition: all 0.4s ease-in-out;

    transform: translateY(0px);

}



section {

    padding: 80px 0;

}



.common_bg {

    background: var(--sec-bg);

}



*::-webkit-input-placeholder {

    color: #999 !important;

    opacity: 1;

}



*::-moz-placeholder {

    color: #999 !important;

    opacity: 1;

}



*:-ms-input-placeholder {

    opacity: 1 !important;

    color: #999 !important;

}



:root {

    --bg-color: #0B78A0;

    --orange: #E78729;

    --green: #779573;

    --white: #fff;

    --black: #000;

    --hover: #066081;

    --sec-bg: #a5cef3;

}



/*  Header-Style-here */



.header {

    position: fixed;

    z-index: 4;

    width: 100%;

}



.header .logo_nav a img {

    width: 480px;

}



#header.nav-up .logo_nav {

    top: -200px;

    -webkit-transition: all 0.2s ease-in-out;

    -o-transition: all 0.2s ease-in-out;

    transition: all 0.2s ease-in-out;

}



#header .logo_nav {

    background: var(--white);

}



#header.fixed.nav-down .logo_nav {

    top: 0px;

    -webkit-transition: all 0.6s ease-in-out;

    -o-transition: all 0.6s ease-in-out;

    transition: all 0.6s ease-in-out;

    position: fixed;

    top: 0;

    left: 0;

    right: 0;

    z-index: 9;

    box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.55);

}



.header .top_bar {

    background: var(--bg-color);

    padding: 7px 0;

}



.header .top_wrapper {

    display: flex;

    align-items: center;

    justify-content: space-between;

}



.header .top_bar i {

    width: 22px;

    height: 22px;

    border-radius: 100%;

    line-height: 22px;

    text-align: center;

    font-size: 14px;

    color: var(--bg-color);

    background: var(--white);

    transition: all 0.4s ease-in-out;

    transform: translateY(0px);

}



.footer .footer-social a i {

    color: white;

    transition: all 0.4s ease-in-out;

    font-size: 22px;

}



.header .top_bar .top_col a {

    margin-right: 10px;

}



.header .top_bar .top_col a i {

    margin-right: 5px;

}



.header .top_bar .top_social a,

.footer .footer-social a+a {

    margin-left: 5px;

}



.header .top_bar a,

.footer .footer-social a {

    color: var(--white);

    font-size: 14px;

    font-weight: 400;

}



.header .top_bar a:hover i,

.footer .footer-social a:hover i {

    -webkit-transform: translateY(-4px);

    transform: translateY(-4px);

}



.logo_nav {

    padding: 15px 0;

}



.logo_nav .container {

    display: flex;

    justify-content: space-between;

}



.action_btn .btn {

    font-size: 16px;

    font-weight: 400;

    color: var(--white);

    padding: 0 20px;

    border-radius: 4px;

    line-height: 2.3;

    background: #4D648D;

    margin-left: 10px;

    transition: all 0.4s ease-in-out;

    transform: translateY(0px);

    box-shadow: none;

    font-family: "Poppins", sans-serif;

}



.action_btn .btn.orange {

    background-color: #E78729;

}



.action_btn .btn.green {

    background: var(--green);

}



.action_btn .btn:hover {

    -webkit-transform: translateY(-4px);

    transform: translateY(-4px);

}



.action_btn .btn.blue {

    display: inline-flex;

    align-items: center;

}



.action_btn .btn.blue img {

    width: 15px;

    margin-right: 7px;

}



main {

    overflow-x: hidden;

}



.header .nav_bar {

    position: absolute;

    width: 100%;

    background: rgba(165, 206, 243, 0.92);

}



.header .nav_bar .navbar {

    padding: 0;

    background: transparent;

}



.header .nav_bar .navbar .navbar-nav {

    justify-content: space-between;

    width: 100%;

    font-family: "DM Sans", sans-serif;

}



.header .nav_bar .navbar .navbar-nav .nav-item {

    margin: 0 5px;

    padding: 0;

}



.header .nav_bar .navbar .navbar-nav .nav-item a {

    color: var(--white);

    font-size: 17px;

    font-weight: 400;

    padding: 12px 10px;

    display: inline-block;

}



.header .nav_bar .navbar .navbar-nav .nav-item a:hover {

    background: var(--hover);

}



.header .nav_bar .navbar .navbar-nav .nav-item .dropdown-menu {

    background: var(--bg-color);

    /* padding: 10px; */

    /* min-width: 220px; */

    width: fit-content;

    /* top: 90px; */

    visibility: visible;

    /* opacity: 0; */

    pointer-events: none;

    transition: all 0.4s ease-in-out;

    width: 100%;

    text-align: center;

}



.header .nav_bar .navbar .navbar-nav .nav-item.dropdown:hover .dropdown-menu {

    top: 100%;

    visibility: visible;

    opacity: 1;

    pointer-events: all;

}



.header .nav_bar .navbar .navbar-nav .nav-item .dropdown-menu li {

    margin: 0;

    padding: 3px 10px;

}



.header .nav_bar .navbar .navbar-nav .nav-item .dropdown-menu li a {

    color: var(--white);

    font-size: 14px;

    font-weight: 400;

    padding: 0;

    width: 100%;

}



.header .nav_bar .navbar .navbar-nav .nav-item .dropdown-menu li:hover {

    background: #a5cef3;

    color: #fff;

}



.header .nav_bar .navbar .navbar-nav .nav-item .dropdown-menu li a:hover {

    background: unset;

    color: #fff;

}



.header .nav_bar .navbar .navbar-nav .nav-item:last-child .dropdown-menu {

    left: inherit;

    right: 0;

    transition: 0.6s ease;

}



/* .dropdown:hover .dropdown-menu {

    visibility: visible !important;

    display: block;

    transition: 0.6s ease;

} */



/*  Header-Style-here */







/*  Footer-Style-here */

.footer-item .footer_logo img {

    width: 330px;

    margin-bottom: 25px;

}



.footer-social .social {

    background: #0B78A0;

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 100%;

    transition: all 0.4s ease-in-out;

}



.footer-social .social img {

    width: unset;

}



.footer-social {

    display: flex;

    gap: 8px;

}



.footer .footer-bottom {

    padding: 10px 0;

    background-color: #283655;

    border-top: 1px solid #fff;

}



.footer .footer-bottom .copyright {

    color: var(--white);

    font-size: 13px;

    text-align: center;

    margin: 0;

}



.footer .footer-top {

    padding: 80px 0 40px;

    background-color: #283655;

}



.footer .footer-item .title {

    color: var(--white);

    font-size: 24px;

    margin-bottom: 20px;

}



.footer .footer-item .desc {

    color: var(--white);

    font-size: 16px;

    max-width: 343px;

    margin-bottom: 30px;

}



.footer .footer-item ul li {

    list-style: none;

    margin-bottom: 18px;

}



.footer .footer-item ul li:last-child {

    margin-bottom: 0;

}



.footer .footer-item ul li a {

    color: var(--white);

    font-size: 16px;

    display: inline-flex;

    align-items: baseline;

}



.footer .footer-item ul li a:hover {

    opacity: 0.8;

}



.footer .footer-item ul li a i {

    color: #0b78a0;

    margin-right: 12px;

    font-size: 17px;

}



.footer .subscribe button {

    border: unset;

    background: unset;

}



.footer-item form .subscribe i {

    color: white;

    background: #0B78A0;

    padding: 7px;

    border-radius: 100%;

    font-size: 20px;

}



.footer-item form .subscribe {

    background: white;

    width: 290px;

    min-width: 290px;

    padding: 7px 11px;

    margin-bottom: 25px;

    border-radius: 4px;

    display: flex;

    align-items: center;

    justify-content: space-between;

}



.footer-item form .subscribe input {

    border: unset;

    outline: unset;

    border-color: unset;

}



.footer .middle_column {

    display: flex;

    justify-content: center;

}



.footer .middle_column .row {

    --bs-gutter-x: 9.5rem;

    --bs-gutter-y: 0;

    display: flex;

    flex-wrap: nowrap;

    margin-top: calc(var(--bs-gutter-y) * -1);

    margin-right: calc(var(--bs-gutter-x) * -.5);

    margin-left: calc(var(--bs-gutter-x) * -.5);

}



.footer .middle_column .footer-item {

    width: fit-content;

}



.middle_column h4 {

    padding-left: 35px;

}



.footer .middle_column ul {

    display: flex;

    flex-wrap: wrap;

}



.footer .middle_column ul li {

    width: 50%;

    text-align: center;

}



.footer .middle_column ul li:nth-child(even) {

    padding-left: 65px;

}



.footer .last_column {

    display: flex;

    justify-content: end;

}



.footer .last_column ul li:nth-child(1) a {

    pointer-events: none;

}



.footer .middle_column .footer-item ul li a {

    color: var(--white);

    font-size: 18px;

    display: inline-flex;

    align-items: baseline;

    width: 160px;

    min-width: 160px;

    transition: all 0.4s ease-in-out;

}



.footer .middle_column .footer-item ul li a:hover {

    opacity: 0.8;

}



/* modal css */



.covers_modal {

    overflow: hidden;

}



.covers_modal .call_mail {

    display: flex;

    justify-content: center;

    width: 100%;

    gap: 30px;

}



.covers_modal .call_mail p {

    margin-bottom: unset;

}



.covers_modal .modal-header {

    position: relative;

    background-color: #9EC3E4;

}



.covers_modal .modal-header p i {

    margin-right: 8px;

    position: relative;

    z-index: 1;

    color: #9EC3E4;

}



.covers_modal .modal-header .call p i {

    transform: rotate(90deg);

}



.covers_modal .modal-header p i:after {

    position: absolute;

    content: "";

    background: #fff;

    width: 25px;

    height: 25px;

    left: -4px;

    top: -4px;

    border-radius: 100%;

    z-index: -1;

}



.covers_modal .modal-header p {

    font-size: 16px;

    font-weight: 500;

}



.covers_modal .modal-dialog {

    max-width: 620px;

    /* height: auto; */

    display: flex;

    align-items: center;

    justify-content: center;

    height: 100%;

}



.covers_modal .modal-body {

    padding-right: 35px;

    padding-left: 35px;

}



.covers_modal .modal-body h5,

.covers_modal .modal-body p {

    text-align: center;

}



.covers_modal .modal-body h5 {

    color: #9EC3E4;

    font-weight: 600;

    margin-top: 20px;

}



.covers_modal .modal-body p {

    color: #333;

}



.covers_modal .modal-header p {

    color: #fff;

}



.covers_modal .modal-header p a {

    color: #fff;

    font-size: 18px;

    font-weight: 600;

}



.covers_modal form {

    margin-top: 40px;

}



.covers_modal .modal-header button {

    position: absolute;

    right: -10px;

    top: -10px;

    background: white;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 20px;

    border-radius: 100%;

    border: 5px solid #554a4a;

    opacity: unset;

    color: #9ba0b7;

    transition: 0.3s ease;

}



.covers_modal .modal-header button:hover {

    background: #7e0606;

    border: 5px solid #7e0606;

    color: #fff;

}



.covers_modal input.form-control,

.covers_modal textarea {

    border: unset;

    border-bottom: 1px solid #9EC3E4;

    border-radius: unset;

    margin-bottom: 15px;

}



.covers_modal input.form-control:focus,

.covers_modal textarea:focus {

    outline: none;

    box-shadow: unset;

}



.covers_modal label i {

    width: 18px;

    margin-right: 5px;

    color: #9EC3E4;

}



.covers_modal .submit_button {

    border: unset;

    width: fit-content;

    padding: 12px 100px;

    margin: auto;

    border-radius: 4px;

    color: #fff;

    background-color: #6DAD3C;

    font-size: 20px;

    transition: 0.4s ease;

    margin-top: 20px;

    margin-bottom: 20px;

}



.covers_modal .submit_button:hover {

    transform: translateY(-5px);

}



/* responsive css */



@media(max-width:1599px) {

    .middle_residence .patio_text {

        min-height: 85px;

    }



    .banner .bnr_ctnt .container {

        padding: 0 50px;

    }

}





@media only screen and (max-width:1499px) {

    .banner .bnr_ctnt .container {

        padding: unset;

    }



    .banner .carousel-indicators {

        bottom: 10px;

    }



    .banner .bnr_ctnt .container {

        justify-content: space-around;

    }



    .quote_banner .bnr_ctnt .container {

        justify-content: end;

    }



    .header .nav_bar .navbar .navbar-nav .nav-item a {

        color: var(--white);

        font-size: 16px;

        font-weight: 400;

        padding: 10px 5px;

        display: inline-block;

    }



    .pool_enclosure .heading_section p {

        padding: 0 250px;

    }



    .indoor-section .indoor_img .overlay_dots {

        left: 565px;

    }



    .residence_section .residence figure img {

        width: 90%;

        height: 200px;

    }



    .residence_2 .residence figure img {

        width: 90%;

        height: 240px;

    }



    .residence_section .patio_text {

        min-height: 132px;

    }



    .middle_residence .patio_text {

        min-height: 107px;

    }



    .last_residence .patio_text {

        min-height: 185px;

    }



    .quote_form label {

        font-size: 14px;

    }



    .gallery_images h4 {

        width: 50%;

    }

}



@media(max-width:1399px) {

    .last_residence .patio_text {

        min-height: 198px;

    }



    .residence_section .patio_text {

        min-height: 150px;

    }



    .middle_residence .patio_text {

        min-height: 102px;

    }



    p,

    .indoor-section .indoor_ctnt .features ul li,

    .overview_section .overview_content .type p span,

    .overview_section .features ul li,

    .faq-section .accordion .accordion-item .accordion-body p {

        font-size: 15px;

    }



    .overview_section .overview_content h5 {

        font-size: 20px;

    }



    .faq-section .accordion .accordion-item .accordion-button {

        font-size: 17px;

    }



    .footer .middle_column .row {

        --bs-gutter-x: 1.5rem;

    }



    .overview_section .type {

        display: flex;

        align-items: start;

        gap: 12px;

        margin-bottom: 15px;

        justify-content: space-between;

        flex-direction: column;

    }



    .overview_section .type .mid_line {

        display: none;

    }



    .residence_section .residence h6 {

        font-size: 17px;

    }



    .residence_section .residence span,

    .residence_section b {

        font-size: 15px;

    }



    .blog-section .slick-slider {

        width: calc(100% - 80px);

    }



    .gallery_section h3,

    .overview_section h3,

    .indoor-section .indoor_ctnt h3,

    .faq-section .section-title {

        font-size: 30px;

    }



    .faq-section .accordion .accordion-item .accordion-button {

        font-size: 15px;

    }



    .faq-section .accordion .accordion-item .accordion-body p {

        font-size: 14px;

        margin: 0;

    }



    .banner_text h1 {

        font-size: 40px;

    }



    .overview_carousel .slick-arrow.slick-prev,

    .overview_carousel .slick-arrow.slick-next {

        top: 155px;

    }



    .banner .features {

        display: flex;

        flex-wrap: wrap;

        color: #fff;

        gap: 12px;

        margin-bottom: 20px;

    }



    .banner .features h4 {

        border-right: 3px solid #fff;

        padding-right: 11px;

        font-size: 20px;

    }



    .indoor-section .indoor_img .overlay_dots {

        left: 475px;

    }



    .common_gallery {

        padding: 60px 0;

    }



    .gallery_content .container > div {

        align-items: start;

    }



    .gallery_content .list {

        width: 45%;

    }



    .gallery_content .content {

        width: 50%;

    }



    .gallery_content h3, .more_product_section h4 {

        font-size: 34px;

    }



    .north_york_section h4 {

        font-size: 32px;

    }



    .gallery_images h4 {

        font-size: 26px;

    }



    .gallery_banner h2 {

        font-size: 62px;

    }



    .gallery_images h4 {

        width: 57%;

    }



    .more_product_section figure figcaption {

        font-size: 20px;

    }

}



@media(min-width:1200px) {



    .dropdown:hover .dropdown-menu {

        visibility: visible !important;

        display: block;

        transition: 0.6s ease;

    }

}



@media(max-width:1199px) {

    .header {

        position: fixed;

        width: 100%;

        z-index: 4;

    }



    .header .nav_bar .navbar .navbar-nav .nav-item {

        margin: 0 5px;

        padding: 0;

        display: flex;

        align-items: center;

        justify-content: center;

        border-bottom: 1px solid #fff;

        flex-direction: column;

    }



    .header .nav_bar .navbar .navbar-nav {

        padding-bottom: 40px;

    }



    .indoor-section .indoor_img .overlay_image {

        left: -31px;

    }



    .residence_section.opening_residence .patio_text {

        min-height: 103px;

    }



    .last_residence .patio_text {

        min-height: 222px !important;

    }



    .residence_section .patio_text {

        min-height: 174px;

    }



    .middle_residence .patio_text {

        min-height: 127px;

    }



    .gallery_section figure img {

        -webkit-filter: blur(0);

    }



    .pool_enclosure .heading_section p {

        padding: 0 150px;

    }



    .banner_text h1 {

        font-size: 32px;

    }



    .banner_text .call-action .btn span {

        font-size: 16px;

    }



    .rating figure {

        width: 110px;

        height: 35px;

    }



    .rating {

        margin-left: 40px;

    }



    .blog-section .slick-slider {

        width: calc(100% - 60px);

    }



    .blog-section {

        height: 625px;

    }



    .action_btn {

        display: none;

    }



    .header .nav_bar {

        position: absolute;

        width: 100%;

        background: rgba(165, 206, 243, 0.92);

        /* padding-bottom: 40px; */

    }



    .navbar-toggler {

        padding: .25rem .75rem;

        font-size: 1.25rem;

        line-height: 1;

        background-color: transparent;

        border: 1px solid transparent;

        border-radius: .25rem;

        transition: box-shadow .15s ease-in-out;

        position: fixed;

        right: 11%;

        top: 16px;

        z-index: 9;

    }



    .overview_carousel .slick-arrow.slick-prev,

    .overview_carousel .slick-arrow.slick-next {

        top: 125px;

    }



    .indoor-section .indoor_img .overlay_dots {

        left: 385px;

    }



    .residence_section .residence figure img {

        width: 90%;

        height: 150px;

    }



    .overview_section .indoor_ctnt .features ul li {

        width: 100%;

    }



    .covers_modal {

        overflow: scroll;

    }



    .quote_form .attachments_items>div {

        width: 50%;

    }



    .footer .middle_column {

        padding-left: 10px;

    }



    .footer .middle_column ul li:nth-child(even) {

        padding-left: unset;

    }



    .gallery_images h4 {

        width: 68%;

    }



    .gallery_images .images figure {

        width: calc(100% / 2 - 15px);

    }



    .gallery_images .images {

        justify-content: center;

    }

}



@media(max-width:991px) {

    .quote_banner {

        min-height: 722px;

    }



    .active-popup .carousel-inner,

    .active-popup .carousel-inner div {

        height: 100%;

        min-height: 645px;

    }



    .residence_section .patio_text {

        min-height: 102px;

    }



    .banner .bnr_ctnt {

        height: 100%;

        position: absolute;

        top: 51%;

        transform: translateY(-50%);

        left: 0;

        right: 0;

    }



    .banner .bnr_ctnt .container {

        display: flex;

        align-items: center;

        justify-content: space-between;

        height: unset;

        flex-direction: column;

        gap: 50px;

        margin-top: 130px;

    }



    .quote_banner .bnr_ctnt .container {

        justify-content: end;

        align-items: end;

    }





    .banner .carousel-indicators {

        bottom: 6px;

    }



    .carousel-inner {

        position: relative;

        width: 100%;

        overflow: hidden;

        height: 1180px;

    }



    .banner .carousel-item {

        background-position: center;

        background-repeat: no-repeat;

        background-size: cover;

        height: 1180px;

        position: relative;

    }



    .palm_section .row {

        display: flex;

        flex-direction: column-reverse;

    }



    .indoor-section .row {

        align-items: center;

        gap: 40px 0;

    }



    .action_btn {

        display: none;

    }



    .header .nav_bar {

        position: absolute;

        width: 100%;

        padding-top: 0;

        background: transparent !important;

    }



    .header .nav_bar .navbar .navbar-nav {

        background: rgba(165, 206, 243, 0.92);

        padding-bottom: 20px;

    }



    .header .nav_bar .navbar .navbar-nav > li:last-child {

        border-bottom: unset;

    }



    .blog-section .slick-slider {

        width: calc(100% - 150px);

    }



    .faq-section .align-items-center {

        align-items: center !important;

        gap: 30px 0;

    }



    .footer .row {

        gap: 45px 0;

    }



    .footer .last_column {

        display: flex;

        justify-content: start;

    }



    .farming_section .indoor_img {

        position: relative;

        width: 100%;

        height: 100%;

    }



    .overview_section .indoor_ctnt .features {

        gap: 20px;

        flex-direction: column;

    }



    .overview_section .components {

        width: 100%;

    }



    .overview_section .type {

        display: flex;

        align-items: start;

        gap: 12px;

        margin-bottom: 15px;

        flex-direction: column;

    }



    .overview_section .type .mid_line {

        width: 100%;

        height: 1px;

        background-color: gray;

    }



    .indoor-section .indoor_img .overlay_image {

        width: 290px;

    }



    .blog-carousel .slick-arrow.slick-prev {

        right: 122px;

    }



    .blog-carousel .slick-arrow.slick-next {

        right: 75px;

    }



    .indoor_pool .row {

        display: flex;

        flex-direction: column-reverse;

    }



    .overview_carousel .slick-arrow.slick-prev,

    .overview_carousel .slick-arrow.slick-next {

        top: 90px;

    }



    .indoor-section .indoor_img .overlay_dots {

        left: 606px;

    }



    .indoor-section .indoor_ctnt .text-center {

        margin-top: 30px;

    }



    .blog-carousel .item .blog-title {

        font-size: 16px;

    }



    .blog-section .client h6 {

        font-size: 14px;

    }



    .farming_section .row {

        flex-direction: column-reverse;

    }



    .residence_section .residence figure img {

        width: 90%;

        height: 240px;

    }



    .fenestration_section .row {

        flex-direction: column-reverse;

    }



    .fenestration_section .indoor_ctnt {

        margin-top: 40px;

    }



    .fenestration_section .row .col-md-6 {

        flex: 0 0 auto;

        width: 100%;

    }



    .fenestration_section p {

        max-width: 100%;

        margin-top: 40px;

    }



    .fenestration_section .features ul li {

        width: 100%;

    }



    .fenestration_section .row {

        gap: 10px 0 !important;

    }



    .faq-section .row>div:nth-child(2) {

        margin-top: 30px;

    }



    .quote_form .other_comments {

        width: 100%;

    }



    .quote_form .attachments_items {

        width: 100%;

    }



    .gallery_content .container > div {

        flex-direction: column;

        gap: 30px;

    }



    .gallery_content .list {

        width: 100%;

    }



    .gallery_content .content{

        width: 100%;

     }



     .gallery_images h4 {

        width: 90%;

    }

}



@media(max-width:768px) {

    section {

        padding: 50px 0;

    }



    .indoor-section .indoor_ctnt .text-center {

        margin-top: unset;

    }



    .active-popup .carousel-inner,

    .active-popup .carousel-inner div {

        height: 100%;

        min-height: 590px;

    }



    .outdoor_section {

        padding: 50px 0;

    }



    /* .indoor-section .indoor_ctnt p:last-child {

        margin-bottom: 45px;

    } */

    .indoor-section .indoor_img .overlay_image {

        left: -43px;

    }



    .enjoy_content {

        display: flex;

        align-items: center;

        justify-content: center;

        flex-direction: column;

        padding-top: 20px;

    }



    .residence_section.opening_residence .patio_text {

        min-height: unset;

    }



    .blog-section {

        height: 570px;

    }



}



@media(max-width:767px) {

    .quote_banner .banner-form {

        display: none;

    }



    .quote_banner {

        min-height: 350px;

    }



    .last_residence .patio_text {

        min-height: unset !important;

    }



    .pool_enclosure .patio_text {

        min-height: unset;

    }



    .indoor-section .indoor_img .overlay_image,

    .outdoor_section .indoor_img .pop_image,

    .palm_section .indoor_img .top_image {

        display: none;

    }



    .banner .carousel-indicators {

        bottom: 42px;

        display: none;

    }



    .banner_text h1 {

        font-size: 25px;

    }



    .banner_text ul li {

        font-size: 15px;

        margin-bottom: 10px;

    }



    .indoor-section .indoor_ctnt .features ul li {

        font-size: 16px;

    }



    .banner-form p {

        font-size: 15px;

    }



    .banner .bnr_ctnt .container {

        gap: 30px;

        margin-top: 110px;

    }



    .carousel-inner {

        position: relative;

        width: 100%;

        overflow: hidden;

        height: 1170px;

    }



    .banner .carousel-item {

        background-position: center;

        background-repeat: no-repeat;

        background-size: cover;

        height: 1170px;

        position: relative;

    }



    .gallery_section h3,

    .overview_section h3,

    .indoor-section .indoor_ctnt h3,

    .faq-section .section-title,

    .pool_enclosure .heading_section h3 {

        font-size: 25px;

    }



    .footer .middle_column {

        display: flex;

        justify-content: start;

    }



    .footer .footer-item .desc {

        font-size: 14px;

        max-width: 100%;

    }



    .footer .middle_column .row {

        --bs-gutter-x: 7.5rem;

    }



    .blog-section .slick-slider {

        width: calc(100%);

    }



    .gallery_section h3 {

        width: 100%;

        min-width: unset;

    }



    ul#pills-tab {

        display: flex;

        width: 100%;

        align-items: center;

    }



    .residence_section ul li {

        width: 50%;

    }



    .residence_section .nav-link h5 {

        font-size: 18px;

    }



    .pool_enclosure .heading_section p {

        padding: unset;

    }



    .column figure img {

        position: static;

        width: 100%;

        height: 100%;

    }



    .gallery_section .row div:nth-child(4) .column {

        display: flex;

        flex-direction: row;

        width: 100%;

        gap: 6px;

    }



    .gallery_section .row {

        --bs-gutter-x: 0.5rem !important;

        gap: 6px 0;

    }



    .blog-section .section-title {

        margin-bottom: 15px;

        font-size: 25px;

    }



    .gallery_section h3,

    .faq-section .section-title {

        text-align: center;

    }



    .footer .footer-item .title {

        font-size: 16px;

    }



    .banner .bnr_ctnt {

        top: 51%;

    }



    .indoor-section .indoor_ctnt {

        padding-right: unset;

    }



    .banner .features h4 {

        font-size: 16px;

    }



    .farming_section .indoor_img::after {

        display: none;

    }



    .youtube_section .covers_video::after {

        display: none;

    }



    .pool_enclosure .upper_section {

        height: 475px;

    }



    .residence_2 .upper_section {

        height: 250px !important;

    }



    .pool_enclosure .heading_section h4 {

        font-size: 24px;

    }



    .indoor_ctnt .short_heading h4 {

        font-size: 20px;

    }



    .palm_section {

        padding: 90px 0 0px;

    }



    .covers_modal .modal-header p a {

        font-size: 16px;

    }



    .quote_form .attachments_items {

        flex-direction: column;

        gap: unset;

    }



    .quote_form .attachments_items>div {

        width: 100%;

    }



    .quote_form .submit_button {

        width: 100%;

    }



    .middle_column h4 {

        padding-left: unset;

    }



    .footer .middle_column {

        padding-left: unset;

    }



    .footer .middle_column ul li {

        text-align: left;

    }



    .gallery_banner {

        min-height: 300px;

    }



    .common_gallery {

        padding: 40px 0;

    }



    .gallery_content h3, .more_product_section h4 {

        font-size: 26px;

    }



    .north_york_section h4 {

        font-size: 24px;

    }



    .gallery_images h4 {

        font-size: 22px;

    }



    .gallery_banner h2 {

        font-size: 42px;

    }



    .gallery_images h4 {

        width: 57%;

    }



    .more_product_section figure figcaption {

        font-size: 20px;

    }



    .gallery_images .images figure {

        width: 100%;

    }



    .gallery_images h4 {

        width: 100%;

    }



    .gallery_content h1 {

        font-size: 28px;

    }



    .gallery_content .content h2 {

        font-size: 24px;

    }



    .north_york_section h3 {

        font-size: 26px;

    }



    .gallery_images h4 span:nth-child(2) {

        font-size: 30px;

    }



    .gallery_images h4 span:nth-child(3) {

        font-family: 'Kiev';

        font-size: 30px;

    }



    .gallery_images h4 span:nth-child(4) {

        font-family: 'Kiev';

        font-size: 30px;

    }



    .header .nav_bar .navbar .navbar-nav {

        padding-bottom: 10px;

    }

}



@media(max-width:575px) {

    .covers_modal .call_mail {

        gap: 8px;

        flex-direction: column;

    }



    .carousel-control-next,

    .carousel-control-prev {

        width: 9%;

    }



    .banner_text .call-action .btn {

        margin-bottom: 10px;

    }



    .banner-form {

        display: none;

    }



    .carousel-inner {

        position: relative;

        width: 100%;

        overflow: hidden;

        height: 480px;

    }



    .banner .carousel-item {

        background-position: center;

        background-repeat: no-repeat;

        background-size: cover;

        height: 480px;

        position: relative;

    }



    .banner_text {

        height: auto;

        display: flex;

        align-items: center;

        justify-content: center;

        flex-direction: column;

    }



    .banner .features {

        display: flex;

        flex-wrap: wrap;

        color: #fff;

        gap: 12px;

        margin-bottom: 20px;

        align-items: center;

        display: flex;

        align-items: center;

        justify-content: center;

    }



    .banner_text ul li {

        color: var(--white);

        font-size: 20px;

        font-weight: 400;

        margin-bottom: 12px;

        padding-left: 50px;

        position: relative;

    }



    .banner_text ul li:after {

        content: '';

        position: absolute;

        left: 22px;

        top: 2px;

        background-image: url(../images/tick.svg);

        width: 18px;

        height: 18px;

        background-position: center;

        background-repeat: no-repeat;

        background-size: contain;

    }



    .outdoor_section {

        padding: 0px 0;

    }



    .blog-carousel .item .blog-title {

        font-size: 14px;

    }



    .banner-form {

        width: 100%;

    }



    .indoor-section .indoor_img .overlay_image {

        width: 250px;

    }



    .indoor-section .indoor_ctnt .features {

        gap: 0px;

        flex-direction: column;

        width: 100%;

    }



    .pool_enclosure .heading_section p {

        padding: 0 15px;

        text-align: left;

        font-size: 13px;

    }



    .footer .middle_column .footer-item ul li a {

        font-size: 13px;

        width: 150px;

        min-width: 150px;

    }



    .footer .middle_column .row {

        --bs-gutter-x: 0.5rem;

    }



    .banner_text h1,

    .banner-form h2 {

        font-size: 18px;

    }



    .banner_text ul li,

    .banner-form p,

    .faq-section .call_button .btn span,

    .indoor-section .indoor_ctnt .features ul li,

    .overview_section .overview_content .type p span,

    .overview_section .features ul li,

    .touch_button a {

        font-size: 14px;

    }



    .banner_text .call-action .btn span,

    .faq-section .call_button .btn span small {

        font-size: 13px;

    }



    .banner_text .call-action .btn figure {

        width: 27px;

        height: 27px;

    }



    .banner .rating figure {

        width: 90px;

        height: 30px;

    }



    .banner .bnr_ctnt {

        top: 51%;

        height: auto;

    }



    .banner_text {

        height: auto;

    }



    .indoor_ctnt .call_button .btn figure,

    .faq-section .call_button .btn figure {

        width: 30px;

        height: 30px;

    }



    section {

        padding: 50px 0;

    }



    .indoor-section .indoor_img figure::after {

        display: none;

    }



    .indoor-section .indoor_img figure {

        height: 250px;

    }



    .indoor-section .indoor_ctnt .features ul li::after {

        background-image: url(../images/blue_tick.svg);

        width: 18px;

        height: 18px;

    }



    .indoor_ctnt .call_button .btn span {

        font-size: 15px;

    }



    .indoor_ctnt .call_button .btn span small {

        line-height: 14px;

    }



    .outdoor_section {

        padding: 50px 0;

    }



    .palm_section {

        padding-bottom: unset;

    }



    .faq-section {

        margin-top: unset;

    }



    .overview_section .overview_content h5 {

        font-size: 20px;

    }



    .overview_section .indoor_ctnt .features ul li::after {

        width: 18px;

        height: 18px;

    }



    p,

    .blog-section .client h6 {

        font-size: 14px;

    }



    .blog-carousel .item {

        padding: 30px 10px;

    }



    .blog-carousel .slick-arrow.slick-prev {

        display: none;

    }



    .blog-section {

        height: 510px;

    }



    .blog-carousel .slick-arrow.slick-next {

        display: none;

    }



    main {

        overflow-x: hidden;

    }



    .gallery_section .gallery_heading {

        text-align: left;

    }



    .youtube_section .covers_video {

        height: 375px;

        width: 100%;

        position: relative;

        z-index: 1;

    }



    .farming_section {

        background: #F2FCFF;

        height: 100% !important;

        padding: 50px 0;

        position: relative;

    }



    .gallery_banner h2 {

        font-size: 34px;

    }

}



@media(max-width:475px) {

    .banner_text .call-action .btn {

        margin-bottom: 10px;

    }



    .banner_text .call-action {

        margin-top: 26px;

        display: flex;

        align-items: start;

        flex-direction: column;

        gap: 15px;

    }



    .banner .rating {

        margin-left: unset;

    }



    .carousel-inner {

        position: relative;

        width: 100%;

        overflow: hidden;

        height: 500px;

    }



    .banner .carousel-item {

        background-position: center;

        background-repeat: no-repeat;

        background-size: cover;

        height: 500px;

        position: relative;

    }



    .indoor-section .indoor_ctnt .first_heading {

        max-width: unset;

        width: fit-content;

        position: relative;

        font-size: 18px;

    }



    .indoor-section .indoor_ctnt .first_heading sup {

        position: absolute;

        top: 1px;

    }



    .indoor_pool .short_heading {

        margin-top: -18px;

        max-width: unset;

        text-align: left;

        width: fit-content;

        margin: -21px auto 0;

    }



    .indoor_ctnt .short_heading h4 {

        font-size: 16px;

    }



    .footer-item form .subscribe {

        background: white;

        width: 100%;

        min-width: unset;

        padding: 7px 11px;

        margin-bottom: 25px;

        border-radius: 4px;

        display: flex;

        align-items: center;

        justify-content: space-between;

    }

}