* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    text-decoration: none!important;
    list-style: none!important;
    outline: 0!important
}

 img{
    display: block;
 }


@font-face {
    font-family: 'Nexa';
    src: url('../fonts/Nexa-Black.woff2') format('woff2'),
        url('../fonts/Nexa-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Nexa';
    src: url('../fonts/Nexa-Book.woff2') format('woff2'),
        url('../fonts/Nexa-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


::-webkit-scrollbar-track
{
 
    background-color: #191919;
}

::-webkit-scrollbar
{
    width: 9px;
    background-color: #191919;
}

::-webkit-scrollbar-thumb
{
 
    background-color: #999999;
    
}

 
 

.sectionTitle{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 30px;
    font-weight: 900;
    line-height: 30px;
    padding: 5px;
    padding-bottom: 0px;
}

.sectionTitle2{
    font-family: 'Nexa', sans-serif;
    color: black;
    font-size: 30px;
    font-weight: 900;
    line-height: 30px;
    padding: 5px;
    padding-bottom: 0px;
}

.sectionTitle2:hover{
    font-family: 'Nexa', sans-serif;
    color: white;
    font-size: 30px;
    font-weight: 900;
    line-height: 30px;
    padding: 5px;
    padding-bottom: 0px;
    cursor: pointer;
}

.sectionTitle2 a{
    font-family: 'Nexa', sans-serif;
    color: #EDEADE;
    font-size: 30px;
    font-weight: 900;
    line-height: 30px;
    padding: 5px;
    padding-bottom: 0px;
    cursor: pointer;
}

.sectionTitle2 a:hover{
    font-family: 'Nexa', sans-serif;
    color: white;
    font-size: 30px;
    font-weight: 900;
    line-height: 30px;
    padding: 5px;
    padding-bottom: 0px;
    cursor: pointer;
}


.projectPad{
     padding: 5px;
}


.thumbContainer{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
/*    cursor: pointer;*/
}

.thumbContainer .thumbTitle{
   
    margin-top: 49%;
    padding-top: 2%;
    position: absolute;
    width: 100%;
    height: 8%;
    z-index: 2;
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    line-height: 100%;
    text-align: center;
    background-color: rgba(0,0,0,0.35);
    vertical-align: middle; 
     display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  
  
}.thumbContainer:hover .thumbTitle{
   display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
/* opacity:0;*/
  
}

.thumbContainer .thumbTitle2{
   
    margin-top: 53.5%;
    position: absolute;
    width: 100%;
    height: 5%;
    z-index: 2;
    font-family: 'Nexa', sans-serif;
    color: #bcbcbc;
    font-size: 8px;
    font-weight: 600;
    line-height: 100%;
    text-align: center;
    background-color: rgba(0,0,0,0.35);
    vertical-align: middle; 
     display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  
  
}.thumbContainer:hover .thumbTitle2{
   display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
/* opacity:0;*/
  
}



.thumbContainer{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
/*    cursor: pointer;*/
}

.thumbContainer .thumbTitle3{
   margin-top: 60%;
    position: absolute;
    width: 100%;
    height: 20%;
    z-index: 2;
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 19px;
    font-weight: 900;
    line-height: 100%;
    text-align: center;
    background-color: rgba(0,0,0,0.35);
    vertical-align: middle; 
     display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  
  
}.thumbContainer:hover .thumbTitle3{
   display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
/* opacity:0;*/
  
}

.projectPopup{
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 10000;
    text-align: center;
    bottom: 0px;
    background-color: rgba(0,0,0,0.5);
}.projectMainPopup{
    display: block;
    position: absolute;
    width: 100%;
    height: auto;
    z-index: 10000;
    background-color: #191919;
    text-align: center;  bottom: 0px;
 
}


.projectTitle{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 19px;
     
    line-height: 19px;
    text-align: left;
    padding-bottom: 40px;
 

}

.projectDetails{
    display: block;
    position: relative;
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 13px;
     
    line-height: 13px;
    text-align: left;

 

}
.projectDetails span{
 
 
    text-align: right;
    float: right;
 

}
 

.underlined{
   border-bottom: #999999 1px solid;
   margin-top: 15px;
   padding-bottom: 13px;
}


.underlined:last-of-type {
  border-bottom: none;
}


.projectPadding{
    padding: 40px;

}


.projectContent{
    display: inline-block;
    position: relative;
    width: 100%;
    max-width: 1620px;
}


.overThis{
    height: 350px;
    overflow: auto;
}


.grid-container {
  columns: 5 200px;
  column-gap: 1rem;
  width: 90%;
  margin: 0 auto;
 


}
.grid-container div {
  width: 150px;
  margin: 0 1rem 1rem 0;
  display: inline-block;
  width: 100%;
 
}


 


.hidden{  opacity: 0; }

.visible{ opacity: 1; }
 
 .menuWhiteBg{
    background-color: rgba(0,0,0,0.9) !important;
 }
 .menuContainer{
    display: block;
    position: fixed;
    z-index: 10000;
    width: 100%;
    height: auto;
    text-align: center;
    background-color: rgba(0,0,0,0.6);
}
.menuContent{
   
    padding-left: 40px;
    padding-right: 40px;
    vertical-align: top;
}
.menuTable{
    display: inline-table;
    position: relative;
    width: 100%;
    max-width: 1580px;
    table-layout: fixed;
        margin-top: 5px;
}
.m1{
    display: table-cell;
    position: relative;
    width: 110px;
    height: auto;
    text-align: left;
    vertical-align: middle;
}
 .m2{
    display: table-cell;
    position: relative;
    width: auto;
    height: auto;
    text-align: right;
    vertical-align: middle;
}



 .m3{
    display: table-cell;
    position: relative;
    width: 70px;
    height: auto;
    text-align: right;
    vertical-align: middle;
}




.openMenu{
    display: none;
    position: fixed;
    width: 50px;
    height: 50px;
    top: 15px;
    right: 15px;
    z-index: 100;
    
}
.openMenu a{
    display: block;
    position: relative;
    width: 50px;
    height: 50px;
    background-image: url('../imgs/open.png');
    background-repeat: no-repeat;
    background-position: center;
 
    text-decoration: none;
      background-color: #bcbcbc;
    
      z-index: 100;
}
.openMenu a:hover{
     background-color: #bcbcbc;
 
}.closeMenu{
    display: none;
    position: fixed;
    width: 50px;
    height: 50px;
    top: 15px;
    right: 15px;
    z-index: 500;
    
}
.closeMenu a{
    display: block;
    position: relative;
    width: 50px;
    height: 50px;
    background-image: url('../imgs/close.png@v=333');
    background-repeat: no-repeat;
    background-position: center;
 
    text-decoration: none;
      background-color: #999999;
 
}
.closeMenu a:hover{
     background-color: #999999;
 
}

.menuPanel{
    display: none;
    position: fixed;
    width: 100%;
    height: auto;
    z-index: 1000;
    top:0px;
    left: 0px;
    background-color: #000000;
}

.menuPadding{
    padding: 30px;
    padding-top: 30px;
}


@media (max-width:900px) {
 .m2{
    display: none;
}
 .m3{
   display: none;
}
.openMenu{
    display: block;
    position: fixed;
 
    
}.closeMenu{
    display: block;
    position: fixed;
 
    
}
}

@media (min-width:901px) {

.menuPanel{
    display: none !important;
    
}

    }

.logo{
    display: inline-block;
    position: relative;
    width: 210px;
    height: 110px;
 
}
.logo a{
    display: block;
    position: relative;
    width: 220px;
    height: 160px;
    background-image: url('../imgs/logo4.png');
    background-repeat: no-repeat;
        background-position: top center;
        background-size: 160px ;
    text-decoration: none;
}
.logo a:hover{}

.logoX{
     display: inline-block;
    position: relative;
    width: 110px;
    height: 55px;
}
.logoX a{
 
    display: block;
    position: relative;
    width: 110px;
    height: 55px;
    background-image: url('../imgs/logo.png');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 110px auto;
    text-decoration: none;
 
}
.logoX a:hover{
 
}
.s1{
    display: inline-block;
    position: relative;
    width: 29px;
    height: 29px;
    margin-left: 2px;
}
.s1 a{
    display: block;
    position: relative;
    width: 29px;
    height: 29px;
    background-image: url('../imgs/icon1.png');
    background-repeat: no-repeat;
    background-position: center;
    text-decoration: none;
}
.s1 a:hover{
 
}
.s2{
    display: inline-block;
    position: relative;
    width: 29px;
    height: 29px;
    margin-left: 2px;
}
.s2 a{
    display: block;
    position: relative;
    width: 29px;
    height: 29px;
    background-image: url('../imgs/icon2.png');
    background-repeat: no-repeat;
    background-position: center;
    text-decoration: none;
}
.s2 a:hover{
 
}




.menuItem{ 
     display: inline-block;
     position: relative;
     width: auto;
     height: auto; 

 }.menuItem a{ 
     font-family: 'Montserrat', sans-serif;
     color: #FFFFFF;
     font-size: 12px;
     font-weight: 600;
     line-height: 20px;
     padding-left: 20px; padding-right: 20px;
     text-decoration: none;
     text-transform: uppercase;

 }.menuItem a:hover{    
    color: #999999;
    text-decoration: none;
 }



 .menuItemHL{ 
 

 }.menuItemHL a{ 
  
     color: #999999;
 

 }.menuItemHL a:hover{    
    color: #999999;
 
 }

@media (max-width:900px) {


.logo{
     display: inline-block;
    position: relative;
    width: 110px;
    height: 55px;
}
.logo a{
 
    display: block;
    position: relative;
    width: 110px;
    height: 100px;
    background-image: url('../imgs/logo4.png');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100px auto;
    text-decoration: none;
 
}
.logo  a:hover{}
 

.menuItem{ 
     display: block;
     position: relative;
     width: auto;
     height: auto; 

 }.menuItem a{ 
     font-family: 'Montserrat', sans-serif;
     color: #FFFFFF;
     font-size: 14px;
     font-weight: 600;
     line-height: auto;
     padding:0px;
     padding-top: 10px;
     padding-bottom: 10px;
     text-decoration: none;
     text-transform: uppercase;
     display: block;
     position: relative;

 }.menuItem a:hover{    
    color: #999999;
    text-decoration: none;
 }


}

@media (max-width: 1200px) {
    

.thumbContainer .thumbTitle{
   
    margin-top: 40.25%;
    position: absolute;
    width: 100%;
    height: 18%;
    z-index: 2;
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 7px;
    font-weight: 600;
    line-height: 100%;
    text-align: center;
    background-color: rgba(0,0,0,0.35);
    vertical-align: middle; 
     display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  
  
}.thumbContainer:hover .thumbTitle{
   display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
/* opacity:0;*/
  
}

.thumbContainer .thumbTitle2{
   
    margin-top: 50.5%;
    position: absolute;
    width: 100%;
    height: 10%;
    z-index: 2;
    font-family: 'Nexa', sans-serif;
    color: #bcbcbc;
    font-size: 6px;
    font-weight: 400;
    line-height: 100%;
    text-align: center;
    background-color: rgba(0,0,0,0.35);
    vertical-align: middle; 
     display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
}

}.thumbContainer:hover .thumbTitle2{
   display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
/* opacity:0;*/
  
}

.thumbContainer{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
/*    cursor: pointer;*/
}
.thumbContainer .thumbTitle3{
   margin-top: 60%;
    position: absolute;
    width: 100%;
    height: 20%;
    z-index: 2;
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 600;
    line-height: 100%;
    text-align: center;
    background-color: rgba(0,0,0,0.35);
    vertical-align: middle; 
     display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
   
}
}.thumbContainer:hover .thumbTitle3{
   display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
/* opacity:0;*/
  
}

}



#fullpage{
/*    display: block;
    position: absolute !important;*/
/*    top:0px;*/
}



.slickCarousel{

}


.serviceTable{
    display: table !important;
    position: relative;
    width: 100%;
    height: 100vh  !important;
    table-layout: fixed;
}
.serviceCell{
    display: table-cell;
    position: relative;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    text-align: center;
}
.serviceContainer{
    display: inline-table;
    position: relative;
    width: 100%;
    max-width: 1500px;
    height: auto;
}
.serviceContainerCell1{
    display: table-cell;
    position: relative;
    width: 50%;
    height: auto;
    text-align: left;
        vertical-align: top;
  
}

.serviceContainerCell2{
    display: table-cell;
    position: relative;
    width: auto;
    height: auto;
        vertical-align: middle;
    text-align: center;
}
.serviceContainerCell3{
    display: table-cell;
    position: relative;
    width: 120px;
    height: auto;
        vertical-align: middle;
    text-align: center;
}

.serviceInline{
    display: inline-block;
    position: relative;
    text-align: left;
}

.line{
    display: inline-block;
    position: relative;
    width: 3px;
    height: 70px;
    background-color: #999999;
}




.banner{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
}

.bannerImage{
    display: block;
    position: relative;
    width: 100%;
    height: 100vh;
    overflow-x: hidden;
}
/*.bannerImage img{
    width: 100%;

}
*/
.titleTable{
    display: table;
    position: absolute;
    width: 100%;
    height: 100%;
    table-layout: fixed;
    vertical-align: middle;
    text-align: center;
    z-index: 1
}
.titleCell{
    display: table-cell;
    position: relative;
    width: 100%;
    height: 100%;
    table-layout: fixed;
    vertical-align: middle;
    text-align: center;
    }

