@font-face {
  font-family: 'open_sansitalic';
  src: url('fonts/opensans-italic-variablefont_wdthwght-webfont.woff2') format('woff2'),
       url('fonts/opensans-italic-variablefont_wdthwght-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;

}




@font-face {
  font-family: 'open_sansregular';
  src: url('fonts/opensans-variablefont_wdthwght-webfont.woff2') format('woff2'),
       url('fonts/opensans-variablefont_wdthwght-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;

}


#sgcc-fab{ left:auto !important; right:16px !important; }

 
html, body { overflow-x: hidden; }
 
* {
  font-family: 'open_sansregular';
  margin:0;
  padding:0;
  box-sizing: border-box;
}
p{
  text-align: justify;
  line-height: 1.5em;
  font-size: 1.2rem;
}
html {
  scroll-behavior: smooth;
}
body{
 
  max-width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  overflow-x: hidden;
}
header#main-header{
  background: transparent;
 width:100%;
 position: fixed;
  left: 0;
  top: 0rem;
  z-index: 9999;
 
 

}
header#main-header .containerheader{
  
 position: relative;
  z-index: 9999;
  display: grid;
 
  width: inherit;
  grid-template-columns: repeat(3, 1fr);
  text-align: center;
 

}
#lc_text-widget,.lc_text-widget--bubble{
 
  right: 27px !important;
  bottom: 100px !important;
}
#main-header a { 
text-decoration: none;
}
#main-header a#main-logo {
  position: relative !important;
    top: 0.2rem !important;
    text-align: center;
}
#main-header a#main-logo img {
  height: 65px;
  width: auto;
}
#main-header a.startbuild{
  align-self: center !important;
  justify-self: flex-start;
 
  position: relative;
  left: 2rem;
}
/* Cookie Bar */
#cookie-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #333;
  color: #fff;
  padding: 10px 20px;
  text-align: center;
  font-size: 14px;
  z-index: 1000;
}

#cookie-bar a{
  text-decoration:underline;
  color: #CFA353;
  font-weight: bolder;
  padding-bottom:0.4rem;
}
#cookie-bar button {
  background-color: #CFA353;
  color: #fff;
  border: none;
  padding: 10px 10px;
  margin-left: 10px;
  cursor: pointer;
  border-radius: 5px;
  font-size: 14px;
}

/* Modal Styling */
#cookie-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 20px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  z-index: 1100;
  border-radius: 5px;
  width: 90%;
  max-width: 400px;
  display: none;
 
}

.modal-content h3 {
  margin-bottom: 15px;
  font-size: 2rem;
  color:#0F1125;
  font-family: 'playfair_display_scregular';
}

.modal-content label {
  display: block;
  margin-bottom: 10px;    font-size: 1rem;
}
*{
font-family: 'open_sansregular';
}
body{
font-family: 'open_sansregular';
}
#save-preferences {
  background-color: #CFA353;
  color: #fff;
  border: none;
  padding: 10px 10px;
  margin-left: 10px;
  cursor: pointer;
  border-radius: 5px;
  font-size: 14px;
}
#mainslickslider  .slick-slide {
 
  height: 100vh !important;
 
}

/* MENU HOVER */
.mobile_menu_bar::after, .et_toggle_slide_menu::after{
  color: #FFF;
}
body #page-container .et_slide_in_menu_container {
  background: #CFA353;
}
.et_menu_containernONE{
  background-color: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(8px);
  will-change: backdrop-filter;
  z-index: 99999999999;

}
.et_menu_containernONE .logo_container a img {
 transform:scale(0.8);
 scale:0.8;
}
.home-menu a.homemenuacolor,#et-info-phone a.homemenuacolor  {
  color:#FFF  ;
} 

.et_fixed_nav #main-header {
  
  z-index: 99999;
}

.mobile_menu_bar.homemenuacolor::before {
  color:#0F1125 !important;
}

.mobile_menu_bar {
  left: 143px;
  top: -45px;
}


/** testimonials ***/

#testimonialspage{

  width:100%;
  display: block;
  height: 500px;
  margin-block:0rem;
  padding-block:4rem;

}
#testimonialspage_inside{
width:90%;
margin:0 auto;
display: grid;
grid-template-columns: repeat(2,1fr);
gap:2rem;
}
#testimonialspage_inside h3{
font-size: 3rem;
  }
  
  #testimonialspage_inside ul{
      display: flex;
      gap: 3rem;
      list-style: none;
      padding: 0;
}

#testimonialspage_inside ul li{
  display: flex;
  flex-direction: row;
      gap: 1rem;
      justify-content: center;
      align-items: center;
  
}
#testimonialspage_inside ul li img{
 
  border-radius: 50%;
  border: 4px solid #CFA353;
}
/** end testimonials **/

/** Customer Say **/

#customersay{

  width:100%;
  display: block;
  height: auto;
  background-color: #F6F6F6;
 
  padding-block:5rem;
}
#customersay_inside{
  width:90%;
margin:0 auto;
display: block;
text-align: center;
 
 
gap:2rem;
}
#customersay_inside h3{
  font-size:4rem;
  text-align: center;
  padding: 0;
  margin-block: 1rem;
}
#customersay_inside p{
font-size: 1rem;
color:gray;
margin:0 auto;
width:50%;
text-align: center;

}
 

.tabs {
  position: relative;
  display: flex;
  border-bottom: 2px solid transparent;
  width: 500px;
  margin: 0 auto;
  justify-content: space-between;
  background-color: white;
  padding: 1rem;
  border-radius: 2.5rem;
  padding-inline: 4rem;
}
.tab:hover {
  color: #CFA353;
}
.tab {
  padding: 10px 3rem;
  cursor: pointer;
  position: relative;
  color: #333;
  font-weight: 500;
}

.tab:hover {
  color: #CFA353;
}

.underline {
  position: absolute;
  bottom: 12px;
  left: 0;
  height: 3px;
  width: 0;
  background: #CFA353;
  transition: all 0.3s ease;
}

.tab-content {
  margin-top: 20px;
  display: none;
}

.tab-content.active {
  display: block;
 
}



.video-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  width: 90%;
  max-width:1800px;
  margin: 0 auto;
  margin-top:3rem;
}

.video-wrapper {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 aspect ratio */
  background: #000;
  overflow: hidden;
  border-radius: 8px;
}

.video-wrapper video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: none;
}

.play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* background-color: rgba(0, 0, 0, 0.6); */
  border: none;
  /* border-radius: 50%; */
  /* padding: 20px; */  
  cursor: pointer;
  background-color: transparent;
  z-index: 1;
}
 
.stop-button {
  display: none; /* Hidden by default */
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 30px;
  height: 30px;
  background: rgba(255, 255, 255, 0.85);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  z-index: 2;
 
  align-items: center;
  justify-content: center;
}

.stop-button::before {
  content: "■"; /* Or ❚❚ */
  font-size: 16px;
  color: #000;
}

.expand-button {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(0, 0, 0, 0.6);
  border: none;
  color: #fff;
  font-size: 18px;
  padding: 6px;
  border-radius: 4px;
  cursor: pointer;
  z-index: 2;
}

/* Modal styles */
.modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.8);
}

.modal-content {
  position: relative;
  margin: 5% auto;
  width: 80%;
  max-width: 900px;
  background: #000;
  padding: 0;
  border-radius: 8px;
  overflow: hidden;
}

#modal-video {
  width: 100%;
  height: auto;
}

.modal-close {
  position: absolute;
  top: 10px;
  right: 15px;
  color: white;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
}

.expand-button {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(0, 0, 0, 0.6);
  border: none;
  padding: 6px;
  border-radius: 4px;
  cursor: pointer;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
}

.expand-button svg {
  width: 20px;
  height: 20px;
  fill: white;
}

.expand-button:hover {
  background: rgba(0, 0, 0, 0.85);
}


/** end customer say **/

/* PROJECT PAGE **/

.featured_projects{
  display: grid;
  grid-template-columns: 60% 40%;
  gap:2rem;
  width: 90%;
  height:auto;
 
  margin:0 auto;
  margin-block:7rem;

}

.featured_projects a{
text-decoration: none;
color:black;

}
.featured_projects div.pleft{
 width: 100%;
 height: 100%;
}
.featured_projects div.pleft img{
  width: 100%;
  height: 100%;
  max-height: 500px;
  object-fit: cover;
  border-radius: 1rem;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
 }
.featured_projects div.pright{
  display: flex;
  flex-direction: column;
 justify-content: center;
 align-items: flex-start;
 gap:1rem;
  
}
.textleft{
  text-align: left;
}
.featured_projects div.pright h2{
font-size: 4rem;
font-weight: bold;
color:black;

  
}
.featured_projects div.pright p{
 
  color:rgba(0,0,0,0.8);
  
    
  }
.reverseproject{
  direction: rtl; /* reverse content visually */
}


#gridfeatured{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid:3rem;
  width:90%;
  margin:0 auto;
  box-sizing: border-box;
}
#gridfeatured div{
 padding:2rem 2rem 2rem 0;
 box-sizing: border-box;

}
#gridfeatured div:nth-child(even) {
  margin-top: 6rem;
}

#gridfeatured div a > h2{
font-size: 2.6rem;
}
#gridfeatured div a  {
color:black;
  }
#gridfeatured div a > img{
  box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
  width:96%;
  height: 800px;
  object-fit: cover;
  border-radius: 0.5rem;

 }

 #divide2grid{
	display:grid;
grid-template-columns: 30% 70%;	
gap:2rem;
}
#divide2grid div{
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: baseline;
 gap:1rem;
 height: 100%;

}
.dividerleft{
position: relative;
}
.dividerleft::after{
content:'';
position: absolute;
right:0;
top:20%;
 
  border-right:1px solid gray;
  height: 50%;
}
#divide2grid div h4{
 font-size: 3rem;
 color:black;
 }

.portfolio-single  h2{
  font-size: 2rem;
  color:black;
  margin-block: 2rem 1rem;
  }
 .infinite-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
  grid-auto-rows: 300px;
  gap: 1rem;
  width: 100%;
  margin: 2rem auto;
}

.grid-item {
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  position: relative;
}

.grid-item img {
  width: 100%;
  height: 100%;
  object-position: center;
  object-fit: cover;
  display: block;
}

/* Span variations */
.span-1 {
  grid-row: span 1;
}

.span-2 {
  grid-row: span 2;
}

/** END PROJECT PAGE **/

@media only screen and (min-width: 981px) {
  #logo {
    max-height: 55%;
    position: relative;
    top: -10px;
    left: -30px;
  }
 
}



.home-menu {
  position: relative;
  top: 30px;
  text-align: right;
  display: flex;
    justify-content: flex-end;
    right: 6rem;
}

#gallerysection{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap:1rem;
  width: 100%;
  height: auto;
padding:7rem 0 0 0;
  background: white;


}
#gallerysection h2{
width:100%;
  font-size:3.5rem;
  color:black;
  /* font-family: 'playfair_display_scregular'; */
  line-height: 1em;
  text-align: center;
  padding-bottom: 0;
  margin-bottom: 0;
}
#gallerysection p {
  display: block;
  padding-bottom: 0;
  margin-bottom: 1rem;
  width: 80%;  
  color: rgba(0, 0, 0, 0.85);
}

#gallerysection p:last-of-type {
 
  margin-bottom: 4rem; 
  
}
.bkg-gradient{
  display: none!important;
}
.home-menu {

  color: rgba(255, 255, 255, 1);
}
.home-menu.hoveredhm {

  color: black;
}
#gallerysectioninside{
  width: inherit;
}
.gallery-lightbox{
  height:auto;
  display: grid;
  gap: 10px;


  grid-template-areas:
  "a1 a2"
  "a3 a4"
  "a5 a6"
  "a7 a8";


width:100%;
}

#a1 {
  grid-area: a1;
  height: 600px;
  overflow:hidden;
}
#a1  img{
width:100%;
object-fit: cover;
height: 100%;

}

#a2 {
  grid-area: a2;
  height: 600px;
}
#a2  img{
width:100%;
object-fit: cover;
height: 100%;

}

#a3 {
  grid-area: a3;
  height: 600px;
}
#a3  img{
width:100%;
object-fit: cover;
height: 100%;

}

#a4 {
 grid-area: a4;
 height: 600px;
}
#a4  img{
width:100%;
object-fit: cover;
height: 100%; 
}
#a5 {
  grid-area: a5;
  height: 600px;
 }
 #a5  img{
  width:100%;
  object-fit: cover;
  height: 100%;
  
   }
 #a6 {
  grid-area: a6;
  height: 600px;
  overflow:hidden;
}
#a6  img{
width:100%;
object-fit: cover;
height: 100%;

}

 #a7{
  grid-area: a7;
  height: 600px;
}
#a7  img{
width:100%;
object-fit: cover;
height: 100%;

}
 #a8{
  grid-area: a8;
  height: 600px;
  overflow:hidden;
}
#a8  img{
width:100%;
object-fit: cover;
height: 100%;

}

 #a9 {
  grid-area: a9;
  height: 500px;
  overflow:hidden;
  display: none;
}
#a9  img{
width:100%;
object-fit: cover;
height: 100%;

}



#lightcase-info   {
  width: 100%;
  display: block;
  text-align: center !important;
}
#lightcase-info #lightcase-sequenceInfo {

  display: block;
  text-align: center !important;
}
#lightcase-info #lightcase-title {

  display: block  ;
  text-align: center !important;
}
/* OUR FEATURED **/


section#ourfeatured{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap:0rem;

   width: 100%;
   height: auto;
   margin:0rem auto;
}
section#ourfeatured  #ourfeaturedinsideLeft  {
background-color: #EFEFEF;

  padding: 6rem 4rem;
  box-sizing: border-box;
}
section#ourfeatured  #ourfeaturedinsideLeft  p {
text-align: justify;
display: block;
margin-bottom:5rem;
 }
 

section#ourfeatured  #ourfeaturedinsideLeft h2{
  width: 100%;
  font-size: 3rem;
  color: #0F1125;
  /* font-family: 'playfair_display_scregular'; */
  line-height: 1em;
  text-align: left;
  margin: 8rem 0 2rem 0;


  
}


section#ourfeatured   #ourfeaturedinsideRight  {
width: 100%;
overflow: hidden;
height:auto;

}
section#ourfeatured   #ourfeaturedinsideRight img  {
  width: inherit;
  height: 100%;
  object-fit: cover;
  max-height: 1200px;

}

/*TESTIMONIALS*/
#testimonials{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap:1rem;
box-sizing: border-box;
   width: 100%;
   height: auto;
   padding: 7rem 0;
   background:rgba(0, 0, 0, 0.04);
 
}
#testimonials > h2{
width:100%;
  font-size:3rem;
  color:#000;
  /* font-family: 'playfair_display_scregular'; */
  line-height: 1em;
  text-align: center;
 
  margin:0;
  padding:0;

}
#testimonials > p{
display:block;
margin-bottom: 1rem;
    max-width: 70%;
color:rgba(0,0,0,0.85);
 
  }
#testimonials  #testidivider{
  display: block;
  height: auto;
  width: 100%;
}

#testimonials  #testidivider .testiinsides{
width:80%;
margin:0 auto;
}

#testimonials  #testidivider > div{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  height: auto;
  position: relative;
  width: 100%;
  overflow: hidden;
   }

   #testimonials  #testidivider > div video {
    width: 70vw;
    height: 80vh;
    margin: 0 auto;
    object-fit: cover;
    display: block;
  }
#testimonials  .testiinsides{
  width: 100%;
  margin: auto;

}
#testimonials  .testiinsides .slick-prev {
  left:-30px;
  top: 50%;
  background: url(images/arrow-left-circle.svg) no-repeat center center;
  width: 40px;
  height: 40px;
  background-size: contain;
  z-index: 999999;
  /* filter: brightness(0) invert(1); */
}

#testimonials  .testiinsides .slick-prev {
  left:-0px;
  top:50%;
  background: url(images/arrow-left-circle.svg) no-repeat center center !important;
  width:40px;
  height: 40px;
  background-size: contain;
  z-index: 999999;
  
}
/* #testimonials  .testiinsides   .slick-prev::before,    #testimonials  .testiinsides  .slick-next::before {

  content: '' !important;
} */
#testimonials  .testiinsides .slick-next {
  right: 10px;
     top:50%;
     background: url(images/arrow-right-circle.svg) no-repeat center center !important;
     width:40px;
     height: 40px;
     background-size: contain;
     z-index: 999999;
   
   }

#testimonials  .testiinsides .testibar h3{
  font-size: 1.9rem;
  font-style: normal;
  color: black;
  font-weight: bold;
  margin-bottom:1.5rem;
 
}
#testimonials  .testiinsides .testibar{
  padding: 2rem 4rem 2rem 4rem;
  font-size: 1.5rem;
  display: flex !important;
  flex-direction: column;
  gap:0rem;
  justify-content: center;
  align-items: flex-start;
  height: 300px;
    }
#testimonials  .testiinsides .testibar p{
  font-size: 1.5rem;

  color:rgba(0,0,0,0.85);
  width:70vw;
    }
    #testimonials  .testiinsides .testibar span{
      font-size: 1rem;
    
      color:#F0AB3C;
      width:70vw;
        }
    #testimonials  .testiinsides     .slick-next:before {
      content: '→';
      color: #CFA353;
      font-size: 3rem;

  }
   #testimonials  .testiinsides     .slick-prev:before {
      content: '←';
      color: #CFA353;
      font-size: 3rem;

  }



  /** Vison **/
  #vision{
    display: block;
    width:100%;
    padding-block:7rem;
 
    background: white;
   
  }

  #vision #vision_inside{
    display: grid;
    width:100%;
    grid-template-columns: 50% 50%;
    box-sizing: border-box;
   
  }

  #vision #vision_inside > div{
display: flex;
flex-direction: column;
color:black;
box-sizing: border-box;
   padding:5rem;
   height: 100%;
   justify-content: center;
   align-items: flex-start;
   text-align: left;
  }


  #vision #vision_inside > div .stepcounter{
    display: flex;
    justify-content: baseline;
    align-items: flex-start;
    gap:1rem;
    text-align: left;
 
 }
