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


@font-face {
    font-family: 'Montserrat-BoldItalic';
    src: url('../fonts/Montserrat-BoldItalic.woff2') format('woff2'),
        url('../fonts/Montserrat-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: 'Montserrat-ExtraBoldItalic';
    src: url('../fonts/Montserrat-ExtraBoldItalic.woff2') format('woff2'),
        url('../fonts/Montserrat-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}


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

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


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

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

@font-face {
    font-family: 'Montserrat-SemiBold';
    src: url('Montserrat-SemiBold.woff2') format('woff2'),
        url('Montserrat-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-SemiBoldItalic';
    src: url('../fonts/Montserrat-SemiBoldItalic.woff2') format('woff2'),
        url('../fonts/Montserrat-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-Thin';
    src: url('Montserrat-Thin.woff2') format('woff2'),
        url('Montserrat-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

*{
    padding: 0;
    margin: 0;
    text-decoration: none;
    box-sizing: border-box;
    font-family: 'Montserrat';
    
}

*:focus{outline: none;box-shadow: none;}

html, body {scroll-behavior: smooth}
.slick-prev:before {
    margin-right: 15% !important;
    content: url("../imgs/arrow-left.png")!important;
    color: #8897A2 !important;
    font-size: 50px !important;
  }
  .slick-next:before {
    margin-left: 15% !important;
    content: url("../imgs/right-arrow.png")!important;
    color: #8897A2 !important;
    font-size: 50px !important;
  }

.form-maps{background-color: #fff;padding: 3% 15% 4% 15%; }
.contForm{width: 100%;background-color: #ffffff;min-height: 400px;}
.mapsCont{width:50%;}
input:focus{border: 2px solid #2D435B !important;}  
textarea { resize: none; }
textarea:focus{ resize: none; border: 2px solid #2D435B !important; }
.contForm{padding: 3% 2%;display: flex;flex-direction: column;}
.contFormInput{display: flex;justify-content: space-between;flex-wrap: wrap;}
.contFormInput input{width: 49.5%;font-size: 16px; margin-bottom: 1%;padding: 1%;border: 1px solid #8597A3; border-radius: 5px;}
.contInpt{padding: 1%;margin-bottom: 1%; font-size: 16px; border: 1px solid #8597A3; width:100%;border-radius: 5px;}
.contInpt::placeholder{color: #8597A3; font-size: 14px; font-family: 'Montserrat-Regular';}
.contFormInput input::placeholder {color: #8597A3 ;font-size: 14px; font-family: 'Montserrat-Regular';}
.buttonForm1 {height: 40px;width: 95px;border-radius: 20px;background-color:rgb(4, 21, 51);border: none;color: #ffffff;font-size: 13px;font-weight: bold;}
.buttonForm1:hover{border: 2px solid rgb(4, 21, 51);background-color: transparent;color: rgb(4, 21, 51);border-radius: 0px;font-weight: 700;transition:0.5s;}
.mapsBtn{text-align:center;}
.textHeroFind{z-index: 2;color: #ffffff;font-weight: 600;position: absolute;left:43%;bottom: 45%;font-size: 45px;}
.topText{padding:4% 15%;display: flex;justify-content: center;align-items: center;background-color: #fff;}
.topTextTittle{width: 30%;font-size: 32px;font-weight: 900;color:#063e8e;}
.topTextDets{ width: 60%;font-size: 15px;}
.findmap{width:100%;height: 400px;}

/* checkmark sign*/
.checkmark {width: 45px;height: 45px;border-radius: 50%;display: block;stroke-width: 2;stroke: rgb(250, 249, 249);stroke-miterlimit: 10;box-shadow: inset 0px 0px 0px #ddaa5f;animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;}
.checkmark__circle {stroke-dasharray: 166;stroke-dashoffset: 166;stroke-width: 2;stroke-miterlimit: 10;stroke: #ddaa5f;fill: none;animation: stroke .6s cubic-bezier(0.650, 0.000, 0.450, 1.000) forwards;}
.checkmark__check {transform-origin: 50% 50%;stroke-dasharray: 48;stroke-dashoffset: 48;animation: stroke .3s cubic-bezier(0.650, 0.000, 0.450, 1.000) .8s forwards;}
@keyframes stroke {100% {stroke-dashoffset: 0;}}
@keyframes scale {0%, 100% {transform: none;}50% {transform: scale3d(1.1, 1.1, 1);}}
@keyframes fill {100% {box-shadow: inset 0px 0px 0px 30px #ddaa5f;}}
 
/* checkmark page */
/* .successFormPage{padding: 15% 0; justify-content: center; align-items: center; display: none;width: 100%;height: 100%; margin-top: 20%;padding: 2% 10%;}
.thankU{ font-size: 30px; color: #05306d; font-weight: 900;}
.thankUFirst{font-size: 25px; color: #0d4ba1; font-weight: 700; margin-top:20px ;}
.thankUSecond{font-size: 20px; color: #0d4ba1; font-weight: 500;}
.successFormPageMapsForm{justify-content: center; align-items: center;display: none;width: 100%;height: 100%; margin-top: 0%;padding: 2% 10%;} */
.contact-form-title{
    text-align: center;
    font-size: 30px;
    font-family: 'Montserrat-ExtraBold';
    color: #2D435B;
    text-transform: uppercase;
    
}
.fields-marked-with{
    padding-bottom: 30px;
    font-size: 14px;
    font-family: 'Montserrat-Regular';
    color: #8597A3;
}

.projects-menu{
    padding: 15px 0;
}  

.projects-menu ul li a{
      color: #8597A3;
      font-family: 'Montserrat-Regular' !important;
      font-size: 14px !important;
}

.projects-menu ul li a:hover{
    color: #2D435B;
    font-weight: bold;
    font-style: normal;
    font-display: swap;
    border-bottom: 1px solid #2D435B;

}


#myImg{
    cursor: pointer;
    transition: 0.5s;
}

#myImg:hover{
    opacity: 0.7;
}

  .projects-menu ul li{
    list-style: none;
    padding: 0 20px !important;
}

.related-project-column-33-33 .hero::after {display:block; content: " ";height: 420px !important; position: absolute;top: 0;left: 0;transition: 0.3s ease-in-out;width: 100%;background-color: #3b5872c4 ;}

.related-project-column-33-33:hover .hero::after { background:linear-gradient(to bottom,	rgb(255,255,255,0.1),rgb(255,255,255,0.1),rgb(59,88,114,0.8)) }

.related-project-column .hero-related::after {transition: 0.3s ease-in-out;display:block; content: " ";height: 300px !important; position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #3b5872c4 ;}

.related-project-column:hover .hero-related::after {  background:linear-gradient(to bottom,	rgb(255,255,255,0.1),rgb(255,255,255,0.1),rgb(59,88,114,0.8))}



.hero{width:100%;height: 420px;position: relative;}
.hero-related{width:100%;height: 300px;position: relative;}

/*.image-no-hover {height: 420px !important;}*/
.services-item { position: relative; height: 430px;  }
.services-item a { display: block }
.services-item .service-image { height: 430px; position: absolute; transition: all 300ms ease-in; top: 0; left: 0; right: 0; bottom: 0; background-size: cover; margin: 7px;background-repeat: no-repeat; background-position: center}
.services-item .service-image::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(10,39,72,0.7); opacity: 1; transition: 0.3s ease-in-out}
.services-item:hover .service-image::after { opacity: 1 ; background:linear-gradient(	rgb(255,255,255,0.1),rgb(255,255,255,0.1),rgb(59,88,114,1))  }

/* .bridges-hover{
    content: url("../imgs/Our\ services\ -\ Bridges\ -\ No\ Hover.png");
    transition: 2s;
 }
 
 .bridges-hover:hover{
     content: url("../imgs/Our\ services\ -\ Bridges\ -\ Hover.png");
     transition: 2s;
 }
 .facilities-hover{
    content: url("../imgs/Our\ services\ -\ Facilities\ -\ No\ Hover.png");
    transition: 2s;
 }
 
 .facilities-hover:hover{
     content: url("../imgs/Our\ services\ -\ Facilities\ -\ Hover.png");
     transition: 2s;
 }
 .roads-hover{
    content: url("../imgs/Our\ services\ -\ Roads\ -\ No\ Hover.png");
    transition: 2s;
 }
 
 .roads-hover:hover{
     content: url("../imgs/Our\ services\ -\ Roads\ -\ Hover.png");
     transition: 2s;
 } */

.projects-menu ul {
    display: flex;
}



body {
    margin: 0;
    padding: 0;
    font-family: 'Montserrat';
    font-size: 16px;
       
}

.img-right-3{
    display: none;
}

.x{
    overflow: auto;
}
.y{
    overflow: hidden;
}


/* Three image containers (use 25% for four, and 50% for two, etc) */
.column {
    float: left;
    width: 33.33%;
    padding: 5px;
  }

.column-2imgs {
    float: left;
    width: 50%;
    padding: 5px;
  }

  .column2 {
    float: left;
    width: 32.2%;
    
    padding: 5px;
    position: relative;
   
  }
  .column2 p{
    position: absolute;
    bottom: 10px;
    left: 25px;
    color: white;
    text-transform: uppercase;
    font-family: 'Montserrat-extraBold';
    font-size: 26px;
    transition: 0.3s ease-in-out;
  }
  .column2 p:hover{
    color: #3B5872;
  }
  .column2.services-item p:hover{
    color: #FFFFFF;
  }

  /* Clear floats after image containers */
  .row::after {
    content: "";
    clear: both;
    display: table;
    
  }

  .row2::after {
    content: "";
    clear: both;
    display: table;
    
  }

  .related-project-row::after{
    content: "";
      clear: both;
      display: table;
    }
    .related-project-row {
     width: 100%;
    }
   
    
.related-project-column{
    position: relative;
    float: left !important;
    width: 50%;
    padding: 5px;
    }
    .related-project-column-33-33 {
        position: relative;
          float: left !important;
          width: 33.33%;
          padding: 5px;
        }
        .related-project-column img{
            object-fit: cover;
            height: 300px;
        }

  
  .row2{
    width: 100%;
}


.heropic{
    background: url('../../assets/imgs/heropic-desk-notext.png') no-repeat center center ; 
    background-size: cover;
    position: relative;
    background-repeat: no-repeat;
    width: 100%;
    height: 900px;
}
.heropic p{
    line-height: 60px;
    text-align: center;
    left: 48%;
    font-size: 47px;
    font-family: 'Montserrat-Regular';
    position: absolute;
    top: 40%;
    color: white;
    
}
.column2 p span{
    font-weight: 500;
    font-size: 30px !important;
}
.related-projects-texts span{
    font-weight: 500;
    font-size: 25px !important;
}
.heropic span{
    font-family: 'Montserrat-ExtraBold';  
}
.heropic-contact-page{
    background: url('../../assets/imgs/contact-us-heropic.png') no-repeat center center;
    background-size: cover;
    position: relative;
    background-repeat: no-repeat;
    width: 100%;
    height: 430px;

}

.contactus-header-content{
    padding: 70px 25%;
    text-align: center;
  
}
.contactus-header-title{
    text-transform: uppercase;
    color: #2D435B;
    font-size: 40px;
    font-family: 'Montserrat-ExtraBold';
    
}
.contactus-header-sub{
    color: #2D435B;
    font-size: 18px;
    font-family: 'Montserrat-Regular';
}

footer{
    bottom: 0;
}

.projects-img-slider{
    height: 427px; 
    width:100%;
}

.hero-attributes{
    position: relative;
}
.hero-attributes p{
    text-transform: uppercase;
    color: #FFFFFF;
    font-size: 40px;
    width: 65%;
    text-align: center;
    position: absolute;
    padding-left: 38%;
    top: 170px;
}
.hero-attributes span{
    font-weight: 900;

}

.navigation-desk{
   padding-top: 50px;
   padding-right: 70px;
     
}
.navigation-desk ul{
    display: flex;
    
    
}

.header-desk{
    display: flex;
    justify-content: space-between;
    
    
}


.header-desk img{
    padding-top: 35px;
   padding-left: 100px;
   
}

.navigation-desk ul li{
    list-style: none;
    padding: 0 45px;
}


.navigation-desk ul li a{
    color: #2D435B;
    font-size: 13px;
    font-family: 'Montserrat-Regular';
    
} 

.navigation-desk ul li a:hover{
    color: #2D435B;
    text-decoration: none;
    text-shadow: 0 0 1px;
    

} 
.container-footer-mobile{
    display: none;
}

nav{   
    width: 100%;
}
nav .logo2{

    margin: 15px 50px;
}

nav ul{
    float: right;
}

nav ul li{
    display: inline-block;
    line-height: 80px;
    margin: 0 5px;
    padding-left: 15px;
}

nav ul li a{
    color: #2D435B;
   


}
.contact a{
    color: white;
}
.contact a:hover{
    font-weight: bold;
    color: white;
}


.checkbtn {
    font-size: 30px;
    float: right;
    line-height: 80px;
    margin-right: 40px;
    cursor: pointer;
}

#check{
    display: none;}

.wrapper{
    width: 1371px;
}

.header1 {
    margin: 0;
    background-image: url('../../assets/imgs/ban1.png');
    width: 100%;
    height: 100vh;

}



.logo {
    margin: 2em; 
    width: 50%;
          
}

#nav {
    
    margin-right: -85%;
}

.container-nav {
    display: flex;
    justify-content: space-between;
    margin: 0 2em;
    align-items: flex-start;
    

}


.img-one img {
    display: block;
  margin-left: auto;
  margin-right: auto;
  width: 38%;
  fill: #3B5872;
}

.parag1 {
    
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%, -50%);
    color: #FFFFFF;
    font-size: 1.5em;
    width: 20%;
    text-align: center;
}

.parag1 span{
    font-weight: 900;
    
}

.p2{
    font-weight: bold;
    width: 90%;
    font-size: 18px;
    color: #2D435B;
}

.p3{
    font-weight: 500;
    font-size: 14px;
    color: #8597A3;
}

.cols {
    display: flex;
    align-items:baseline;
    justify-content: space-between;
    padding-bottom: 30px;
}
.cols-ourprincipals {
    display: flex;
    align-items:baseline;
    justify-content: space-between;
    padding-bottom: 30px;
}

.p2-div {
    margin-top: 10%;
    width: 50%;
     
    
}

.container-first{

 align-items: flex-start;
 width: 100%;  
 padding: 0 15%;
}

.first-container-projects{
    background-color:rgb(133, 151, 163 , 0.2) ;
    width: 100%;  
    padding: 2% 15%;
    margin-top: 5%;
   }   



.p3-div {
    padding: 40px 0;
    width: 50%;      
    
}

.container-second {
    
    background-color:#2D435B ;
    width: 100%;  
    padding: 2% 15%;
}


#myBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    top: 550px; /* Place the button at the bottom of the page */
    right: 30px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color: #2D435B; /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 15px; /* Some padding */
    border-radius: 10px; /* Rounded corners */
    font-size: 18px; /* Increase font size */
  }
  
  #myBtn:hover {
    background-color: #8597A3; /* Add a dark-grey background on hover */
  }



.p4-div {
    font-family: 'Montserrat-Bold' !important;
    width: 50%;
    padding-top: 25px;
    padding: 0;

}

.p4{
    font-weight: bold;
    padding-right: 20%;
    color: #8597A3;
    font-size: 18px !important;
   
    }

.p5-div {
    width: 50%; color: #FFFFFF;
}

.p5{
    font-family: 'Montserrat-Regular';
    font-size: 14px;
}
.p5-2{
    font-family: 'Montserrat-SemiBoldItalic';
    font-size: 14px;
}
.burger4{
    color: white !important;
}
.closer-together2 {   
    color: #FFFFFF;
}

.andvalues{
    color: #2D435B;
}


.briding2 {
    padding: 30px 0;
    color: #FFFFFF;
    font-size: 32px;
    text-transform: uppercase;
    width: 50%;

}
.active{
    font-family: 'Montserrat-ExtraBold' !important;
}
.active-projects{
    color: #2D435B !important;
    font-weight: bold !important;
    font-style: normal !important;
    font-display: swap !important;
    border-bottom: 1px solid #2D435B !important;
}

.briding2 span{
    font-weight: bold;
}

.principals {
    text-transform: uppercase;
    color: #2D435B;
    font-size: 32px;
    width: 35%;
    padding-top: 70px;
    
}

.principals span{
    font-weight: bold;

}


.container-three{
    background-color: rgb(133, 151, 163,0.12);
    width: 100%;  
    padding: 5% 25%;


}

.p-15 { 
    margin: 0 auto;
    text-align: center;
    align-items: center;
}

.difference2{
    font-size: 32px;
    color: #2D435B;
    text-transform: uppercase;
    font-family: 'Montserrat-Regular' !important;
}

.difference2 span{
    font-family: 'Montserrat-ExtraBold' !important;
}
.p-30{
    padding-bottom: 5%;
}

.p-10{
    padding: 10px 0;
    color: #2D435B;
    
    font-size: 18px;
    font-weight:bold;
    text-align: center;
    
    
}

.p-11{
    color: #2D435B;
    text-align: center;
    font-size: 14px;
    width: 110%;
    font-weight: 400;
}
.btn-submit{
    background-color: #2D435B; 
    color: white;
    border-radius: 30px;
    border: solid 1px transparent;
    padding: 15px 40px;
    text-align: center;
    font-weight: 600;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;

}
.btn-submit:hover{
    font-weight: 600;
    background-color: transparent; 
    color: #2D435B !important;
    border: 1px solid #2D435B;
}
.btn-check{
    background-color: #2D435B; 
    border-radius: 30px;
    border: solid 1px transparent;
    padding: 15px 50px;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
}

.btn-loadmore{
    background-color: #2D435B; 
    border-radius: 30px;
    border: solid 1px transparent;
    padding: 15px 50px;
    color: white;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
}
.btn-loadmore:hover{
    background-color: transparent; 
    color: #2D435B !important;
    border: 1px solid #2D435B;
    
}
.container-seven-1 a{

    color: white !important;
}

.container-seven-1 a:hover{
    background-color: transparent; 
    color: #2D435B !important;
    border: 1px solid #2D435B;

}

.btn-check-div{
    padding-top: 5%;
}
.btn-loadmore-div{
    text-align: center;
    padding: 60px 0;
}
.rows-our-projects{
    padding-top: 30px;
    margin-bottom: 20px;
}

.rows-our-projects a:hover{
    border-bottom: 1px solid white;
}



.btn-check-div a:hover{
    background-color: transparent; 
    color: #2D435B !important;
    border: 1px solid #2D435B;

    }
.p-15 a{
    color: white;

}

.hidden{
    display: none;
}
.error{
    color: red;
}

.container-fourth {
    position: relative;
    width: 100%;  
    padding: 2% 15%;

}


.img-right-2{
    position: absolute;
    right: 0;
    top: -50px;
    
}
.img-right-2 img{
    height: 550px;  
}





.p66-div {
    padding-top: 25px;
    padding-bottom: 40px;
    width: 50%;
}

.p66{
    font-size: 18px;
    font-weight: bold;
    color: #2D435B;
    width: 80%;
   
   
    }


.slick-slide img{
    object-fit: cover;
    height: 420px;
        width: 100% !important;
    }    

.p77-div {
    width: 50%;
    margin: 5em ;
    color: #FFFFFF;
       }

.container-six{
    width: 100%;  
    padding-left: 15%;
    padding-right: 15% ;
    padding-top: 40px;
    padding-bottom: 70px ;
    
}
.column {
    position: relative;
}
.related-projects-texts-small{
    font-size: 12px;
    font-weight: 400;
    color: #FFFFFF;
}

.related-projects-texts{
    width: 80%;
    font-size: 22px;
    font-weight: 600;
    text-transform: uppercase;
    color: white;
    display: flex;
    flex-direction: column;
    position: absolute;
    bottom: 15px;
    left: 30px;
}
.related-projects-texts a{
    font-size: 20px;
    color: white;
    font-weight: 650;
}

.related-projects-texts a:hover{
    color: white;
    border-bottom: 2px solid white;
}
.related-projects-texts p{
    margin: 0;
    padding: 0;
}

/* .slider-texts{
    display: flex;
    flex-direction: column;
    position: absolute;
    bottom: 15px;
    left: 30px;
}
.slider-texts p{
    margin: 0;
    padding: 0;
} */

.column p{
    
    font-size: 24px;
    font-weight: 900;
    text-transform: uppercase;
    color: white;   
}
.container-eleven-sub {
    font-weight: 400 !important;
    font-size: 12px !important;
    color: white;   

}
.related-products-container{
    padding-right: 15%;
    padding-left: 15%;
    padding-top: 20px;
    padding-bottom: 80px;
    background-color: rgba(133, 151, 163, 0.12);
}

.container-seven{
    position: relative;
  
    width: 100%;  
    padding: 2% 15%;
    background: url('/assets/imgs/tinted-desktop.png') no-repeat center center;
    background-size: cover;
}


.container-seven-p1{
    color: #2D435B;
    font-weight: 600   ;
    padding-top: 20px;
    text-align: center;
    font-size: 18px;
}


.quality-and-safety-div{
    text-align: center;
    margin-top: 60px;
    display: flex;
    justify-content: space-evenly;
}
.quality-items{
    text-align: center;
}

.quality-parag-div{
    font-size: 16px;
    text-align: center;
   color: #2D435B;
   font-weight: bold;
    width: 80%;
}

.quality-img-class{
    padding-right: 30%;
    padding-bottom: 20px;
}

.project-image-class{
    padding-right: 20%;
    padding-bottom: 25px;
}

.process-image-class{
    padding-right: 25%;
    padding-bottom: 20px;

}
.project-parag-div{
    text-align: center;
    font-weight: bold;
   color: #2D435B;
    width: 80%;
    font-size: 16px;

}

.process-parag-div{
    text-align: center;
    font-weight: bold;
   color: #2D435B;
    width: 80%;
    font-size: 16px;

}
.container-seven-1{
    text-align: center;
    padding: 30px 10%;
}
.btn-viewall-div{
    padding-top: 40px;
    text-align: center;
}

.btn-viewall-div a{
    color: white;
}

.btn-viewall-div a:hover{
    background-color: transparent; 
    color: #2D435B !important;
    border: 1px solid #2D435B;

}
.res1 {
    width: 70%;
    margin-top: 2em;
    margin-left: 20%;

}       


.flexme {
    list-style: none;
    display: flex;
    width: 80%;
    padding-top: 30px;
  
}

.li-text{
    padding-left: 15px;
}

.p99 {
   
    color: #2D435B;
    
    
   
    }

.li-items {
    font-size: 20px;;
    color: #8597A3;
    font-family: 'Montserrat-SemiBoldItalic';
    font-weight: 600;
}    

.p102{
    width: 100%;
    color: #2D435B;
    padding-top: 20px;
    font-weight: 500;
    font-size: 14px;
   
    }

.burger {
    display: none;
}   

    

.desktop-nav ul {

    list-style: none;
    display: flex;
    padding: 0;
    justify-content: flex-end;
    margin: 3em 0;
   
}

.toggle-btn {
    width: 35px;
    position: absolute;
    right: 80px;
    top: 40px;
    display: none;

}

/* .toggle-btn span{
    display: inline-block;
    width: 100%;
    height: 2px;
    background-color: #000;
    float: left;
    margin-bottom: 8px;

} */

.desktop-nav li {

    margin: 0 1.5em;
    
}

.desktop-nav a {

    text-decoration: none;
    font-weight: 700;
    color: #2D435B;
}

.img-div img{
    position: relative;
    float: right;
    width: 20%;

}

.separator{
    border-bottom: 1px solid #8597A3;
    padding-top: 50px;
    width: 100%;
}

.our-services{
    font-size: 32px;
    text-align: center;
    color: #2D435B;
    font-weight: 700;
    text-transform: uppercase;

}

.services_col_container {display: grid; grid-template-columns: repeat(3, 30%); grid-column-gap: 5%}
.service_col {display: block; position: relative; overflow: hidden}
.service_col::after {content: '';display: block; clear: both}
.service_inner_container { position: relative}
.service_inner_container p{ position: absolute; width: 100%; bottom: -9px; left: 0; color: white; text-transform: uppercase; font-family: 'Montserrat-extraBold'; font-size: 26px; z-index: 2; background: -webkit-gradient(linear,left top,left bottom,from(transparent),to(rgb(29 48 69))); padding: 20px; transition: .3s ease-in-out}
.tint_overlay::before {content: '';position: absolute;top: 0;right: 0;bottom: 0;left: 0;background: rgb(29,48,69);z-index: 1;height: 100%; transition: .3s ease-in-out; opacity: .4}
.service_col:hover .tint_overlay::before { opacity: 0 }
.service_col:hover .service_inner_container p { padding: 40px }

.our-projects-title{
    padding: 30px 0;
    font-size: 32px;
    text-align: center;
    color: #2D435B;
    font-weight: 900;
    text-transform: uppercase;

}

.our-quality{
    padding-top: 30px;
    text-align: center;
    color: #2D435B;
    font-family: 'Montserrat-ExtraBold';
    text-transform: uppercase;
    font-size: 32px;

}

.container-seven-1-p1{
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    color: #2D435B;
    font-size: 14px;
}
.container-seven-1-p2{
    padding: 15px 0;
    color: #2D435B;
    font-weight: 600;
    font-style: italic;
    font-display: swap;
    font-size: 14px;
}

.container-footer-desktop{
    background-color: #2D435B;
    padding: 50px 15%;
    
}
.copyright2{
    font-family: 'Montserrat-Regular' !important;
    color: white;
    font-size: 12px;
    padding-left: .7%;
}
.copyright2 a{
    font-family: 'Montserrat-Regular' !important;
    color: white !important;
}

.footer-div{
    display: flex;
}

.container-footer-desktop .footer-menu a{
    color: white; transition: .3s ease-in-out
}
.container-footer-desktop .footer-menu a:hover , .footer-projects a:hover{
    font-weight: 650 !important;
    color: white; 
}
.container-footer-desktop .footer-projects a{
    color: #8597A3;
    
    
}
.container-footer-desktop .footer-projects a:hover{
    color: white;  
}

.projects-tab-footer{
    font-size: 13px !important;
    color: white !important;
    margin-left: -15px;
    font-weight: 500;
}
.container-footer-desktop .footer-projects p{  
    color: white;
    font-weight: 500;
    font-size: 13px;
}
.container-footer-desktop ul li {
    color: #FFFFFF;  
    font-weight: 500;
    font-size: 13px;
    min-width: 100px;
}
.arrow {
    border: solid white;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 4px;
  }
  
  .right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }
.container-footer-desktop .info-footer .address span{
    font-weight: 600;
}
.container-footer-desktop .info-footer .contact span{
    font-weight: 600;
}

.footer-menu{
    padding-left: 20%;
}

.footer-menu li{
    padding-top: 7px;
    list-style: none;
    padding-left: 20%;
}
.footer-projects{
    padding-top: 5px;
    padding-left: 10%;
}
.footer-projects li{
    color: #8597A3 !important;
}
.footer-projects li a{
    font-size: 12px;
}
.info-footer{
    font-size: 13px;
    float: right;
    color: #FFFFFF; 
    font-weight: 500;
    padding-left: 5%;
}

.seperator-footer{
    border-right: 1px solid #FFFFFF;
    padding-left: 5%;
    padding-right: 2%;
}


.links-projects{
    position: relative;
    
    
}
.link-to-project{
    
    font-family: 'Montserrat-ExtraBold' !important;
}
.container-eight{
   
    padding-left: 10%;
    padding-right: 10%;
    padding-top: 40px;
    padding-bottom: 0;
}

.container-eight-p1{
    margin: 0 auto;
    width: 50%;
    text-align: center;
    font-size: 27px;
    color: #2D435B;
    font-weight: 650;
}
.container-eight-elements{
    align-items:baseline;
    width: 100%;
    display: flex;
    padding: 40px 15%;
    justify-content:space-evenly;
}

.container-eight-elements-e1{
    width: 120%;
}



.container-eight-elements-e1-items{
    align-items: center;
    padding: 7px 0;
   
}

.container-eight-elements-e1 span{
font-family: 'Montserrat-Regular' !important;
   padding-left: 2%;
    color: #8597A3;
    font-size: 14px;
}

.container-nine {
    position: relative;
    padding: 30px 10%;
}
.img-left{
    position: absolute;
    left: 0;
    bottom: -40px;
}
.img-left img{
    height: 550px; 
}

.container-nine-parags{
    
    padding-left: 50%;
    width: 100%;
    margin-bottom: 70px;
}
.container-nine-parags-title{
    font-size: 32px;
    font-family: 'Montserrat-ExtraBold';
    color: #2D435B;
    text-transform: uppercase;
}
.container-nine-parags-p1{
    font-size: 18px;
    font-weight: 600;
    color: #2D435B;
}
.container-nine-parags-p2{
    font-size: 14px;
    color: #8597A3;
}

.container-ten{
    background-color: rgb(133, 151, 163,0.12);
    padding: 2% 15%;
}

.project-details-container{
    position: relative;
    padding: 2% 15%;
    margin-top: 30px !important;

}
.project-details-container-1-title{
    color: #2D435B;
    font-size: 35px;
    text-transform: uppercase;
}
.project-details-container-1-title span{
    color: #2D435B;
    font-family: 'Montserrat-ExtraBold';
}
.project-details-container-1-details{
    padding-top: 40px;
    width: 85%;
}
.project-details-container-1-details-rows p{
    margin: 0;
    padding: 0;
}
.project-details-container-1-details-rows span{
    padding-bottom: 80px;
    font-size: 18px;
    font-weight: bold;
    color: #2D435B;
}
.project-details-container-1-details-rows-duration span{
    font-size: 20px;
    font-weight: bold;
    color: #2D435B;
}
.seperator-project{
    margin: 25px 0;
    border-top: 1px solid #8597A3;
}

.project-details-container-1-details-parags{
    
    font-size: 14px !important;
    color: #8597A3 !important;
    font-family: 'Montserrat-Regular' !important;
}
.project-details-container-1-details-parags p{
    font-size: 14px !important;
    color: #8597A3 !important;
    font-family: 'Montserrat-Regular' !important;
}
.project-details-container-1-details-rows-duration{
    display: flex;
    justify-content:space-between;
}
.project-details-container-1-details-rows-duration p{
    padding: 0;
    margin: 0;
}
.project-details-container-1{
    
    display: flex;
    justify-content:space-between;

}
.project-details-container-1-title-mobile{display: none; }
.project-left-image{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
}
.link-to-project{font-size: 20px;}
.link-to-project .arrow{margin-bottom: 1.5px !important;}
.link-to-project .arrow{margin-bottom: 1.5px !important;}
.project-details-container-1-title-mobile span{
    color: #2D435B;
    font-family: 'Montserrat-ExtraBold';
}
.project-left-image img{
    position: relative;
    max-height: 650px;
    border-top-left-radius: 45%;
    border-bottom-left-radius: 45%;
   
}

.project-info{
    width: 40%;
}

.project-caroussel-container{
    position: relative;
    padding-left: 15%;
    padding-right: 15%;
    padding-top: 250px;
    padding-bottom: 130px;
}


.container-eleven{
    padding: 60px 15%;

}

.container-ten-div{
    padding-bottom: 30px;
}
.container-ten-title{
    padding-top: 60px;
    padding-bottom: 30px ;
    text-align: center;
    text-transform: uppercase;
    font-size: 32px;
    color: #2D435B;

}
.container-ten-title-span{
    
    font-weight: bold;

}
.container-ten-items-div{
    padding: 30px 0;
    width: 45%;
    display: flex;
}

.container-ten-items-div-alone{
    width: 60%;
    display: flex;
}

.container-ten-items{
    
   justify-content: space-between;
    display: flex;
}

.project-manager-details{
    padding-left: 5%;
}
.project-manager-details-parag{
    color: #2D435B;
    font-size: 14px;
}
.project-manager-details span{
    font-weight: bold;
}

.project-manager-details-title{
    font-family: 'Montserrat-Regular';
    text-transform: uppercase;
    color: #2D435B;
    font-size: 20px ;
}
.putcenter{
    padding-top: 5%;
    padding-left: 35%;
   
}

.fas , .fa{
    display: none;
}

.img-left2{
    display: none;
}
.heropic-mobile {
    position: relative;
    background: url('/assets/imgs/heroimage-background.png')no-repeat center center;
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 750px;
    display: none;
}
.heropic-mobile .heroshape{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 450px;

}

.container-eleven-main{
    font-size: 22px;
    font-family: 'Montserrat-ExtraBold' !important;
}





@media screen and (min-width: 911px) {
    .navigation-mobile{ display: none !important; }
    .burger5{ display: none !important; }
    
}
 

 @media screen and (max-width: 911px) {
    .project-details-container-1-title-mobile{
        text-align: center;
        display: block; font-size: 24px;
        position: absolute;
        width: 80%;
        top: 36%;
        right:8%;}
    .services-item .service-image::after{background: none;}
    .mapsBtn{padding-bottom: 20px;}
   
     .logo-mobile-footer{
         padding-top: 40px;
     }
     .hero-related{width:100%;height: 200px;position: relative;}

    .related-project-column .hero-related::after {display:block; content: " ";height: 165px !important; position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #3b5872c4 ;}

    .related-project-column img{
        height: 165px;
   }
    .related-project-column{width: 100%;}
    .related-products-container{
        padding-right: 8%;
        padding-left: 8%;
        padding-top: 20px;
        padding-bottom: 80px;
        background-color: rgba(133, 151, 163, 0.12);
    }
     .related-project-column{
         margin: 3px 0;
         height: 165px !important;
     }
    


    
    .services-item .service-image { height: 135px !important; }
   
     .bridge {background-image: url(/assets/imgs/bridge-mobile.jpg) !important;}
     .road {background-image: url(/assets/imgs/roads-mobile.jpg) !important;}
     .facility {background-image: url(/assets/imgs/facilities-mobile.jpg) !important;}
     

     
    .project-details-container{margin-top: 60px !important;}
    .container-first { padding: 0 10%;}
    .container-second{padding: 2% 10%;}
    .container-fourth{padding: 10px 10%;}
    .container-ten{padding: 2% 10%;}
    .container-nine{padding: 0 10%;}
    
    .container-eight-elements-e1-items{
        display: flex;
       
        margin: 0 20px;
       
    }
     
    .related-project-column-33-33 .hero::after {background:linear-gradient(to bottom,	rgb(255,255,255,0.1),rgb(255,255,255,0.1),rgb(59,88,114,0.8)) }

    .related-project-column-33-33 .hero::after {height: 290px !important;  }



    .projects-slider-mobile .hero::after {background:linear-gradient(to bottom,	rgb(255,255,255,0.1),rgb(255,255,255,0.1),rgb(59,88,114,0.8)) }

    .projects-slider-mobile .hero::after {height: 360px !important;  ;}

    .projects-menu{
        padding: 25px 0;
    } 
     .movemore{
         padding-left: 7%;
     }
    .flexme{
        width: 100%;
        padding-top: 15px;
    }
     .dimmedHero{
         display: none !important;
     }
    .image-no-hover{
        height: 140px !important;
    }
    .btn-viewall-div{
        padding: 40px 0;
    }
    .container-eleven{
        padding: 20px 18%;
    }
   
    .related-project-column-33-33{
        margin: 3px 0;
        width: 100%;
        height: 290px !important;
    }
    .projects-slider-mobile{
        height: 360px !important;
    }
    
     .project-caroussel-container{
        padding-bottom: 100px;
         padding-top: 100px;
     }
    
     .service_col {margin-bottom: 30px}
     .services_col_container {grid-template-columns: 100%; grid-column-gap: 0}
     .tint_overlay {display: none}

     
    .services-item{
        height: 150px;
    }
    .contFormInput input::placeholder {font-size: 12px;}

    .fields-marked-with{
        font-size: 12px;
    }

    .heropic-contact-page{
        position: relative;
        height: 350px;
    }
    .contInpt{padding: 4% !important;margin: 1% 0; font-size: 16px; border: 1px solid #8597A3; width:100%;border-radius: 5px;}

    .contFormInput input{width: 48%;font-size: 16px; margin-bottom: 1%;padding: 4% !important;border: 1px solid #8597A3; border-radius: 5px;}


    .project-manager-img img{
        height: 46px;
    }
    .container-eight-elements-e1-items span{
       
       
        padding-left: 7px !important;
     
    }
    .btn-check{
      
        padding: 15px 30px !important;
      
    }

    .first-container-projects{ 
        padding-bottom: 50px;
        padding-left: 12%;
        padding-right: 12%;
        padding-top: 20px;
        margin-top: 5%;
       }   

    .projects-menu{
       font-size: 11.5px !important;
        margin: 0;
    }

    .projects-menu ul li{
   
        list-style: none;
        padding: 0 12px!important;
    }
    .related-projects-texts{
        width: 80%;
        left: 15px;
    }
    .container-eleven-sub {
        font-family: 'Montserrat-Light' !important;
        font-size: 12px !important;
        color: white;   
    
    }
    .container-eleven-main{
        font-size: 20px;
        
        font-family: 'Montserrat-ExtraBold' !important;
    }

    .related-project-row{flex-direction: column; }
     
    
    
     .related-project-column-33-33 img{
        
        height: 290px;
     
    }
     .projects-slider-mobile img{
        
        height: 360px !important;
     
    }
  
    .row{
        align-items: center;
        
        flex-direction: column !important;
    }
    .column{
        width: 100% !important;
    }
    .project-details-container{
        position: relative;
        padding: 0 15%;
        margin-top: 0;
    
    }
  
    .project-details-container-1-details{
        width: 100%;
    }
    .project-info{
        padding-top: 350px;
        width: 100%;
    }
    .project-details-container-1-title{
        display: none; }

    .project-left-image img{max-height: 300px; position: relative;}

    .contFormInput input{
        margin: 1% 0;
        width: 100%;
    }
    .contact-form-title{
        padding: 20px 0;
        font-size: 22px;        
    }
    .contactus-header-content{
        padding: 55px 15%;
        text-align: center;
    }
    .contactus-header-title{
        
        font-size: 24px;
    }
    .contactus-header-sub{
        padding: 0 5%;
        font-size: 11.5px;
        font-weight: 600;
        font-style: normal;
        font-display: swap;
    }
    .our-services{
        font-size: 22px;
    }
    
  
    .column2{   
        width: 100%;
        
    }
    .column2 img{
        height: 110px !important;
    }
    .column2 p{
        margin: 0;
        padding: 0;
        font-size: 20px;
        position: absolute;
        top: 55%;
        left: 50%;
        transform: translate(-50%, -50%);
      }

    .container-seven{
        width: 100%;  
        padding: 2% 10%;
        background: url("/assets/imgs/tinted-mobile.png") no-repeat center center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    

    .container-nine-parags-p2{
        font-size: 11.5px !important;
        font-family: 'Montserrat-Regular' !important;

    }

    .our-projects-title{
        padding: 20px 0;
        font-size: 22px;
        font-family: 'Montserrat-ExtraBold' !important;
    }
    .column {
        position: relative;
    }

    
    
    
    /* .column .slider-texts-mobile .container-eleven-sub{
        padding-bottom: 25px !important;
        }
    */
    
    .column img{
        height: 400px;
    }
    
    .heropic{
        display: none;
    } 
    .heropic-mobile{
        display: inline-block;
    }  

     .slider-texts{
        display: flex;
        flex-direction: column;
        position: absolute;
        bottom: 15px;
        left: 30px;
    
    } 
 

    .projects-img-slider{
        height: 300px; 
       
    }
    

    .hero-attributes img{
        transform: rotate(90deg);
        margin: 0;
        padding-top: 50px;
        padding-bottom: 50px;
        margin-left: 30px;
        margin-top: 50px;
        
        width: 480px;
    }
    .hero-attributes p{
        padding-top: 50px;
        padding-left: 130px;
        font-size: 24px;
        width: 380px;
    }

    .navigation-mobile{
        display: none;
    } 

    .img-right-2{
        display: none;
    }
    .img-right-3{
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        top: -30px;
    }

    .img-left{
        display: none;
    }
    .img-left2{
        position: absolute;
        left: 0;
        
        display: block;
    }
    .container-nine-parags{
        margin-bottom: 20px;
        padding:0;
        padding-top: 70px;
    }

    .container-nine-parags-title{
        font-size: 22px;
    }
    .container-nine-parags-p1{
        padding: 20px 0;
        font-weight: bold;
    font-style: normal;
    font-display: swap;
        font-size: 14px;
    }
 

    .dottomove{
        position: fixed;
        height: 100vh;
        width: 100%;
        z-index: 4;
        background-color: #2D435B;
    }
    .dottomove img{
     height: 90px;
    padding-top: 35px;
    padding-left: 30px;
       
    }
    .dottomove ul{
       
        font-size: 20px;
        font-weight: 900;
        padding-top: 80px;
        text-align: center;
    }
    .dottomove ul li{
        
        padding: 20px 0;
        
    }
    .dottomove ul li a{
       
        color: white;
        padding: 15px 0;
        width: 80%;
    }
 

    .seperateme{
        text-align: center;
        align-items: center;
        margin: 0 120px;
        
        border-bottom: 1px solid #8597A3;
    }

    .fa-times{
        color: white;
        font-size: 30px;
        padding-top: 50px;
        padding-right: 30px;

    }
    .fa-times{
        display: block;
    }
    .flex-header{
        display: flex;
        justify-content: space-between;
    }
    .fa-bars{
        display: block;
        font-size: 30px;
        padding-top: 50px;
        padding-right: 30px;
        color: #2D435B;
    }

    

    .header-desk img{
        height: 90px;
        padding-top: 35px;
       padding-left: 25px;
       
    }

    .navigation-desk{
        display: none;
    }

    .burger {
        display: block ;
    }  

    .cols {
        flex-direction: column;
        padding: 15px 0;
        
    }
    .cols-ourprincipals {
        flex-direction: column;
        padding: 0;
    }

    .p2{
        font-weight: 700;
        width: 100%;  
        font-size: 14px;
        text-align: center;
    }

    .p2-div {
        width: 100%;
        
       
              
    }

    .p3-div {
        padding-top: 20px;
        width: 100%;
        text-align: center;
    }
    .p3{
        font-size: 11.5px;
        color: #8597A3;
    }
    .bridgindiv{
        text-align: center;
        padding-top: 10%;
    }
    .briding2{
        line-height: 1.1;
        padding: 0;
       width: 100%;
        font-size: 22px;
    }
    .p4-div{
        text-align: center; 
        width: 100%;
        padding-bottom: 30px;
        
    }

    .p4{
        padding: 0;
        font-size: 14px !important;
        font-weight: bold;
    }


    .p5-div {
        text-align: center;
        width: 100%;
        padding-bottom: 30px; 
    }
    .p5 , .p5-2{
        font-weight: 450;
    font-style: normal;
    font-display: swap;
        
        font-size: 11.5px;
    }
    
    .li-text {
           font-size: 16px;
    }
    .p-15 { 
        
        text-align: center;
        width: 100%;
        
        
    }

    .container-three{
        background-color: rgb(133, 151, 163,0.12);
        width: 100%;  
        padding-top: 20px;
        padding-right: 10%;
        padding-left: 10%;
        padding-bottom: 50px;
    
    
    }

    .p-30 {
        width: 100%;
        padding: 15% 0;
        text-align: center;
    }

    .p-10{
        color: #2D435B;
        font-weight: bold !important;
    font-style: normal !important;
    font-display: swap !important;
        font-size: 14px !important;
        width: 100%;
        
    }

    .p-11{
        text-align: center;
        font-size: 11.5px;
        font-weight: 450;
    font-style: normal;
    font-display: swap;
        width: 100%;
        
    }

    .btn-check-div{
        padding-bottom: 25px;
    }
    

    .separator{
        padding-top: 0;
        margin: 50px 0;
    }

  .p66-div {
        padding: 0;
        width: 100%;
    }

    .p66{
        font-size: 14px !important;
        font-weight: bold;
        font-style: normal;
        font-display: swap;
        width: 100%;
    }

    .p99 {
        flex-direction: column;
        display: block;
        
    }

    .principals {
        line-height: 1.1;
        padding-top: 250px;
        width: 100%;
        font-size: 22px;
        font-family: 'Montserrat-Regular';
    }

    .principals span{
        font-family: 'Montserrat-ExtraBold' !important;
    
    }

    .p102 {
        font-weight: 450;
    font-style: normal;
    font-display: swap;
        font-size: 11.5px !important;
        color: #8597A3;
    }

    .difference2{
        line-height: 1.1;
        font-size: 22px;
        padding-top: 50px;
    }

    .our-quality{
        padding-top: 10%;
        text-align: left;
        width: 90%;
        font-size: 22px;
    }

    .container-seven-p1 {
        width: 100%;
        text-align: left;
        font-size: 14px;
        font-family: 'Montserrat-SemiBold';
    }
    .quality-and-safety-div{
        flex-direction: column;
        padding: 0;
        margin: 0;
    }

    .quality-items , .project-items , .process-items{
        display: flex;
    }
   

    .quality-img-class,  .process-image-class {
        padding: 0;
        height: 80px;
        padding: 5% 0;
    }
    .project-image-class{
        padding: 0;
        height: 85px;
        padding: 5% 2px;
    }

    .quality-parag, .project-parag , .process-parag {
        font-size: 13px;
    }

    .container-seven-1{
        width: 100%;
        padding: 0;
        padding-top: 15px;
        margin: 0;
        padding-bottom: 30px;
        text-align: left;
    }
    .container-seven-1-p1{
        font-weight: 450;
    font-style: normal;
    font-display: swap;
    }

    .container-seven-1-p1 , .container-seven-1-p2{
        font-size: 11.5px;
        
    }
    .container-seven-1-p2{
        font-style: italic;
    }
   
    .quality-parag-div ,.process-parag-div , .project-parag-div{
        padding: 25px 8% !important;
        width: 60%;
        font-size: 13px;
        text-align: left; 
         
    }
   

    .btn-check{
       
        font-size: 12px;
        padding: 17px 50px !important;
        border-radius: 80px;
        
    }

    .container-eight-p1{
        width: 100%;

        text-align: left;
        font-size: 16px;
    }

    .container-eight-elements{
        padding: 0;
        padding-top: 5%;
        width: 100%;
    }

    .container-ten-title{
        padding-bottom: 0 ;
        padding-top: 10%;
        text-align: left;
        font-size: 22px;
    }
    .container-ten-items{
        flex-direction: column;
        width: 100%;
    }
    .container-ten-items-div{
        width: 100%;
        padding: 5% 0;
    }
    .putcenter{
        padding: 0;
    }
    .container-ten-items-div-alone{
        padding-top: 5%;
        width: 100%;
    }
    .project-manager-details-title{
        padding-bottom: 5px;
        margin: 0;
        font-size: 16px;
    }
    .project-manager-details-parag{
        font-size: 11.5px;
    }
    .container-eight-elements-e1 span{
         font-size: 11.5px;
         font-family: 'Montserrat-Regular' !important;
     }

    .container-footer-desktop{
        display: none;
    }

    .container-six{
        padding-top: 0px !important;
        padding-left: 10%;
        padding-right: 10%;
        padding-bottom: 50px;
        display: block;
    }
    .column {
        width: 100%; 
      }
    

      .column p{
        position: absolute;
        bottom: 50px;
        left: 110px;
        font-size: 22px;
        font-weight: 900;
        text-transform: uppercase;
        color: white;
        
    }

    .container-footer-mobile{
        display: block;
        padding: 20px 10%;
        background-color: #2D435B;
    }

    .pages-and-projects-mobile-div{
        padding-top: 50px;
        display: flex;
        
    }

    .dot {
        color: #8597A3;    
      }

    .projects-mobile img{
        padding-right: 5%;
    }
    .pages-and-projects-mobile-div p{
        font-size: 12px;
        color: white;
        font-weight: 600;
    font-style: normal;
    font-display: swap;
    }
    .pages-and-projects-mobile-div p:hover{
        cursor: pointer;
        font-family: 'Montserrat-extraBold' !important;
    }
    .pages-and-projects-mobile-div a{
        font-weight: 600;
    font-style: normal;
    font-display: swap;
    }
    .pages-and-projects-mobile-div a:hover{
        color: white;
        font-family: 'Montserrat-extraBold' !important;
    }
    .pages-mobile a{
        color: white;
    }
    .projects-mobile{
        padding: 0 30%;    
    }
    .projects-mobile li{
        font-size: 12px;
        color: #8597A3;
        
    }
    .projects-mobile a{
        color: #8597A3;

    }
    .projects-mobile p a{
        color: white;

    }
   

    .seperator-mobile{
        margin: 20px 0;
        border-bottom: 1px solid #FFFFFF ;
    }

    .address-and-contact-mobile{
        font-weight: 500;
        padding-top: 20px;
        color: #FFFFFF;
        font-size: 12px;
    }
    .contact-mobile p{
        text-decoration: none;
    }
    .address-and-contact-mobile span{
        font-weight: bold;
    }
    .copyright{
        padding-top: 60px;
    }
    .copyright span{
        font-weight: 500;
        padding-left: .5em;
        color: white;
        font-size: 10px;
    }
    .copyright span a{
        
        color: white;
       
    }


    .logo {
        /* margin: 26em !important; */
        width: 190px;
        margin-left: 0 !important;
        

    }
    
    .checkbtn{
        display: block;
    }
    /* ul{
        position: fixed;
        width: 100%;
        height: 100vh;
        background: #2D435B;
        top: 80px;
        left: -100%;
        text-align: center;
        transition: all .5s;
    } */

    nav ul li{
        display: block;
        color: white;
        border-bottom: 1px solid;
        
        

    }

    .li-bars{
        border-bottom: 1px solid white;
        width: 30%;
        margin: 0 auto;
        
    }
    

    #check:checked ~ ul{
        left: 0;
    }
    


} 
@media screen and (max-width: 1200px) and (min-width: 700px)  {
    .quality-img-class , .process-image-class  , .project-image-class  {
        padding-top: 0;
        
       
    }
    .project-caroussel-container{
        padding-top: 100px !important;
    }
    .quality-parag-div , .project-parag-div , .process-parag-div {
        padding: 0 8% !important;
        
    }
}

@media screen and (max-width: 1200px) and (min-width: 911px)  {
    .container-nine-parags{
       
        margin:0;
    }
    

.img-left img{
        height: 350px;
        bottom: 0;
        }


.img-right-2 img{
    height: 400px;
    top: 0;
    bottom: 0%;
}
.project-left-image img{
    max-height: 400px;
    top: 0;
    bottom: 0%;
}

}
