.chbk { padding: 60px 0; text-align: center; font-size: 20pt; }
.mh-head { background-color: #1d4e4a } .mh-head .hamburger-inner, .mh-head .hamburger-inner:after, .mh-head .hamburger-inner:before { background: #dddddd; }
.mm-listview>li>a, .mm-listview>li>span { text-transform: uppercase;}
.banner-wrapp-home { width: 100%; overflow-x: hidden; } .welcome-image { padding-top: 30px; position: relative;}
.welc-img-bdr-top {   width: 100%;    max-width: 400px; position: absolute;  right: 80px; top: 0;   margin: 0 0 10px 0; }
.grow-border-1 { margin-top: 20px;} .grow-border, .grow-border-1, .grow-border-3, .grow-border-4 {    background-color: #aaaaaa;    height: 1px;  width: 100%;   max-width: 400px;      display: inline-block; }  .grow-border-4 { position: absolute; right: 0; top: 0;} .hme-pdts-img-3 { position: relative;}
/*
.welcome-wrapp.active .welc-img-bdr-top { animation: borderGrow 0.5s ease forwards;}
@keyframes borderGrow {
0% {   width: 0; }
100% {   width: 400px; }
}
*/
.welcome-border-box {  z-index: 150;  width: 177px;   height: 177px;    margin: auto;   text-align: center;   color: #fff;   position: relative;   top: 50px;   cursor: pointer;   position: absolute; left: 0px; top: 40px; }  .welcome-border-box:before {   position: absolute;   width: 0;   height: 2px;   content: "";   background: #aaaaaa;   top: 0px;   left: 0px;  }
.welcome-border-box:after {   position: absolute;   width: 2px;   height: 0;   content: "";   background: #aaaaaa;   top: 0px;   right: 0px;  }
.welcome-border-box-inner:after {   position: absolute;   width: 0;   height: 2px;   content: "";   background: #aaaaaa;;   bottom: 0px;   right: 0px;  }
.welcome-border-box-inner:before {   position: absolute;   width: 2px;   height: 0;   content: "";   background: #aaaaaa;   left: 0;   bottom: 0;   }
.active-box-anim.welcome-border-box:before { width: 100%;  transition:  300ms width ease 500ms; }
.active-box-anim.welcome-border-box:after { height: 100%;  transition:  300ms height ease 800ms; }
.active-box-anim .welcome-border-box-inner:after {  width: 100%;  transition:  300ms width ease 1000ms; }
.active-box-anim .welcome-border-box-inner:before { height: 100%;  transition:  300ms height ease 1200ms; }
.welcome-border-box-btm { right: 30px; top: auto; left: auto; bottom: 100px; }
.line-border-block { position: relative; max-width: 1000px; margin: 0 auto; }
.line-border-vertical, .line-border-vertical-1 { width: 1px; height: 400px; background-color:#aaaaaa; position: absolute; top: 0; left: 0; opacity: 0.5; }
.hme-testi-wrapp .line-border-vertical { left: auto; right: 0; z-index: 12000;}
/* ---------------- menu --------------------- */
.hamburger { width: 30px; } #hamburger-1 { margin-left: 20px; margin-top:21px; transition: all 0.5s ease; } 
.hamburger-main .line {  width: 30px;  height: 2px;  background-color: #FFF;  display: block;  margin: 5px auto;  -webkit-transition: all 0.3s ease-in-out;  -o-transition: all 0.3s ease-in-out;   transition: all 0.3s ease-in-out; }
.hamburger-main:hover {  cursor: pointer; }
/* ONE */
#hamburger-1.is-active .line:nth-child(2) {  opacity: 0;}
#hamburger-1.is-active .line:nth-child(1) {  -webkit-transform: translateY(6px) rotate(45deg);  -ms-transform: translateY(6px) rotate(45deg);  -o-transform: translateY(6px) rotate(45deg);  transform: translateY(6px) rotate(45deg); }
#hamburger-1.is-active .line:nth-child(3) {  -webkit-transform: translateY(-9px) rotate(-45deg);  -ms-transform: translateY(-9px) rotate(-45deg);  -o-transform: translateY(-9px) rotate(-45deg);  transform: translateY(-9px) rotate(-45deg); }
.other-menu-wrapp { position: relative; z-index: 12000; overflow: hidden;}
.other-menu { position: fixed; top: 0; right: 0; width: 450px; padding: 0 50px; background-color: var(--lightBg); height: 100%; transform: translateX(450px); transition: all 0.5s ease;}
.hamburger-main { position: relative; z-index: 100;}
.other-menu.menu-open { transform: translateX(0);   }
.other-menu { justify-content: center; flex-direction:column; }
.slide-menu { width: 250px; margin:0 auto 35px auto;}
.slide-menu li { display: block; } .slide-menu a:link, .slide-menu a:visited { display: block; padding: 15px 0;  font-size: 12pt;}
.slide-menu ul { display: block; width: calc(50% - 0px);}
.slide-menu ul:last-child { text-align: right;}
.menu-logo { text-align: center; padding-bottom: 30px; width: 100%;}
.primary-menu { transition: all 0.5s ease; opacity: 1; }
.primary-menu.menu-hide { opacity: 0; visibility: hidden; }
@keyframes menuShowAnim  {
  0% { opacity: 0;}  100% { opacity: 1;}
}
.smo-menu { position: relative; top: 0; left: 0; transform: translate(0,0); width: calc(200px - 0px); margin: 0 auto; padding-top: 20px;}
.other-menu address { padding: 20px; background-color: #e9e9e9; width: calc(100% - 0px);}
.header-fix .hamburger-main .line, .white-header .hamburger-main .line, .is-active.hamburger-main .line {  background-color: var(--color); }
.hme-what-we-align .view-projects a:link, .hme-what-we-align  .view-projects a:visited { margin: 0 auto; width: 280px;}
.hme-what-we-align .view-projects { width: calc(100% - 0px); padding: 60px 0; }
.about-btm-cnt .widget-title { text-align: center;}
.archi-image img { width: 150px; margin: 10px 0 30px 0; }
@media (max-width: 1800px) {
}
@media (max-width: 1500px) {
   .container { max-width: calc(1500px - 0px); padding: 0 100px; width: calc(100% - 0px);  }  .hme-resid-blk {   padding-right: 130px; }   .hme-hospitality-blk {      padding: 60px 120px 60px 180px;  }
  .hme-insti-blk {   padding: 60px 0 60px 60px; } .hme-landscape-blk {   padding: 60px 120px 0 180px; } .hme-pdcts-right {    padding-left: 120px; }
.footer-top address { padding: 0 60px; } .footer-logo { width: 200px;} .what-we-land figure { padding-right: 540px;} .what-we-land article { padding: 0 0 0 80px; }
.what-we-land:nth-child(even) figure {   padding-right: 0px;  padding-left: 540px; }
.what-we-land:nth-child(even) article {   padding: 0 80px 0 0;  }
.titleBrdr {  width: 110px; left: -123px; } .what-we-land:nth-child(even) .titleBrdr { left: auto;  right: -123px; }
.prj-filter-items {   justify-content: center;   gap: 80px; } .header-wrapp {   padding: 0 80px; }
}
@media (max-width: 1400px) {
   :root { --gutter: 120px 0;   }
   .container { max-width: calc(1500px - 0px); padding: 0 80px; width: calc(100% - 0px); }
  .header-wrapp {   padding: 0 50px; }
  .hme-our-projects-wrapp, .footer-wrapp { padding: 120px 0; }
  .grow-border, .grow-border-1, .grow-border-3, .grow-border-4 {   max-width: 300px; }
   .abt-btm-cnt article { padding: 0 100px; }
   .welcome-title {   font-size: 24pt; } .welcome-title span {  font-size: 18pt;  }
}
@media (max-width: 1300px) {
   :root { --gutter: 80px 0; }
   .container { max-width: calc(1500px - 0px); padding: 0 80px; width: calc(100% - 0px); }
   .hme-our-projects-wrapp { padding: 100px 0; }
   .hme-resid-blk { padding-right: 100px; } .hme-hospitality-blk { padding: 60px 100px 60px 120px; } .hme-insti-blk { padding: 60px 0 60px 100px; }   
   .hme-landscape-blk { padding: 60px 80px 0 100px; } .hme-pdcts-right { padding-left: 100px; }.footer-wrapp { padding: 100px 0; } .footer-top address { padding: 0 50px;   } .footer-logo { width: 180px;} .abt-btm-cnt article { padding: 0 50px 0 0; }
     .titleBrdr {  width: 110px; left: -123px; } .what-we-land:nth-child(even) .titleBrdr { left: auto; right: -123px; }
     .title-what-we-land { font-size: 20pt; } .prj-filter-items { justify-content: center; gap: 50px; }
      .header-wrapp { padding: 0 40px; }
}
@media (max-width: 1200px) {
   :root { --gutter: 50px 0;   }
   .header-wrapp { padding: 0 30px; }
   .container { max-width: calc(1500px - 0px);      padding: 0 40px;      width: calc(100% - 0px);  }
  .hme-our-projects-wrapp { padding: 100px 0;}
  .hme-resid-blk { padding-right: 60px; }   .hme-hospitality-blk {      padding: 60px 100px 60px 120px;  }  .hme-insti-blk {   padding: 60px 0 60px 60px;}
   .hme-landscape-blk { padding: 60px 80px 0 60px;} .hme-pdcts-right {   padding-left: 60px;} .footer-wrapp { padding: 100px 0;}   .footer-top address {      padding: 0 50px;   }
   .footer-logo { width: 120px;}    .abt-btm-cnt article { padding: 0 50px 0 0;  }  .titleBrdr {  width: 110px; left: -123px; }
  .what-we-land:nth-child(even) .titleBrdr {   left: auto;   right: -123px;}  .title-what-we-land {   font-size: 20pt; }
   .prj-filter-items { justify-content: center; gap: 50px;   }
   .banner-caption { max-width: calc(900px - 0px); width: 100%;}
   .welcome-image { padding-right: 45px; } .welcome-border-box-btm { right: 0; }   
   .footer-mid-wrapp { flex-direction: column; justify-content: center;}
   .smo {
      position: static;      top: 0;      transform: translateY(0);      right: 0; margin: 0 auto;
  }
  .clients-wrapp li { width: calc(25% - 0px);}
   .welcome-content article { width: calc(100% - 30px); padding-right: 30px }
   .banner-wrapp-what, .banner-projects-what { background-size: cover;}
}

@media (max-width: 1000px) {
   .banner-cap-border-right .anim-border-bann {   right: 0;   left: auto; }
   .anim-border-bann { right: auto; left: 0; }

   .hme-pdts-title p {      padding-left: 40px;      padding-top: 50px;      margin-left: 194px; }
      .footer-menu li a:link, .footer-menu li a:visited { font-size: 10.5pt;         display: block;         padding: 10px 0px;      }


      .footer-top .footer-logo { display: none;}
      
      .what-we-land figure, .what-we-land article,   .what-we-land:nth-child(even) figure {
  
         padding-right: 0; width: calc(50% - 0px); padding-left: 0;
     }

     .what-we-land article { padding-left: 50px;}
     .what-we-land:nth-child(even) article {
      padding: 0 50px 0 0;
  } 

   

   .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev { left: -64px; }
   .owl-carousel .owl-nav button.owl-next { left: auto; right: -53px;  }

   .page-title {
      font-size: 22pt;
   }
   .title-what-we-land { padding-bottom: 10px; font-size: 18pt;}


}
@media (max-width: 900px) {
.welcome-content,   .welcome-image  { width: calc(100% - 0px); padding: 0;}  .welcome-image { padding-top: 50px; max-width: 350px; margin: 0 auto;}
.welcome-content article { padding-right: 0;}
.hme-resid-blk {
   padding-right: 40px;
}

.hme-hospitality-blk {
   padding: 60px 40px 60px 0px;
}

.hme-insti-blk {
   padding: 60px 0 60px 00px;
}
.hme-landscape-blk {
   padding: 60px 0px 0 40px;
}
.hme-testi-wrapp { padding-left:60px; padding-right: 60px; }


.about-btm-image { display: none;} .abt-btm-cnt { width: calc(100% - 0px); }     .abt-btm-cnt article { padding: 0; }
.what-we-land article { position: relative;}
.what-we-land:nth-child(even) { flex-direction: row-reverse;}

.contact-address, .gmap-blk { width: calc(100% - 0px); } .gmap-blk { margin-top: 50px;} .contact-address { padding-top: 50px;}



}

@media (max-width: 800px) {
   .container { padding: 0 20px;}
   .hme-what-we-link a:after, .view-projects a:after, .proj-blk-link::after, .primary-menu, .footer-menu { display: none; }
 .menu-logo img { width: 160px; }
 .what-we-title { text-align: left;}
 .hme-pdcts-left, .hme-pdcts-right { width: calc(100% - 0px);}
 .hme-pdcts-right { padding-left: 0;}
 .banner-wrapp-what, .banner-projects-what { height: 180px;}
 .hme-pdts-left-btm h4 { position: relative; padding-bottom: 35px;}
.btm-caption { text-align: center !important; font-size: 11.6pt; }
.hme-what-we-align {
   padding: var(--gutter60); }
   .hme-testi-wrapp { padding-left: 0; padding-right: 0; width: 100%; }

   .hme-testi-wrapp .owl-carousel .owl-nav button.owl-next,  .hme-testi-wrapp .owl-carousel .owl-nav button.owl-prev { display: none !important;}

   .what-we-land {
      position: relative;
      margin-bottom: 35px;
  }
  .clients-wrapp li { width: calc(33.33% - 0px);}

.what-wedo-page  [data-aos^=fade][data-aos^=fade],
.projects-page  [data-aos^=fade][data-aos^=fade]
{ opacity: 1 !important;     transform: translate3d(0, 0, 0) !important;} 
}


@media (max-width: 642px) {
   .home-slide-1 { background-image: url(../images/banner/attic-studio-slide-1-600w.webp); }
   .home-slide-2 { background-image: url(../images/banner/attic-studio-slide-2-600w.webp); }
   .home-slide-3 { background-image: url(../images/banner/attic-studio-slide-3-600w.webp); } 
   .other-menu { width: 340px;}
   .other-menu { padding: 0 25px;}
   .hme-what-we-align {
      padding: var(--gutter40); padding-bottom: 0; }
   .hme-resid-blk {
      padding-right: 25px; padding-bottom: 30px;
  } 
  .hme-our-projects-wrapp { padding: 80px 0;}

  .hme-landscape-blk {
   padding: 30px 0px 0 25px;
}
.hme-comm-blk {
   padding: 0px 0;
}
.hme-hospitality-blk {
   padding: 0px 30px 0px 0px;
}
.hme-interirors-blk { padding-top: 30px;}
.hme-insti-blk { padding: 30px 0; }

.sub-btm-what-we-wrapp .container { padding: 0;}
.hme-pdts-title p {
   padding-left: 0px;
   padding-top: 50px;
   margin-left: 0px; border: none;
}
.title-what-we-land {
   padding-bottom: 10px;
   font-size: 15pt;
}
.what-we-land figure, .what-we-land article, .what-we-land:nth-child(even) figure {
   padding-right: 0;
   width: calc(100% - 0px);
   padding-left: 0;
}
.titleBrdr { display: none; } .title-what-we-land { padding-top: 30px;}
.what-we-land:nth-child(even) article { padding: 0;}

   .what-we-title {      font-size: 14pt; }
   .hme-what-title {      font-size: 12pt;   }
   .project-item {
      width: calc(50% - 30px);
   }
   .banner-caption p:nth-child(even) { padding-left: 0; }
   .contNum .form-group {
      width: calc(100% - 0px);
  }

  .clients-wrapp li { width: calc(50% - 0px);}


.contact-logo img { width: calc(100px - 0px); }

.site-logo { width: 120px;}
.page-title { font-size: 18pt; }
.footer-wrapp, .hme-our-projects-wrapp, .footer-mid-wrapp { padding: 50px 0;} .footer-mid-wrapp { margin: 40px 0; padding: 20px 0; }  
.hme-pdts-img-3 { padding-top: 50px;} .hme-pdts-img-2 { padding-bottom: 50px; }

.widget-title {
   font-size: 16pt; padding-bottom: 20px;
}
.hme-pdts-left-btm h4 {
   font-size: 12pt;
   line-height: 18pt;
}
.banner-wrapp-what, .banner-projects-what { margin-top: 100px;}
.slide-menu a:link, .slide-menu a:visited { text-transform: uppercase; font-size: 10pt; font-weight: 500;}
}

@media (max-width: 428px) {
 

   
.project-item {
   width: calc(100% - 0px);
}
.animated-text, .animated-text-2 { font-size: 14pt }
.cpr-wrapp span { display: block;}
.hme-gallery-wrapp .container { padding: 0;}
.hme-what-title span { width: 100%;}

}
@media (max-width: 360px) {
.animated-text, .animated-text-2 { font-size: 12pt }
}

/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* ------------- Metex creations -------------  */
/* ------------------ 2025 -------------------  */
/* ---------------- gadhafi ------------------  */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */