/* font faces */
/* @font-face {
    font-family: 'Tajawal';
    src: url(../../../assets/fonts/tajawal/tajawal-regular.woff2);
    font-display: swap;
    font-style: normal;
}
@font-face {
    font-family: 'TajawalBold';
    src: url(../../../assets/fonts/tajawal/tajawal-bold.woff2);
    font-display: swap;
    font-style: normal;
} */

@font-face {
    font-family: 'Gotham';
    src: url(../../../assets/fonts/Gotham/Gotham-Book.otf);
    font-display: swap;
}

@font-face {
    font-family: 'GothamBold';
    src: url(../../../assets/fonts/Gotham/Gotham-Bold.otf);
    font-display: swap;
}
@font-face {
    font-family: 'GothamMedium';
    src: url(../../../assets/fonts/Gotham/Gotham-Medium.otf);
    font-display: swap;
}
@font-face {
    font-family: 'Berlingske';
    src: url(../../../assets/fonts/Berlingske/BerlingskeSerif-SemiBold.ttf);
    font-display: swap;
}
@font-face {
    font-family: 'OptimaMedium';
    src: url(../../assets/fonts/Optima/Optima\ Medium.ttf);
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url(../../assets/fonts/Lato/Lato-Regular.ttf);
    font-display: swap;
}
@font-face {
    font-family: 'LatoMedium';
    src: url(../../assets/fonts/Lato/Lato-Medium.ttf);
    font-display: swap;
}
@font-face {
    font-family: 'LatoSemi';
    src: url(../../assets/fonts/Lato/Lato-Semibold.ttf);
    font-display: swap;
}

@font-face {
    font-family: 'LatoBold';
    src: url(../../assets/fonts/Lato/Lato-Bold.ttf);
    font-display: swap;
}

/* general styles */
:root {
    --primary-btn-color: #005775B2;
    --heading-color: #53585A;
    --text-color: #53585A;
    --form-mob-bg-color: rgba(232, 232, 232, 1);
    --form-bg-color: rgba(0, 53, 80, 0.54);
    --lang-selector-color: #53585A;
    --button-text-color: #FFFFFF;
    --ar-font: 'Tajawal', sans-serif;
    --ar-bold-font: 'TajawalBold', serif;
    --en-font: 'Gotham', sans-serif;
    --en-heading-font:'Berlingske', sans-serif;
    --en-text-font: 'Gotham', sans-serif;
    --en-text-medium-font: 'GothamMedium', sans-serif;
    --en-button-font: 'GothamBold', sans-serif;
    --en-bold-font: 'GothamBold', sans-serif;
    /* --en-semi-bold-text-font: 'LatoSemi', sans-serif; */
    --en-bold-text-font: 'GothamBold', sans-serif;
    --input-color: #ffffff;
    --field-background: #0F1215;
    --main-form-field-bg: rgba(255, 255, 255, 0.15);
    /* --main-form-field-bg: #40677b; */
    --main-form-field-bg-mob:rgba(255, 255, 255, 0.4);
    --usps-color:#FFFFFF;
    --mob-usps-color:#53585A;
    --button-border-color: #005775;
    --place-holder-color:rgba(255, 255, 255, 0.56);
    --overlay-color:rgba(0, 0, 0, 0.75);
    --footer-color: #282828;
    --form-cta-bg:#FFFFFFCC;
    --form-cta-color:#005775;
    --main-form-placeholder-color:#A5A5A5;
    --main-form-placeholder-color-mob:#B0B4B6;
    --main-form-mob-input-color:#53585A;


}
*{ box-sizing: border-box; margin: 0; padding: 0;color: var(--text-color); font-size: 18px;}
.container{ width: 92%; margin: 0 auto; }
img{ display: block; width: auto; height: auto; max-width: 100%;}
fieldset{ border: none; }
button,.button{font-family: var(--en-button-font); color: var(--button-text-color); background: var(--primary-btn-color); font-weight: 600; border: 1.5px solid var(--button-border-color);border-radius: 4px; padding: 13px 27px;} 
.button{ text-decoration: none; text-transform: uppercase; letter-spacing: 3%; font-size: 20px; display: inline-block; text-align: center;}
.button::after { max-height: 100%;
  content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23ffffff'><path d='m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z'/></svg>");
    font-family: inherit;
    color: inherit;
    font-weight: 600;
    padding-left: 14px;
    width: 18px;
    height: 18px;
    display: inline-block;
    top: 2px;
    position: relative;
}