.colorstep2{
  color:#55B8EB  !important;
}
.colorstep3{
  color:#FAC229 !important;
}
   #vision #vision_inside > div .stepcounter span:nth-child(1){
font-size: 4rem;
font-weight: bold;
color:#5E5E5E;
     
  }

  #vision #vision_inside > div .stepcounter h3{
    font-size: 2rem;
    font-weight: bold;
    color:black;
    margin-bottom:2rem;
         
      }
      #vision #vision_inside > div   p{
        font-size: 1.3rem;
  
        color:rgba(0,0,0,0.65);
        margin-bottom:2rem;
             
          }
  /* MEET THE TEAM */

#meettheteam{
  display: block;
  width:100%;
  padding-block:7rem; 
  background: rgba(0, 0, 0, 0.04);
 
}

#meettheteam .meettheteam_inside{
  display: block;
  width:90%; 
  box-sizing: border-box;
  margin:0 auto; 
  text-align: center;
}
#meettheteam .meettheteam_inside h2{
  display: block;
  width: 100%;
  margin: 0 auto;
  font-size: 3rem;
  color: black;
  margin-bottom: 1.5rem;
}

#meettheteam .meettheteam_inside p{
  display: block;
  width: 100%;
  margin: 0 auto;
  font-size: 1.5rem;
  color: rgba(0,0, 0, 0.8);
}
#meettheteam .meettheteam_inside p:last-of-type{
  margin-bottom:2.5rem;
 

}
#meettheteam   img{
  display: block;
  width: 100%;
  padding: 4rem 0;
 
}

#expert #expert_inside_2{
  width: 100%;
  display: grid;
  grid-template-columns: 50% 50%;
  gap:0.5rem;


}
#expert #expert_inside_2   div  > img{
  width: 100%;
 height:600px;
 min-height: 600px;
 object-fit: cover;


}
#expert #expert_inside_2 p  {
  padding:3rem;
  color:rgba(0,0,0,0.85);
font-size: 1.8rem;
font-weight: 600;
}
#expert #expert_inside_2 ul  {
 
  display: block;
  margin-left: 2rem;
  padding-block: 0rem;
  list-style: none;
 
  padding:0 3rem ;
  box-sizing: border-box;
  margin:0 auto;
 }
#expert #expert_inside_2 ul li{
 

 margin-block: 1rem;
 font-size: 1.4rem;
 ;
 display: flex;
 flex-direction: row;
 justify-content: flex-start;
 align-items: flex-start;
 gap: 1rem;
 color:rgba(0,0,0,0.85);
}
 /***/

 
/*** Expert **/


#expert{
display: block;
width: 100%;
padding:7rem 0;
background: white;
 

}

#expert #expert_inside{
  display: block;
  width: 90%;
  margin: auto;
 
 
  
  }
  #expert #expert_inside h2{
color:black;
font-size: 3.5rem;
   
    
    }

    #expert  #expert_inside p{
      display: block;
 
      margin:1rem auto;
      font-size: 1.5rem;
      color:rgba(0,0,0,0.85);
     
     
      
      }

      #expert  #expert_inside ul{
        display: block;
        margin-left: 2rem;
        padding-block: 2rem;
        list-style: none;
margin :1rem 0 2rem 0;
      }

      
      #expert  #expert_inside ul li{
        margin-block: 1rem;
        font-size: 1.4rem;
        color: rgba(0, 0, 0, 0.85);
        display: flex    ;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 1rem;

      }

      #expert  #expert_inside ul li span{
        color: rgba(0, 0, 0, 0.75);
   font-size: 1.5rem;

      }
/**/
.coloryellowbutton{
  background: #DF9C1E !important;
  
}
.colorblackbutton{
  background: #000 !important;
  
}



 






























  section#theteam{
      display: grid;
      grid-template-columns: repeat(2,1fr);
      gap:0rem;
      background-color: #EFEFEF;
       width: 100%;
       height: auto;
       margin:0rem auto;
       box-sizing: border-box;
    }
    section#theteam  #meetteamleft  {

   
      padding: 4rem 4rem 0 4rem;
      box-sizing: border-box;
  }
  section#theteam #meetteamleft  p {
  text-align: justify;
  display: block;
  margin-bottom:5rem;
     }
     
   
     section#theteam #meetteamleft h2{
      width: 100%;
      font-size: 2.5rem;
      color: #0F1125;
      /* font-family: 'playfair_display_scregular'; */
      line-height: 1em;
      text-align: left;
      margin: 8rem 0 2rem 0;
  
  
      
    }
  
    
    section#theteam  #meetteamright  {
   width: 100%;
   overflow: hidden;
   height: 100%;
   box-sizing: border-box;
   padding:0rem;    
    }
    section#theteam  #meetteamright  img  {
      width: 100%;
      height: 100vh;
      object-fit: cover;
      box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  
    }

    /**CTA FOOTER **/

 #ctafooter{
  display: block; 
  /* background:  url(../images/ctafooter.webp) no-repeat center center ; */
  background-size: cover;
  width:100vw;
  height:auto;
position: relative;
padding-block:6rem;
 }
 #ctafooter #ctafootershadow{
  position: absolute;
  top:0;
  left:0;
  width:100vw;
  height:100%;
  background: rgba(0,0,0,0.7);
  z-index: 99;

 }
 #ctafooter   #ctafootergrid{
  display: grid;
  grid-template-columns: 40% 60%;
  gap:2rem;
  width:100%;
  height: inherit;
  position: relative;
  z-index: 999;


  }

      #ctafooter   #ctafootergridRight{
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items:flex-start;
          gap:1.3rem;
     padding:3rem 7rem;
     height: inherit;
     box-sizing: border-box;
       
          }
          #ctafooter   #ctafootergridRight .ctaibar{
            display: flex;
            flex-direction: row;
            justify-content:flex-start;
            align-items:flex-start;
            gap:1rem;
          
         
            }
            #ctafooter   #ctafootergridRight .ctaibar a{
        text-decoration: none;
        min-width: 300px;
        text-align: center;
            
           
              }
          #ctafooter   #ctafootergridRight h2{
              width: 100%;
              font-size: 3rem;
              color: #FFF;
          
              text-align: left;
              margin: 8rem 0 2rem 0;
           
          position: relative;
          
              
            }

            #ctafooter   #ctafootergridRight h2::after {
              content: '';
              position: absolute;
             left: -35%;
              top: 40%;
              width: 30%;
              height: 1px;
              border-bottom: 1px dashed #a97609;
          }
            #ctafooter   #ctafootergridRight p{
           
              color: #FFF;
              text-align: justify;
              display: block;
              margin-bottom:2rem;
               
          
          
              
            }
          
 /****** end cta footer **/


/*** CTA NESLETTER **/
#newsletter_content {
  display: block;
  width: 100%;
  height: auto;
  padding-block: 5rem;
  background-color: white;
}
#newsletter_content  .iconheader {
   
  justify-content: center;
 
}
#newsletter_content #newsletter_content_inside {
display: grid;
  grid-template-columns: 50% 50%;
  padding: 1rem;
  width: 50%;
  height: auto;
  margin: 0 auto;
    margin-top: 0px;
  border-radius: 2rem;
  margin-top: 3rem;

}
#newsletter_content #newsletter_content_inside_right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 3rem;
  box-sizing: border-box;
  gap: 0rem;
}
#newsletter_content #newsletter_content_inside_right h3 {
  font-size: 2rem;
  font-weight: 700;
  color:black;
  font-family: 'playfair_display_scregular';
}
#newsletter_content #newsletter_content_inside_right h3  span{
  font-size: 2rem;
  font-weight: 700;
  font-family: 'playfair_display_scregular';
}
#newsletter_content #newsletter_content_inside_left{
display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: end;
}

#newsletter_content #newsletter_content_inside_right h4 {
  font-size: 1.5rem;
  font-weight: 500;
 color:#a97609;font-family: 'open_sansregular';
}
#newsletter_content #newsletter_content_inside_right p {
  font-size: 1rem;
  color: rgba(0, 0, 0, 0.6) !important;
}

#newsletter {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  width: 100%;
  box-sizing: border-box;
  margin-top: 2rem;
}
#newsletter input[type=email] {
  width: 100%;
  padding: 1rem;
  display: block;
  border: 1px solid #cccccc;
 
  box-sizing: border-box;  border-radius: 2rem;
}

#newsletter input[type=submit] {
  border: none;
  background-color: #a97609;
  border-radius: 2rem;
  color: white;
  padding: 1rem;
  display: block;
 
  width: 100%;
  box-sizing: border-box;
  font-size: 1rem;
}

@media (max-width: 768px) {
    
    #modelinglanding #modelinglandinginside {
 
    width: 100%;
  
    box-sizing: border-box;
    padding: 1rem;
}
  .home-menu {
   
    display: none;
  }
  #newsletter_content #newsletter_content_inside {
       
      grid-template-columns: 100% !important;
      width:100% !important;
 
  }
  #newsletter_content_inside_left img {
    width: 70% !important;
    max-height: none !important;
    overflow: unset;
    object-position: unset;
    height: auto !important;
    object-fit: contain;
}

#newsletter_content #newsletter_content_inside_left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
}

 @media (min-width: 981px) {
  .et_fullwidth_nav #main-header .container {
 
      height: 80px;
  }
}

@media only screen and (min-width: 981px) {
  #logo {
      position: relative;
      top: 0px;
      left: -20px;
      width: auto;
      max-height: 65px;
      min-height: 65px;
  }
}
#et-info-phone {
  margin-right: 43px;
}

.logoBGreplace{ 
  width: 100px;
  height: auto;    
}


#footersectionsocial{
  background-color: white;
  height: 100px;
  box-sizing: border-box;
  width: 100%; 
  border-top:1px solid #EEE;
}
#footersectionsocialinside{  
  height: inherit;
  box-sizing: border-box;
  width: 100%;
  display: grid;
  grid-template-columns: 50% 50%;
  gap:1.3em; 
  margin:0 auto;
  max-width:1711px;


}
#footersectionsocial #footersectionsocial1{

display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 1rem;
  width: inherit;
  height: 100%;
  position: relative;
  padding-right: 3rem;
  box-sizing: border-box;


}
#footersectionsocial #footersectionsocial1::after {
  content: '';
  position: absolute;
  top: 7px;
  right: 0;
  height: 80%;
  width: 1px;
  border-right:1px dashed #CCC ;

}
#footersectionsocial #footersectionsocial1 h5{
  color: #0F1125;
  font-size: 1rem;
  text-transform: capitalize;
  font-weight: bold;
  margin: 0;
  padding: 0;
  position: relative;
  top: -5px;

  }
#footersectionsocial #footersectionsocial1 ul{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap:2rem;
margin: 0;
  padding: 0;
}
#footersectionsocial #footersectionsocial1 li{
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
}


#footersectionsocial #footersectionsocial1 li a{
text-decoration: none;
}
#footersectionsocial #footersectionsocial2{
 
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 2rem;
    box-sizing: border-box;
    padding-inline: 1rem;
    position: relative;
  }
 
  #footersectionsocial #footersectionsocial2 h5{
      color: #0F1125;
      font-size: 1rem;
      text-transform: capitalize ;
      font-weight: bold;
      margin: 0;
      padding: 0;
      position: relative;
      top: -5px;
      white-space: nowrap;
      }

 
      #footersectionsocial #footersectionsocial2 > #fsocail2{
 
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items:flex-start;
  
          }
          #footersectionsocial #footersectionsocial2 > #fsocail2 a{
text-decoration: none;
color:#0F1125;
          }
          #footersectionsocial #footersectionsocial2 > #fsocail2 span{
       font-size: 1rem;
                          }
  #footersectionsocial #footersectionsocial3{

      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      gap:1rem; 
      }
      #footersectionsocial #footersectionsocial3 h5{
          color: #0F1125;
          font-size: 1rem;
          text-transform: capitalize;
          font-weight: bold;
          margin: 0;
          padding: 0;
          position: relative;
          top: -5px;
          white-space: nowrap;
          }
      #footersectionsocial #footersectionsocial3 #footerforms{
          display: grid;
      grid-template-columns: 60% 40%;
          justify-content: center;
          align-items: center;
      }

      #footersectionsocial #footersectionsocial3 #footerforms input[type=email]{
          border:none;
         width: 100%;
         text-align: center;
         padding:1rem 2rem;
          background-color: rgba(0,0,0,0.06);
      }
      #footersectionsocial #footersectionsocial3 #footerforms input[type=submit]{
border:none;
width: 100%;
text-align: center;
padding-block:1rem;
background-color: #0F1125;
color:#FFFF;
      }
#footersection{
  background-color: #F8F8F8;
  height:auto;
  box-sizing: border-box;
  width: 100%;
}

#footersection #footersectiongrid{
  display: grid;
  grid-template-columns: 30% 25% 15% 15% 15%;
  gap:1rem;
  width:90%;
  margin:0 auto;
  box-sizing: border-box;
  padding-block:3rem;
  max-width:1711px;
}

#footersection #footersectiongrid #fg1{


margin:0;
padding:0;
}
#footersection #footersectiongrid #fg1inside{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap:1.2rem;
margin:0;
padding:0;
}

#footersection #footersectiongrid #fg1inside h3{
  width: 100%;
  font-size: 1.7rem;
  color: #0F1125;
  /* font-family: 'playfair_display_scregular'; */
  line-height: 1em;
  text-align: left;
  text-transform: uppercase;
 margin:2rem 0 0rem 0;
 padding: 0;

position: relative;
}
#footersection #footersectiongrid #fg1inside p{
text-align: justify;
font-size: 0.8rem;
line-height: 1.5em;
}

#footersection #footersectiongrid #fg2{

height: 100%;
  margin:0;
  padding:0;
}
#footersection #footersectiongrid #fg2inside{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
height: inherit;

}

#footersection #footersectiongrid #fg3{

  height: 100%;
     margin:0;
     padding:0;
   }
   
#footersection #footersectiongrid #fg3inside{
  display: flex;
  flex-direction:column;
  justify-content:baseline;
  align-items: start;
  height: inherit;
   }
   #footersection #footersectiongrid #fg3inside h5{
      width: 100%;
      font-size: 1.5rem;
      color: #0F1125;
 
      line-height: 1em;
      text-align: left;
      text-transform: uppercase;
  display: block;
  margin-bottom:2rem;
     padding: 0;
   
  position: relative;
       }
       #footersection #footersectiongrid #fg3inside ul li a{
        text-align: left;
        text-decoration: none;
        font-size: 1.2rem;
          color: #0F1125;
         
           }


           #footersection #footersectiongrid #fg2{

height: 100%;
  margin:0;
  padding:0;
}
#footersection #footersectiongrid #fg2inside{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
height: inherit;

}

#footersection #footersectiongrid #fg3{

  height: 100%;
     margin:0;
     padding:0;
   }
   
#footersection #footersectiongrid #fg3inside{
  display: flex;
  flex-direction:column;
  justify-content:baseline;
  align-items: start;
  height: inherit;
   }
   #footersection #footersectiongrid #fg3inside h5{
      width: 100%;
      font-size: 1.2rem;
      color: #0F1125;

      line-height: 1em;
      text-align: left;
      text-transform: uppercase;
  display: block;
  margin-bottom:2rem;
     padding: 0;
   
  position: relative;
       }
       #footersection #footersectiongrid #fg3inside ul li a{
        text-align: left;
        text-decoration: none;
        font-size: 0.8rem;
          color: #0F1125;
         
           }



           #footersection #footersectiongrid #fg5{

              height: 100%;
                 margin:0;
                 padding:0;
               }
               
            #footersection #footersectiongrid #fg5inside{
              display: flex;
              flex-direction:column;
              justify-content:baseline;
              align-items: start;
              height: inherit;
               }
               #footersection #footersectiongrid #fg5inside h5{
                  width: 100%;
                  font-size: 1.2rem;
                  color: #0F1125;
                
                  line-height: 1em;
                  text-align: left;
                  text-transform: uppercase;
              display: block;
              margin-bottom:2rem;
                 padding: 0;
               
              position: relative;
                   }
                   #footersection #footersectiongrid #fg5inside ul li a{
                    text-align: left;
                    text-decoration: none;
                    font-size: 0.8rem;
                      color: #0F1125;
                     
                       }




                       #footersection #footersectiongrid #fg4{

                          height: 100%;
                             margin:0;
                             padding:0;
                           }
                           
                        #footersection #footersectiongrid #fg4inside{
                          display: flex;
                          flex-direction:column;
                          justify-content:baseline;
                          align-items: start;
                          height: inherit;
                           }
                           #footersection #footersectiongrid #fg4inside h5{
                              width: 100%;
                              font-size: 1.2rem;
                              color: #0F1125;
             
                              line-height: 1em;
                              text-align: left;
                              text-transform: uppercase;
                          display: block;
                          margin-bottom:2rem;
                             padding: 0;
                           
                          position: relative;
                               }
                               #footersection #footersectiongrid #fg4inside a{
                                text-align: left;
                                text-decoration: none;
                                font-size: 0.8rem;
                                  color: #0F1125;
                                 
                                   }
#footerbottom{
  display: flex;
  width: 90%;
  margin: 0 auto;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding-block: 1rem;
  border-top: 1px solid #CCC;
  max-width:1711px;
}

#footerbottom ul{
  display: flex;
  margin: 0 auto;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-end;
  text-align: right;
  gap: 1rem;
  width: 100%;
}

#footerbottom ul li{
list-style: none;

}
#footerbottom ul li a{
text-decoration: none;
font-size: 0.8rem;
  color:#0F1125;
 }
 #footerbottom h6{
  text-decoration: none;
  font-size: 0.8rem;
      color:#0F1125;
      white-space: nowrap;
      padding: 0;
     }


     /* CONTACT US **/

     #fullscreenpagesubpage{
     
      height: 75vh;
      width: 100vw;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
    
      position: relative;
     }
     #fullscreenpagesubpage  #fullscreenpagesubpageShadow{
      position: absolute;
      top:0;
      left:0;
      width:100vw;
      height: 75vh;
      background: rgba(0,0,0,0.65);
      z-index: 99;
     }
     #fullscreenpagesubpage #centerdetails { 
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align: center;
   position: relative;
z-index: 999;
     }
     #fullscreenpagesubpage #centerdetails h1{
      width: 100%;
      font-size: 5rem;
      color: white;
   
      line-height: 1em;
      text-align: center;
      text-transform: uppercase;
      margin-bottom: 2rem;
      padding: 0;
      position: relative;
     }

     #fullscreenpagesubpage #centerdetails h3{
      
        font-size: 2rem;
        color: white;
        font-family: 'open_sansregular';
        font-weight: normal;
    
     }

     #contactusform{
      display: flex;
      flex-direction:column;
      justify-content:center;
      align-items: center;
      gap:1rem;
      height: auto;
      box-sizing: border-box;
      margin-block:6rem;
  
     }
     #contactusform p{
      width:50%;
      text-align:center;

}

#contactusform  #mainbuttons{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap:2rem;
  margin-block:3rem;
  list-style: none;

}
     #contactusform h2{
      color: #0F1125;
 
      font-size: 3.5rem;
      margin-top: 0rem;
      margin-bottom: 0;
      padding-bottom: 0;

     }
     #contactusform #formsgrid {
      display: grid;
      grid-template-columns: repeat(2,1fr);
      gap:2rem;
      width: 1200px;
      margin:0 auto;

      margin-top:2rem;
      margin-bottom:3rem;


     }

     #contactusform #formsgrid  #formsgridleft{
display: flex;
flex-direction: column;
justify-content: baseline;
align-items: last baseline;
gap:1.5rem;
font-size: 1rem;
     }
     #contactusform #formsgrid  #formsgridleft .groupform,  #contactusform #formsgrid  #formsgridright .groupform{
  display: block;
  width: 100%;
             }
     #contactusform #formsgrid  #formsgridleft select,   #contactusform #formsgrid  #formsgridleft input[type=text],  #contactusform #formsgrid  #formsgridleft input[type=email]{
padding:1rem;
border:1px solid #DDD;
width:100%;
     }

     #contactusform #formsgrid  #formsgridright{
      display: block;
      width:100%;
margin:0;
padding:0;
     }
     #contactusform #formsgrid  #formsgridright iframe{
      display: flex;
      position: relative;top:-80px;
      left:40px;

     }
     #contactusform #formsgrid  #formsgridright input[type=text]{
      padding:1rem;
      border:1px solid #DDD;
      width:100%;
             }

             #contactusform input[type=submit]{
              text-decoration: none;
color: white;
background-color: #CFA353;
border: 1px solid #CFA353;
font-size: 1rem;
box-sizing: border-box;
padding: 1rem 7rem !important;
border-radius: 3.5rem;
transition: background-color 0.3s ease;
width: fit-content;
             }

#whoweare{
  width:90%;

  margin:0 auto;

  max-width:1711px;
  height: auto;
  padding-block:6rem;
}

#whoweareinside{
  width:100%;
 
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap:4rem;
  height: auto;
  margin-top:2rem;
  box-sizing: border-box;
 
}
#whoweareinside #whoweareleft{
  display: flex;
  flex-direction: column;
  justify-content: baseline;
  align-items: flex-start;
  gap:1rem;

}
#whoweareinside #whoweareleft h2{
  text-align:left;
  color:#0F1125; padding:0;    font-family: 'playfair_display_scregular';
  font-size:3rem; width:auto;
  position:relative;
}
#whoweareinside #whoweareleft p{
  text-align: justify;
  color:#656565;

}
#whoweareinside #whoweareright{
  display: flex;
  flex-direction: column;
  justify-content: baseline;
  align-items: flex-start;
  gap:1rem;

 }

 #whoweareinside #whoweareright h2{
  text-align:left;
  color:#0F1125; padding:0;    font-family: 'playfair_display_scregular';
  font-size:3rem; width:auto;
  position:relative;
}
#whoweareinside #whoweareright p{
  text-align: justify;
  color:#656565;

}



#whoweareshaded{
  width:100%;

  margin:0 auto;


  height: auto;
  background: linear-gradient(to right, #CFA353 50%, #FFF 50%); /* Split colors */

}

#whoweareshadedinside{
  width:90%;
 
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap:0rem;
  height: auto;
  margin-top:2rem;
  box-sizing: border-box;
  margin:0 auto;
  max-width:1711px;
}
#whoweareshadedinside #whoweareshadedleft{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items:start;
  gap:1rem;

  box-sizing: border-box;
  padding-right:9rem;
  padding-block: 5rem;
}
#whoweareshadedinside #whoweareshadedleft h2{
  text-align:left;
  color:#FFF; padding:0;    font-family: 'playfair_display_scregular';
  font-size:3rem; width:auto;
  position:relative;
  padding-block:3rem;
}

#whoweareshadedinside #whoweareshadedleft .icontext{

  color:#FFF;  

}
#whoweareshadedinside #whoweareshadedleft p{
  text-align: justify;
  color:#FFF;

}
#whoweareshadedinside #whoweareshadedright{
  display: flex;
  flex-direction: column;
  justify-content: baseline;
  align-items: flex-start;
  gap:1rem;


 }

 #whoweareshadedinside #whoweareshadedright img{
object-fit: cover;
width:100%;
height: 100%;

 }



 /**TESTIMONIALS */
 #theteamoriginal{
 display: flex;
 flex-direction: column;
  width: 100%;
  height: auto;
  margin-top:6rem;
 }
 #theteamoriginal #theteamoriginalheader{
width:90%;
max-width:1711px;
margin:0 auto;
text-align: left;
 }
 #theteamoriginal #teamgrid{
width:100%;

gap:2rem;
box-sizing: border-box;
margin-top: 2rem;
position: relative;
margin-bottom:4rem;
 }
 #theteamoriginal #teamgrid::after{
 content: '';
position: absolute;
left: 0;
top: 0;
width: 50%;
height: 100%;
background-color: #F1F1F1;
box-shadow: 16px 14px 1px rgba(0,0,0,0.03);
z-index: 1;
 }
 #theteamoriginal #teamgrid #teamgridleft{
 width:90%;
display: grid;
grid-template-columns: 40% 60%;
gap:2rem;
box-sizing: border-box;
margin-top: 2rem;
max-width:1711px;
margin:0 auto;
padding-block:4rem;
position: relative;
z-index: 99;
}
#theteamoriginal #teamgrid #teamgridleft #teamlefta{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
  height: 100%;
}
#theteamoriginal #teamgrid #teamgridleft #teamlefta h2{

  font-size:3rem;
color:#0F1125;
  font-family: 'playfair_display_scregular';
  line-height: 1em;
  text-transform: uppercase;
  position: relative;

}
#theteamoriginal #teamgrid #teamgridleft #teamlefta h2::after {
  content: '';
  left: 0;
  bottom: 10px;
  width: 33%;
  
  height: 1px;
  position: absolute;
  border-bottom: 2px dashed #CFA353;
}
#theteamoriginal #teamgrid #teamgridleft #teamlefta p{
margin-top:2rem;
display: block;
  font-size:1rem;
color:#3A3A3A;
text-align: justify;
padding-right:3rem;



}
#theteamoriginal #teamgrid #teamgridleft #teamleftb {

position: relative;
left: 6rem;
 
 
 

}
#theteamoriginal #teamgrid #teamgridleft img{
width: revert;
max-width: 350px;
position: relative;
height: auto;




}

/***left2**/
#theteamoriginal #teamgrid2{
width:100%;

gap:2rem;
box-sizing: border-box;
margin-top: 2rem;
position: relative;
margin-bottom:4rem;
   }
   #theteamoriginal #teamgrid2::after{
   content: '';
  position: absolute;
right: 0;
  top: 0;
  width: 50%;
  height: 100%;
  background-color: #F1F1F1;
  box-shadow: 16px 14px 1px rgba(0,0,0,0.03);
  z-index: 1;
   }
#theteamoriginal #teamgrid2 #teamgridleft2{
width:90%;
display: grid;
grid-template-columns: 60% 40%;
gap:2rem;
box-sizing: border-box;
margin-top: 2rem;
max-width:1711px;
margin:0 auto;
padding-block:4rem;
position: relative;
z-index: 99;
}
#theteamoriginal #teamgrid2 #teamgridleft2 #teamleft2a{
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: start;
 height: 100%;
}
#theteamoriginal #teamgrid2 #teamgridleft2 #teamleft2a h2{

 font-size:3rem;
color:#0F1125;
 font-family: 'playfair_display_scregular';
 line-height: 1em;
 text-transform: uppercase;
 position: relative;

}
#theteamoriginal #teamgrid2 #teamgridleft2 #teamleft2a h2::after {
 content: '';
 left: 0;
 bottom: 10px;
 width: 33%;
 
 height: 1px;
 position: absolute;
 border-bottom: 2px dashed #CFA353;
}
#theteamoriginal #teamgrid2 #teamgridleft2 #teamleft2a p{
margin-top:2rem;
display: block;
 font-size:1rem;
color:#3A3A3A;
text-align: justify;
padding-right:3rem;



}
#theteamoriginal #teamgrid2 #teamgridleft2  #teamleft2b  {

display: flex;
flex-direction: row;
justify-content: flex-end;
position: relative;
left: -7rem;


}
#theteamoriginal #teamgrid2 #teamgridleft2 img{

width: revert;
max-width: 350px;
position: relative;
height:fit-content;




}

/* LEGEND **/

#legendbar{
background-color:#EFEFEF;
height: 250px;
width: 100vw;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
text-align: center;

}
#legendbar #legendbarinside{
display: flex;
flex-direction: row;
justify-content:space-between;
align-items: center;
gap:2rem;
width:60%;
margin:0 auto;
height: 100%;
padding-block:2rem;
}
#legendbar #legendbarinside > div{
width: 32%;
display: flex;
flex-direction: column;
justify-content:center;
align-items: center;
gap:0rem;
box-sizing: border-box;

vertical-align:top;
height:120px;
padding-inline:2rem;
}
#legendbar #legendbarinside div h6{
font-size:3rem;
color:#0F1125;
   font-family: 'playfair_display_scregular';
   line-height: 1em;
   text-transform: uppercase;
   position: relative;
   margin-block:2rem;

  }
#legendbar #legendbarinside div span{
padding-inline:2rem;
}

/** PROCESS **/

#process{

height: auto;
  width: 100vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding-block:5rem;
  background-color: #CFA353;
  
  }
  #process #processheader{
    display:block;

  
    width:90%;
    margin:0 auto;
    padding-block:2rem;
    }
  #process #processinside{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap:3rem;
  width:90%;
  margin:0 auto;
  box-sizing: border-box;
  padding-block:1rem;
  }

  #process #processinside   div{
padding:0;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: baseline;
align-items: start;
    }
    #process #processinside   div h2{
      font-size:2rem;
 
         font-family: 'playfair_display_scregular';
         line-height: 1em;
         text-transform: uppercase;
         position: relative;
         text-align: left;
         color:white;
         margin-bottom:1rem;
          }

          #process #processinside   div p{
text-align: justify;
color:white;
                }
#process #processinside   div .barline{
width: 100%;
height: 2px;
display: block;
clear: both;
margin-block:3rem;
border-bottom:2px dashed rgba(255,255,255,0.4);
}
               
/** ARES WE SERAVE **/


.containermap {
display: grid;
grid-template-columns: 30% 70%;
padding: 20px;
width:90%;
margin:0 auto;
max-width:1711px;

}

.containermap .locations {
width: 100%;
padding-right: 20px;
}

.containermap .locations button {

width: 100%;
padding: 10px;

margin: 0px 0;
background-color: #EEE;
color: #555;
border: none;
height: 100px;
border-radius: 0;
cursor: pointer;
font-size: 16px;
text-align: left;
padding-left:4rem;

border-bottom: 2px solid #FFF;
background:#EEE url(../images/locationgray.png) no-repeat  20px center;

}
.containermap .locations button:last-child {
border-bottom: transparent;
}

.containermap .locations button:hover {

color:white;
background:#120d22 url(../images/locationdefault.png) no-repeat  20px center;
}
.containermap .locations .mapselected {
background:#120d22 url(../images/locationdefault.png) no-repeat  20px center;
color:white;
}

.containermap .locations .butlocation{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
gap:1rem;
padding-left: 4rem;
}
.containermap .locations .ajaxloader{
display:none;
background: url(../images/ajax-loader.gif) no-repeat center center;
background-size: contain;
width:43px;
height: 11px;
margin-right: 1rem;
}

.containermap  #map {
width: 100%;
    height: 600px;
border-radius: 10px;
}
/* Preloader styles */
#preloader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.9);
z-index: 1000;
display: none; /* Hidden by default */
justify-content: center;
align-items: center;
}

#preloader .spinner {
border: 8px solid #f3f3f3; /* Light gray */
border-top: 8px solid #3498db; /* Blue */
border-radius: 50%;
width: 50px;
height: 50px;
animation: spin 1s linear infinite;
}

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

/** GUARANTEE **/

#guarantees{
display: grid;
grid-template-columns: repeat(2,1fr);
height: auto;
width: 90%;
gap:0;
margin:0 auto;
background-color: white;
}
#guarantees #guaranteesleft{
padding:2rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
box-sizing: border-box;
}
#guarantees #guaranteesleft ol { 
display: list-item;
margin-left: 1rem;
padding-left: 1rem;
}
#guarantees #guaranteesleft ul { 
display: list-item;
margin-left: 1rem;
padding-left: 1rem;
}
#guarantees #guaranteesleft ol li { 
list-style: auto;
line-height: 1.8em;

font-size:1.2rem;
}
#guarantees #guaranteesleft ul li { 
list-style: auto;
font-size:1.2rem;
line-height: 1.8em;
}
#guarantees #guaranteesleft h2{
font-size:3rem;
color:#0F1125;
   font-family: 'playfair_display_scregular';
   line-height: 1em;
   text-transform: uppercase;
   position: relative;
   margin-top:3rem;
   padding:0;
}
#guarantees #guaranteesleft p{
margin-top:2rem;
display: block;
   font-size:1rem;
color:#3A3A3A;
text-align: justify;
padding-right:3rem;
}
#guarantees #guaranteesright img{
object-fit: cover;
width: 100%;
height: 100%;
}


/*builder**/
#building{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width:100vw;
height: 100vh;
background-size: cover;
position: relative;

}
#building #bgshadow{
display: block;
position: absolute;
top:0;
left:0;
width: inherit;
 height: inherit;
 background: rgba(0,0,0,0.6);
 z-index: 2;


}
#buildingheader{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
z-index: 99;
}
#buildingheader h2{
font-size:3rem;
color:#FFF;
   font-family: 'playfair_display_scregular';
   line-height: 1em;
   text-transform: uppercase;
   position: relative;
   margin-top:3rem;
   padding:0;
}
#buildingheader h2::before{
content: '';
position: absolute;
right: -150px;
top: 50%;
width: 130px;
height: 1px;
border-bottom: 1px dashed #CFA353;
}
#buildingheader h2::after {
content: '';
position: absolute;
left: -150px;
top: 50%;
width: 130px;
height: 1px;
border-bottom: 1px dashed #CFA353;
}
#buildingheader h3{
font-size:1.6rem;
color:#FFF;
   font-family: 'playfair_display_scregular';
   line-height: 1em;
   text-transform: uppercase;
   position: relative;
   display: block;
   margin:1rem 0 1.5rem 0;
   padding:0;
}
#buildingheader p{
margin-top:2rem;
display: block;
   font-size:1rem;
color:#FFF;
text-align: justify;
padding-right:3rem;
}


#buildinginside{
width:70%;
margin:0 auto;
display: grid;
grid-template-columns: repeat(2,1fr);
position: relative;
z-index: 99;
}
#buildinginside div  {

display: block;

padding:3rem;
}
#buildinginside div p{

display: block;
   font-size:1rem;
color:#FFF;
text-align: justify;
padding-right:3rem;
}

/* Modeling section **/

#modelinglanding{
display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    background: #0F1125;
    height: auto;
    width: 100%;
    position: relative;
    z-index: 1;
    padding-block: 5rem;
}

#modelinglanding #modelinglandinginside{
display: flex;
flex-direction: column;
justify-content: baseline;
align-items: flex-start;
gap: 1rem;

width: 90%;
margin: 0 auto;
}

#modelinglanding #modelinglandinginside ul{
margin-left: 1rem;
list-style: disc;
padding-left: 2rem;
}

#modelinglanding #modelinglandinginside ul li{
  color: #CFA353;
  font-size: 1.2rem;
  margin-bottom: 0.7rem;
}
#modelinglanding #modelinglandinginside .iconheader{
padding:1rem;
}


#modelinglanding #modelinglandinginside h2{
color:white;
font-size: 3.5rem;
font-weight: bold;
font-family: 'playfair_display_scregular';
padding:1rem;
}
#modelinglanding #modelinglandinginside h3{
color:white;
font-size: 2.8rem;
font-weight: bold;
font-family: 'playfair_display_scregular';
padding:1rem;
}
#modelinglanding #modelinglandinginside p{
color:white;
font-size: 1.2rem;
padding:1rem;
}
#modelinglanding #modelinglandinginside #modelinglandinglist{
width:100%;
display: flex;
flex-direction: row;
gap:1rem;


}


#modelinglanding #modelinglandinginside #modelinglandinglist .slick-slide {

padding: 1rem;
}



#modelinglanding #modelinglandinginside #modelinglandinglist .slick-slide img{
box-sizing: border-box;
border:10px solid rgba(266,255,255,1);
object-fit: cover;
width: 100%;
height: 100%;
}
#modelinglanding #modelinglandinginside #modelinglandinglist .slick-slide span{
color:white;
display: block;
margin-top:0.6rem;
}

#modelinglanding #modelinglandinginside #modelinglandinglist  .slick-prev::before, #modelinglanding #modelinglandinginside #modelinglandinglist  .slick-next::before {

  font-size: 2rem;

}

#modelingsection #modelingsectionleft .modelingbutton_isting{
  display: flex;
  flex-direction: row;
  justify-content:flex-start;
  align-items: flex-start;
  gap:1.5rem;
}
/*** SECTION PROCESS MODEL ***/
#processsection{

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
padding-block:4rem;
    height: auto;
    width: 100%;
    position: relative;
    z-index: 1;
    }
    
    #processsection   #processsectioninside{
      display: flex;
      flex-direction: column;
      justify-content: baseline;
      align-items: flex-start;
      gap: 1rem;        
      width: 90%;
      margin: 0 auto;
  
    }

    #processsection   #processsectioninside #processsectioninsidegrid{
    display:grid;
    grid-template-columns: repeat(2,1fr);    
    gap: 3rem;        
    width: 100%;
    margin: 0 ;

    }
    #processsection   #processsectioninside #processsectioninsidegrid .processbox span{
      display: flex        ;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          width: fit-content;
          height: 70px;
          padding-inline: 2rem;
          border-radius: 0.4rem;
          background-color: #0F1125;
          color: white;
          font-size: 1.7rem;
          font-weight: bolder;
          border: 4px solid #CFA353;
      }
      #processsection   #processsectioninside #processsectioninsidegrid .processbox h5{
        
    
margin :1.5rem 0 0 0;
        color: #0F1125;
        font-size: 1.5rem;
        font-family: 'playfair_display_scregular';
                }
                #processsection   #processsectioninside #processsectioninsidegrid .processbox p{
        display: block;
    margin-bottom:2rem;
    text-align: justify;
     }
    #processsection   #processsectioninside h2{
      color:#0F1125;
      font-size: 3.5rem;
      font-weight: bold;
      font-family: 'playfair_display_scregular';
    
    }

#mainbgbox{
border-top: 1px solid #BBB;
padding-top: 3rem;
}


/*** CATEGORY PROJECTS  SECTION****/
#categoryprojects{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width:100%;
box-sizing: border-box;
height: auto;
padding-block:4rem;
}
#categoryprojects #categoryprojectheader{
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 width:60%;
 margin:0 auto;
 height: auto;

  }
  #categoryprojects #categoryprojectheader h2{
    color:#0F1125;
    font-family: 'playfair_display_scregular';
    font-size: 3rem;
    margin-top:1rem;
    position: relative;
    text-align: center;
  
    display:block;
    width: fit-content;
  }
 #categoryprojects #categoryprojectheader p{
  text-align: center;
 
  }
  #categoryprojects #categoryprojectsinsidegrid{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  width:90%;
  margin:0 auto;
  
  text-align: center;
  margin-top:3rem;
  gap:2rem;

  }

  #categoryprojects #categoryprojectsinsidegrid > div{
    width: 100%;
    height: 100%;
    box-sizing:border-box;
  
    display: flex  ;
    flex-direction: column;
    justify-content: left;
    align-items: flex-start;

    }
    #categoryprojects #categoryprojectsinsidegrid > div h3{
      color:#0F1125;
      font-family: 'playfair_display_scregular';
      font-size: 2rem;
      margin-top:1rem;
      position: relative;
    
      display: inline-block;
      width: fit-content;
      text-align: left;
      }
      #categoryprojects #categoryprojectsinsidegrid > div p{
   text-align: left;
   display: block;
   padding-bottom:1rem;   
      }
      #categoryprojects #categoryprojectsinsidegrid > div a{
   text-decoration: none;
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items:center ;
   gap:1rem;
   color:#CFA353 ;
   font-size: 1rem;
 
      }
      #categoryprojects #categoryprojectsinsidegrid > div a span{
     display: inline-block;
     background: url(../images/arrowright.png) no-repeat center center;
     width:50px;
     height: 50px;
     background-size:auto;
     padding:1rem;
     border-radius: 50%;
     background-color:#CFA353 ;

      
           }
    #categoryprojects #categoryprojectsinsidegrid > div img{
      object-fit: cover;
      width: 100%;
      box-sizing: border-box;box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
      height: 100%;
         }
       
/** CUSTOM HOME ISNPIRATION DSIGN PAGE **/

#customhome-inspirationdesigns{
display: flex;
flex-direction: column;
justify-content: center;
align-items:left;
width:100%;
height: auto;

padding-block:4rem;
background: rgba(226,226,226,0.6);

}
#customhome-inspirationdesigns #customhome-inspirationdesignsheader{
width:90%;
margin:0 auto;

}
#customhome-inspirationdesigns #customhome-inspirationdesignsheader h2{
color:#0F1125;
font-family: 'playfair_display_scregular';
font-size: 3.5rem;
margin-top:1rem;
position: relative;

display: inline-block;
width: fit-content;
text-align: left;
}
#customhome-inspirationdesigns #customhome-inspirationdesignsgrid{
display: grid;
width:90%;
margin-top:2rem;
margin:0 auto;
grid-template-columns: repeat(6,1fr);
gap:1.2rem;
grid-template-areas:
"b1 b1 b1 b2 b2 b2"
"b3 b3 b4 b4 b5 b5"
"b6 b6 b6 b6 b6 b6";
}
#b1 {
grid-area: b1;
height: 350px;
overflow:hidden;
}
#b1  img{
width:100%;
object-fit: cover;
height: 100%;

}
#b2 {
grid-area: b2;
height: 350px;
overflow:hidden;
}
#b2  img{
width:100%;
object-fit: cover;
height: 100%;

}
#b3 {
grid-area: b3;
height: 350px;
overflow:hidden;
}
#b3 img{
width:100%;
object-fit: cover;
height: 100%;

}
#b4 {
grid-area: b4;
height: 350px;
overflow:hidden;
}
#b4 img{
width:100%;
object-fit: cover;
height: 100%;

}
#b5 {
grid-area: b5;
height: 350px;
overflow:hidden;
}
#b5 img{
width:100%;
object-fit: cover;
height: 100%;

}

/** MODELING ISPIRATION **/



#modeling-inspirationdesigns{
display: flex;
flex-direction: column;
justify-content: center;
align-items:left;
width:100%;
height: auto;
 
padding-block:4rem;
background: rgba(226,226,226,0.6);
 
}
#modeling-inspirationdesigns #modeling-inspirationdesignsheader{
  width:90%;
  margin:0 auto;

}
#modeling-inspirationdesigns #modeling-inspirationdesignsheader h2{
color:#0F1125;
font-family: 'playfair_display_scregular';
font-size: 3.5rem;
margin-top:1rem;
position: relative;

display: inline-block;
width: fit-content;
text-align: left;
}
#modeling-inspirationdesigns #modeling-inspirationdesignsgrid{
display: grid;
width:90%;
margin-top:2rem;
margin:0 auto;
grid-template-columns: repeat(6,1fr);
gap:1.2rem;
grid-template-areas:
"c1 c1 c1 c2 c2 c2"
"c3 c3 c4 c4 c5 c5"
"c6 c6 c6 c6 c6 c6";
}
#c1 {
  grid-area: c1;
  height: 350px;
  overflow:hidden;
}
#c1  img{
width:100%;
object-fit: cover;
height: 100%;

}
#c2 {
  grid-area:c2;
  height: 350px;
  overflow:hidden;
}
#c2  img{
width:100%;
object-fit: cover;
height: 100%;

}
#c3 {
  grid-area: c3;
  height: 350px;
  overflow:hidden;
}
#c3 img{
width:100%;
object-fit: cover;
height: 100%;

}
#c4 {
  grid-area: c4;
  height: 350px;
  overflow:hidden;
}
#c4 img{
width:100%;
object-fit: cover;
height: 100%;

}
#c5 {
  grid-area: c5;
  height: 350px;
  overflow:hidden;
}
#c5 img{
width:100%;
object-fit: cover;
height: 100%;

}
/* modal window */

.formdivider{
  display: block;
  grid-template-columns: repeat(2,1fr);
  gap: 1rem;
  width: 100%;
  height: 100%;
}
.formdivider div:first-child{
  height:auto;
  
 
}
.formdivider div:first-child span{
  font-size: 2rem;
  font-weight: bold;  
 
}


.formdivider div:last-child img{

width:432px;
height: 736px;
 
}

#leftdetails ul{
  color: white;
  list-style: disc;
 
}



#leftdetails ul li{
margin-bottom:0.7rem;
 
}

#googlereviews{
  display: block;
width: 90%;
margin: 0 auto;
padding-block: 4rem;
max-width: 1711px;
}
#googlereviews h2{
      width: 100%;
  font-size: 3.5rem;
  color: #0F1125;
  font-family: 'playfair_display_scregular';
  line-height: 1em;
  text-align: left;
  margin: 8rem 0 2rem 0;
  
}


.scrollToTopss {
  padding: 10px;
  text-align: center;
  color: #444;
  text-decoration: none;
  position: fixed;
  right: 1rem;
  bottom: 5rem;
  z-index: 9999;
  width: 75px;
  height: 75px;
}


/** MENU POPUP ***/
#toggleBtn {
  position: fixed;
  top: 1rem;
  right: 1rem;
  width: 32px;
  height: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: transparent;
  border: none;
  cursor: pointer;
  z-index: 1001;
}
#toggleBtn2 {
  position: relative;
  top: 0rem;
 left: 1rem;
  width: 32px;
  height: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: transparent;
 color:white;
  cursor: pointer;
  margin-bottom: 1.5rem;
  z-index: 9;
}
#toggleBtn span,#toggleBtn2 span {
  display: block;
  height: 4px;
  background: #333;
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
#toggleBtn.open span:nth-child(1) {
  transform: translateY(10px) rotate(45deg);
}
#toggleBtn.open span:nth-child(2) {
  opacity: 0;
}
#toggleBtn.open span:nth-child(3) {
  transform: translateY(-10px) rotate(-45deg);
}

/* ---- Side Panel ---- */
#shadow-panel-menu{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0,0,0,0.5);
  z-index: 9999;visibility: hidden;
}
#shadow-panel-menu.open{
  visibility: visible;

}
#sidePanel {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0,0,0,0.9);
  transform: translateX(-100%);
  transition: transform 0.5s ease-in-out;
  z-index: 1000;
  overflow: hidden;
  color: #fff;
  padding: 2rem;
  box-sizing:content-box;
}
#sidePanel.open {
  transform: translateX(0);
}

/* ---- Menu Content ---- */
.menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.menu-list > li {
  margin-bottom: 1.5rem;
  position: relative;
}
.menu-list a {
  color: #fff;
  text-decoration: none;
  font-size: 1.5rem;
}
/* Hide all sub‑menus */
.sub-menu {
  display: none  ;
}

/* Show when its parent LI gets .open */
 
 li.open > .sub-menu {
  display: block !important;
}
  
.sub-menu li {
  margin-bottom: 0.75rem;
}
.sub-menu a {
  font-size: 1.25rem;
}
 
#ctasection #ctasectioninside  div{
       
  display: flex ;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
 
}

#ctasection #ctasectioninside  div p{
       
color:rgba(0,0,0,0.65);
 
}
    /* MOBILE VERSIONS */


 
        @media only screen and  (max-width: 1600px) {
            #modelingsectionright {
 
padding: 0rem;
}
         #customhomesectionright {
 
padding: 0rem;
}   
 section#theteam #meetteamright {
 
padding: 0  ;
}
          nav ul li {
 
  padding: 0rem 1rem !important;
 width:fit-content;
  box-sizing:  border-box;
}
          nav {
 
 
 
 
  gap: 1rem !important; 
}
          nav ul {
 
  gap: 0.5rem !important;
}
          #footersectionsocialinside {
       
        width: 80%;
       
      }
          #ctafooter #ctafootergridRight h2 {
       
        margin: 2rem 0 0rem 0;
       
      }
          section#theteam #meetteamleft p {
       
        margin-bottom: 1rem;
      }
          section#theteam #meetteamleft h2 {
       
        margin: 2rem 0 0rem 0;
      }
          section#ourfeatured #ourfeaturedinsideLeft p {
       
        margin-bottom: 1rem;
      }
          section#ourfeatured #ourfeaturedinsideLeft h2 {
       
        margin: 2rem 0 0rem 0;
      }
          #newsletter_content #newsletter_content_inside {
        display: grid;
        grid-template-columns: 50% 50%;
        padding: 1rem;
        width: 75%;
        height: auto;
        margin: 0 auto;
        border-radius: 2rem;
      }
      
      #modelingsectionleft {
       
        gap: 0rem;
      }
      #customhomesectionleft {
       
        gap: 0rem;
      }
      #ctasection #ctasectioninside {
       
        gap: 0rem;
       
      }
      #ctasection #ctasectioninside  > div{
       
        gap: 0rem;
       
      }
        #fullscreenpagesubpage #centerdetails h3 {
        font-size: 2rem;
      
      }
        #fullscreenpagesubpage #centerdetails h1 {
      
        font-size: 3rem;
      
      }
      #fullscreenpagemodel #leftdetails h1 {
       
        font-size: 2.7rem;
      
        width: 80%;
      }
      #fullscreenpagemodel #leftdetails p{
        width: 70%;
      
        font-size: 1rem;
        line-height: 1.5em;
      margin-bottom: 0rem;
      }
      
      nav ul {
        list-style: none;
        text-align: center;
        display:flex;
        flex-direction:row;
        justify-content:flex-start;
        align-content:flex-start;
        flex-wrap:wrap;
        gap:1rem;
      
      
      }
      
      nav   ul li {
        margin-bottom: 0px;
       
 
      padding: 0.7rem 1rem;
      
      }
      nav   ul li  a{
      font-size:1rem;
        
        }
      }
         #defaultpage{
         padding: 4rem; 
      }
      #defaultpage_inside{
         padding-top: 3rem; 
      }
    #defaultpage_inside h3 strong{
      font-family: 'playfair_display_scregular';
      color:black;
      }
    #defaultpage_inside h4 strong{
      font-family: 'playfair_display_scregular';
      color:black;
      }
      @media only screen and (max-width: 1400px) {
        #mainslickslider .slick-next {
          right: 46%;
          
        }
        #mainslickslider .slick-prev {
          left: 46%;
          
        }
        #building {
 padding-block:4rem;
  width: 100vw;
  height: auto;
 
}
    #building #bgshadow {
 
  height: 100%;
 
}    
#buildinginside {
  width: 90%;
 
}
        }
    @media (max-width: 980px) {
      .et_fixed_nav.et_header_style_slide #main-header {
        position: fixed;
        left: 0 !important;
        top: 0;
        height: 80px;
        box-sizing: border-box;
        width: 100%;
        display: flex;
        padding: 0;
        z-index: 999;
      }
    }
@media only screen and (max-width: 980px) {
.et_header_style_slide #et-top-navigation {

  position: fixed;
  width: 100%;
  top: 10px;
  z-index: 999999999999;
  right: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-content: flex-end;
}
}
@media only screen and (max-width: 980px) {
.et_menu_container {
  width: 100% !important; 
}
}



    /* Styles for tablets (width 768px and below) */
@media (max-width: 768px) {
    .fullscreen-menu nav ul li {
 
    box-sizing: border-box !important;
  
}
              nav ul li {
 
  padding: 0.5rem 1rem !important;
    min-width: fit-content;
}
    #categoryprojects #categoryprojectheader {
 
    width: inherit;
  
}
    
    .slick-next {
    right: -15px;
}
    #modeling-inspirationdesigns #modeling-inspirationdesignsgrid ,#customhome-inspirationdesigns #customhome-inspirationdesignsgrid{
 width: 100%;
        grid-template-columns: repeat(2, 1fr);
    grid-template-areas: none;
}
#c1,#c2,#c3,#c4,#c5,#b1,#b2,#b3,#b4,#b5 {
    grid-area: unset;
        height: 250px;
  
}
    
  #fullscreenpagemodel #leftdetails {
 
    justify-content: end;
    align-items: flex-start;
 
 
    width: 90%;
    height: 100%;
 
 
    
    padding-bottom: 2rem;
  }
  #fullscreenpagemodel #leftdetails h1 {

    font-size: 2rem;
    width:100%;
  
  }
  #fullscreenpagemodel #leftdetails p {
   
      width: 90% !important;
      height: 200px;
      overflow-y: scroll;
      padding-right: 1rem;
      text-align: left !important;
   
  
  }



  #mainslickslider .slick-next {
    right: 42% !important;
  }
  #mainslickslider .slick-prev {
    left: 42% !important;
  }
  .linkmoveleft{
    display: none !important;
  }
  #modelinglanding #modelinglandinginside h3 {
  
    font-size: 2rem;
 
  }
  #modelinglanding #modelinglandinginside  {
  
width:100%;
 
  }
  #customhome-inspirationdesigns #customhome-inspirationdesignsheader h2 {
 
    font-size: 2.5rem;
  
  }
  #categoryprojects #categoryprojectheader h2 {
 
    font-size: 2.5rem;
  
  }
  #categoryprojects #categoryprojectsinsidegrid {
 
    grid-template-columns: 100%;
    width: 90%;
   
  }
  section#ourfeatured #ourfeaturedinsideLeft h2 {
 
    font-size: 2.5rem;
   
  }
  #gallerysection h2 {
  
    font-size: 2.5rem;
    padding-inline: 2rem;
    text-align: center;
  }
  #ctasection #ctasectioninside h2 {
 
    font-size: 2.5rem;
 
  }

  #awardssection h4 {
  
    text-align: center;
  }
  #modelingsectionleft h2 {
 
    font-size: 2.5rem;
 
  }
  #ctafooter #ctafootergridRight h2 {
 
    font-size: 2rem;
   
    line-height: 1.2em;
   
 
  }
  section#theteam #meetteamleft p {
  
    margin-bottom: 2rem;
  }
  section#theteam #meetteamleft p:first-child {
 
    margin-top: 0rem;
  }
  #testimonials .testiinsides .testibar h3 {
 
    font-style: normal;
 
    font-weight: bold;
    text-align: center;
  }
  #testimonials h2 {
 
    font-size: 2.3rem;
  
  }
  #et-info-phone{
    display: none;
  }
  #testimonials > p {
   
    text-align: center;
    width: 90%;
  }
  #testimonials .testibar p {
    text-align: center;
    width: 100%;
  }
  section#ourfeatured #ourfeaturedinsideLeft {
 
    padding: 2rem;
 
  }
  .fslightbox-container {
  
    z-index: 99999999999 !important;
  }
