*{
     padding:0;
     margin:0;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}

/*-----------Body--------------*/
body{font-family: 'Poppins', sans-serif;overflow-x: hidden;}
/*-----------Header--------------*/
#header{
     width: 100%;
     max-width: 1920px;
     height: 100px;
     position: relative;
     background-color: #ffffff;
}
.logo{
     /*width: 80%;*/
}
/*-----------Menu--------------*/
/*-----------Slider--------------*/
#slider{
     width: 100%;
     max-width: 1920px;
     height: auto;
     position: relative;
     /*background-color: #ffffff;  */ 
}
#slider_page{
     width: 100%;
     max-width: 1920px;
     height: 200px;
     position: relative;
     /*background-color: #ffffff;*/   
}
.carousel-item{
     width: 100%;
     height: auto;
}
.slider-title{
    position: absolute;
    padding: .5rem 2rem;
    width: 80%;
    top: 40%;
    left: 10%;
    z-index: 1;
    text-align: center;
}

.slider-title h2{
     color: #ffffff;
     padding-top: 0.5rem;
     padding-bottom: 0rem;
     text-shadow: 2px 3px 4px rgba(0, 0, 0, 0.8);
     -webkit-text-shadow: 2px 3px 4px rgba(0, 0, 0, 0.8);
     -moz-text-shadow: 2px 3px 4px rgba(0, 0, 0, 0.8);
}

/*-----------Contenido--------------*/

#nosotros{
     width: 100%;
     height: auto;
     background-image: url("../image/bg_rombo.png");
     background-color: #000000;
     padding-top: 2.5rem;
     padding-bottom: 2.5rem;
}

p.nosotros{
     margin-top: 1rem;
     font-size: 1rem;
     color:#ffffff;
     font-size: 400;
     padding-bottom: 0.5rem;
}
.photo{
     border:5px solid #ffffff;
}

#servicios{
     width: 100%;
     height: auto;
     background-color: #ffffff;
     padding-top: 3rem;
     padding-bottom: 2rem;
}
.title-section h2{
     font-size: 2rem;
     color:#070707;
     font-weight: 800;
     text-align: center;
}
.box-title{
     display: none;
     position: absolute;
     width: 100%;
     height: 65px;
     top: 1rem;
     left: 2rem;
     z-index: 1;
}
.title{
     position: relative;
     float: left;
     width: 450px;
     height: 40px;
     top: .3rem;
     left: .5rem;    
}
.title h4{
     font-size: 1.4rem;
     color:#ffffff;
     font-weight: 400;
     text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.7);
     -webkit-text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.7);
    -moz-text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.7);
}
h4.service-title{
    background-image: url(../image/title-back.jpg);
    background-size: 100%;
    color: #FFF;
    margin: 0;
    padding: 8px 20px;
    text-align: center;
    border-radius: 4px 4px 0 0;
    margin-bottom: -1px;
    text-transform: uppercase;
}
.image {
  width: 100%;
  opacity: 0.6;
  display: block;
  /*width: auto;*/
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}

.middle2 {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  width: 83%;
  height: auto;
  top: 62%;
  left: 46%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: left;
}
.cont-img:hover .image {
  opacity: 1;
}
/*.cont-img:hover .middle2 {
  opacity: 1;
}*/
.text2 li{
  color: white;
  font-size: .8rem;
  padding: .2rem 1rem; 
  line-height: .7rem;
}
#clientes{
     width: 100%;
     height: auto;
     background-color: #ffffff;
     padding-top: 3rem;
     padding-bottom: 3rem;
}
h3.elg{
     font-size: 2rem;
     color:#ffffff;
     padding: .8rem .8rem;
     background-color: #070707;
     text-align: center; 
     border-radius: 5rem;
}
#contacto{
     width: 100%;
     height: auto;
     background-color: #000000;
     padding-top: 2.5rem;
     padding-bottom: 2rem;

}
#contacto h4{
     color: #ffffff;
     font-size: 1.2rem;
     font-weight: 500;
     margin-bottom: .2rem;
}
#contacto h3{
     color: #ffffff;
     font-size: 1.2rem;
     font-weight: 500;
     margin-bottom: .5rem;
}

