#box-slide { width:100%; height:600px; position: relative;}
#box-slide .carousel { width:100%; height:600px; background:yellow;  }
#box-slide .carousel-cell { width:100%;  height:600px; padding:270px 0 0; }*

section {
 width: 100%; height: 600px; position: relative;
  
}

.section--purple {
  background-color: #9b59b6;
}

.section--blue {
  background-color: #3498db;
}

.section--green {
  background-color: #2ecc71;
}

#main {
  text-align: center;
}

#more {
  margin: 20px auto 48px;
}

.modal-content { background: orange; border-radius: 0; border: 4px white solid; padding:0 2% 100px;  margin-top: 150px;  }
.modal-content a { display: block; color: white; font-size: 22px; font-weight: bold; margin: 10px 0;}
.modal-content a:hover { color: black; text-decoration: none;}
.cerrar { display: block; text-align: right; }

/* NUEVO */
html, body { overflow-x: hidden; }

header { width: 100%; height: 75px; background: rgba(0,0,0,0.7); position: fixed; z-index: 99999999; }
.burger { position: absolute; top: 20px; right: 20px; width: 30px; cursor: pointer; display: none;  }
.burger img { width: 30px;  }

.copy {
  max-width:600px; color: white; font-size: 18px;  margin: 0 auto; border-radius: 15px; padding: 25px;
  background-color: rgba(163, 3, 3, 0.7); text-align: center;
}

.copy i {
  font-size: 22px;
}

.copy_ {
  max-width:600px; color: white; font-size: 18px;  margin: 0 auto; border-radius: 15px; padding: 25px;
  background-color: rgba(59, 168, 53, 0.7);
}


 .logo { width: 100px; height: 100px; margin-right: 190px; margin-top: -5px; }
  ul { width: 100%; height: 50px; text-align: center; margin: 0 auto;  padding-top: 35px;   }
  ul li {  list-style: none; height: 50px; width: auto; padding: 0 15px; float: left; font-weight: bold; font-size: 14px; }
  ul li a { color:#fff; width: auto !important; height: 50px; vertical-align: middle; font-size: 12px; transition:all 200ms ease;   }
  ul li a:hover { color:yellow; text-decoration: none;  }

  #info { width: 100%; min-height: 50px; position: relative; text-align: center; color:#4D4D4D; font-size: 18px; padding: 75px;}
  #info hr { display: inline-block; vertical-align: middle; background: none; border-top: grey solid 3px; width: 15%; margin: 0 25px;  }
  #info h2 { display: inline-block; vertical-align: middle; }
  #info_ { width: 100%; height: auto; padding-bottom: 150px; position: relative; text-align: center; color:#4D4D4D; font-size: 18px; padding-top: 50px;}


  footer { width:100%; min-height:500px; padding-top: 50px;   }
  footer a { color:white; transition:all 200ms ease; }
  footer a:hover { color: rgba(255,255,255, 0.7); text-decoration: none; }
  footer h3 { font-size: 18px;}
  footer hr { width: 50%; margin-right: 45%;  }
  footer .center img  { margin: 50px 42%;  }
  .remate { width: 100%; height: 50px; background: #4D4D4D url(../imagenes/logo-ab.png) no-repeat; background-position: 75% 10px; padding-top: 10px;  font-size: 12px; }
  .remate a { color: white; }
  .remate a:hover { color: white; text-decoration: none; }


.somos { width: 100%; height: 280px; background: url(../imagenes/somos.jpg) no-repeat center ; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  height: 745px !important; position: relative; }
.somos .img { position: absolute; top:0; left: 50%; margin-left: -21%; margin-top: 150px; }

.cultura { width: 100%; height: 280px; background: url(../imagenes/cultura.jpg) no-repeat ; background-size: auto 100%; background-position: 0 600px;  height: 745px !important; position: relative; }
.cultura .img { position: absolute; top:0; left: 50%; margin-left: -21%; margin-top: 150px; }

/* GALERIA */
.galeria { width: 100%; height: 280px; background: url(../imagenes/galeria.jpg) no-repeat center ; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  height: 745px !important; position: relative; }
.galeria .img { position: absolute; top:0; left: 50%; margin-left: -21%; margin-top: 250px; }

#mapa { width: 100%; height: 480px; }
.mapa { width: 100%; height: 480px; position: relative; }
.dir { color: white; max-width: 600px; height: auto; margin: 25px auto; background: rgba(29, 112, 182, 0.5); border-radius: 25px; padding: 25px 50px; }
.tel, .mail { color:#1D70B6 ;  max-width: 600px; display: block; margin: 0 auto; font-weight: bolder; }

.tel:hover { color:orange; text-decoration: none; }
.mail:hover { color:orange; text-decoration: none;}


/* DIRECTORIO */

.directorio { width: 100%; height: 280px; background: url(../imagenes/directorio.jpg) no-repeat center ; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  height: 745px !important; position: relative; text-align: center; }
.directorio .img { width: 50%; margin: 200px auto 0 auto; }

.celda { width: 95%;  min-height: 25px; transition:all 200ms ease; text-align: left; cursor: pointer; font-size: 14px; padding-left: 25px; margin-bottom: 15px;x    }
.celda:hover { color: #f39035; margin-left: 10px; }

.rojo { background: url(../imagenes/rojo.png) left center no-repeat; background-size: 20px;  }
.azul { background: url(../imagenes/azul.png) left center no-repeat; background-size: 20px;  }
.ama { background: url(../imagenes/amarillo.png) left center no-repeat; background-size: 20px;  }
.verde { background: url(../imagenes/verde.png) left center no-repeat; background-size: 20px;  }
.cafe { background: url(../imagenes/cafe.png) left center no-repeat; background-size: 20px;  }
.azulm { background: url(../imagenes/azulm.png) left center no-repeat; background-size: 20px;  }
.nara { background: url(../imagenes/naranja.png) left center no-repeat; background-size: 20px;  }

#mapa_ { max-width: 860px; min-height: 767px;  background:yellow url(../imagenes/mapa.jpg) no-repeat top center; background-size: 100%; margin: 50px auto; }
#mapa_ img { width: 100% !important;}

#pleca-dir { width: 100%; height: auto; text-align: center; background: yellow; color: black; padding: 10px 0; background: url(../imagenes/fondo-pleca.jpg); background-size: 100%; }
#pleca-dir div { display: inline-block; vertical-align: top; margin:0 10px; cursor: pointer; transition: all 200ms ease;  }
#pleca-dir div img { margin-right: 5px; }
#pleca-dir div:hover { color: white; }

#info { max-width: 960px; height: auto; padding: 75px 0; text-align: center; margin: 0 auto;  }
#info_ { max-width: 1080px; height: auto; padding: 75px 0; text-align: center; margin: 0 auto; }


/* FOOTER */
.foo1 { background:#FF3A00 url(../imagenes/foo1.jpg) no-repeat bottom right !important; }
.foo2 { background:#FFE200 url(../imagenes/foo2.jpg) no-repeat bottom right !important; }
.foo3 { background:#7CCA00 url(../imagenes/foo3.jpg) no-repeat bottom right !important; }
.foo6 { background:#1D70B6 url(../imagenes/foo6.jpg) no-repeat bottom right !important; }
.centro_ { color: white; text-align: center; }
.centro_ img { display: inline-block; margin-top: 50px; }
.remate { color: white; }

.pleca-fo { width: 100%; height: 30px; margin-bottom: 15px; }

.pleca1 { background:#FF3A00 url(../imagenes/foo1.jpg) no-repeat top right !important; }
.pleca2 { background:#FFE200 url(../imagenes/foo2.jpg) no-repeat top right !important; }
.pleca3 { background:#7CCA00 url(../imagenes/foo3.jpg) no-repeat top right !important; }
.pleca6 { background:#1D70B6 url(../imagenes/foo6.jpg) no-repeat top right !important; }


/* SLIDE  */


.carousel-cell h2 { color:white; font-size:75px;  }
.carousel-cell a { color:white;  margin-top:50px; position:relative; }


ol.flickity-page-dots { display:none; }
button.flickity-prev-next-button.next { background: none; background-position:center; opacity:1; border-radius:0;  }
button.flickity-prev-next-button.previous { background: none; /*background: url(../imagenes/prev.png) no-repeat;*/ background-position:center; opacity:1; border-radius:0; }
button.flickity-prev-next-button.next .arrow { fill: #ED7A00; }
button.flickity-prev-next-button.previous .arrow { fill: #ED7A00; }


#slide1 { background: url(../imagenes/slide1.jpg); -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#slide2 { background:url(../imagenes/slide2.jpg) no-repeat top center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#slide3 { background:url(../imagenes/slide3.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#slide4 { background:url(../imagenes/slide4.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


  /* */ 
    @media only screen and (max-width : 1080px) {

    }

    /*  */ 
    @media only screen and (max-width : 969px) {
.btn-info {  display: inline; }
.guarda { display: none; }
.burger { display: inline;  }
      }

@media only screen and (max-width : 780px) {
 .logo_ { display: inline; }
 #piezas  .carousel-nav  {
  height: 16.6%;
  width: 100%;
  background: white;
  position: absolute;
  z-index: 999999999999999;
  right: 0;
}
}

 
 /*  */ 
    @media only screen and (max-width : 580px) {


      .index  { text-align: center; padding-top: 100px; }
      .index img  { margin-top: 50px; }
      .copy { width: 80% !important; }
      .index_2 {  height: auto; padding-top: 25px; }
      .boton-in { width: 100%; height: 50px; border: white solid 1px; text-align: left; float: left; margin-right: 20px; margin-bottom: 30px; }
.clientes { width: 100%; min-height: auto; background: white; margin-bottom: 0px; text-align: center; padding: 0px 14% ; text-align: center; color: black; }
.clientes img { margin: 0 auto }


.boton-in:hover { width: 100%; height: 150px; }

footer { width:100%; height:auto; background:url(../imagenes/footer.jpg) no-repeat center center; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; padding-top: 20px;   }

  
    
        
    }

   
  /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 750px) {

.burger { display:inline; }
#inicio { height: 450px; }
#quienes_somos { height: auto; padding-bottom: 50px; background-image: none; }
#quienes_somos .ajuste { height: 10px;  }

#servicios h2 { padding-top:50px;  }

a.submenu { color:red !important; }
a.submenu-a { color:white !important;  width: 90%; height: auto; font-size: 17px; vertical-align: middle; margin-bottom: 9px; line-height: 18px; }
a.submenu-b { color:white !important;  width: 90%; height: auto; font-size: 17px; vertical-align: middle; margin-bottom: 9px;  line-height: 18px; }

.pleca1 { width: 100%; height: 150px; background:url(../imagenes/pleca2.png) no-repeat center center; background-size: 100%; margin: -50px 0 -50px 0; }
.pleca2 { width: 100%; height: 260px; background:url(../imagenes/pleca33.png) no-repeat 0 0; background-size: 100%; margin: -150px 0 -100px 0; }
.pleca3 { width: 100%; height: 300px; background:url(../imagenes/pleca4.png) no-repeat center center; background-size: 100%; margin: -60px 0 -50px 0; z-index: 99999999999999; }


.clientes { height: auto !important; padding-bottom: 100px; background: white; }
.clientes img { float: left; width: 25%;}

.guarda { display: none; }


    }






    /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 550px) {
   footer .center  { padding-bottom: 50px; padding: 0 5% 50px 5%;}
   footer .center img  { margin: 50px auto; display: block; }
   header { background: rgba(0, 0, 0, 0.5); height: 100px; }
   .remate { height:150px; background-position: 20px 100px; }
#inicio { height: 450px; }
#quienes_somos { height: auto; padding-bottom: 50px; background-image: none; }
#quienes_somos .ajuste { height: 10px;  }

#servicios { padding-bottom:200px; height: 960px !important;  }
#servicios h2 { padding-top:50px;  }
.clientes { height: auto !important; }

.submenu-a { width: 90%; height: auto; font-size: 17px; vertical-align: middle; margin-bottom: 9px; line-height: 18px; }
.submenu-b { width: 90%; height: auto; font-size: 17px; vertical-align: middle; margin-bottom: 9px;  line-height: 18px; }

.pleca1 { width: 100%; height: 150px; background:url(../imagenes/pleca2.png) no-repeat center center; background-size: 100%; margin: -50px 0 -50px 0; }
.pleca2 { width: 100%; height: 260px; background:url(../imagenes/pleca3.png) no-repeat 0 0; background-size: 100%; margin: -50px 0 -100px 0; }
.pleca3 { width: 100%; height: 100px; background:url(../imagenes/pleca4.png) no-repeat 0 0; background-size: 100%; margin: 0; z-index: 99999999999999; }

.piezas { height: 300px; }

.clientes  { height: 550px !important; padding-top: 25px;  background: white;}
.clientes img { float: left; width: 50%;}
.comodin {  margin-left: 25%; margin-top: 0px}

#contacto { width: 100%; height: auto; margin-top: 0px; padding-top: 0; padding-bottom: 50px;
}

.carousel-cell {
  width: 100%;
  margin-right: 10px;
  counter-increment: carousel-cell; color:black;
  padding: 0 30px;
  margin: 0 50px;
}

.carousel-cell h3 {
  text-align: right; color:black; font-size: 14px; border-bottom:#ea2227 solid 3px; width: 100%; padding-bottom: 20px; float: left;  
}

.carousel-cell .title {
   color:#ea2227; font-weight: 700; margin-top: 10px;
}

h1, h2 { font-size: 16px !important;}
.prod1 { background-size: 300%; background-position: center;  }
.prod2 { background-size: 300%; background-position: center;  }
.prod3 { background-size: 300%; background-position: center;  }
.prod4 { background-size: 300%; background-position: center;  }
.prod5 { background-size: 300%; background-position: center;  }
.prod6 { background-size: 300%; background-position: center;  }

.base { background-image: none; background:rgba(0,0,0,0.8); }
.base h3 { text-align: left !important; font-size: 18px !important; line-height: 22px !important; float: left !important;  }

.base {width: 100%; height: auto; background: rgba(0,0,0,0.8); padding-bottom: 20px;
       position: absolute; bottom: 0; background-size: 110%; padding-left: 50px;}

#inicio { height: 250px; }
#inicio .carousel { height: 250px; }
#inicio .carousel .carousel-cell { height: 250px; }

.in-1 {  background:url(../imagenes/inicio1.jpg) no-repeat center center !important; -webkit-background-size: 450px !important;
  -moz-background-size:450px !important;
  -o-background-size: 450px !important;
  background-size: 450px !important;
}

.in-2 {  background:url(../imagenes/inicio2.jpg) no-repeat center center !important;  -webkit-background-size: 450px !important;
  -moz-background-size: 450px !important;
  -o-background-size: 450px !important;
  background-size: 450px !important;
}

.in-3 { background:url(../imagenes/inicio.jpg) no-repeat center center !important;  -webkit-background-size: 450px !important;
  -moz-background-size: 450px !important;
  -o-background-size: 450px !important;
  background-size: 450px !important;
}

.submenu-a, .submenu-b, .submenu-z { height: auto; padding: 25px 5%;  }


#piezas  .carousel-nav .carousel-cell img {
  margin-top: 15px; transition:all 200ms ease; width: 100%;
}


#info { width: 100%; min-height: 50px; background: white; position: relative; text-align: center; color:#4D4D4D; font-size: 18px; padding: 100px 2%;}
#info_ { width: 100%; height: auto; background: white; padding-bottom: 150px; position: relative; text-align: center; color:#4D4D4D; font-size: 18px; padding-top: 50px;}

.somos .img { position: relative; top:0; left: 0%; margin-left: 0%; margin-top: 150px; width: 100%; }
.cultura .img { position: relative; top:0; left: 0%; margin-left: 0%; margin-top: 150px; width: 100%; }
.galeria .img { position: relative; top:0; left: 0%; margin-left: 0%; margin-top: 150px; width: 100%; }
    }