.gallery-lightbox {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* Two columns */
  gap:0.6rem; /* Space between images */
  grid-template-areas: none !important;
}

.gallery-lightbox div {
  width: 100%;
  display:block;
  margin-block:0rem;
  grid-area: unset !important;
  min-height: 400px;
  height:450px;
  max-height: 40px;
}

.gallery-lightbox img {
  width: 100%;
  height: auto;
  display: block;
}

#gallerysection p {
 
  margin-bottom: 3rem;
  padding-inline: 2rem;
  text-align: center;
}
  #awardssection ul {  
    flex-direction: column;
     width: 100%;   
  }

  #awardssection ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 2rem;
    margin-bottom: 2rem;
    gap: 1rem;
    width: 100%;
    text-align: center;
  }
  #awardssection ul li {
width:inherit;
  }

  #awardssection h2 {
 
    font-size: 2.5rem;
 
  }
  #awardssection h4 {
 
    font-size: 1.2rem;
 
  }
  #awardssection p {
  
    font-size: 1rem;
    width: 90%;
  }
  
  #awardssection img {
 
    width: 60%;
     margin: 0 auto;
     max-width: 233px;
  }
  #trusted_builder div span {
    padding-inline: 2rem;
 
  }

  #awardssection #awardssectionbox > div {
 
 
    height: auto;
   
    flex-basis: 100%;
  }
  .centerDivSlider h1{
 
    font-size: 1rem;
    opacity: 0.8;
 
}
#awardssection #awardssectionbox > div h5 {
 
  font-size: 1.4rem; 
 
}
 
.centerDivSlider h2{
 
    font-size: 1.6rem;
 
    width: 90%;
}
.centerDivSlider h3{
 
    font-size: 1rem;
 
 
}

#testimonials #testidivider {

  grid-template-columns: repeat(1, 1fr);

}

#whoweareinside {
  
  grid-template-columns: repeat(1,1fr);

}
#contactusform #formsgrid {

  grid-template-columns: repeat(1, 1fr);

  width: 100%;

}
.containermap .locations button {

  height: 60px;
}
.containermap {

  grid-template-columns: repeat(1, 1fr);
  gap:1.5rem;
}

.containermap .locations {
  
  padding-right: 0px;
}
#fullscreenpagesubpage #centerdetails h1 {

  font-size: 3rem;

}
#fullscreenpagesubpage #centerdetails h3 {
  font-size: 2rem;
  font-family: 'open_sansregular';

}
#whoweareshadedinside {
  width: 100%;

  grid-template-columns: repeat(1,1fr);

}
#whoweareshaded {
  width: 100%;
  margin: 0 auto;
  height: auto;
  background: linear-gradient(to right, #CFA353 100%, #FFF 100%);
}
#whoweareshadedinside #whoweareshadedleft {
  
  padding-right: 1rem;
  padding-block: 3rem;

}
#theteamoriginal #teamgrid #teamgridleft {
  width: 100%;

  grid-template-columns: repeat(1,1fr);
  
}

#theteamoriginal #teamgrid::after {


width: 100%;



}
#theteamoriginal #teamgrid #teamgridleft #teamleftb {
position: relative;
left: 0rem;
}
#theteamoriginal #teamgrid #teamgridleft img {
width: 100%;
max-width: 100%;
position: relative;
}
#theteamoriginal #teamgrid #teamgridleft #teamlefta h2 {
font-size: 2rem; 
line-height: 1.4em;

}
#theteamoriginal #teamgrid #teamgridleft #teamlefta p {
margin-top: 2rem;
display: block;
font-size: 1rem;
color: #3A3A3A;
text-align: justify;
padding-right: 0rem;
}
#theteamoriginal #teamgrid #teamgridleft #teamlefta {
padding: 1rem;
}
#theteamoriginal #teamgrid2 #teamgridleft2 {
width: 100%;

grid-template-columns: repeat(1,1fr);

}
#theteamoriginal #teamgrid2 #teamgridleft2 #teamleft2b { 
left: 0rem;
}
#theteamoriginal #teamgrid2 #teamgridleft2 #teamleft2a {
 padding: 1rem;
box-sizing: border-box;
}
#theteamoriginal #teamgrid2 #teamgridleft2 #teamleft2a h2 {
font-size: 2rem; 
}

#theteamoriginal #teamgrid2 #teamgridleft2 #teamleft2a p {
 padding-right: 0rem;
}
#theteamoriginal #teamgrid2::after {
 width: 100%; 
}
#theteamoriginal #teamgrid2 #teamgridleft2 img {
width: 100%;
max-width: 100%;

}
#legendbar {

height: auto;
width: 100vw; 
}
#legendbar #legendbarinside {
display: flex;
flex-direction: column;
justify-content:center; 
}
#legendbar #legendbarinside { 
width: 100%; 
}
#process #processinside { 
grid-template-columns: repeat(1, 1fr);  
}
#guarantees { 
grid-template-columns: repeat(1,1fr);
width: 100%;
padding: 0; 
}
#guarantees #guaranteesleft p { 
padding-right: 0rem;
}


#building {
height: auto;
padding: 1rem;
width: 100%;
}
#buildinginside div p {
display: block;
font-size: 1rem;
color: #FFF;
text-align: justify;
padding-right: 0rem;
}
#building #bgshadow {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
z-index: 2;
}
#buildinginside div {
display: block;
padding: 0rem;
}
#buildingheader h2 {
font-size: 2.5rem;
color: #FFF;
font-family: 'playfair_display_scregular';
line-height: 1em;
text-transform: uppercase;
position: relative;
margin-top: 3rem;
padding: 0;
}
#buildinginside {
width: inherit;
margin: 0;
display: grid;
grid-template-columns: repeat(1,1fr);
position: relative;
z-index: 99;
padding: 0;
margin: 0 auto;
box-sizing: border-box;
}
#legendbar #legendbarinside > div {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 0rem;
box-sizing: border-box;
vertical-align: top;
height: auto;
padding-inline: 2rem;
}
#footerbottom {
  display: flex;
  width: 90%;
  margin: 0 auto;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  padding-block: 1rem;
  border-top: 1px solid #CCC;
  max-width: 1711px;
}
#footerbottom h6 {
  text-decoration: none;
  font-size: 0.8rem;

  color: #0F1125;
  white-space: nowrap;
  padding: 0;
  text-align: center;
}
.et_header_style_left #et-top-navigation .mobile_menu_bar {
  padding-bottom: 24px;
  position: fixed;
  top: 0;
  display: flex;
  width: fit-content;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  right: 0;
  left: auto;
  z-index: 99999999999;
}


.et_slide_in_menu_container ul#mobile_menu_slide {
  display: block !important;
  background: none;
  border: none;
  
  box-shadow: none;
  padding: 0px 40px;
  margin-top: 6rem;
  border-top: 1px solid white;
}
body #page-container .et_slide_in_menu_container {
  background: #CFA353;
  z-index: 999999;
}
.et_menu_containernONE {
  background-color: none !important;
  z-index: 9 !important;
  height: 70px;
  padding: 0;
  margin: 0;
}
#et-info-phone a {

}
#fullscreenpagemodel #leftdetails h1 {

  font-size: 2.5rem;

}
#fullscreenpagemodel #leftdetails p {
  width: 80%;


}
#wecanhelp #wecanhelpinside {
  display: grid;
  width: 90%;
  grid-template-columns: repeat(1,1fr);

}
#modelinglanding {
 
  height: auto;

}
#processsection #processsectioninside h2 {
  
  font-size: 2.5rem;

}
#processsection #processsectioninside #processsectioninsidegrid {

  grid-template-columns: repeat(1,1fr);
  
}
#modelinglanding #modelinglandinginside h2 {
  color: white;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: 'playfair_display_scregular';
  padding: 1rem;
}
.et_header_style_left .logo_container {
   height: auto;
   top:-5px;
   left:-5px;
   
}
.et_header_style_left #logo {
  max-width: 25% !important;
}
#mainslickslider .slick-next {
  right: 37%;

}
#mainslickslider .slick-prev {
  left: 37%;

}
#trusted_builder h2 {

  font-size: 2rem;

}
#trusted_builder p span {
  padding-inline: 2rem;


}
.content {
  max-height: 180px;
  overflow: hidden;
  transition: max-height 0.3s ease;
  margin-bottom: 1.5rem;
}
#modelingsection {
  grid-template-columns: repeat(1,1fr);
  width: 100%;

  margin:2rem auto;
  gap: 1rem;
  
}
#modelingsectionright {
  padding: 0rem;
}
#customhomesectioninside {
  
  grid-template-columns: repeat(1,1fr);
  width: 100%;

  gap: 1rem;
  display: flex;
  flex-direction: column-reverse;
}
  

#customhomesectionright {

  padding: 0rem;
}
#videosection {

  height: auto;
 
}
#videosection video {
  width:100%;
  height: 300px;
}
#customhomesection {

  padding-block: 2rem;
  
}
#awardssection {

  gap: 1rem;

  margin: 3rem auto;

}
#awardssection p {

  line-height: 1.2em;
  text-align:center;
}

#awardssection #awardssectionbox {

  grid-template-columns:100%;
 
}

#awardssection #awardssectionbox > div h5 {

  text-align: center;
}
#customhomesectionleft h2 {

  font-size: 2.5rem;

}
#ctasection #ctasectioninside p {
  width: 100%;

}
section#ourfeatured {

  grid-template-columns: 100%;

}
a.globalb:link, a.globalb:visited {

  padding: 1rem 2rem !important;
  width:fit-content;

  white-space: normal;
  word-wrap: break-word;
  word-break: break-word;
  overflow-wrap: break-word;


}
#centerwrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 90%;
  margin: 0 auto 8rem auto;
  gap: 2rem;
  padding-bottom: 2rem;
  position: relative;
  z-index: 1;
}
#gridlistings {

  grid-template-columns: repeat(1,1fr);

}
.portfolio-single img {
  border-radius: 1rem;
  width: 100%;
  object-fit: cover;
  height: 250px;
}
#contactusform h2 {

  font-size: 2.5rem;

}
section#theteam #meetteamleft h2 {
  width: 100%;
  font-size: 1.5rem;
  color: #0F1125;
  font-family: 'playfair_display_scregular';
  line-height: 1em;
  text-align: left;
  margin: 8rem 0 2rem 0;
}
a.globalb:link, a.globalb:visited {
  text-decoration: none;
  color: white;
  background-color: #CFA353;
  border: 1px solid #CFA353;
  font-size: 1rem;

   
  border-radius: 3rem;
  transition: background-color 0.3s ease;
 
  padding: 1rem 2rem !important;

  white-space: normal;
  word-wrap: break-word;
  word-break: break-word;
  overflow-wrap: break-word;
  width: 100%;
  max-width: 350px;
  display: block;
  box-sizing: border-box;
}
#contactusform #mainbuttons {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  margin-block: 3rem;
  list-style: none;
}
#contactusform p {
  width: 90%;
  text-align: center;
}
section#ourfeatured #ourfeaturedinsideLeft .featured_button_isting{  
  display: flex;
  flex-direction: column;
  gap: 1rem;

 
}

section#theteam { 
  grid-template-columns: repeat(1,1fr);
  }

section#theteam #meetteamleft {
  padding: 3rem 1rem;   
}
section#theteam #meetteamright {
  width: 100%;
  overflow: hidden;
  height: 100%;
  box-sizing: border-box;
  padding: 0;
}
.home-menu a {
   display: none;
}

  .et_header_style_left #logo {
  max-width: 100% !important;
}
.et_header_style_left .logo_container {
  height: auto;
  top: 5px;
  left: 30px;
  width: 100%;
  margin: 0 auto;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#ctafooter #ctafootergridRight {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 1.3rem;
  padding: 1rem 2rem;
  height: inherit;
  box-sizing: border-box;
}
#ctafooter #ctafootergrid {

  grid-template-columns: repeat(1,1fr);
 
}
#ctafooter #ctafootergridRight h2 {  
  margin: 2rem 0 2rem 0;  
}
#footersectionsocialinside {
  height: inherit;
  box-sizing: border-box;
  width: 100%; 
  gap: 1.3em;
  margin: 0 auto;
  max-width: 1711px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 3rem 2rem;
}
#footersectionsocial #footersectionsocial3 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
#footersectionsocial {
  background-color: white;
  height: auto;
  box-sizing: border-box;
  width: 100%;
  border-top: 1px solid #EEE;
}
#footersection #footersectiongrid {

  grid-template-columns: repeat(1,1fr);

} 
#testimonials {

  width: 100%;
  padding:0;
 
}
#testimonials .testiinsides .testibar p {
 
 
  line-height: 1.6em;
    text-align: justify;
    width:80% ;
}
#testimonials .testiinsides .testibar span {
  display: block;
  text-align: center;
}
#footerbottom ul {
  display: flex;

  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 1rem;
  width: 100%;
}
#footersection #footersectiongrid #fg2inside {


  justify-content: flex-start;
 
}
section#ourfeatured #ourfeaturedinsideLeft h2 {

  margin: 2rem 0 0 0;
}
section#theteam #meetteamleft h2 {

  margin: 2rem 0 0rem 0;
}
#ctafooter {

  padding: 1rem 0 3rem 0;
}
}

@media (max-width:681px) {
    
     .fullscreen-menu   nav {
  
    grid-template-columns: 100%;
    height: auto;
    max-width: 90%;
            width: auto;
}
  #logofloatleft {
 
    gap: 2rem;
    position: absolute;
    top: 20px;
    left: 20px;
  }
  #logofloatleft img{
 
width:120px;
height: auto;
  }
  .et_header_style_slide #page-container {
   
    z-index: 9;
  }
     .fullscreen-menu nav ul li {
 
    width: 100%;
    max-width:300px;
    margin:0 auto;
            min-width: 150px;
}



nav ul  {
 
  gap: 0.4rem  !important; 
  display: grid !important;
  grid-template-columns: repeat(2,1fr);
}
 

nav {
  height: 75%;
 
  grid-template-columns: 100% !important;
  gap:0.4rem !important;
}
nav ul li a {
 
  width: 100%;
}
body {
    font-size: 14px; /* Smaller font size for mobile */
}

header, section, footer {
    padding: 10px; /* Reduce padding */
}

nav {
    font-size: 12px; /* Smaller navigation font */
    margin-top: 3rem;
}

.menu-open + .fullscreen-menu {
 
  overflow: auto;
}
}

    /* Styles for tablets (width 768px and below) */
    @media (max-width: 480px) {
      #mainslickslider .slick-next {
        right: 40% !important;
      }
      #mainslickslider .slick-prev {
      left: 40% !important;
      }
      .menu-open + .fullscreen-menu::after {
        bottom: 0;
        background:none!important;
      }
      #fullscreenpagemodel #leftdetails {
    
        justify-content: end;
        align-items: flex-start;
    
       
        width: 90%;
        height: 100%;
  
 
        overflow-y: 300px;
        padding-bottom: 2rem;
      }
    }
/* Styles for mobile phones (width 480px and below) */



/** LOCATIONS PAGES **/

#location_boxes{
  display: block;
  width:100%;
  box-sizing: border-box;
  height: auto;

}
#location_boxes_inside{
  display: flex;
  width:90%;
  box-sizing: border-box;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
justify-self: center;
align-items: center;
gap:1rem;
margin:0 auto;

}
#location_boxes_inside > div{
display: flex;
flex: 1;            /* each box takes equal share of the row */
/* or you can explicitly use width: 20%; */
box-sizing: border-box; /* so padding/borders don’t break the math */
height: 250px;
flex-direction: column;
 
justify-content:baseline;
align-items: baseline;
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
border-radius: 1rem;
 
padding:0.5rem;
}
#location_boxes_inside > div .mappers{
height: 200px;
width: 100%;
box-sizing: border-box;
padding:0;
margin:0;
}
#location_boxes_inside > div .mappers img{
  height: 100%;
  object-fit: cover;
  width: 100%;
  border-radius: 0.4rem;
 
  }
  #location_boxes_inside > div  a{
    text-decoration: none;
    display: block;
    padding: 0.5rem;
    color: black;
    font-weight: bold;
   
    }
    #location_boxes_inside > div  a:hover{
color:rgba(0,0,0,0.7);
     
      }

      #fullscreenpagevideo {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        height: 76vh;
        overflow: hidden;
        z-index: -1; /* send behind other content */
      }
      #fullscreenpagevideo video {
        position: absolute;
        top: 50%;
        left: 50%;
        width: auto;
        height: auto;
        min-width: 100%;
        min-height: 100%;
        transform: translate(-50%, -50%);
        object-fit: cover; /* ensure it covers without distortion */
      }
      #fullscreenpagevideo  #rightdetails{
position: absolute;
left:10px;
bottom:0px;
background-color: rgba(255,255,255,1);
padding:0rem 2rem;
border-left:5px solid #F4B043;
box-shadow: 1rem 1rem 0 0 rgba(255,255,255,0.7);
box-sizing: border-box;
min-width:300px;
z-index: 999;

      }
      
      #fullscreenpagevideo  #rightdetails h1{
        font-family: 'playfair_display_scregular';