#contacto p{
     color: #ffffff;
     font-size: .9rem;
     font-weight: 400;
     line-height: 1.1rem;
     margin-bottom: .5rem;
}

.box-title-contact{
     position: relative;
     width: 100%;
     height: 65px;
     /*top: 1rem;
    left: 2rem;*/
}
.icon-contact{
     position: relative;
     float: left;
     width: 30px;
     height: 60px;
     
}
.title-contact{
     position: relative;
     float: left;
     width: 200px;
     height: auto;
     top: .3rem;
     left: .3rem;    
}

.btn-form {
    color: #000000;
    background-color: #ffffff;
    font-size: 1rem;
    padding: .3rem 1.5rem;
    border-radius: 2rem;
    margin-top: -.5rem;
}
.btn-form:hover {
    color: #ffffff;
    background-color: #dddddd;
    padding: .3rem 1.5rem;
}
.form-group {
    margin-bottom: .7rem;
}

.brd{
     border:3px solid #f3ad27;
}

.brd-r{
     border-right:3px solid #e5e5e5;
}

.line{
     width: 100%;
     height: 5px;
     background-color: #d6d6d6;
     margin-top: 2rem;
     margin-bottom: 2rem;
}
#page{
     width: 100%;
     height: auto;
     background-image: url("../image/bg_rombo.png");
     background-color: #000000;
     padding-top: 2.5rem;
     padding-bottom: 2.5rem;
}
#page h2{
     font-size: 1.8rem;
     color:#ffffff;
     font-weight: 500;
     text-align: center;
}
/*-----------Footer--------------*/
#footer{
     width: 100%;
     max-width: 1920px;
     height: 100px;
     clear: both;
     background-color: #333333;
}
.icon-red{
     width: 60px;
     height: auto
}
.nos-eligen .item{
    text-align: center;
}
.nos-eligen img{
    display: inline-block !important;
    max-height: 80px;
    max-width: 100%;
    width: auto !important;
}
.service-gallery{
    display: flex;
    flex-flow: wrap;
}
    .service-gallery a{
        width: 12.5%;
        height: 150px;
        overflow: hidden;
        padding: 1px;
    }
        .service-gallery.estructura-hormigon a{
            width: 33.33%;
            height: 200px;
        }
        .service-gallery a img{
            object-fit: cover;
            width: 100%;
            height: 100%;
        }
/*-----------Queries--------------*/

     @media only screen and (max-width: 1920px){

     }
     @media only screen and (max-width: 1024px){

     }
     @media only screen and (max-width: 768px){
         .slider-title{
             top: 20%;
         }
        .service-gallery a{
            width: 25%;
            height: 100px;
        }
        .slider-title h2{
            font-size: 16px;
        }
        
        .navbar-brand{
             width: 75%;
        }
        .logo{
            max-width: 100%;
        }
        #navbarNav{
            z-index: 2;
            background-color: rgb(255, 255, 255);
            padding: 10px 20px;
            box-shadow: rgba(0, 0, 0, 0.7) 0px 0px 5px -1px;
            margin-top: -25px;
        }
     }
     @media only screen and (max-width: 400px){
        #navbarNav{
            z-index: 2;
            background-color: rgb(255, 255, 255);
            padding: 10px 20px;
            box-shadow: rgba(0, 0, 0, 0.7) 0px 0px 5px -1px;
            margin-top: -25px;
        }
     }
     
#whatsAppFixed {
  position: fixed;
  bottom: 60px;
  right: 10px;
  z-index: 10;
  transition: all 400ms;

}

#whatsAppFixed:hover {
  transform: scale(1.1);
}

#whatsAppFixed img {
  width: 75px;
}

.owl-carousel .owl-stage{
    display: flex;
    align-items: center;
}

.cotizar{
    text-align: center;
}
    .cotizar a{
        display: inline-block;
        max-width: 300px;
        margin-top: 20px;
        font-weight: 500;
        text-transform: uppercase;
        font-size: 18px;
    }