h1,h2,h5{font-family: var(--en-heading-font); font-weight: 600}
strong{font-family: var(--en-bold-font); font-weight: 400; color: inherit; font-size: inherit;}
body{ font-family: var(--en-text-font); }
body.ar{ font-family: 'Tajawal', serif; }
h2{ font-size: 30px; line-height: 1em; margin-bottom: 30px;color: var(--heading-color); line-height: 1.16em; text-align: center; }
h1{ font-size: 24px; line-height: 1em; max-width: 469px; margin-bottom: 15px;}
.mobile{display: none;}
.owl-carousel .owl-item img.mobile{display: none;}
p{ font-size: 18px; margin-bottom: 18px; color: var(--text-color);line-height: 1.5em; }
p.note { font-size: 13px; font-style: italic; margin-bottom: 0; }
.field-wrap .error { font-size: 8px; color: red; position: absolute; width: fit-content; right: 2px; bottom: -15px; }
.privacy-box .field-wrap .error{     bottom: -9px; left: 18px;}
sup { font-family: inherit; font-weight: inherit; font-size: 0.8em; }
#hero-slider .slide img { width: 100%; }
h3.subheading { font-family: var(--en-bold-font); font-weight: 700; font-size: 22px; line-height: 1.6em; letter-spacing: 5%; text-align: center; text-transform: uppercase; color: #91A0AD; margin-bottom: 30px; margin-top: -30px; }

/* success */
#success-overlay { display: flex; justify-content: center; align-items: center; position: fixed; top: 0px; bottom: 0px; width: 100%; z-index: 99999999; background-color: rgba(0, 0, 0, 0.8); color: #3d3d3d; }
#success-overlay-innerwrap { display: block; position: relative; width: 92%; max-width: 600px; min-height: 180px; padding: 40px; background-color: rgb(255 255 255 / 90%); border-radius: 5px;    display: flex; justify-content: center; flex-direction: column; }
#success-overlay h4 { text-align: center; font-size: 35px; font-family: var(--en-heading-font); margin-bottom: 10px; font-weight: 500;font-size: 30px; }
#success-overlay h5 { text-align: center; font-size: 18px;font-family: var(--en-text-font); text-transform: none; font-size: 18px;}
#success-overlay-close { position: absolute; right: 0px; top: 0px; font-size: 22px; cursor: pointer; padding: 12px 15px 8px; font-weight: 600; background: #000; color: #fff; }



/* hero section */
.hero-section { position: relative;}
.hero-section #hero-slider .owl-stage-outer,.hero-section #hero-slider  .owl-stage, .hero-section #hero-slider .owl-item ,.hero-section #hero-slider  .slide,.hero-section #hero-slider img { height:100%; }
.hero-section #hero-slider img{object-fit: cover; object-position: left;}
.hero-section .container { display: flex; position: relative; z-index: 1; }
.hero-section #language-selector a { display: block; line-height: 1em; color: var(--button-text-color); text-decoration: none; text-align: right; font-family: var(--ar-bold-font); font-weight: 500; background: var(--lang-selector-color); width: fit-content; padding: 5px 16px; margin-left: auto; margin-bottom: 12px; font-weight: 700;} 
.hero-section .logo-wrap { max-width: 264px; margin-bottom: 38px; }
.hero-section .usps p { font-size: 22px; line-height: 1.22em; }
.hero-section * { color: var(--usps-color);}



.usps .button{ border-color: #FFFFFF66;background: #FFFFFF3D; }
.full-slider-text-section .full-text p{ max-width: 90%; margin-left: auto; margin-right: auto; text-align: center; }
.centered { text-align: center; }
.hero-section #hero-slider { top: 0; left: 0; width: 100%; z-index: -1; height: 100%; }
section{background-repeat: no-repeat; background-size: cover; }


/* main form */
.hero-section .form-container {
    background: var(--form-bg-color);
    padding: 30px 25px;
    border-radius: 5px;
    text-align: center;
    max-width: 432px;
}
.hero-section .form-container .logo-wrap{margin: 0 auto 17px;}
.hero-section .form-container p {margin-bottom: 0; font-size: 16px; line-height: 1.37em;}
.hero-section .form-container .field-wrap{margin-bottom: 10px;}
.hero-section .form-container form{margin-top: 15px;}
.hero-section .field-wrap input { border: none; border-radius: 5px; padding: 10px; background: var(--main-form-field-bg);font-size: 16px; }
.hero-section .field-wrap input::placeholder{color: var(--main-form-placeholder-color);}
.hero-section .field-wrap .error { bottom: 0; }


.hero-section .form-container input:-webkit-autofill,
.hero-section .form-container input:-webkit-autofill:hover,
.hero-section .form-container input:-webkit-autofill:focus,
.hero-section .form-container input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 1000px var(--main-form-field-bg) inset !important; -webkit-text-fill-color: white !important;  caret-color: white;  transition: background-color 5000s ease-in-out 0s;  }

/* Base phone input */
.hero-section .form-container input[type="tel"] {
  background-color: var(--main-form-field-bg) !important;
  color: white !important;
}

/* Autofill states */
.hero-section .form-container input[type="tel"]:-webkit-autofill,
.hero-section .form-container input[type="tel"]:-webkit-autofill:hover,
.hero-section .form-container input[type="tel"]:-webkit-autofill:focus,
.hero-section .form-container input[type="tel"]:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px var(--main-form-field-bg) inset !important;
  -webkit-text-fill-color: white !important;
  caret-color: white !important;
  /* border: 1px solid transparent !important; */
  transition: background-color 9999s ease-in-out 0s;
}