font-size: 2.5rem;
      }

      #fullscreenpagevideo  #rightdetails h1  span{
        color:#CFA353;font-size: 2.5rem;
        font-family: 'playfair_display_scregular';
      }

      #innovation{
        display: block;
        box-sizing: border-box;
        width: 100%;
        height: auto;
        margin-top:2rem;

      }
      #innovation_inside{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap:3rem;
        width:90%;
        margin:0 auto;
        height: 100%;
        box-sizing: border-box;
     
        
      }

      @media(max-width:768px){
        #innovation_inside{
        grid-template-columns: repeat(1, 1fr);
        }

      }
      #innovation_inside > div{
        display: flex;
        flex-direction: column;
        gap:1rem;
        height: 100%;
        justify-content: center;
        align-items: flex-start;
        
      }

 
      #innovation_inside   div#righti   img#section1img {
         object-fit: cover;
      height: 500px;
      width: 100%;
      }

      #innovation_inside h2{
      margin-block:0;
        font-size: 2.5rem;
        font-weight:500;
        color: black;
        font-family: 'playfair_display_scregular';
      }
      #innovation_inside p{
      padding:0;
 margin-bottom:1rem;
 
      }
      #innovation_inside ul{
        display: block;
        margin:0 0 2rem 0;
        padding:0;
      
 
      }
      #innovation_inside ul li{
display: flex;   
 justify-content: flex-start;
align-items: center;
gap:1rem;

      
 
      }
#constructor{
  display: block;
        box-sizing: border-box;
        width: 100%;
        height: auto;
        margin-top:7rem;

      }
      #constructor   #constructor_inside{
        display: block;
      
        width:90%;
        margin:0 auto;
        height: 100%;
        box-sizing: border-box;
        text-align: center;
     
        
      }

      #constructor   #constructor_inside h2{
        font-size: 2.5rem;
        text-align: left;
        display: block;
        width: 80%;
        border-left: 5px solid #a97609;
        padding-left: 1rem;
          font-family: 'playfair_display_scregular';
          font-weight: normal;
        }



        
        #constructor   #constructor_inside > p{
          padding:0;
          margin-bottom:1rem;
          width:60%;
          margin:0 auto;
          text-align: center;
          }

          #constructor   #constructor_inside #divp{
            display: flex  ;
                flex-direction: column;
                width:100%;
                margin: 0 auto 3rem auto;
                gap:2rem;
                box-sizing: border-box;
                background-color: rgba(0,0,0,0.03);
                padding:2rem;
 
}
#constructor   #constructor_inside #divp > div{
  display: flex  ;
      flex-direction: column;
      gap: 0rem;
      width:100%;
      box-sizing: border-box;
      padding:1.4rem;
      text-align: left;
      
  }
  #constructor   #constructor_inside #divp > div p{
    margin: 0;
    padding: 0;
    font-size: 1.3rem;
    font-weight: normal;
    margin-bottom: 1rem;
    color: rgba(0, 0, 0, 0.8);
  }
 #constructor  #constructor_inside ul{
list-style: none;
display: flex;
gap:1rem;
width: 100%;
justify-content: center;
align-items: flex-start;
margin:3rem auto 2rem auto;
      }
      #constructor  #constructor_inside ul li{
        list-style: none;
        display: flex    ;
        flex-direction: column;
        gap: 1rem;
        height: 100%;
        width: 400px;
        justify-content: baseline;
        align-items: center;
              }
              #constructor  #constructor_inside ul li img{
        object-fit: cover;
        width: 100%;
        height: 100%;
                      }
              #constructor  #constructor_inside ul li span{
display: block;
 line-height: 1.4em;
box-sizing: border-box;
width:80%;
text-align: center;
font-size: 1.2rem;
font-weight:500;
font-family: 'playfair_display_scregular';
                      }


                      #servicestypes{
                        display: block;
                        width: 100%;
                        height: auto;
                        box-sizing: border-box;
                        background-color: rgba(0, 0, 0, 0.03);
        padding-block:5rem;
        margin-block:5rem;
        
                      }
                      #servicestypes_inside{
                        display: block;
                        width: 90%;
                        margin:0 auto;
                        text-align: center;
        
        
                      }
                      #servicestypes_inside h2{
                      
                        text-align: left;
                        display: block;
                        width: 80%;
                        border-left:5px solid #a97609;
                        padding-left:1rem;
                        font-family: 'playfair_display_scregular';
                        font-weight: normal;
                        font-size: 2.5rem;
                      }
                      #servicestypes_inside p{
                        display: block;
                         
                    font-size: 1.3rem;
                        text-align: center;
        
        
                      }
                      #servicestypes_grid{
                        display: grid;
                        grid-template-columns: repeat(2,1fr);
                        grid-auto-rows: 500px;
                        width:100%;
                        grid:0;
                        box-sizing:
        
                        
                      }

                      
      @media(max-width:768px){
        #servicestypes_grid{
        grid-template-columns: repeat(1, 1fr);
        }

      }
                      #servicestypes_grid .imgfit img{
                        object-fit: cover;
                        width: 100%;
                        height: 100%;

                      }

                      #servicestypes_grid .textfit {
                  display:flex;
                  flex-direction: column;
                  justify-content: center;
                  align-items:baseline;
                  gap:1rem;
                  height: 100%;
                  text-align: left;
                  box-sizing: border-box;
                  padding:4rem;

                      }

                      @media(max-width:768px){
                        #servicestypes_grid .textfit {
                          padding:0rem;

                        }

                      }
                      #servicestypes_grid .textfit h2{
                        text-align: left;
                        font-size: 2.5rem;

                      }
                      #servicestypes_grid .textfit p {
                        text-align: left;

                      }







#loc_projects{
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box;
 
padding-block:5rem;
margin-block:5rem;
}
#loc_projects #loc_projects_inside{
  display: block;
  width: 90%;
  margin:0 auto;
  text-align: center;
}
#loc_projects #loc_projects_inside h2{
 
text-align: left;
display: block;
width: 60%;
border-left:5px solid #a97609;
padding-left:1rem;
font-family: 'playfair_display_scregular';
font-weight: normal;
font-size: 2.5rem;
}
#loc_projects #loc_projects_inside ul{
display:grid;
grid-template-columns: repeat(3,1fr);
grid-auto-rows: auto;
 
gap:2rem;
list-style: none;
width:100%;
box-sizing: border-box;
margin:0;
padding:0;
}
#loc_projects #loc_projects_inside ul li{
width:100%;
height:inherit;
}
#loc_projects #loc_projects_inside ul li a{
text-decoration: none;
position: relative;
height: inherit;
display: block;
  }
#loc_projects #loc_projects_inside ul li a img{
  object-fit: cover;
  width:100%;
  height: 100%;
  }
  #loc_projects #loc_projects_inside ul li a span{
position: absolute;
top:82%;
left:0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 80px;
font-size: 2rem;
width: 100%;
padding:0;
z-index: 9999;
background-color: rgba(255,255,255,0.85);
color:#a97609;
font-weight:bolder;
text-align: center;
margin:0;
      }

#teamwork{
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box; 
padding-block:5rem;
margin-block:5rem;
 background-color: rgba(0,0,0,0.04);
}
#teamwork_inside{
  display: block;
  width: 90%;
  margin:0 auto;
  text-align: center;
}
#teamwork_inside h2{
 
  text-align: left;
  display: block;
  width: 80%;
  border-left:5px solid #a97609;
  padding-left:1rem;
  font-family: 'playfair_display_scregular';
  font-weight: normal;
  font-size: 2.5rem;
}
#teamwork_inside p{

display: block;
text-align: justify;
  line-height: 1.5em;
  font-size: 1.2rem;
}


#teamwork_inside_grid{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid:2rem;
  grid-auto-rows: auto;
  margin-block:3rem;
}

@media(max-width:768px){
  #teamwork_inside_grid{
    grid-template-columns: repeat(1,1fr);

  }

}

#teamwork_inside_grid #teamwork_inside_grid_left{
display: block;
padding-bottom:3rem;
}
#teamwork_inside_grid #teamwork_inside_grid_left #miguelloc{
  position: relative;
  left:-80px;
  top:50px;

}


@media(max-width:768px){
  #teamwork_inside_grid #teamwork_inside_grid_left #miguelloc{
    left:0px;

  }

}
#teamwork_inside_grid #teamwork_inside_grid_right{
display: flex;
flex-direction: column;
justify-content: center;
align-items: baseline;
height: 100%;
}
#teamwork_inside_grid #teamwork_inside_grid_right p{
  font-size: 1.5rem;
  text-align: left;
  background-color: white;
  border-left:10px solid #a97609;
  padding-left:1rem;
  color:rgba(0,0,0,0.7);
 padding-block:1.5rem;
  box-shadow: rgba(66, 21, 21, 0.24) 0px 3px 8px;

}
#teamwork_inside_grid #teamwork_inside_grid_right p strong{
  font-size: 2rem;
  text-align: left;
margin-top:1rem;
  display: block;
  color:black;
  font-weight: bolder;

}

#inspiration{
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box; 
padding-block:5rem;
margin-block:5rem;
 background-color: rgba(0,0,0,0.04);
}
 
#inspiration_inside{
  display: block;
text-align: justify;
  line-height: 1.5em;
  font-size: 1.2rem;
  margin:0 auto;
  width:90%;
}
#inspiration_inside h2{
 
  text-align: left;
  display: block;
  width: 80%;
  border-left:5px solid #a97609;
  padding-left:1rem;
  font-family: 'playfair_display_scregular';
  font-weight: normal;
  font-size: 2.5rem;
  line-height: 1em;
}
#inspiration_inside p{

display: block;
text-align: justify;
  line-height: 1.5em;
  font-size: 1.2rem;
}
        
#inspiration_inside  #inspiration_inside_grid {

  display:block;
 
  }  



  /* CSS to create a 90%‐width grid, total height 1000px, 
   with the exact template areas shown in your example */
.grid-container {
  width: 100%;
  height: auto;
  margin: 0 auto;              /* center container if you like */
  display: grid;

  /* Three columns: left column is 40% of the width; 
     the other two columns are each 30% */
  grid-template-columns: 40% 30% 30%;

  /* Three rows, using “fr” so that row heights sum to 1fr+1fr+2fr = 4fr => 
     total 1000px → roughly 250px, 250px, 500px. 
     But since the left tile spans rows 1+2, 
     that means it will be 2fr+1fr = 750px tall. */
  grid-template-rows: 2fr 1fr 1fr;

  /* Define named areas in a 3×3 layout */
  grid-template-areas:
    "left   top1   top2"
    "left   mid    mid"
    "bottom bottom right";

  /* Optional gap between each grid item */
  gap: 10px;
}
@media(max-width:768px){
  .grid-container {
    grid-template-columns: 100%;
    grid-template-areas:unset;
    
  }

}
/* Assign each child to its grid‐area */

.item-left   { grid-area: left;   }
.item-top1   { grid-area: top1;   }
.item-top2   { grid-area: top2;   }
.item-mid    { grid-area: mid;    }
.item-bottom { grid-area: bottom; }
.item-right  { grid-area: right;  }
@media(max-width:768px){
  .item-left   { grid-area:unset   }
  .item-top1    { grid-area:unset   }
  .item-top2    { grid-area:unset   }
  .item-mid     { grid-area:unset   }
  .item-bottom { grid-area:unset   }
  .item-right   { grid-area:unset   }

}
/* If you’re placing <img> tags inside each item, you can also force them 
   to fill and maintain aspect‐ratio, for example: */
.grid-container > div img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 1rem;
}
     


 /**PROJECT BLOG**/
 #projectvision{
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box; 
padding-block:3rem;
margin-block:2rem;
 
}
#projectvision h2{
  font-family: 'playfair_display_scregular';
font-size: 2.5rem;
text-align: center;
}
.blog-container {
  display: flex;             /* enable flex layout */
  width: 90%;               /* fill parent width */
  height: auto;            /* fixed height for all boxes */
  box-sizing: border-box;
  margin:0 auto;
  gap:2rem;
}

 
.blog-box {
  flex: 1;                             /* each box is 1 fraction of total width */
  display: flex;                       /* so we can arrange image + content vertically */
  flex-direction: column;              /* stack image on top, content below */
  margin: 0 10px;                      /* optional horizontal gap between boxes */
  box-shadow: 0 2px 8px rgba(0,0,0,0.15); /* subtle drop‐shadow */
  border-radius: 1rem;                  /* slightly round corners (optional) */
  background-color: #fff;              /* white background */
  overflow: hidden;                    /* ensures rounded corners on image if needed */
}

 
.blog-image {
  flex: 0 0 50%;        /* do not grow, do not shrink; fixed 40% of parent’s height */
  overflow: hidden;     /* crop any overflow */
 
}

.blog-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;    /* ensure the image covers its container */
  display: block;
  box-shadow: none !important;
}
 
 
.blog-content {
  flex: 1;                        /* takes all remaining space */
  padding: 2rem;                  /* give some breathing room */
  display: flex;
  flex-direction: column;         /* so h3 + p stack vertically */
  justify-content: flex-start;    /* start from the top */
  color: #333;                    /* dark grey text */
  font-family: Arial, sans-serif; /* example font */
  overflow-y: auto;
  height: 100%;
margin-bottom: 2rem;
}

 
.blog-content h3 {
  margin: 0 0 8px 0;
  font-size: 1.8rem;
  line-height: 1.2;
}

 
.blog-content .highlight {
  color: #e67e22;   /* orange accent (adjust to your brand color) */
  font-weight: 600;
}

 
.blog-content p {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.5;
  flex: 1;     /* if you want the paragraph to fill leftover space, useful if you add a “Read more” button at the bottom */
}

 
.blog-container > .blog-box:first-child {
  margin-left: 0;
}
.blog-container > .blog-box:last-child {
  margin-right: 0;
}

 
@media (max-width: 900px) {
  .blog-container {
    flex-direction: column;
    height: auto;  /* let each box grow naturally */
  }
  .blog-box {
    margin: 10px 0; /* vertical spacing between stacked boxes */
    height: 500px;  /* keep each box 500px tall on narrow screens, if desired */
  }
}

/** Testimonials lsider **/

#testimonial_slider{
  display:block;
  width:100%;
 padding-block:5rem;
  background: linear-gradient(to bottom, #f5f5f5, #e0e0e0); /* subtle grey gradient */
  
}
/* --------------- WRAPPER & TYPOGRAPHY --------------- */
.testimonials-wrapper {
  width: 1200px;
  /*max-width: 1200px;  */     /* adjust as needed */
  margin: 0 auto;
  padding: 40px 20px;      /* top/bottom 40px, sides 20px */
  background: linear-gradient(to bottom, #f5f5f5, #e0e0e0); /* subtle grey gradient */
}
@media(max-width:768px){
  .testimonials-wrapper {
    width: 100%;
  }

}
.testimonials-wrapper h2 {
  text-align: center;
  font-size: 2rem;
 
  margin-bottom: 8px;
  font-family: 'playfair_display_scregular';
  font-weight: normal;
}

.testimonials-wrapper h2 strong {
  font-weight: 700;       /* bold the location */
}

.testimonials-wrapper .subtitle {
  text-align: center;
  color: #555;
  font-size: 1rem;
  margin-bottom: 30px;
  line-height: 1.4;
}

/* --------------- SLICK SLIDER CONTAINER --------------- */
.testimonial-slider {
  position: relative;      /* needed for positioning arrows */
}

/* --------------- INDIVIDUAL SLIDE LAYOUT --------------- */
.slide {
  display: flex !important;
  background-color: #fff;
  border-radius: 1rem;
  overflow: hidden;
  height: auto;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  justify-content: center;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
}
@media(max-width:768px){
  .slide {
    flex-direction: column;
  }

}
/* -------------- LEFT SIDE: PHOTO -------------- */
.slide-photo {
  flex: 0 0 300px;       /* fixed width for photo column */
  overflow: hidden;
}

.slide-photo img {
  /* width: 100%;
  height: 100%;
  object-fit: cover;     ensure the avatar fills its container */
  display: block;
}

/* -------------- RIGHT SIDE: TEXT CONTENT -------------- */
.slide-content {
  flex: 1;               /* fill remaining space */
  padding: 30px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.slide-content h3 {
  font-size: 1.1rem;
  line-height: 1.4;
  color: #333;
  position: relative;
  margin-bottom: 16px;
  font-style: italic;
}

.slide-content h3 .highlight {
  font-weight: 700;
  color: #e67e22;        /* an accent/orange color for “Ozzy’s Golden Construction” */
}

/* Decorative vertical bar on the left of the quote text */
.slide-content h3::before {
  content: "";
  position: absolute;
  left: -20px;
  top: 0;
  width: 4px;
  height: 100%;
  background-color: #e67e22;
}

/* Author line (name + location) */
.slide-content .author {
  font-size: 0.9rem;
  color: #777;
  font-weight: 600;
  margin-top: auto;      /* push author to bottom if you add more text later */
}

/* --------------- SLICK’S DEFAULT DOTS --------------- */
.slick-dots {
  display: flex !important;
  justify-content: center;
  margin-top: 20px;
}

.slick-dots li button:before {
  font-size: 10px;
  color: #bbb;           /* default is grey */
  opacity: 1;
}

.slick-dots li.slick-active button:before {
  color: #e67e22;        /* active dot is orange */
}

/* --------------- SLICK ARROWS --------------- */
.slick-prev,
.slick-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(255, 255, 255, 0.8);
  border: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  z-index: 10;
  cursor: pointer;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.slick-prev {
  left: -18px;   /* half the arrow’s width, so it sits just outside the slide */
}

.slick-next {
  right: -18px;
}

/* Use CSS-generated arrows (you can customize to any icon set) */
.slick-prev:before,
.slick-next:before {
  font-family: "slick";       /* slick’s built-in font */
  font-size: 20px;
  line-height: 1;
  color: #333;
}

.slick-prev:before {
  content: "←";   /* left arrow */
}

.slick-next:before {
  content: "→";   /* right arrow */
}

/* Hide default outline on arrow buttons */
.slick-prev:focus,
.slick-next:focus {
  outline: none;
}



/*** LIst container **/

 #listcontainer{
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box; 
padding-block:5rem;
margin-block:5rem;
 
 }

/*---------------------------------------
  2) CONTAINER
---------------------------------------*/
.container {
  width: 1200px;
  margin: 0 auto;            /* center in the viewport */
  padding: 40px 0;           /* 40px top/bottom spacing */
  font-family: Arial, sans-serif;
  color: #333;
}
@media(max-width:768px){
  .container {
    width: 100%;
 
  }
}
/*---------------------------------------
  3) MAIN HEADING
---------------------------------------*/
.main-heading {
  font-size: 1.8rem;
  line-height: 1.5;
  text-align: center;
  margin-bottom: 40px;
 
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: 'playfair_display_scregular';
  font-weight: normal;
}

/*---------------------------------------
  4) FEATURE ROW (each horizontal band)
---------------------------------------*/
.feature-row {
  display: flex;
  min-height: 200px;          /* ensure at least 200px tall */
  margin-bottom: 20px;        /* gap between rows */
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  overflow: hidden;
}
@media(max-width:768px){
  .feature-row {
    flex-direction: column;
  }

}
/*---------------------------------------
  5) LEFT SIDE: IMAGE
---------------------------------------*/
.row-image {
  flex: 0 0 250px;            /* fixed 250px wide column */
  overflow: hidden;
}

.row-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;          /* crop/scale image to fill the 250px × 100% height */
  display: block;
}