.titleContainer{
    display: inline-block;
    position: relative;
    width: 100%;
    max-width: 1600px;
    padding: 30px;
    text-align: left;
    padding-top: 100px;
 
    }


.lbl1{
     font-family: 'Nexa', sans-serif;
    color: #000000;
    font-size: 26px;
    line-height: 26px;
    font-weight: 900;
    text-transform: uppercase;
  
    letter-spacing: 12px;
    padding-bottom: 5px;
 
}
.lbl2{
     font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 75px;
    line-height: 75px;
    font-weight: 900;
    text-transform: uppercase;
   padding-bottom: 15px;
    letter-spacing: 20px;
 
}

.btitle{
     font-family: 'Nexa', sans-serif;
    color: #bcbcbc;
    font-size: 14px;
    line-height: 12px;
     font-weight: 900;
    text-transform: uppercase;
  
    letter-spacing: 2px;
 
    max-width: 520px;
}.btxt{
    font-family: 'Nexa', sans-serif;
    color: #bcbcbc;
    font-size: 17px;
 
    line-height: 18px;
    max-width: 470px;
 
    padding-top: 10px;
    text-align: left;
    -moz-text-align-last: left;
    text-align-last: left;
 
}




@media (max-width: 700px){
         .bannerImage img{
             width: 200%;
             transform: translate(-50%, 0);
         }     
} 

@media (max-width: 600px){
   .bannerImage img{
     width: 400%;
     transform: translate(-50%, 0);
   }   
   .btitle{         
        font-size: 25px;
        line-height: 25px;
        letter-spacing: 1px;
        max-width: 200px;
        text-shadow: 1px 1px 1px #000000;
   }
  .btxt{
       text-shadow: 1px 1px 1px #000000;
           font-size: 11px;
    font-weight: 300;
    line-height: 14px;
  }
  .titleCell{
        vertical-align: middle;
        text-align: center;
    }

   .titleContainer{
      padding-bottom: 0px;
    }



} 





.profileTable{
    display: table;
    position: relative;
    width: 100%;
    height: 100%;
    vertical-align: top;

}
.profileCol1{
    display: table-cell;
    position: relative;
    width: 50%;
    height: auto;
    vertical-align: top;
    text-align: right;
     
}
.profileCol2{
    display: table-cell;
    position: relative;
    width: 50%;
    height: auto;
    vertical-align: middle;
    text-align: left;
 
}.profileColFull{
    display: table-cell;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: middle;
    text-align: center;
 
}



.contactBg{
background-image: url('../../images/contact.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.pillarBg{
background-image: url('../../images/pillar.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}

.serviceBg{
background-image: url('../../images/glass-wall-P97QWA3.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}

.bg1{
background-image: url('http://www.aplusconstruction.co/images/pp-products.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.symbol1{
background-image: url('../imgs/pp-product-shape.png');
 background-repeat: no-repeat;
background-position: right bottom;
}

.bg2{
background-image: url('http://www.aplusconstruction.co/images/pp-initiatives.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.symbol2{
background-image: url('../imgs/pp-initiatives-shape.png');
 background-repeat: no-repeat;
background-position: right bottom 30px;
background-size: auto auto;
}.symbol3{
background-image: url('../imgs/case-shape.png');
 background-repeat: no-repeat;
background-position: right 30px bottom 30px;
background-size: auto auto;
}

@media (max-width:900px) {

 
.profileTable{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;
}
.profileCol1{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;
    text-align: right;
    min-height: 400px;
   
}
.profileCol2{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;
    text-align: left;
 
}
}


.profileContent{
    display: inline-block;
    position: relative;
    width: 100%;
    text-align: left;
    padding: 30px;
    max-width: 1600px;
 
}

.profileTitle{
    font-family: 'Montserrat', sans-serif;
    color: #007e57;
    font-size: 55px;
    font-weight: 700;
    line-height: 50px;

}.profileTitle span{
    display: block;
    position: relative;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    color: #232a33;
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 4px;
    padding-top: 10px;
}.profileTitleDark{
    font-family: 'Montserrat', sans-serif;
    color: #232a33;
    font-size: 55px;
    font-weight: 700;
    line-height: 50px;

}.profileTitleDark span{
    display: block;
    position: relative;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    color: #232a33;
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 4px;
    padding-top: 10px;
}
.profileSubTitle{
    font-family: 'Montserrat', sans-serif;
    color: #232a33;
    font-size: 11px;
    font-weight: 700;
 
    line-height: 12px;
    letter-spacing: 2px;
 
}.profileTxt{
    font-family: 'Montserrat', sans-serif;
    color: #232a33;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    padding-top: 20px;
}.profileTxt span{
     color: #007e57;
      font-weight: 600;
 
}.profileTxt a{
    font-family: 'Montserrat', sans-serif;
    color: #49ab5b;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    text-decoration: none;
 }
.profileTxt a:hover{
    font-family: 'Montserrat', sans-serif;
    color: #49ab5b;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
 }
 .profileTxt th{
    color: #49ab5b;
    padding-right: 20px;
    font-weight: 400;
 }



 .spanStyle span{
    font-weight: 800 !important;
     color: #232a33 !important;

 }






.profileSlogan{
    font-family: 'Montserrat', sans-serif;
    color: #007e57;
    font-size: 32px;
    font-weight: 800;
    line-height: 32px;
    padding-top: 50px;
}.profileSlogan span{
     color: #007e57;
      font-weight: 500;
        font-size: 26px;
         line-height: 26px;
 
}
.profileLogo{
    padding-top: 20px;
   
}
.contactTxt{
    font-family: 'Montserrat', sans-serif;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    padding-top: 50px;
 
    padding-left: 2px;
}.contactTxt a{
     color: #FFFFFF;
 
      text-decoration: none;
 
}
.contactTxt a:hover{
     color: #FFFFFF;
  
 
}


.footer{
    font-family: 'Montserrat', sans-serif;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
 
}.footer a{
     color: #FFFFFF;
 
      text-decoration: none;
 
}
.footer a:hover{
     color: #FFFFFF;
 
 
}


.section{
     background-color: #f9f9f9;
}

.darkBlue{
    background-color: #232a33;
}.darkgrey{
    background-color: #111111;
}
.green{
    background-color: #49ab5b;
}
.grey{
         background-color: #f9f9f9;
}
.whiteContainer{
    background-color: #999999;
  /*  padding: 30px;*/
    margin-top: 50px;
}

.defaultContainer{
    display: inline-block;
    position: relative;
    width: 100%;
    height: auto;
    text-align: center;
}
.defaultContent{
    display: inline-block;
    position: relative;
    width: 100%;
    max-width: 1650px;
    height: auto;
    text-align: left;
}.defaultContentCenter{
    display: inline-block;
    position: relative;
    width: 100%;
    max-width: 1500px;
    height: auto;
    text-align: center;
}
.defaultPaddingTop0{
    padding: 50px;
    padding-top: 0px;
}.defaultPadding{
    padding: 50px;
}.defaultPadding2{
    padding: 50px;
    padding-top: 30px;
    padding-bottom: 30px;
}
.defaultPadding3{
    padding: 10px;
}




























.sTable{
    display: table;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;

}
.sCol{
    display: table-cell;
    position: relative;
    width: 33.3333333%;
    height: auto;
    vertical-align: top;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 60px;
    font-weight: 800;
    line-height:60px;
    color:#FFFFFF; 
}



.num{    

    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    color: #FFFFFF;
    text-align: center;
     font-size: 60px;
    font-weight: 800;
    line-height: 60px; 
}
.numTxt{  
    display: block;  

    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    color: #FFFFFF;
    text-align: center;
     font-size: 25px;
    font-weight: 500;
    line-height: 25px; 
    padding-top: 5px;
}

.cTable{
    display: table;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;

}
.col1{
    display: table-cell;
    position: relative;
    width: 30%;
    height: auto;
    vertical-align: middle;
    text-align: center;
     
}
.col2{
    display: table-cell;
    position: relative;
    width: auto;
    height: auto;
    vertical-align: top;
    text-align: left;
 
}

.cPadLeft{
    padding: 40px;
    padding-right: 20px;
}

.cPadRight {
    padding: 40px;
    padding-left: 20px;
    padding-top: 70px;
}
.cPadCenter {
    padding: 40px;
    display: inline-block;
    text-align: center;
}
.padTop40 {
      padding-top: 50px;
}

.round{
    border-radius: 50%;
    display: inline-block;
    position: relative;
}

.cTitle{
    font-family: 'Montserrat', sans-serif;
    color: #49ab5b;
    font-size: 19px;
    font-weight: 600;
    line-height: 22px;
}.cTitle2{
    font-family: 'Montserrat', sans-serif;
    color: #232a33;
    font-size: 19px;
    font-weight: 800;
    line-height: 22px;
    padding-bottom: 20px;
}

@media (max-width:900px) {

 
.cPadLeft{
    padding: 20px;
 
}

.cPadRight{
  padding: 20px;
}

.cPadCenter {
    padding: 20px;
 
}

.sCol{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
}

.cTable, .sTable{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;
}
.col1{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;
    text-align: right;
    min-height: 400px;
}

.autoHeight{
    min-height: auto !important;
}
.col2{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: top;
    text-align: left;
 
}

}



.maxWidth600{
    max-width: 550px;
}


.button1{
    display: block;
    position: relative;
    width: 100%;
    text-align: left;
     padding-top: 20px;
}

.button1 a{
    display: inline-block;
    position: relative;
    text-align: center;
 
    background-color: #49ab5b;
    padding-left: 20px;
    padding-right: 20px;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 500;
    line-height: 30px;
    border-radius: 15px;
}
.button1 a:hover{
  background-color: #232a33;
}


.button2{
    display: block;
    position: relative;
    width: 100%;
    text-align: center;
     padding-top: 20px;
}

.button2 a{
    display: inline-block;
    position: relative;
    text-align: center;
 
    background-color: #232a33;
    padding-left: 20px;
    padding-right: 20px;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 500;
    line-height: 30px;
    border-radius: 15px;
}
.button2 a:hover{
   color: #232a33;
  background-color: #FFFFFF;
}





.formTitle{
    font-family: 'Montserrat', sans-serif;
    color: #232a33;
    font-size: 34px;
    font-weight: 500;
    line-height: 34px;

}

.formLabel{
    font-family: 'Montserrat', sans-serif;
    color: #232a33;
    font-size: 17px;
    font-weight: 500;
    line-height: 17px;
    margin-bottom: 10px;
}.formLabel span{
    font-family: 'Montserrat', sans-serif;
    color: #49ab5b;
    font-size: 17px;
    font-weight: 500;
    line-height: 17px;
}
.formField{ 
  display:block;
  width:auto;
  vertical-align:top;
  margin-bottom: 10px;

}
.formField .fld{   
  display: block;
  width:100%;
  height:auto;
  line-height:auto;
  color:#232a33;
  padding:10px;
  border:#cecece 1px solid;
  border-radius: 15px;
 
  font-family: 'Montserrat', sans-serif;
  background-color:#ffffff;
  font-size:14px;
  text-align:left;
  font-weight:300;
} 





@media (max-width:600px) {
.profileContent {
 
    padding: 10px;
    padding-top: 40px;
    padding-bottom: 50px;
 
    min-height: auto;
}

.profileTitle, .profileTitleDark {
 
    font-size: 35px;
  
    line-height: 35px;
}

.num {
 
    font-size: 45px;
 
    line-height: 45px;
}
.numTxt {
 
    font-size: 20px;
 
}

}
@media (max-width:900px) {

.menuContent {
    padding: 5px;
 
}

        .symbol1 {
 
             background-size: 50% auto;
        }        

        .symbol2 {
 
            background-position: right bottom 30px;
            background-size: 200% auto;
        }
        .symbol3 {
 
            background-position: right 10px bottom 10px;
            background-size: 50% auto;
        }

.defaultPadding {
    padding: 35px;
}
}


 
 .prevArrow {
    display: block;
    position: absolute;
    width: 50px;
    height: 50px;
    background-color: #FFFFFF;
    z-index: 100;
    right:103px;
    bottom:1px;
    background-image: url('../imgs/left.png');
    background-repeat: no-repeat;
    background-position: center center;
    transition: all 1s;
    cursor: pointer;
 } 
  .prevArrow:hover {
     background-color: #999999;
 }
 .nextArrow {
    display: block;
    position: absolute;
     width: 50px;
    height: 50px;
    background-color: #FFFFFF;
    z-index: 100;
    right:52px;
    bottom:1px;
    background-image: url('../imgs/right.png');
    background-repeat: no-repeat;
    background-position: center center;
    transition: all 1s;
    cursor: pointer;
 }
   .nextArrow:hover {
   background-color: #999999;
 }



 #theVision .prevArrow {
     right:52px;
 
 } 
 
 #theVision .nextArrow {
 
    right:1px;
 
 }
 

.back{
    display: none;
    position: fixed;
    width: 50px;
    height: 50px;
    bottom: 1px;
    right: 1px;
    z-index: 200;
    
}
.back a{
    display: block;
    position: relative;
    width: 50px;
    height: 50px;
    background-image: url('../imgs/up.png');
    background-repeat: no-repeat;
    background-position: center center;
  
    text-decoration: none;
    background-color: #FFFFFF;
    z-index: 100;
}
.back a:hover{
     background-color: #999999;
 
}


.close{
    display: block;
    position: absolute;
    width: 50px;
    height: 50px;
    top: 1px;
    right: 1px;
    z-index: 200;
        background-image: url('../imgs/close.png@v=2');
    background-repeat: no-repeat;
    background-position: center center;
  
    text-decoration: none;
    background-color: #FFFFFF;
    z-index: 100;
    cursor: pointer;
    
}
 
.close:hover{
     background-color: #999999;
 
}





.service1{
     font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 23px;
    line-height: 23px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding-bottom: 30px;
    text-align: left;
 }
.service2{
     font-family: 'Nexa', sans-serif;
    color: #999999;
    font-size: 23px;
    line-height: 23px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding-bottom: 30px;
    padding-top: 10px;
 }.service3{
     font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
 
    letter-spacing: 2px;
    padding-bottom: 5px;
 }.service4{
     font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
 
    letter-spacing: 2px;
    padding-bottom: 5px;
 }



.pillarContainer{
    display: inline-table;
    position: relative;
    width: 100%;
    max-width: 800px;
    height: auto;

  
}
.pillarCell1{
    display: table-cell;
    position: relative;
    width: 90px;
    height: auto;
    text-align: center;
   vertical-align: top;
  
}.pillarCell1 img{
    display: inline-block;
  
}
.pillarCell2{
    display: table-cell;
    position: relative;
    width: auto;
    height: auto;
    text-align: left;
   vertical-align: top;
}


.pillar1{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 25px;
    line-height: 25px;
    font-weight: 500;
 
    letter-spacing: 2px;
    padding-bottom: 40px;
 
}
.pillarTitle2{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 17px;
    line-height: 18px;
    font-weight: 900;
 padding-top: 5px;
    letter-spacing: 2px;
   
}.pillarText2{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 13px;
    line-height: 16px;
    font-weight: 500;
   padding-top: 10px;
    letter-spacing: 2px;
   
}



.contactContainer{
    display: table;
    position: relative;
    width: 100%;
  
    height: 100vh;
}
.contactCell1{
    display: table-cell;
    position: relative;
    width: 75%;
    height: 100%;
        vertical-align: middle;
    text-align: center;
    background-color: #191919;
  
}

.contactCell2{
    display: table-cell;
    position: relative;
    width: 75%;
    height: 100%;
        vertical-align: middle;
    text-align: center;
}


.contactContent{
    display: inline-block;
    position: relative;
    width: 100%;
    height: auto;
    max-width: 75%;
    text-align: left;
}

.contactLine{
    display: block;
    position: relative;
    width: 100%;
    height: 2px;
    margin-top: 20px;
    margin-bottom: 20px;
    background-color: #999999;
}

.contactTitle1{
      font-family: 'Nexa', sans-serif;
    color: #6F6F6F;
    font-size: 27px;
    line-height: 27px;
    font-weight: 900;
 
    letter-spacing: 5px;
    text-transform: uppercase;
     
}
.contactTitle2{
        font-family: 'Nexa', sans-serif;
   color: #FFFFFF; 
    font-size: 80px;
    line-height: 80px;
    font-weight: 900;
   padding-top: 10px;
    letter-spacing: 8px;
    text-transform: uppercase;
   
}.contactTitle3{
        font-family: 'Nexa', sans-serif;
   color: #FFFFFF; 
    font-size: 27px;
    line-height: 27px;
    font-weight: 900;
   padding-top: 20px;
   padding-bottom: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
   
}
.contactInfo{
        font-family: 'Nexa', sans-serif;
   color: #FFFFFF; 
    font-size: 14px;
    line-height: 17px;
    font-weight: 400;
 
   
}
.contactInfo a{
        font-family: 'Nexa', sans-serif;
   color: #FFFFFF; 
    font-size: 14px;
    line-height: 17px;
    font-weight: 400;
 
   
} 
.contactInfo a:hover{
 
   color: #999999; 
     
 
   
}


.contactPanel{
    display: block;
    position: relative;
    width: 100%;
    text-align: center;
}

.contactImage{
    display: table;
    position: relative;
    width: 100%;
    text-align: center;
    table-layout: fixed;
    height: 60px;
}
.contactImageCell{
    display: table-cell;
    position: relative;
    width: 25%;
    height: 100%;
    vertical-align: middle;
    text-align: center;

}

.contactImageCell img{
    display: inline-block;
    position: relative;

  
}


.contactLeft{
    padding-left: 0px;
    padding-right: 20px;
}
.contactRight{
    padding-left: 0px;
    padding-right: 0px;
}
 
.contactField{ 
  display:block;
  width:auto;
  vertical-align:top;
  margin-bottom: 20px;

}
.contactField .fld{   
  display: block;
  width:100%;
  height:auto;
  line-height:auto;
  color:#999999;
  padding:20px;
  border:#999999 1px solid;
  font-family: 'Nexa', sans-serif;
  background:none;
  font-size:14px;
  text-align:left;
  font-weight:300;
} 
.contactField .area{   
  display: block;
  width:100%;
  height:180px;
  line-height:auto;
  color:#999999;
  padding:20px;
  border:#999999 1px solid;
  font-family: 'Nexa', sans-serif;
  background:none;
  font-size:14px;
  text-align:left;
  font-weight:300;
} 


.checkboxesTitle{
     font-family: 'Nexa', sans-serif;
    color: #5b5b5b;
      font-size:11px;
  text-align:left;
  font-weight:300;
}

.checkboxes{
     font-family: 'Nexa', sans-serif;
    color: #5b5b5b;
      font-size:11px;
  text-align:right;
  font-weight:300;
}


/* Main Classes */
.myinput[type="checkbox"]:before{
    position: relative;
    display: block;
    width: 11px;
    height: 11px;
    border: 1px solid #808080;
    content: "";
    background: #FFF;
}
.myinput[type="checkbox"]:after{
    position: relative;
    display: block;
    left: 2px;
    top: -11px;
    width: 7px;
    height: 7px;
    border-width: 1px;
    border-style: solid;
    border-color: #B3B3B3 #dcddde #dcddde #B3B3B3;
    content: "";
    background-image: linear-gradient(135deg, #B1B6BE 0%,#FFF 100%);
    background-repeat: no-repeat;
    background-position:center;
}
.myinput[type="checkbox"]:checked:after{
    background-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAQAAABuW59YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAB2SURBVHjaAGkAlv8A3QDyAP0A/QD+Dam3W+kCAAD8APYAAgTVZaZCGwwA5wr0AvcA+Dh+7UX/x24AqK3Wg/8nt6w4/5q71wAAVP9g/7rTXf9n/+9N+AAAtpJa/zf/S//DhP8H/wAA4gzWj2P4lsf0JP0A/wADAHB0Ngka6UmKAAAAAElFTkSuQmCC'), linear-gradient(135deg, #B1B6BE 0%,#FFF 100%);
}
.myinput[type="checkbox"]:disabled:after{
    -webkit-filter: opacity(0.4);
}
.myinput[type="checkbox"]:not(:disabled):checked:hover:after{
    background-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAQAAABuW59YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAB2SURBVHjaAGkAlv8A3QDyAP0A/QD+Dam3W+kCAAD8APYAAgTVZaZCGwwA5wr0AvcA+Dh+7UX/x24AqK3Wg/8nt6w4/5q71wAAVP9g/7rTXf9n/+9N+AAAtpJa/zf/S//DhP8H/wAA4gzWj2P4lsf0JP0A/wADAHB0Ngka6UmKAAAAAElFTkSuQmCC'), linear-gradient(135deg, #8BB0C2 0%,#FFF 100%);
}
.myinput[type="checkbox"]:not(:disabled):hover:after{
    background-image: linear-gradient(135deg, #8BB0C2 0%,#FFF 100%);  
    border-color: #85A9BB #92C2DA #92C2DA #85A9BB;  
}
.myinput[type="checkbox"]:not(:disabled):hover:before{
    border-color: #3D7591;
}
/* Large checkboxes */
.myinput.large{
    height:22px;
    width: 22px;
}

.myinput.large[type="checkbox"]:before{
    width: 20px;
    height: 20px;
}
.myinput.large[type="checkbox"]:after{
    top: -20px;
    width: 16px;
    height: 16px;
}
/* Custom checkbox */
.myinput.large.custom[type="checkbox"]:checked:after{
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGHRFWHRBdXRob3IAbWluZWNyYWZ0aW5mby5jb23fZidLAAAAk0lEQVQ4y2P4//8/AyUYwcAD+OzN/oMwshjRBoA0Gr8+DcbIhhBlAEyz+qZZ/7WPryHNAGTNMOxpJvo/w0/uP0kGgGwGaZbrKgfTGnLc/0nyAgiDbEY2BCRGdCDCnA2yGeYVog0Aae5MV4c7Gzk6CRqAbDM2w/EaQEgzXgPQnU2SAcTYjNMAYm3GaQCxNuM0gFwMAPUKd8XyBVDcAAAAAElFTkSuQmCC'), linear-gradient(135deg, #B1B6BE 0%,#FFF 100%);
}
.myinput.large.custom[type="checkbox"]:not(:disabled):checked:hover:after{
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGHRFWHRBdXRob3IAbWluZWNyYWZ0aW5mby5jb23fZidLAAAAk0lEQVQ4y2P4//8/AyUYwcAD+OzN/oMwshjRBoA0Gr8+DcbIhhBlAEyz+qZZ/7WPryHNAGTNMOxpJvo/w0/uP0kGgGwGaZbrKgfTGnLc/0nyAgiDbEY2BCRGdCDCnA2yGeYVog0Aae5MV4c7Gzk6CRqAbDM2w/EaQEgzXgPQnU2SAcTYjNMAYm3GaQCxNuM0gFwMAPUKd8XyBVDcAAAAAElFTkSuQmCC'), linear-gradient(135deg, #8BB0C2 0%,#FFF 100%);
}





.contactSubmit{ 
    display:block; 
    position: relative;
    margin-top: -37px;
    width: 120px;

  
}

.contactSubmit a{  
        display:inline-block; 
        width:auto;
         height:auto;
        font-size:12px; 
        line-height:45px; 
        padding-left: 10px;
        padding-right: 10px;
   color:#000000;
 
 
        font-family: verdana, sans-serif;
        background-color:#999999; 
        text-align:center;    
        margin:0px;    
           
        text-decoration:none;   }
.contactSubmit a:hover{ background-color:#000000;  color: #FFFFFF;  }




.contactButton{ 
    display:block; 
    position: relative;
    margin-top: -37px;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 15px;
    padding-right: 15px;
    width: 150px;
   color:#000000;
   background-color: #bcbcbc;

  
}

.contactButton a{  
        display:inline-block; 
        width:auto;
            padding: 25px;

         height:auto;
        font-size:12px; 
        line-height:45px; 
        padding-left: 10px;
        padding-right: 10px;
   color:#000000;
 
 
        font-family: verdana, sans-serif;
        background-color:#999999; 
        text-align:center;    
        margin:0px;    
           
        text-decoration:none;   }
.contactButton a:hover{ background-color:#000000;  color: #FFFFFF;  }





.brochurebutton{ 
    display:block; 
    position: relative;
    margin-top: -37px;
    width: 120px;
  
}

.brochurebutton a{  
        display:inline-block; 
        width:auto;
         height:auto;
        font-size:12px; 
        line-height:45px; 
        padding-left: 10px;
        padding-right: 10px;
   color:#000000;
 
 
        font-family: verdana, sans-serif;
        background-color:#999999; 
        text-align:center;    
        margin:0px;    
           
        text-decoration:none;   }
.brochurebutton a:hover{ background-color:#000000;  color: #FFFFFF;  }



.pagePad{
    padding: 20px;
}



@media (max-width: 700px){
.lbl1{
     font-family: 'Nexa', sans-serif;
    color: #000000;
    font-size: 15px;
    line-height: 15px;
    font-weight: 900;
    text-transform: uppercase;
  
    letter-spacing: 5px;
    padding-bottom: 5px;
 
}
.lbl2{
     font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 25px;
    line-height: 25px;
    font-weight: 900;
    text-transform: uppercase;
   padding-bottom: 15px;
    letter-spacing: 9px;
 
}

.btitle{
     font-family: 'Nexa', sans-serif;
    color: #bcbcbc;
    font-size: 12px;
    line-height: 12px;
     font-weight: 900;
    text-transform: uppercase;
  
    letter-spacing: 2px;
 
    max-width: 520px;
}.btxt{
    font-family: 'Nexa', sans-serif;
    color: #bcbcbc;
    font-size: 13px;
 
    line-height: 16px;
    max-width: 470px;
 
    padding-top: 10px;
    text-align: left;
    -moz-text-align-last: left;
    text-align-last: left;
 
}





.serviceContainer{
    display: block;
    position: relative;
    width: 100%;
    max-width: 1500px;
    height: auto;
}
.serviceContainerCell1{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    text-align: left;
        vertical-align: top;
  
}

.serviceContainerCell2{
    display: block;
    position: relative;
    width: auto;
    height: auto;
        vertical-align: middle;
    text-align: center;
    padding-top: 15px;
}
.serviceContainerCell3{
    display: none;
}




.service1{
     font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 18px;
    line-height: 18px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-bottom: 10px;
    text-align: left;
 }
.service2{
     font-family: 'Nexa', sans-serif;
    color: #999999;
    font-size: 18px;
    line-height: 18px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-bottom: 10px;
    padding-top: 10px;
 }.service3{
     font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    font-weight: 500;
 
    letter-spacing: 1px;
    padding-bottom: 5px;
 }.service4{
     font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 11px;
    line-height: 14px;
    font-weight: 500;
 
    letter-spacing: 1px;
    padding-bottom: 15px;
 }



.serviceTable{
    display: table !important;
    position: relative;
    width: 100%;
    height: auto  !important;
    table-layout: fixed;
    padding-top: 90px;
    padding-bottom: 90px;
}





.pillar1{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 16px;
    line-height: 18px;
    font-weight: 500;
 
    letter-spacing: 2px;
    padding-bottom: 20px;
 
}
.pillarTitle2{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 14px;
    line-height: 14px;
    font-weight: 900;
 padding-top: 5px;
    letter-spacing: 2px;
   
}.pillarText2{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 10px;
    line-height: 14px;
    font-weight: 500;
   padding-top: 10px;
    letter-spacing: 2px;
   
}



.sectionTitle{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: 900;
    line-height: 20px;
    padding: 0px;
    padding-bottom: 0px;
}


.projectPadding{
    padding: 10px;

}


.overThis{
    height: 200px;
    overflow: auto;
}

 
.grid__col {
    display: block;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}


.projectTitle{
    font-family: 'Nexa', sans-serif;
    color: #FFFFFF;
    font-size: 19px;
    line-height: 19px;
    text-align: left;
    padding-bottom: 10px;
    padding-right: 50px;
 

}


.contactContainer{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
}
.contactCell1{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    vertical-align: middle;
    text-align: center;
    background-color: #191919;
  
}

.contactCell2{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
        vertical-align: middle;
    text-align: center;
}



.contactTitle1{
      font-family: 'Nexa', sans-serif;
    color: #999999;
    font-size: 15px;
    line-height: 15px;
    font-weight: 900;
 
    letter-spacing: 5px;
    text-transform: uppercase;
     
}
.contactTitle2{
        font-family: 'Nexa', sans-serif;
   color: #FFFFFF; 
    font-size: 40px;
    line-height: 40px;
    font-weight: 900;
   padding-top: 10px;
    letter-spacing: 8px;
    text-transform: uppercase;
   
}.contactTitle3{
        font-family: 'Nexa', sans-serif;
   color: #FFFFFF; 
    font-size: 15px;
    line-height: 15px;
    font-weight: 900;
   padding-top: 20px;
   padding-bottom: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
   
}

}


/* Not important. General styling
------------------------------------------ */
@import url("https://fonts.googleapis.com/css?family=Roboto:400,400i,700");
*{ margin: 0; padding: 0; box-sizing: border-box; }
*::before, *::after{ box-sizing: inherit; }
body{ color: rgba(0,0,0,.87); font-size: 1rem; line-height: 1.5; 
  font-family: 'Nexa', sans-serif; background: #FFFFFF; padding: 2rem 2rem 0; }
.wrapper{ display: flex; flex-flow: row; flex-wrap: wrap; justify-content: center; }
.wrapper > *{ margin: 0 1rem 2rem; }

/**************************************************
** CARDS STYLING 
***************************************************/
/* Card outside box. Here is where the 
** dimensions, shadows and borders are set 
------------------------------------------ */
.card{
  position: relative;
  overflow: hidden;
  display: flex;
  
  width: 300px; /* Box dimensions */
  height: 200px; 
  
  border-radius: 5px; /* Styling */
  box-shadow: 0 4px 4px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);  
  transition: box-shadow 0.56s ease-in-out; /* Animation */
  /* background-color: rgba(0,0,0,.2); /* for debugging */
}
/* Shows an outer shadow */
.card:hover{ /* Just for styling */
  cursor: pointer;
  box-shadow: 0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.2);
}

/* Cards titles styling
------------------------------------------ */
.card__title{ /* Just for styling */
    align-self: flex-end; padding: 1.0rem;
    color: rgba(255,255,255,.90); font-size: 2rem;
    line-height: 1;font-weight: 600; }  

/* Styles for:
** - Using IMG tag inside a container
------------------------------------------ */
/* The image container */
.card__thumbnail{
  position: relative;
  overflow: hidden;  
  display: flex;
  justify-content: center; /* horizontal center */
  align-items: center; /* vertical center */
  
  width: 100%; /* Thumbnail dimensions. */
  height: 100%; /*** Change the height to make the image smaller ***/
  /* background-color: rgba(0,0,0,.2);  /* for debugging */
  
}
/* Sets the image dimensions */
.card__thumbnail > img{ /* Tip: use 1:1 ratio images */
  height: 100%; /* or width when img.width > img.height */ 
}  
/* Styles the title inside the img container */
.card__thumbnail > .card__title{ /* Just for styling */
  position: absolute; left: 0; bottom: 0; }


/* Styles for:
** - Using background-size on CSS
** - Using background-size on HTML
** - Using background-size on JS
------------------------------------------ */
/* Prepares a container to have cover background */
.has-bg-img{
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
/* Loads a specific image to a container */
.bg-img-nature{
  background-image: url(https://images.unsplash.com/photo-1441974231531-c6227db76b6e?ixlib=rb-1.2.1&q=85&fm=jpg&crop=entropy&cs=srgb&ixid=eyJhcHBfaWQiOjE0NTg5fQ);
}