/** {box-sizing: border-box;}*/
body{
    width:100%;
    height:100%;
}

.img-comp-container {
    width:500px;
  position: relative;
  height: 390px; /*should be the same height as the images*/

}

.img-comp-img {
  position: absolute;
  width: auto;
  height: auto;
  overflow:hidden;
}

.img-comp-img img {
  display:block;
  vertical-align:middle;
  
}

.img-comp-slider {
    
    /*top: 103px;*/
    /*left: 166px*/
    background-image:url('../images/arrowh.png');
    background-size:contain;
  position: absolute;
  z-index:9;
  cursor: ew-resize;
  /*set the appearance of the slider:*/
  width: 40px;
  height: 40px;
  background-color: #2196F3;
  opacity: 0.7;
  border-radius: 50%;
}
.img-comp-img.img-comp-overlay{
    border-right:2px solid #3695D5;
}

         
@media only screen and (min-width: 992px) and (max-width: 1024px) {
      .img-comp-container{
        margin:0 auto;
         width:450px !important;
    }
    
    .img-comp-slider{
         top: 130px;
         left: 206px;
    }
    
       
    .img-comp-img img{
        width:450px !important;
    }
    .testi-slide{
        padding:20px 10px !important;
    }
    .testi-overlay{
        left:35% !important;
    }
}
@media only screen and (min-width:768px) and (max-width:991px){
    
    .img-comp-container{
        margin:0 auto;
         width:370px !important;
         height:300px !important;
    }
    .img-comp-slider{
        top: 103px;
        left: 166px;
    }
   
    .project-text{
        margin-top:0px !important;
    }
    .img-comp-img img{
        width:370px !important;
    }
}

@media only screen and (min-width:478px) and (max-width:566px){
     .row.mb-5.mob-show  .img-comp-container{
        margin:0 auto;
    }
     .row.mb-5.mob-show  .project-text>p{
        margin-bottom:0% !important;
    }
     .row.mb-5.mob-show .project-text>p{
        margin-bottom:10% !important;
    }
    
}
@media only screen and (min-width:480px) and (max-width:767px){
    

    .row.mb-5.mob-show .img-comp-container{
        margin:0 auto;
    }
     .row.mb-5.mob-show .project-text{
         padding:0px 10px !important;
        margin-bottom: 10% !important;
        /*margin-top:20% !important;*/
    }
    /*.row.mb-5.mob-show .img-comp-slider{*/
    /*    top: 80px !important;*/
    /*    left: 131px !important;*/
    /*}*/
    .row.mb-5.mob-show .sub-title{
        padding:0px !important;
    }
    .testi-slide{
        padding:0 !important;
    }
    .testimonial-section{
     padding: 25px 0 !important;
    }
    .contact-main-form{
        padding:86px 0px 0px !important;
    }
    .proz-mint>h3{
        font-size: 16px !important;
    }
    .proz-mint>p{
         font-size: 15px !important;
         line-height: 1.4;
    }
    .process-section img{
            vertical-align: super !important;
    }
    
    
}


@media only screen and (min-width:375px) and (max-width:480px){
      
     .row.mb-5.mob-show  .img-comp-img img{
        width:300px !important;
    }
    .htitle{
        margin-top:5% !important;
    }
    .latest-projects-section .project-text.hproject-text .sub-title{
        margin-top:10% !important;
    }
    
    .row.mb-5.mob-show   .img-comp-container{
        margin:0 auto;
      width:350px !important;
    }
      .row.mb-5.mob-show  .project-text>p{
        margin-bottom:5% !important;
    }
    
    .abt-imgz.mobile-imm, .mobile-intel-img{
        display:block !important;
    }
    .abt-imgz, .intel-img{
        display:none !important;
    }
    /*.img-comp-slider{*/
    /*    top: 146.5px !important;*/
    /*left: 231px !important;*/
    /*}*/
    
}

@media only screen and (min-width:300px) and (max-width:374px){
    
    .img-comp-img img{
        width:300px !important;
    }
    
    .img-comp-container{
        margin:0 auto;
      width:300px !important;
    }
     .project-text>p{
        margin-bottom:10% !important;
    }
    .proz-mint>h3{
        font-size:16px !important;
    }
    .proz-mint>p{
        font-size: 13px !important;
        line-height:1.7 !important;
    }
    .project-text.hproject-text .sub-title.htitle{
        padding-top:50px !important;
    }
    
    .testi-slide{
        padding:0 !important;
    }
    .testimonial-section{
     padding: 25px 0 !important;
    }
    .testi-overlay{
        left:35% !important;
    }
    
    .contact-main-form{
        padding:86px 0px 0px !important;
    }
    

}