/*---------------------------------------
  6) RIGHT SIDE: TEXT CONTENT
---------------------------------------*/
.row-content {
  flex: 1;                    /* take remaining horizontal space */
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;    /* vertically center if less text */
}

/* Row title (h3) */
.row-content h3 {
  font-size: 1.1rem;
  margin-bottom: 10px;
  font-weight: 600;
  line-height: 1.3;
  color: #222;
}

/* Paragraph text */
.row-content p {
  font-size: 0.95rem;
  line-height: 1.5;
  color: #555;
}

/*---------------------------------------
  7) OPTIONAL: REMOVE BOTTOM MARGIN ON LAST ROW
---------------------------------------*/
.feature-row:last-child {
  margin-bottom: 0;
}


/*** QA **/

#questionair{
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box; 
padding-block:5rem;
margin-block:5rem;
}


.faq-container {
  width: 1200px;              /* fixed width as requested */
  margin: 40px auto;          /* center horizontally with some top/bottom space */
}
@media(max-width:768px){
  .faq-container {
    width: 100%;
  }

}
.faq-title {
  text-align: center;
  font-size:2.5rem;
  line-height: 1.3;
  letter-spacing: 1px;
  margin-bottom: 30px;
 
  text-transform: uppercase;
  color: #222;
  font-family: 'playfair_display_scregular';
  font-weight: normal;
}

.faq-title span {
  display: block;             /* force “FORT LAUDERDALE” onto its own line */
  font-weight: 700;  font-family: 'playfair_display_scregular';
  color: #000;
}

/*-----------------------------------
  3) EACH FAQ ITEM
-----------------------------------*/
.faq-item + .faq-item {
  margin-top: 10px;           /* small gap between items */
}

.faq-item {
  border-bottom: 1px solid #ccc;
  overflow: hidden;
}

/*-----------------------------------
  4) QUESTION ROW (CLICKABLE)
-----------------------------------*/
.question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 16px 20px;
  font-size: 1.71rem;
  font-family: inherit;
  color: #222;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

/* Remove default focus outline but keep accessibility */
.question:focus {
  outline: 2px dashed #888;
  outline-offset: 2px;
}

/* The plus/minus icon on the right */
.question .icon {
  font-size: 1.2rem;
  line-height: 1;
  margin-left: 10px;
  color: #888;
}

/* When item is “active” (open), change icon color if you like */
.faq-item.active .question .icon {
  color: #444;
}

/* Add a simple hover effect on the question row */
.question:hover {
  background-color: rgba(0, 0, 0, 0.02);
}

/*-----------------------------------
  5) ANSWER SECTION
-----------------------------------*/
.answer {
  max-height: 0;                      /* start collapsed */
  padding: 0 20px;
  color: #555;
  font-size: 1.2rem;
  line-height: 1.5;
  overflow: hidden;                   /* hide content when collapsed */
  transition: max-height 0.3s ease, padding 0.3s ease;
}

/* When .active, allow the answer to expand */
.faq-item.active .answer {
  padding: 12px 20px 20px;           /* top/bottom padding once open */
  max-height: 500px;                  /* large enough to show the entire text */
}

/* If you want a thin separator line between question text and answer text */
.faq-item.active .answer {
  border-top: 1px solid #e0e0e0;
}
/*** global buttons**/

/** Quote Box **/

/* 1) Reset any default paragraph margin so we can control spacing exactly */
.quote-box p {
  margin: 0;
}

/* 2) Main container styling */
.quote-box {
  position: relative;
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  padding: 20px 24px 20px 32px;
  margin: 0 auto;
  max-width: 1220px;
  box-sizing: border-box;
}                    /* adjust as needed, or use width:100% */
 

/* 3) The vertical accent bar (yellow) on the left */
.quote-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 6px;                              /* thickness of the bar */
  height: 100%;
  background-color: #f1c40f;               /* a nice golden yellow (you can swap your own) */
  border-top-left-radius: 8px;             /* match the container’s top corner radius */
  border-bottom-left-radius: 8px;          /* match the container’s bottom corner radius */
}

/* 4) Quote text itself */
.quote-box p {
  font-size: 1rem;                         /* ~16px if your root font is 16px */
  line-height: 1.5;                        /* makes multi-line quotes more readable */
  color: #333333;                          /* dark grey for the body of the quote */
}

/* 5) Citation styling (right-aligned, bold) */
.quote-box .cite {
  display: block;                          /* push onto its own line */
  margin-top: 12px;                        /* spacing between the quote and the attribution */
  font-weight: 700;
  text-align: right;
  color: #111111;                          /* slightly darker for emphasis */
  font-size: 0.95rem;                      /* a tad smaller than the quote text */
}

/*** hero **/
.hero {
  width: 100%;
  background: white;
  color: black;
  text-align: center;
  padding: 10rem 2rem;
}
.hero h2 {
 
  font-weight: normal;
  font-family: 'playfair_display_scregular';
  font-size: 2.5rem;
  line-height: 1.2;
  margin-bottom: 24px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.hero .cta-btn {
  display: inline-block;
  background-color:#CFA353;
  color: white;
  font-weight: 600;
  padding: 1.2rem 3rem;
  border-radius: 9999px; /* pill shape */
  font-size: 1rem;
  transition: background-color 0.2s ease;
}
.hero .cta-btn:hover {
  background-color: #d97706; /* amber-600 */
}

/* ---------------------- 3. CONTENT SECTION (FORM + MAP) ---------------------- */
.content-section {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  background-color: #fafafa;
  padding: 60px 20px;
  justify-content: center;
  gap: 40px;
}

/* 3a. LEFT COLUMN: CONTACT FORM */
.contact-form-container {
  flex: 1 1 300px; /* grow/shrink, base width 300px */
  max-width: 500px;
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  padding: 32px;
}
.contact-form-container h2 {
  font-size: 1.5rem;
  margin-bottom: 12px;
  font-weight: 600;
  color: #111;
}
.contact-form-container p {
  font-size: 1rem;
  margin-bottom: 24px;
  color: #555;
}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea {
  width: 100%;
  padding: 12px 14px;
  margin-bottom: 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 1rem;
  transition: border-color 0.2s ease;
  box-sizing: border-box;
 
}
.contact-form input[type="text"]:focus,
.contact-form input[type="email"]:focus,
.contact-form textarea:focus {
  outline: none;
  border-color: #1e40af; /* blue-800 */
}
.contact-form textarea {
  min-height: 100px;
  resize: vertical;
}
.contact-form button[type="submit"] {
  background-color: #CFA353;
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  padding: 12px 28px;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.contact-form button[type="submit"]:hover {
  background-color: #d97706; /* amber-600 */
}

/* 3b. RIGHT COLUMN: MAP + INFO */
.map-container {
  flex: 1 1 300px;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
/*  Embedded Google Map */
.map-container .map-embed {
  width: 100%;
  height: 380px;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
/*  Contact Info */
.contact-info {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.contact-info .info-row {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #444;
  font-size: 1rem;
}
.contact-info .info-row i {
  font-size: 1.2rem;
  color: #1e40af; /* blue-800 */
  min-width: 24px;
  text-align: center;
}
/*  Social Icons Row */
.social-icons {
  display: flex;
  gap: 16px;
  margin-top: 8px;
}
.social-icons a {
  color: #444;
  font-size: 1.5rem;
  transition: color 0.2s ease;
}
.social-icons a:hover {
  color: #1e40af; /* on hover, blue-800 */
}

/* ---------------------- 4. RESPONSIVE ---------------------- */
@media (max-width: 900px) {
  .content-section {
    flex-direction: column;
    align-items: center;
  }
  .map-container {
    max-width: 100%;
  }
  .contact-form-container {
    max-width: 100%;
  }
}



/** Iconic page **/
#listicons{
  width: 100%;
  background: linear-gradient(to bottom, #f5f5f5, #e0e0e0);
  color: #fff;
 
  padding: 10rem 2rem;
  text-align: left;
}

/*========================================
  CONTAINER
  ========================================*/
  .containerimage {
 
   width: 1200px;
    margin: 0 auto;
    padding: 20px 0;
  }
  @media(max-width:768px){
    .containerimage {
      width: 100%;
    }
  
  }
  /*========================================
    HEADER STYLES
    ========================================*/
  .main-headingimage {
    font-size: 2.5rem;        /* h2 at 2.5rem */
    text-align: center;
 
    line-height: 1.2;
    margin-bottom: 20px;
    color:black;
    font-family: 'playfair_display_scregular';
    font-weight: normal;
  }
  
  /*========================================
    INTRO PARAGRAPH
    ========================================*/
  .intro {
    margin: 0 auto 30px;
    width: 1200px;
    color: #444;
    text-align: justify;
  }
  
  /*========================================
    TWO-COLUMN CONTENT
    ========================================*/
  .contentimage {
    display: flex;
    flex-wrap: wrap;
    gap: 0px;
    
  }
  
  /* LEFT COLUMN */
  .text-column {
    flex: 1 1 300px;      /* grow, shrink, basis */
    background-color: #ffffff;
    padding: 20px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  }
  
  /* Highlighted paragraphs with left border */
  .highlight {
    border-left: 4px solid #f5a623;   /* yellow-orange accent */
    padding-left: 16px;
    margin-bottom: 20px;
    color: #333;
  }
  
  /* Remove bottom margin from last highlight */
  .text-column .highlight:last-of-type {
    margin-bottom: 0;
  }
  
  /* RIGHT COLUMN */
  .image-column {
    flex: 1 1 300px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  /* Make image fluid */
  .image-column img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 4px;
  }



.containericon {
 width: 1200px;
  margin: 0 auto;
  text-align: left;
}
@media(max-width:768px){
  .containericon {
    width: 100%;
  }

}
.intro-text {
  text-align: left;
  margin-bottom: 0px;
  color: #555;
  font-size: 2rem;
  font-weight: bold;
}

.card {
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  padding: 20px 25px;
  margin-bottom: 30px;
}

.card h2 {
  font-size: 1.1rem;
  margin-bottom: 15px;
  color: #333;
}

/* ====================================================
   BULLET LIST WITH ICONS
   ==================================================== */
.icon-list {
  list-style: none;
}

.icon-list li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 15px;
}

.icon-list li:last-child {
  margin-bottom: 0;
}

.icon-list li .icon {
  font-size: 1.5rem;
  color: #1f6feb; /* default blue — change per‐item inline if desired */
  width: 36px;
  flex-shrink: 0;
}

.icon-list li .text {
  margin-left: 12px;
  color: #333;
 
  font-size: 1.2rem;
 
}

/* ====================================================
   FOOTER TEXT & BUTTON
   ==================================================== */
.footer-text {
  font-size: 1.2rem;
  color: #555;
  margin-bottom: 10px;
  line-height: 1.5;
}

.testimonial {
  font-size: 1.2;
  font-style: italic;
  color: #444;
  margin-top: 15px;
}

.testimonial span {
  font-style: normal;
  font-weight: bold;
}

.btn-container {
  text-align: center;
  margin-top: 30px;
  margin-bottom: 40px;
}

.btn-cta {
  background-color: #CFA353;/* golden/orange */
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  padding: 1.5rem 3rem;
  border: none;
  border-radius: 2rem;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.btn-cta:hover {
  background-color: #e0901f;
}

/* GLOABL BUTTON */

a.flexiblebutton{
  text-decoration: none;
  color:white;
  background-color: #CFA353;
  border:1px solid #CFA353;
  font-size: 1.5rem;
   
 
  padding:1.5rem 3rem  ;
  border-radius:3rem;
  transition: background-color 0.3s ease; /* Smooth transition */
 
 width:auto;
  text-align: center;
  display: inline-block;
}
a.globalbuttonc:link,    a.globalbuttonc:visited {
  text-decoration: none;
  color:white;
  background-color: #5E5E5E;
  border:1px solid #5E5E5E;
  font-size: 1rem;
   
  padding: 1rem 1rem;
  border-radius:0rem;
  transition: background-color 0.3s ease; /* Smooth transition */
 
  min-width:fit-content;
 
  text-align: center;
  display: inline-block;
}
a.globalbuttonc:hover {
 
  background-color: #3C3D3D;
  border:1px solid #3C3D3D;
  
}
a.globalbuttona:link,    a.globalbuttona:visited,a.globalb:link,    a.globalb:visited{
  text-decoration: none;
  color:white;
  background-color: #004D7F;
  border:1px solid #004D7F;
  font-size: 1rem;
   
 
  padding: 1.2rem 1rem;
  border-radius:0rem;
  transition: background-color 0.3s ease; /* Smooth transition */
 
  min-width: 210px;
 
  text-align: center;
  display: inline-block;
      }


      a.globalbuttona:hover,  a.globalb:hover  {
 
        background-color: #063F63;
        border:1px solid #063F63;
        
      }
      a.globalbuttona:hover,     a.globalbuttona:focus{
          color:white;
          border:1px solid #CFA353;
          background-color:#0F1125  ;
          opacity:1 !important;
      
      }




      a.globalbuttona2:link,    a.globalbuttona2:visited, a.globalb2:link,    a.globalb2:visited{
          text-decoration: none;
          color:#000;
          background-color: #FFF;
          border:1px solid #CFA353;
          font-size: 1rem;
           
          
          padding:1rem 1rem !important;
    
          transition: background-color 0.3s ease; /* Smooth transition */
      
          min-width: 250px;
          text-align: center;
          display: inline-block;
              }
              a.globalbuttona2:hover,     a.globalbuttona2:focus{
                  color:white;
                  border:1px solid #CFA353;
                  background-color:#0F1125  ;
                  opacity:1 !important;
              
              }

              #fullscreenpagesubpageShadow{
              position: absolute;
              background: rgba(0, 0, 0, 0.2);
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;

              }
  /** slider box **/

  #toggleBtn {
    position: fixed;
    top: 1.5rem;
    right: 2rem;
    z-index: 99999;
    background: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    width: 30px;
    height: 24px;
    padding: 0;
  }
  #toggleBtn span {
    display: block;
    width: 100%; 
    height: 4px;
    background: #FFF;
    border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  /* Animated X */
  #toggleBtn.open span:nth-child(1) {
    transform: translateY(10px) rotate(45deg);
  }
  #toggleBtn.open span:nth-child(2) {
    opacity: 0;
  }
  #toggleBtn.open span:nth-child(3) {
    transform: translateY(-10px) rotate(-45deg);
  }

  /* Sliding panel from left */
  #sidePanel {
    position: fixed;
    top: 0;
    left: 0;
    width: 360px;
    height: 100vh;
    background: rgba(0, 0, 0, 0.9);
  
    /* start off‐screen & invisible */
    transform: translateX(-100%);
 
  
    /* animate both slide and fade */
    transition: all 0.3s ease;
    z-index: 999999;

  }
  #sidePanel.open {
    transform: translateX(0);
  }
  /* Panel content */
  #sidePanel h2 {
    color: white;
    padding: 1rem;
    margin: 0;
  }
  #sidePanel p {
    color: white;
    padding: 0 1rem;
  }

  
     .pure-menu.custom-display {
       position: relative; /* for its absolutely‑positioned submenus */
 width:250px;
 padding-right:5rem;    transition: transform 0.3s ease;
     }
     .pure-menu-has-children > .pure-menu-link::after {
       content: '\276F' !important;   margin-right: .5em;
       transition: transform .2s;
  
     font-size: 1.7rem !important;
     position: absolute;
     right: 0;
     }
     .pure-menu-has-children.open > .pure-menu-link::after {
       transform: rotate(90deg);    transition: transform 0.3s ease;
     }
     .pure-menu-has-children { position: static !important; }
     .pure-menu-children {
       position: absolute !important;
       top: 0; left: 100%; display: none;
       white-space: nowrap; 
 
     padding-right: 5rem;    transition: all 0.3s ease;
       
     }
     .pure-menu-has-children.open > .pure-menu-children {
       display: block;
       visibility: visible;         /* show immediately */
       opacity: 1;                  /* fade in */
       transform: translateX(0);    /* slide into place */
       transition: transform 0.3s ease, opacity 0.3s ease;
     }

     .pure-menu-has-children:nth-child(2){
      margin-bottom:1.8rem;
     }
 .pure-menu-link {
  
     font-size: 1.8rem;
 }
 .s2link{
  font-size: 1.3rem !important;
 }
 .s1link{
  font-size: 1.5rem !important;
 }
 .pure-menu-children {
  background-color: black;
  position: absolute !important;
  top: 0; left: 100%;
  white-space: nowrap;
  background: transparent;
  padding-right: 5rem;
  transition: transform 0.3s ease, opacity 0.3s ease;

  /* new transitionable properties */
  visibility: hidden;          /* hide from layout & screen readers */
  opacity: 0;                  /* start fully transparent */
  transform: translateX(10px); /* shift in from right */
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.pure-menu-link {
  color: #777;
}
  .pure-menu-link:hover{
    color:white !important;
    background: transparent !important;
  }
  .pure-menu-link:focus{
    color:white !important;
    background: transparent !important;
  }

/** Impossible **/

  #impossible{
    display: block;
    width: 100%;
    box-sizing: border-box;
    height: auto;
    background:white;
    padding-block: 7rem;
  }
  
  #impossible  #impossible_inside{
    display: block;
    width: 90%;
    box-sizing: border-box;
    height: auto;
      margin:0 auto;
    text-align: center;
    color:white;
  }
  #impossible  #impossible_inside h2{
  font-size:1.9rem;
  font-weight: 500;
  color:black;
  margin-bottom: 5rem;
  text-align: center;
  }
  #impossible  #impossible_inside > p{
    font-size: 1.5rem;
    font-weight:500;
    color:black;
    text-align: left;
    margin-bottom: 5rem;
    }
    #impossible  #impossible_slider  > div{
        position:relative;
    }
    #impossible  #impossible_slider .slick-slide > div{
      display: inherit;
      padding-inline: 1rem;
      width:100%;
    }
    #impossible  #impossible_slider .slick-slide > div > div img{
    width:100% !important;
    }
  #impossible  #impossible_inside_gallery{
    display: block;
    width: 100%;
    box-sizing: border-box;
    height: auto;
    color:white;
    text-align: center;
 
  }
  #impossible  #impossible_inside_gallery > p{ 
    color: black;
    text-align: center !important;
    width: 60%;
    margin: 8rem auto 0 auto;
    font-size: 1.9rem;
    font-weight: 500; 
  }
  #impossible .slick-slide > div{
    padding: 0.3rem;
    position: relative;
  }
  #impossible .slick-slide  img {
    display: block;
    width: auto;
    padding: 0;
    height: 100vh;
    
  }

  #impossible .slick-prev {
    left: 2%;
    
    background: url(../images/arrow-left-circle.svg) no-repeat center center;
   
    width: 60px;
    height: 60px;
    background-size: contain;
    z-index: 999999;
    filter: brightness(0) invert(1);
  } 
  #impossible .slick-next::before
  {
    content: '' !important;
  }
  #impossible .slick-next {
  right: 2%;
    background: url(../images/arrow-right-circle.svg) no-repeat center center;
    width: 60px;
    height: 60px;
    background-size: contain;
    z-index: 999999;
    filter: brightness(0) invert(1);
  } 
  #impossible .slick-prev::before
  {
    content: '' !important;
  }
  #impossible   .slider-box{