/* intl-tel-input wrapper fixes */
.hero-section .form-container .iti,
.hero-section .form-container .iti input,
.hero-section .form-container .iti input[type="tel"] {
  background-color: var(--main-form-field-bg) !important;
}

/* After validation/submission */
.hero-section .form-container .iti input.error,
.hero-section .form-container .iti input.valid,
.hero-section .form-container .iti input:focus,
.hero-section .form-container .iti input:active {
  background-color: var(--main-form-field-bg) !important;
  color: white !important;
}

.hero-section .iti__country span { color: var(--text-color); }
.field-wrap input,  .field-wrap select,  .field-wrap select option { width: 100%; border: none; color: var(--input-color); background: var(--field-background); padding: 7px 10px; line-height: 1.3em; font-size: 15px; border-bottom:  0.5px solid #FFFFFF; font-family: var(--en-text-font);}
.field-wrap input::placeholder{ color: var(--place-holder-color); }
.field-wrap  input:focus-visible { outline: none; }
.field-wrap > .iti { width: 100%;  }
.hero-section .field-wrap > .iti {  border-radius: 5px; }

form .field-wrap { margin-bottom: 25px; position: relative; }
.submit { font-size: 16px; line-height: 1em; letter-spacing: 8%; text-align: center; text-transform: uppercase; width: 100%; padding: 12px; cursor: pointer;}
.field-wrap:last-child { margin-bottom: 28px; }

.floating-logo { position: absolute; top: 53px; right: 4%; width: 113px; height: 113px; }
.dh-symbol { height: 13px;
    width: auto;
    object-fit: contain;
    margin-left: 2px; display: inline-block;}
.dh-symbol.mobile{display: none;}
/* slider dots */
.owl-carousel .owl-dots { position: absolute; bottom: 20px; z-index: 99; left: 0; right: 0; width: 100%; display: flex; justify-content: center; gap: 6px; }
.owl-carousel .owl-dots .owl-dot { background: #FFFFFF80; width: 10px; height: 10px; border-radius: 100%; }
.owl-carousel .owl-dots .owl-dot.active { background: white; }
.owl-carousel { position: relative; }

/* about-section / full-slider-text-section*/
section { padding: 60px 0; }
#about-slider,.introduction-section .images-slider{ margin-bottom: 35px; }
.usps-icons-row { display: flex; justify-content: center; gap: 15px; margin: auto; flex-wrap: wrap; margin-bottom: 38px; max-width: 90%; }
.usps-icons-row .icon { background: #FFFFFF; border: 1px solid #0000001A; padding: 15px 30px; border-radius: 5px; display: flex; align-items: center; gap: 20px; width: calc((100% - 15px * 2) / 3); flex-wrap: wrap;}
.usps-icons-row .icon .img-wrap { width: 50px; }
/* .about-section .usps-icons-row .icon{ max-width: 300px;} */
.usps-icons-row .icon p { margin-bottom: 0; color: var(--text-color);}
.full-slider-text-section .cta { text-align: center; }
.usps-icons-row  .icon .text-wrap { width: calc(100% - 50px - 20px); max-width: fit-content; }
/* payment plan block */
.usps-icons-row .icon .text-wrap > p:first-child strong { color: #91A0AD; text-transform: uppercase; }
.about-section .usps-icons-row .icon{width: calc((100% - 15px ) / 2);}
.usps-icons-row .icon .pp-desc { width: 100%;display: flex; flex-wrap: wrap;gap: 30px;}
.usps-icons-row .icon .pp-desc div:first-child {  position: relative;}
.usps-icons-row .icon .pp-desc div:first-child:after{content: ''; width:1px ; background: rgba(145, 160, 173, 0.59); height: 90%; right: -15px;position: absolute; top:5%; }
.usps-icons-row .icon .pp-desc strong{font-family: var(--en-text-medium-font); font-weight: 500;}
/* introduction sectio */


.two-col-container { display: flex; flex-wrap: wrap; gap: 80px; max-width: 100%; align-items: center; }
.two-col-container .slider-col { width: 40%; }
.two-col-container .text-col { width: calc(100% - 80px - 40%); }

/* amenities */
.amenities-section .amenities { display: flex; flex-wrap: wrap; gap: 30px 20px; }
.amenities-section .amenities .icon { width: calc((100% - 20px * 2) / 3); }
.amenities-section .amenities .icon img { width: unset; margin: auto; margin-bottom: 5px; }
.amenities-section .amenities .icon p { margin-bottom: 0; text-align: center; }
.slider-overlay-section .two-col-container {max-width: 100%;}
/* .amenities-section .two-col-container .slider-col{ width: 50%; } */
/* .amenities-section .two-col-container .text-col{ width: calc(100% - 50%); } */
.slider-overlay-section { position: relative; padding: 0; }
.slider-overlay-section .images-slider { position: absolute; top: 0.2px; left: 0; width: 100%; z-index: 0; height: calc(100% - 0.2px);}

.slider-overlay-section .images-slider .slide img { object-fit: cover; }
.slider-overlay-section .text-col { z-index: 9; background: rgb(247 247 247 / 92%); padding: 80px 6%  60px 7%; width: 50%; }
.slider-overlay-section .images-slider .owl-dots { max-width: 50%; right: 0; left: unset; }
.slider-overlay-section h2 { text-align:left;}
.slider-overlay-section .images-slider .owl-stage-outer,.slider-overlay-section .images-slider .owl-stage,.slider-overlay-section .images-slider .owl-stage .owl-item,.slider-overlay-section .images-slider .owl-item .slide,.slider-overlay-section .images-slider .slide img { height: 100%; }
/* card slider */
.card-section .slider-wrapper .owl-item{ width: calc(90% / 4);  display: flex; }
.card-section .slider-wrapper .card .text-wrap { padding: 25px; background: #FFFFFF; height: 100%;position: relative; }
/* Make Owl calculate height across all slides */
.card-section .slider-wrapper .owl-stage { display: flex; min-width: 100%; }
.card-section .slider-wrapper .card { display: flex; flex-direction: column;  width: calc(90.3vw / 4); }
.card-section .slider-wrapper{ width: 96%; margin-left: auto; }
.card-section .slider-wrapper .card .text-wrap h4 { font-family: var(--en-bold-font); font-weight: 700; font-size: 20px; line-height: 1.3em; letter-spacing: 2%; text-transform: uppercase; color: #91A0AD; }
.card-section .slider-wrapper .card .text-wrap p { font-size: 18px; line-height: 1.3em; margin-top: 14px; margin-bottom: 0; }
.card-section .slider-wrapper .card .text-wrap .floating {padding-right: 10px; position: absolute; bottom: 10px; font-family: 'Stratum',sans-serif; font-weight: 500; font-size: 14px; line-height: 1em; left: 25px;}
/* .owl-carousel .owl-item img.mobile{display: none;} */
.two-col-section h2 { text-align: left; }
/* why-invest  */
.why-invest-section { background: #EAECED; }
.why-invest-section .full-text p {
    margin-bottom: 30px;
}

/* residency section */
.slider-overlay-section.reversed .text-col { margin-left: auto; background: rgb(255 255 255 / 90%); }
.slider-overlay-section.reversed .images-slider .owl-dots { left: 0; right: unset; }
/* icd section */
.icd-section h2 { text-align: left; }

.icd-section .two-col-container .img-col .img-wrap {display: flex;justify-content: flex-end;}
/* marina new section */
.slider-overlay-section.marina-section .text-col { background: rgb(255 255 255 / 85%); }

/* location */
.location-section .map { margin-bottom: 50px; }
.location-section .map img { width: 100%; }

.location-section .minutes { margin: 35px 0; display: flex; flex-wrap: wrap; gap: 60px; }
.location-section .minutes .min { width: calc((100% - 60px * 3) / 4); max-width: fit-content; }
.location-section .minutes .min p { margin-bottom: 0; }
.location-section .minutes .min h5 { font-size: 26px; line-height: 1em; margin-bottom: 2px; }
.location-section .qr-code { margin-top: 60px; }
.location-section .qr-code img { margin-bottom: 16px; width: 90px; height: 90px;}
.location-section .qr-code p {font-size:14px; margin-bottom: 0;}
.location-section .button { background: #303C4214; color: #303C42; border-color: #303C42;}
.location-section .button::after{ content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23303C42'><path d='m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z'/></svg>"); }
.location-section { background: #9CADB7; padding: 0; }
.location-section h2,.location-section p { color: #303C42; }
.location-section  .slider-col { width: 50%; }
.location-section  .text-col { width: calc(100% - 80px - 50%);padding: 50px 0 50px 4%; }
.location-section #map { width: 100%; height: 450px; }
footer{height: 30px; background-color: var(--footer-color);}
/* Modal  */
.modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: var(--overlay-color); z-index: 9999; justify-content: center; align-items: center; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); }
.modal-overlay.active { display: flex; }
/* Modal box */
.modal { max-width: 600px; width: 90%;  animation: slideIn 0.3s ease;height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center; position: relative; }
/* Animation */
@keyframes slideIn {
  from {
    transform: translateY(-40px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.closeModal {
  position: absolute;
  right: 15px;
  top: 10%;
  font-size: 25px;
  cursor: pointer;
  z-index: 10;
  color: white;
}
.modal button[type="submit"] {
  display: block;
  margin: 0 auto;
color: var(--button-text-color);
    border: 1.5px solid var(--button-text-color);
    cursor: pointer;
    background: transparent;
}
.modal h2{
    color: white;
    text-align: center;
}

.modal h2 span.lowercase {
  text-transform: lowercase !important;
  font-size: 30px;
  line-height: 1em;
  color: white;
}

/* Chrome autofill override */
 input:-webkit-autofill,
 input:-webkit-autofill:hover,
 input:-webkit-autofill:focus,
 input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px var(--field-background) inset !important; /* autofill background */
  -webkit-text-fill-color: white !important; /* text color */
  caret-color: white; /* cursor color */
  transition: background-color 5000s ease-in-out 0s; /* prevents flash */
}
.modal .iti--inline-dropdown .iti__country-list{
    background:var(--overlay-color);
  color: white;
}
.modal .iti__dial-code,.modal .iti__country-name{
    color: white
}
.modal .iti__search-input{
     background:var(--overlay-color);
  color: white;
}
.modal .iti__arrow {
      border-top: var(--iti-arrow-height) solid white !important;
    }
    .modal .iti__arrow--up{
        border-bottom: 0;
    }

/* ar */
.ar .main-form .form-container .usps{direction: rtl;}
.ar .main-form .form-container .field-wrap input { text-align: right;}
.ar .main-form .form-container .iti__country-container { right: 0; left: unset; }
.ar .iti__selected-country-primary { padding: 0 var(--iti-spacer-horizontal) 0 var(--iti-arrow-padding); }
.ar .iti__arrow { margin-right: var(--iti-arrow-padding); margin-left: 0; }
.ar .main-form .form-container input.iti__tel-input { direction: rtl; text-align: right; padding-left: 0 !important; padding-right: 45px; }
.ar .text-col,.ar h2 { direction: rtl; }
.ar h1,.ar h2,.ar h3,.ar h4,.ar h5,.ar h6,.ar strong,.ar .button,.ar button{font-family: var(--ar-bold-font);}
.ar .slider-col .images-slider .owl-nav button.owl-next { transform: rotate(180deg); } 
.ar .slider-col .images-slider .owl-nav button.owl-prev { transform: none; }
.ar .two-col-container { direction: rtl; margin-left: auto; margin-right: 0; }
.ar .two-col-container.reversed { margin-left: 0; margin-right: auto; }
.ar .hero-section #language-selector a{font-family: var(--en-bold-font);}

/* responsive */
@media  screen and (min-width:981px) {
    /* slider-resp */
    .card-section .slider-wrapper.desk-disabled{width: 92%; margin-right: auto; margin-left: auto;}
    .card-section .slider-wrapper.desk-disabled .owl-stage .owl-item:last-child { margin-right: 0 !important; }
    .card-section .slider-wrapper.desk-disabled .owl-stage .owl-item { width: calc((100% -  10px * 3)/ 4) !important; }
    .card-section .slider-wrapper.desk-disabled .owl-stage .owl-item .card { width: 100%; }
}
@media screen and (min-width:769px) {
    
    .projects-section .owl-stage{transform: unset !important;}
    
    /* .about-section .container, .location-section .container { padding-left: 40px; } */
    .card-section .slider-wrapper .card .text-wrap{min-height: 198px;}
    .two-col-container.reversed { margin-left: auto; margin-right: 0; }

    .icd-section .two-col-container { gap: 100px;  }
    .icd-section .two-col-container .text-col { width: 45%; }
    .icd-section .two-col-container .img-col { width: calc(100% - 45% - 150px); }
    .about-section .usps-icons-row .icon { max-width: fit-content; }
    .location-section .two-col-container { margin-left: auto; }
    .hero-section #hero-slider{position: absolute;}
    .hero-section { padding: 54px 0 ; }
    .hero-section .submit {color: var(--form-cta-color); background: var(--form-cta-bg);border: 1.5px solid #FFFFFFCC;border-radius: 4px;display: inline-flex; justify-content: center; align-items: center; font-size: 18px; height: 50px;}
    .hero-section .submit::after { top: 0px; padding-left: 5px; content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23005775'><path d='m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z'/></svg>"); }
    .hero-section .field-wrap .error{color: #FFC2C2;font-size: 10px; line-height: 1.8em;right: 8px;}
    .hero-section .iti__arrow { border-top-color: white;}

    


}
@media screen and (min-width:668px) {
    .usps-icons-row .icon .pp-desc div:first-child { width: 56%; }
    .usps-icons-row .icon .pp-desc div:last-child { width: calc(100% - 56% - 30px); }
    .about-section .usps-icons-row .icon:last-child { width: 75%;max-width: 628px;justify-content: center; }

}
@media screen  and (max-width:1280px){
    .usps-icons-row { max-width: 100%; }
    .usps-icons-row .icon { padding: 15px 20px; gap: 10px; flex-wrap: wrap; }
    .usps-icons-row .icon .text-wrap { width: calc(100% - 65px - 10px);  }
    .usps-icons-row .icon .img-wrap { width: 65px; }
    .amenities-section .amenities { gap: 20px 10px; }
    .amenities-section .amenities .icon { width: calc((100% - 10px * 2) / 3); }
    .slider-overlay-section .text-col { padding: 80px 4%  60px 4%; }

}
@media screen and (max-width:1167px){
    .two-col-container,.slider-overlay-section .two-col-container { gap: 40px; }
    /* .two-col-container .text-col,.slider-overlay-section .two-col-container .text-col { width: calc(100% - 40px - 45%); } */
    /* .why-invest-section .icons { gap: 15px 25px; }
    .why-invest-section .icons .icon { width: calc((100% - 25px * 3) / 4); } */
    .two-col-container .slider-col { width: 45%; }

    /* minutes */
    .location-section .minutes { gap: 50px; }
    .location-section .minutes .min { width: calc((100% - 40px * 3) / 4);}

    .icd-section .container .img-col { width: calc(100% - 45% - 100px); }
    .location-section .text-col { width: calc(100% - 40px - 50%); }
    .location-section .slider-col { width:50%; }
  

}

@media screen and (max-width:1024px) {
  .usps-icons-row .icon { width: calc((100% - 25px ) / 2); }
}
@media screen and (max-width:980px){
    .card-section .slider-wrapper .card{ width: calc(90.3vw / 3); }
    .about-section .usps-icons-row .icon:last-child{width: 100%;}

}
@media screen and (max-width:768px) {
    .container { width: 90%; }

    /* .hero-section{padding: 0;} */
    .desktop,.owl-carousel .owl-item img.desktop { display: none; }
    .mobile ,.owl-carousel .owl-item img.mobile{ display: block; }
    .main-form .form-container { background: var(--form-mob-bg-color); padding: 35px 0 35px; }
    .main-form { max-width: unset; width: 100%; }
    .hero-section #language-selector a { background: var(--button-text-color); color: var(--lang-selector-color); }

    /* about  */
    #about-slider,.introduction-section .images-slider{margin-bottom: 35px;}
    #language-selector { position: absolute; top: -40px; right: 0; }

    .two-col-container .slider-col,.slider-overlay-section .two-col-container .slider-col { width: 100%; }
    .two-col-container .text-col,.slider-overlay-section .two-col-container .text-col { width: 90%; margin: auto; }
    .two-col-container { max-width: 100%; }
    /* .amenities-section .two-col-container { flex-direction: column-reverse; } */

    .location-section .minutes .min { width: calc((100% - 50px ) / 2); max-width: unset; }
    .location-section .minutes { max-width: 460px; }
    .location-section .map { margin-bottom: 36px; }

    /* projects */
    .projects-section .cards{width: 95%; margin-right: 0;}
    .projects-section .owl-stage { display: flex; min-width: 100%; }
    .projects-section  .card {width:calc(85vw / 2);}
    .payment-section .image-wrap{width: 100%;}

    .card-section .slider-wrapper .card{ width: calc(85vw / 2); }
     .card-section .slider-wrapper .card .text-wrap { padding: 25px 20px; }
    .card-section .slider-wrapper .card .text-wrap p { margin-top: 10px; }

    .floating-logo { top: 10px; width: 60px; height: 60px; }

    .full-slider-text-section .full-text p{max-width: 100%;}

    .two-col-container.reversed{flex-direction: column-reverse;}
    .two-col-section h2 ,.two-col-container .text-col p{text-align: center;}
    .hero-section .usps * { text-align: center; }
    .hero-section .logo-wrap { width: 61%; margin-left: auto; margin-right: auto; }
    .hero-section * { color: var(--mob-usps-color);}
    .hero-section .form-container{background: var(--form-mob-bg-color);width: 100%; max-width: unset;padding: 40px 8px;}
    .hero-section .field-wrap input{background: var(--main-form-field-bg-mob); color: var(--main-form-mob-input-color);}
    .hero-section .field-wrap input::placeholder{color: var(--main-form-placeholder-color-mob);}
    .hero-section .form-container form{padding: 0 22px;}
    .hero-section .form-container input:-webkit-autofill,
    .hero-section .form-container input:-webkit-autofill:hover,
    .hero-section .form-container input:-webkit-autofill:focus,
    .hero-section .form-container input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 1000px var(--main-form-field-bg-mob) inset !important; /* autofill background */ -webkit-text-fill-color: var(--main-form-mob-input-color) !important; /* text color */ caret-color: white; /* cursor color */ transition: background-color 5000s ease-in-out 0s; /* prevents flash */ }
    .hero-section h1{margin: 0 auto 10px ;}
    .hero-section .container{width: 100%; position: static;}
    .hero-section .form-container .logo-wrap { position: absolute; top: 30px; margin: auto; left: 0; right: 0; }
    .hero-section { padding: 0; }
    .hero-section .submit{color: rgba(255, 255, 255, 1);}

    h1 { font-size: 26px; }
    .hero-section .usps p { font-size: 18px;margin-bottom: 1.6rem; }
    .dh-symbol { height: 13px; margin-left: 1px; }
    .dh-symbol.desktop{display: none;}
    .dh-symbol.mobile{display: inline-block;}
    .button{font-size: 18px;}
    h2{font-size: 25px; margin-bottom: 25px;}
    h3.subheading { margin-bottom: 25px; margin-top: -25px; font-size: 16px; }
    .slider-overlay-section .images-slider { position: relative; top: unset; height: auto; }
    .slider-overlay-section .images-slider .owl-dots { max-width: 100%; }
    .slider-overlay-section .text-col { padding: 25px 0 0; }
    p{font-size: 16px; margin-bottom: 15px;}
    .card-section .slider-wrapper .card .text-wrap h4 { font-size: 18px; }
    .card-section .slider-wrapper .card .text-wrap p { font-size: 16px; }
    .slider-overlay-section.reversed { padding: 40px 0; }
    section { padding: 40px 0; }
    .icd-section .two-col-container .img-col .img-wrap { justify-content: center; max-width: 400px; margin: auto; width: 90%; }
    .location-section { padding-top: 40px; }
    .location-section .text-col { padding: 0; width: 90%; }
    .location-section .button { margin: auto; display: flex; width: fit-content; }
    .icd-section { background: #ECEEEF; }
    .location-section #map { height: 340px; }
   
    .amenities-section .two-col-container .text-col { width: 100%; padding: 40px 5%; background-color: unset; }
    .slider-overlay-section.reversed .text-col{background-color: unset ;}
    .why-invest-section .full-text p { margin-bottom: 25px; }

    /* marina section */
    .marina-section { background: #ECEEEF; }
}

@media screen and (max-width:667px) {
    .usps-icons-row .icon { width: 100%; max-width: 400px; }
    .about-section .usps-icons-row .icon{width: 100%; max-width: 430px;}
    .usps-icons-row .icon .pp-desc { gap: 25px; }
    .usps-icons-row .icon .pp-desc div:first-child:after { height: 1px; bottom: -12.4px; top: unset; left: 0; width: 80px; }


}

@media screen and (max-width:580px){
    /* .projects-section .card { width: 78vw; } */
     .amenities-section .amenities .icon { width: calc((100% - 20px) / 2); }
    .amenities-section .amenities { justify-content: center; gap: 20px;max-width: 400px; margin: auto; }
}
@media screen and (max-width:480px) {
    /* slider-resp */
    .card-section .slider-wrapper .card{ width: 59vw; }
    button, .button{padding: 13px 18px;}

}

@media screen and (min-width:769px) {
    main{
        /* background: url(../images/Full\ BG.png); background-repeat: no-repeat; background-size: cover; background-attachment: fixed; */
        background-color: #F7F7F7;
    }
}
@media screen and (max-width:768px) {
    /* body{background: url(../images/Mobile\ BG.png); background-repeat: no-repeat; background-size: cover; background-attachment: fixed;} */
    body{
        background-color: #F7F7F7;
    }
    
}