position: relative;
overflow: hidden;

 

  }
  #impossible .shadow-slider{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index: 2;
    background: #01090d;
background: linear-gradient(180deg, rgba(1, 9, 13, 0) 0%, rgba(0, 0, 0, 1) 100%);

  }
  #impossible .impossible_slider_details {
    position: absolute;
    left: 50%;
    bottom: 2rem;
    transform: translateX(-50%);
    width: 100%;
    height: auto; /* Or whatever height you want */
    z-index: 999999;
    color: white;
   box-sizing: border-box;
}

#impossible .impossible_slider_details h2 {
padding-inline:2rem;
text-align: left;
margin-bottom: 1rem;
}
#impossible .impossible_slider_details p {
  padding-inline:2rem;
  font-size:1rem;
  color:rgba(255,255,255,0.7);
  }
  
/** Builder **/

#guide_builder{
  display: block;
  width: 100%;
  max-width: 100%;
  height:auto;
  box-sizing: border-box;
  background: #1a7aab;
  background: linear-gradient(90deg, rgba(26, 122, 171, 1) 0%, rgba(0, 78, 128, 1) 100%);
  padding-block:7rem;
}

#guide_builder #guide_builder_inside{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap:1rem;
  width:80%;
  margin:0 auto;
 

}
#guide_builder #guide_builder_inside > div {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap:1rem;
 }
 #guide_builder #guide_builder_inside > div #guide_details {
 
   }
   #guide_builder #guide_builder_inside > div #guide_details form {
    display: flex;
    flex-direction: column;
    gap:1rem;
    width: 400px;
    margin-top: 2rem;
   }
   #guide_builder #guide_builder_inside > div #guide_details form  input[type=text] {
   width:400px !important;
   min-width: 400px !important;
   max-width: 400px !important;
   padding-inline: 0 !important;
   padding-block:1rem  ;  
   text-indent: 1rem;
 
   }
   #guide_builder #guide_builder_inside > div #guide_details form  input[type=button] {   
    padding-block:1.3rem;  
    width:400px !important;
   min-width: 400px !important;
   max-width: 400px !important;
    background-color: #DF9C1E;
    font-weight:bold;
    color:white;
    border:0;
     }

     #guide_builder #guide_builder_inside > div #guide_details form  input[type=button]:hover { 

      background-color: #D08A05;
     }
   #guide_builder #guide_builder_inside > div #guide_details h2 {
 font-size:4rem;
 color:white;
 font-weight: bold;
   }
   #guide_builder #guide_builder_inside > div #guide_details h2 span {
 color:#DF9C1E ;
 font-size: inherit;
 font-weight: inherit;
   }
   #guide_builder #guide_builder_inside > div #guide_details p {
 color:white;
 font-weight:500;
 font-size:1.5rem;
   }

#guide_builder #guide_builder_inside div img {
 width:60%;
 max-width:700px;
 margin:0 auto;
}

/** Mainheader1 **/

#mainheader1{
  display: block;
  width: 100%;
  max-width: 100%;
  height:auto;
  box-sizing: border-box;
 
  background: white;
  padding-block:10rem;

}

#mainheader1 #mainheader1_inside{
  display: block;
 
 
  width:90%;
  margin:0 auto;
}


#mainheader1 #mainheader1_inside h2{
  font-size:2.5rem;
  font-weight: 500;
  color:black;
  margin-bottom: 1rem;
  text-align: left;
}

#mainheader1 #mainheader1_inside p{
  font-size: 1.5rem;
  font-weight:normal;
  color: rgba(0, 0, 0, 0.7);
  text-align: left;
  margin-bottom: 0rem;
}


/*** DREAM HOME **/
#dreamhome{
  display: block;
  width: 100%;
  max-width: 100%;
  height:auto;
  box-sizing: border-box;
 
  background: white;
  
  padding-block:7rem;

}

#dreamhome #dreamhome_inside{
  display: block;
   width:70%;
  margin:0 auto;
}


#dreamhome #dreamhome_inside p{
  color: rgba(0,0,0,0.8);
  text-align: left;
  width: 100%;
  margin: 0;
  font-size: 1.5rem;
  font-weight: normal;
}
#dreamhome #dreamhome_inside h3{
  color: black;
  text-align: left;
  width: 100%;
  padding:0; 
  margin:2rem 0;
 
  font-size: 1.8rem;
  font-weight: bold;
}
#dreamhome #dreamhome_inside #dreamhome_inside_boxes{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap:0.6rem;
  margin :2rem auto 3rem auto;
  width:100%;


}
#dreamhome #dreamhome_inside #dreamhome_inside_boxes div.brown{
display: flex;
justify-content: center;
align-items: center;
padding:3rem 2rem;
font-size: 2rem;
font-weight: bold;
background-color: rgba(240,171,60,0.17);
color:#DF9C1E;
 

}
#dreamhome #dreamhome_inside #dreamhome_inside_boxes div.blue{
  display: flex;
  justify-content: center;
  align-items: center;
  padding:3rem 2rem;
  font-size: 2rem;
  font-weight: bold;
  background-color: rgba(65,173,250,0.17);
  color:#3A9BD5
 
  
  }
 

/** Builder **/

 
#miamibuilkder{
  display: block;
  width: 100%;
  max-width: 100%;
  height:auto;
  box-sizing: border-box;
 
 
  background:rgba(0,0,0,0.04);
 
  padding-block:7rem;

}

#miamibuilkder #miamibuilkder_inside{
  display: block;
   width:70%;
  margin:0 auto;
}
#miamibuilkder #miamibuilkder_inside h2{
  font-size: 2.5rem;
  font-weight: bold;
  color: black;
  margin-bottom: 1rem;
  text-align: left;
}
#miamibuilkder #miamibuilkder_inside p{
  font-size: 1.1rem;
  font-weight: normal;
  color: rgba(0, 0, 0, 0.75);
  text-align: left;
  margin-bottom: 0rem;
}
#miamibuilkder #miamibuilkder_inside #miamibuilkder_inside_grid{
  display: grid  ;
      width: 100%;
      margin: 0 auto;
      grid-template-columns: repeat(2, 1fr);
      gap: 1rem;
}

#miamibuilkder #miamibuilkder_inside #miamibuilkder_inside_grid div.image{
  display: flex  ;
      flex-direction: column;
      gap: 1rem;
      align-items:flex-start;
      justify-content: center;
      height: 100%;
      padding: 2rem 0;
}
#miamibuilkder #miamibuilkder_inside #miamibuilkder_inside_grid div.image img{

width:400px;

}
#miamibuilkder #miamibuilkder_inside #miamibuilkder_inside_grid div{
  display: flex  ;
      flex-direction: column;
      gap: 1rem;
      align-items: center;
      justify-content: center;
      height: 100%;
      padding: 2rem;
}
#miamibuilkder #miamibuilkder_inside #miamibuilkder_inside_grid div h3{
  text-align: left;
  color: black;
  width: 100%;
  font-size: 2rem;
  margin-bottom: 2rem;

} 

#miamibuilkder #miamibuilkder_inside #miamibuilkder_inside_grid div p{
  text-align: left;
  color: rgba(0, 0, 0, 0.8);
  width: 100%;
 
  margin-bottom: 2rem;

} 

#miamibuilkder   #scheduler{
display:block;
margin:7rem auto 0rem auto;
text-align: center;

} 

/** recommend **/

 
#recommend{
  display: block;
  width: 100%;
  max-width: 100%;
  height:auto;
  box-sizing: border-box;
 
 
  background: #0B70B3;
  background: radial-gradient(circle, rgba(11, 112, 179, 1) 0%, rgba(9, 95, 152, 1) 53%, rgba(8, 80, 128, 1) 100%);
  padding-block:7rem;

}

#recommend #recommend_inside{
  display: block;
   width:90%;
  margin:0 auto;
}

#recommend #recommend_inside h2{
  display: block;
   width:100%;
  margin:0 auto;
  font-size:3rem;
  color:rgba(255,255,255,1);
  margin-bottom:1.5rem;
}

#recommend #recommend_inside p{
  display: block;
   width:100%;
  margin:0 auto;
      font-size: 1.5rem;
      color:rgba(255,255,255,0.8);
}

#recommend #recommend_inside strong{
  display: block;
   width:100%;
  margin:2rem  auto 0 auto;
      font-size: 1.5rem;
      font-weight: bold;
      color:#FFF;

}

/** gRIDS BOXES**/

#gridboxes{
  display: block;
  width: 100%;
  height: auto;
  padding:0;
  margin:0;
 

}
 
#gridboxes #gridboxes_inside_grid1{
  display: grid;
  width: 100%;
  height: auto;
  grid-template-columns: repeat(3,1fr);
  gap:0;
}
#gridboxes #gridboxes_inside_grid1 div.boxes{
 
  width: 100%;

}

#gridboxes #gridboxes_inside_grid1 div.boxes img{
  width: 100%;
  height: 520px;
  object-fit: cover;

 
  

}
#gridboxes #gridboxes_inside_grid1 div.boxes  .boxes_text{
 
 height: 520px;
 width: 100%;
 padding:1.5rem ;
 box-sizing: border-box;
 display: flex;
 flex-direction: column;
 justify-content:center;
 align-items:flex-start;
}

#gridboxes #gridboxes_inside_grid1 div.boxes  .boxes_text h4{
 
color:black;
font-size:1.8rem ;
margin-bottom:3rem;
 
 }
 #gridboxes #gridboxes_inside_grid1 div.boxes  .boxes_text p{
 
  color:rgba(0,0,0,0.75);
  font-size:1.3rem ; 
   
   }


   #gridboxes #gridboxes_inside_grid2{
    display: grid;
    width: 100%;
    height: auto;
    grid-template-columns: repeat(2,1fr);
    gap:0;
  }
  #gridboxes #gridboxes_inside_grid2 div.boxes2{
   
    width: 100%;
  
  }
  
  #gridboxes #gridboxes_inside_grid2 div.boxes2 img{
    width: 100%;
    height: 520px;
    object-fit: cover;
  
   
    
  
  }
  #gridboxes #gridboxes_inside_grid2 div.boxes2{
 
    width: 100%;
 
  }

  #gridboxes #gridboxes_inside_grid2 div.boxes2  .boxes_text{
 
    height: 600px;
    width: 100%;
    padding:2.5rem ;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content:baseline;
    align-items:flex-start;
   }
   
  #gridboxes #gridboxes_inside_grid2 div.boxes2  .boxes_text.auto{
 
    height: auto !important;
  
   }
  #gridboxes #gridboxes_inside_grid2 div.boxes2  .boxes_text h4{
 
    color:black;
    font-size:1.8rem ;
    margin-bottom:3rem;
     
     }
     #gridboxes #gridboxes_inside_grid2 div.boxes2  .boxes_text p{
     
      color:rgba(0,0,0,0.75);
      font-size:1.3rem ; 
       
       }


       /** Qoute 3 **/


       /** Mainheader1 **/

#qoute2{
  display: block;
  width: 100%;
  max-width: 100%;
  height:auto;
  box-sizing: border-box;
  background: #302d2d;
  background: linear-gradient(380deg, rgba(48, 45, 45, 1) 0%, rgba(0, 0, 0, 1) 100%);
  padding-block:10rem;

}

#qoute2 #qoute2_inside{
  display: block;
 
 
  width:90%;
  margin:0 auto;
}


 

#qoute2 #qoute2_inside p{
  font-size:2.5rem;
  font-weight:normal;
  color:rgba(255,255,255,0.75);
  text-align: left;
  margin-bottom: 0rem;
}


#qoute3{
  display: block;
  width: 100%;
  max-width: 100%;
  height:auto;
  box-sizing: border-box;
  background: #0B70B3;
  background: radial-gradient(circle, rgba(11, 112, 179, 1) 0%, rgba(9, 95, 152, 1) 53%, rgba(8, 80, 128, 1) 100%);
 
  padding-block:10rem;

}

#qoute3 #qoute3_inside{
  display: block;
 
 
  width:90%;
  margin:0 auto;
}


 

#qoute3 #qoute3_inside p{
  font-size:2.5rem;
  font-weight:normal;
  color:rgba(255,255,255,0.75);
  text-align: left;
  margin-bottom: 0rem;
}

/** Engineers **/


 

 
#engineer{
  display: block;
  width: 100%;
  max-width: 100%;
  height:auto;
  box-sizing: border-box;
 
 
  background: #0B70B3;
  background: radial-gradient(circle, rgba(11, 112, 179, 1) 0%, rgba(9, 95, 152, 1) 53%, rgba(8, 80, 128, 1) 100%);
  padding-block:7rem;

}

#engineer #engineer_inside{
  display: block;
   width:90%;
  margin:0 auto;
}

 

#engineer #engineer_inside p{
  display: block;
   width:100%;
  margin:0 auto;
      font-size: 2.5rem;
      color:rgba(255,255,255,0.8);
}

#engineer #engineer_inside strong{
  display: block;
   width:100%;
  margin:2rem  auto 0 auto;
      font-size: 1.5rem;
      font-weight: bold;
      color:#F0AB3C;
}

/** Guide2**/
#guide2{
  display: block;
  padding: 7rem 0 7rem 0;
  background: white;
}
#guide2 #guide2_inside{
  display:block;
  width:90%;
  margin:0 auto;  
}

#guide2 #guide2_inside_grid{
  display:grid;
  grid-template-columns: 50% 50%;
  gap:2rem;  
}
#guide2 #guide2_inside_grid div{
 width:100%;
 box-sizing: border-box;
 padding:3rem;
}


#guide2 #guide2_inside_grid div form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 400px;
  margin-top: 2rem;
}
#guide2 #guide2_inside_grid div form input[type=text] {
  width: 400px !important;
  min-width: 400px !important;
  max-width: 400px !important;
  padding-inline: 0 !important;
  padding-block: 1rem;
  text-indent: 1rem;
}

#guide2 #guide2_inside_grid div form  input[type=button] {
  padding-block: 1.3rem;
  width: 400px !important;
  min-width: 400px !important;
  max-width: 400px !important;
  background-color: #DF9C1E;
  font-weight: bold;
  color: white;
  border: 0;
}



#guide2 #guide2_inside_grid div h2{
font-size: 3rem;
font-weight: bold;
color:black;
margin-bottom:3rem;

 }

 #guide2 #guide2_inside_grid div p{
  font-size: 1.6rem;
  font-weight: normal;
  color:rgba(0,0,0,0.85);
   }
   #guide2 #guide2_inside_grid div  strong{
    display: block;
    color:black;
    text-align: left;
    width: 100%;
    padding: 0;
    margin: 2rem 0;
    font-size: 1.5rem;
    font-weight: bold;
        }
   #guide2 #guide2_inside_grid div  ul{
    display: block;
    margin-left: 2rem;
    padding-block: 0rem;
    list-style: none;
    padding: 0 3rem;
    box-sizing: border-box;
    margin: 0 auto;
     }
     #guide2 #guide2_inside_grid div  ul li{
     margin-block: 1rem;
     font-size: 1.4rem;
     display: flex ;
     flex-direction: row;
     justify-content: flex-start;
     align-items: flex-start;
     gap: 1rem;
     color: rgba(0, 0, 0, 0.65);
     }

@media(max-width:1600px){
     .pure-menu-children {
      background-color: transparent !important;
  }

  .pure-menu-heading, .pure-menu-link {
    padding: 0.3em 1em !important;
}
.pure-menu-has-children > .pure-menu-link::after {
 
  right: -1rem;
}
}