.fondo{
position: relative;
background:linear-gradient(to bottom right, rgba(90,183,254,.1) 30%,rgba(90,183,254,.5) 60%,#28bbf5 90%),rgb(1, 88, 170);
padding-top: 20px;
}

@media only screen and (max-width: 580px) {
.fondo .banner{
  position: absolute;
  background-color: red;
  color: white;
  padding-top: 3px;
  top: 0px;
  left: 0px;
  height: 55px;
  width: 100%;
  z-index: 9999;
  text-align: center;
  font-size: 14px;
  position:fixed;
  }
}

@media only screen and (min-width: 581px) {
  .fondo .banner{
    position: absolute;
    background-color: red;
    color: white;
    padding-top: 3px;
    top: 0px;
    left: 0px;
    height: 35px;
    width: 100%;
    z-index: 9999;
    text-align: center;
    font-size: 18px;
    position:fixed;
    }
  }
@media only screen and (max-width: 1789px) {
hr {
	height: 2px;
	width: 80%;
	background: #ffffff;
	position: absolute;
	border: 0;
  margin: 71px 0 0 16%;
}
}
@media only screen and (min-width: 1790px) {
  hr {
    height: 2px;
    width: 80%;
    background: #ffffff;
    position: absolute;
    border: 0;
    margin: 92px 0 0 16%;
  }
  }
.space {
	margin-top: 40px;
}
.space20 {
	margin-top: 20px;
}
.fondomenor{ 
       height: 50vh;
	   padding: 5rem;
       margin: 0;
	  }
.fondomenor h1{
	color:#FFF;
	font-size:1.2rem;line-height:1rem;}
	
.fondomenor2 h4{
	color:#FFF;
	font-size:1rem;line-height:1rem;}
	
@media only screen and (max-width: 1023px) {
.visible{
display:none;
}
}
@media only screen and (min-width: 1024px) {
.visiblemenor{
display:none;
}
}



@media only screen and (min-width: 992px) {
.fondomodal{ background:url(../img/fondomodalnew.jpg);
       background-position:center;
	   background-size:100%;
	   background-repeat:no-repeat;
	   background-attachment:scroll;
       margin: 0;
    }
  }

@media only screen and (max-width: 991px) {
  .fondomodal{ background:url(../img/fondomodal2.jpg);
    background-position:center;
  background-size:100%;
  background-repeat:no-repeat;
  background-attachment:scroll;
    margin: 0;
 }
}


@media only screen and (min-width: 992px) {
.fondomodalinicio{ background:url(../img/fondomodalinicio22.jpg);
       background-position:center;
	   background-size:100%;
	   background-repeat:no-repeat;
	   background-attachment:scroll;
     width: 85%;
     left: 12%;
    }
    .fondomodalinicio h3{
      font-size: 1.5em;
    }
    .fondomodalinicio p{
      font-size: 1.2em;
    }
    
}

@media only screen and (max-width: 991px) {
  .fondomodalinicio{ 
         background:url(../img/fondomodalinicio22.jpg);
         background-position:center;
       background-size:100%;
       background-repeat:no-repeat;
       background-attachment:scroll;
         margin: 0;
         width: 90%;
         height: 40%;
         left:5% !important;
         
      }
      .fondomodalinicio input{
        font-size: 12px !important;
      }
  }

  @media only screen and (max-width: 1400px) {
  .previoseccion1{
    height: auto;
    padding-top: 2rem;
  }}
  @media only screen and (min-width: 1401px) {
    .previoseccion1{
      height: auto;
      padding-top: 2rem;
    }
    .previoseccion1 img{
      width: 55% !important;
    }

}
	  
@media only screen and (min-width: 1024px) {
.seccion1{ background:url(../img/logo-fondo.svg);
       height: auto;
	   background-position:right;
	   background-size:80%;
	   background-repeat:no-repeat;
	   background-attachment:scroll;
	   padding: 3rem;
       margin: 0;
	  }
}
@media only screen and (min-width: 1200px) {
  .seccion1{ background:url(../img/logo-fondo.svg);
         height: auto;
       background-position:right;
       background-size:80%;
       background-repeat:no-repeat;
       background-attachment:scroll;
       padding: 3rem;
         margin: 0;
      }
  }

  @media only screen and (min-width: 1600px) {
    .seccion1{ background:url(../img/logo-fondo2.svg);
           height: auto;
         background-position:right;
         background-size:80%;
         background-repeat:no-repeat;
         background-attachment:scroll;
         padding: 3rem;
           margin: 0;
        }
    
    .space{
      padding: 6px !important;
    }

    .seccion1 h1{ 
      font-family: D-DIN-Bold;
      font-size: 34px;
     }
     .seccion1 h3{ 
      font-size: 30px;
     }
     .seccion1 h2{ 
      font-size: 30px;
     }
     .seccion1 p{ 
      text-align: justify;
      font-size: 20px;
     }
    
      }

@media screen and (max-width: 1023px) and (min-width: 581px) {
.seccion1{ 
     background:url(../img/logo-fondo.svg);
     height: auto;
	   background-position:right;
	   background-size:100%;
	   background-repeat:no-repeat;
	   background-attachment:scroll;
	   padding: 1rem;
       margin: 0;
    }
    .seccion1 h1{ 
      font-family: D-DIN-Bold;
      font-size: 24px;
     }
     .seccion1 h3{ 
      font-size: 18px;
     }
     .seccion1 h2{ 
      font-size: 21px;
     }
     .seccion1 p{ 
      text-align: justify;
     }
}
@media only screen and (max-width: 580px) {
  .seccion1{ 
    background-color:#ffffff;
       height: auto;
       padding-top: 2rem;
         margin: 0;
      }
      .seccion1 h1{ 
        font-family: D-DIN-Bold;
        font-size: 24px;
       }
       .seccion1 h3{ 
        font-size: 18px;
       }
       .seccion1 h2{ 
        font-size: 21px;
       }
       .seccion1 p{ 
        text-align: justify;
       }
  }

  @media only screen and (max-width: 580px) {	
.seccion2{ background-color:#ffffff;
       height: auto;
       padding-top: 3rem;
       padding-bottom: 3rem;
       margin: 0;
	  }
  }
  @media only screen and (min-width: 581px) {	
    .seccion2{ background-color:#ffffff;
           height: auto;
           padding: 2.5rem;
           margin: 0;
        }
      }

@media only screen and (min-width: 581px) {	  
.seccion3{ background-color:#ffffff;
       height: auto;
	   padding: 3rem;
       margin: 0;
    }
  }

  @media only screen and (max-width: 580px) {	  
    .seccion3 h1{ 
           font-size: 20px;
        }
      }



@media only screen and (min-width: 581px) {
.seccion4{ 
       height: auto;
	   padding: 3rem;
       margin: 0;
	   background:url(../img/fondo-white.svg);
	   background-color:#e5e5e5;
	   background-position:right;
	   background-size:26%;
	   background-repeat:no-repeat;
	   background-attachment:scroll;
	  }
  }

  @media only screen and (max-width: 580px) {
    .seccion4{ 
           height: auto;
         padding: .8rem;
           margin: 0;
         background:url(../img/fondo-white.svg);
         background-color:#e5e5e5;
         background-position:right;
         background-size:110%;
         background-repeat:no-repeat;
         background-attachment:scroll;
        }
    .seccion4 h1{
      font-size: 22px;

    }

      }

  .seccion5{ background-color:#ffffff;
    height: auto;
    padding: 3rem;
    margin: 0;
 }
    
    @media only screen and (max-width: 580px) {
      .seccion5 h2 {
        font-size: 20px;
      }
      .seccion5 {
        padding-top: .9rem;
        padding-left: .3rem;
        padding-right: .3rem;
        padding-bottom: .9rem;
      }
    }
    /*--------------------------------------------------------------
# Clients
--------------------------------------------------------------*/
@media only screen and (min-width: 581px) {
.clients .clients-wrap {
  border-top: 0px solid #f1eeed;
  border-left: 0px solid #f1eeed;
}

.clients .client-logo {
  padding: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-right: 0px solid #f1eeed;
  border-bottom: 0px solid #f1eeed;
  overflow: hidden;
  background: #fff;
  height: 100px;
}

.clients .client-logo img {
  transition: all 0.3s ease-in-out;
  height: 100%;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

.clients .client-logo:hover img {
  -webkit-filter: none;
  filter: none;
  transform: scale(1.1);
}
}

@media only screen and (max-width: 580px) {
  .clients img{
    padding: 5px;
    width: 90%;
  }
  .clients .client-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    border-right: 0px solid #f1eeed;
    border-bottom: 0px solid #f1eeed;
    overflow: hidden;
    background: #fff;
    height: 60px;
  }
}
/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  color: #b4aca8;
  font-size: 14px;
  background: #3a3a3a;
}

#footer .footer-top {
  padding: 40px 0 30px 0;
  background: #565656;
}

#footer .footer-top .footer-contact {
  margin-bottom: 30px;
}

#footer .footer-top .footer-contact h3 {
  font-size: 22px;
  margin: 0 0 10px 0;
  padding: 2px 0 2px 0;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #fff;
}

#footer .footer-top .footer-contact p {
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 0;
  font-family: "Muli", sans-serif;
  color: #b4aca8;
}

#footer .footer-top h4 {
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  position: relative;
  padding-bottom: 12px;
}

#footer .footer-top .footer-links {
  margin-bottom: 10px;
}

#footer .footer-top .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#footer .footer-top .footer-links ul i {
  padding-right: 2px;
  color: #4a7fba;
  font-size: 18px;
  line-height: 0;
}

#footer .footer-top .footer-links ul li {
  padding: 10px 0;
  display: flex;
  align-items: center;
}

#footer .footer-top .footer-links ul li:first-child {
  padding-top: 0;
}

#footer .footer-top .footer-links ul a {
  color: #b4aca8;
  transition: 0.3s;
  display: inline-block;
  line-height: 0;
}

#footer .footer-top .footer-links ul a:hover {
  text-decoration: none;
  color: #4a7fba;
}

#footer .footer-newsletter {
  font-size: 15px;
}

#footer .footer-newsletter h4 {
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  position: relative;
  padding-bottom: 12px;
}

#footer .footer-newsletter form {
  margin-top: 30px;
  background: #fff;
  padding: 6px 10px;
  position: relative;
  border-radius: 4px 0 0 4px;
  text-align: left;
}

#footer .footer-newsletter form input[type="email"] {
  border: 0;
  padding: 4px 8px;
  width: calc(100% - 100px);
}

#footer .footer-newsletter form input[type="submit"] {
  position: absolute;
  top: 0;
  right: -4px;
  bottom: 0;
  border: 0;
  background: none;
  font-size: 16px;
  padding: 0 20px;
  background: #f03c02;
  color: #fff;
  transition: 0.3s;
  border-radius: 0 4px 4px 0;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}

#footer .footer-newsletter form input[type="submit"]:hover {
  background: #fd5c28;
}

#footer .credits {
  padding-top: 5px;
  font-size: 13px;
  color: #b4aca8;
}

#footer .social-links a {
  font-size: 18px;
  display: inline-block;
  background: #f03c02;
  color: #fff;
  line-height: 1;
  padding: 8px 0;
  margin-right: 4px;
  border-radius: 50%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}

#footer .social-links a:hover {
  background: #fd5c28;
  color: #fff;
  text-decoration: none;
}

/*--------------------------------------------------------------
# GOOGLEMAPS
--------------------------------------------------------------*/
.map-container{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
box-shadow: 0px 0px 15px #a0a2a4;
}
.map-container iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}

@media only screen and (max-width: 580px) {
  .map-container{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:300px !important;
    box-shadow: 0px 0px 15px #a0a2a4;
    }
}

/*--------------------------------------------------------------
# carrusel somos la solucion
--------------------------------------------------------------*/
#content {
    margin-bottom: 25px;
}


@media (min-width: 1200px) {
#carrusel {
    float:left;
    width:810px;
    overflow:hidden;
    height:270px;
    position:relative;
    margin-top:20px;
    margin-bottom:20px;
  }

  #carrusel .left-arrow {
    position:absolute;
    left:10px;
    z-index:1;
    top:60%;
    margin-top:-9px;
}

#carrusel .right-arrow {
    position:absolute;
    right:10px;
    z-index:1;
    top:60%;
    margin-top:-9px;
}

.carrusel {
    width:4000px;
    left:0px;
    position:absolute;
    z-index:0;
}

.carrusel>div {
    float: left;
    height: 203px;
    margin-right: 5px;
    width: 195px;
    text-align:center;
}

.carrusel img {
	cursor:pointer;
	width:150px;
    height:150px;
    border-radius:150px;
    border:1px solid #CCC;
	box-shadow: 0px 0px 18px #ddd;
}

.product {
	padding: 15px;
    border:#CCCCCC 0px solid;
}
h5 {
    margin-top: 1rem;
}

}
@media (min-width: 1600px) {
  #carrusel {
      float:left;
      width:1150px;
      overflow:hidden;
      height:330px;
      position:relative;
      margin-top:20px;
      margin-bottom:20px;
    
  }

  #carrusel .left-arrow {
    position:absolute;
    left:10px;
    z-index:1;
    top:60%;
    margin-top:-9px;
}

#carrusel .right-arrow {
    position:absolute;
    right:10px;
    z-index:1;
    top:60%;
    margin-top:-9px;
}

.carrusel {
    width:4000px;
    left:0px;
    position:absolute;
    z-index:0;
}

.carrusel>div {
    float: left;
    height: 203px;
    margin-right: 5px;
    width: 280px;
    text-align:center;
}

.carrusel img {
	cursor:pointer;
	width:220px;
    height:220px;
    border-radius:220px;
    border:1px solid #CCC;
	box-shadow: 0px 0px 18px #ddd;
}

.product {
	padding: 15px;
    border:#CCCCCC 0px solid;
}
h5 {
    margin-top: 1rem;
}

  }
@media (max-width: 1199px) {
#carrusel {
    float:left;
    width:810px;
    overflow:hidden;
    height:270px;
    position:relative;
    margin-top:20px;
    margin-bottom:20px;
	
}

#carrusel .left-arrow {
  position:absolute;
  left:10px;
  z-index:1;
  top:60%;
  margin-top:-9px;
}

#carrusel .right-arrow {
  position:absolute;
  right:10px;
  z-index:1;
  top:60%;
  margin-top:-9px;
}

.carrusel {
  width:4000px;
  left:0px;
  position:absolute;
  z-index:0;
}

.carrusel>div {
  float: left;
  height: 203px;
  margin-right: 5px;
  width: 195px;
  text-align:center;
}

.carrusel img {
cursor:pointer;
width:150px;
  height:150px;
  border-radius:150px;
  border:1px solid #CCC;
box-shadow: 0px 0px 18px #ddd;
}

.product {
padding: 15px;
  border:#CCCCCC 0px solid;
}
h5 {
  margin-top: 1rem;
}

}

@media (max-width: 991px) {
  #carrusel {
    float:left;
    width:600px;
    overflow:hidden;
    height:330px;
    position:relative;
    margin-top:20px;
    margin-bottom:20px;
  
}

#carrusel .left-arrow {
  position:absolute;
  left:10px;
  z-index:1;
  top:60%;
  margin-top:-9px;
}

#carrusel .right-arrow {
  position:absolute;
  right:10px;
  z-index:1;
  top:60%;
  margin-top:-9px;
}

.carrusel {
  width:4000px;
  left:0px;
  position:absolute;
  z-index:0;
}

.carrusel>div {
  float: left;
  height: 203px;
  margin-right: 5px;
  width: 280px;
  text-align:center;
}

.carrusel img {
  cursor:pointer;
  width:110px;
    height:110px;
    border-radius:110px;
    border:1px solid #CCC;
  box-shadow: 0px 0px 18px #ddd;
  }

.product {
padding: 15px;
  border:#CCCCCC 0px solid;
}
h5 {
  margin-top: 1rem;
}
  
  }

@media (max-width: 580px) {
  #carrusel {
    float:left;
    width:210px;
    overflow:hidden;
    height:330px;
    position:relative;
    margin-top:20px;
    margin-bottom:20px;
    color: #000;
  
}

#carrusel .left-arrow {
  position:absolute;
  left:2px;
  z-index:1;
  top:60%;
  margin-top:-9px;
}

.left-arrow .img{
  width:20% !important; 
}

#carrusel .right-arrow {
  position:absolute;
  right:2px;
  z-index:1;
  top:60%;
  margin-top:-9px;
  color: #000;
}

.carrusel {
  width:4000px;
  left:0px;
  position:absolute;
  z-index:0;
  color: #000;
}

.carrusel>div {
  float: left;
  height: 203px;
  margin-right: 0px;
  width: 190px;
  text-align:center;
  color: #000;
}

.carrusel img {
  cursor:pointer;
  width:100px;
    height:100px;
    border-radius:100px;
    border:1px solid #CCC;
  box-shadow: 0px 0px 18px #ddd;
  }

.product {
padding: 5px;
  border:#CCCCCC 0px solid;
  color: #000;
}
h5 {
  margin-top: 1rem;
}
  
  }



/*--------------------------------------------------------------
# inpusts
--------------------------------------------------------------*/
.redondeado {
   border-radius: 5px;
   line-height: 40px;
 }
.confondo {
   background-color: #e5e5e5;
   color: #6f7072 !important;
 }

 
 /*--------------------------------------------------------------
# carousel header
--------------------------------------------------------------*/
 
#myCarousel-indicators > li {
  text-align: center;  
  border-radius: 50%;
    width: 12px;
    height: 12px;
	background-color: #fff;
	border:20px;
}
.myButton {
color: rgb(255, 255, 255); font-size: 15px; line-height: 12px; padding: 11px; border-radius: 7px; font-family: Oswald-Regular, serif; font-weight: normal; text-decoration: none; font-style: normal; font-variant: normal; text-transform: none; background-image: linear-gradient(rgb(0, 0, 0) 0%, rgb(98, 97, 99) 0%, rgb(0, 0, 0) 100%); border: 0px solid rgb(0, 0, 0); display: inline-block;}
.myButton:hover {
background: #000000; }
.myButton:active {
background: #000000; }

@media (min-width: 1600px) {
  .titulo{
    position: absolute;
    z-index:1;
    padding-top: 14px;
    top:  6rem;
    color: #FFF;
    left:30%;
      
  }
  .titulo2{
    position: absolute;
    z-index:1;
    top:  6rem;
    color: #FFF;
    left:30%;
      
  }
  .titulo h1{
    font-family: D-DIN-Bold;
    font-size:4vw; 
  }
  .titulo h2{
    font-family: D-DIN-Bold;
    text-align: center;
  }
  .paddingcarru{
    padding-bottom: 10px; 
  }
  .carousel-caption h2{
    font-family: aeromatics-bold;
    font-size:3vw; 
  }
  .carousel-item {
    background: no-repeat center center scroll;
    height: 80vh;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: 55%;
   }
   .justificar{color:#FFF;
    text-align:left;
    padding: 9px;
    text-shadow: 0px 0px 0px rgb(41, 41, 41);
      }
  }

@media (min-width: 1200px) {
.titulo{
  position: absolute;
  z-index:1;
  top:  6rem;
  color: #FFF;
  left:23%;
    
}
.titulo2{
  position: absolute;
  z-index:1;
  top:  6rem;
  color: #FFF;
  left:25%;
    
}
.titulo h1{
  font-size:3vw; 
}
.titulo h2{
  font-family: D-DIN-Bold;
  left:30%;
}
.paddingcarru{
  padding-bottom: 2px; 
}
.carousel-caption h2{
  font-size:2.1vw; 
}
.carousel-item {
  background: no-repeat center center scroll;
  height: 75vh;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: 25%;
 }
 .justificar{color:#FFF;
  text-align:left;
  padding: 5px;
  text-shadow: 0px 0px 0px rgb(41, 41, 41);
    }
    .justificar h3{
      font-size:1.1vw; 
    }

    .inicio20{
      height: 25vh;
    }
}

@media (max-width: 1199px) {
.titulo{
  position: absolute;
  z-index:1;
  top:  6rem;
  color: #FFF;
  left:25%;
}
.titulo2{
  position: absolute;
  z-index:1;
  top:  6rem;
  color: #FFF;
  left:25%;
}
.titulo h1{
  font-size:3.5vw; 
}
.paddingcarru{
  padding-bottom: 10px; 
}
.carousel-caption h2{
  font-size:3vw; 
}
.carousel-item {
  background: no-repeat center center scroll;
  height: 100vh;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: 45%;
 }
 .justificar{color:#FFF;
  text-align:left;
  padding: 9px;
  text-shadow: 0px 0px 0px rgb(41, 41, 41);
    }
}
@media (max-width: 768px) {
.titulo{
  position: absolute;
  z-index:1;
  top:  6rem;
  color: #FFF;
  left:25%;
}
.titulo2{
  position: absolute;
  z-index:1;
  top:  6rem;
  color: #FFF;
  left:25%;
}
.titulo h1{
  font-size:3.5vw; 
}
.paddingcarru{
  padding-bottom: 10px; 
}
.carousel-caption h2{
  font-size:5vw; 
}
.carousel-item {
  background: no-repeat center center scroll;
  height: 80vh;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: 60%;
 }
 .justificar{color:#FFF;
  text-align:left;
  padding: 9px;
  text-shadow: 0px 0px 0px rgb(41, 41, 41);
    }
}
@media (max-width: 576px) {
.titulo{
	position: absolute;
  z-index:1;
	color: #FFF;
  left: 9%;
}
.titulo h1{
  font-size:4.7vw; 
}
.titulo h2{
  font-size:5.5vw; 
}
.paddingcarru{
  padding-bottom: 10px; 
}
.carousel-caption h2{
  font-size:5vw; 
}

.carousel-item {
  background: no-repeat center center scroll;
  height: 75vh;
    -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: 75%;
 }
 .justificar{color:#FFF;
  text-align:left;
  padding: 9px;
  text-shadow: 0px 0px 0px rgb(41, 41, 41);
    }
.justificar h3{
  font-size:5vw; 
}
}


	

/* ------------------------- */
/* imagens seccion 1 */
/* ------------------------- */
.img {
float: left;
margin: 15px;
-webkit-transition: margin 0.5s ease-out;
-moz-transition: margin 0.5s ease-out;
-ms-transition: margin 0.5s ease-out;
transition: margin 0.5s ease-out;

}

.ex1 p {
  visibility: hidden;
}

.ex1:hover {
background-color:#FFF;
border-style: solid; border-width: 2px;
border-color:#999;
border-radius:15px;
margin-top: 2px;
}
.ex1:hover p {
  visibility: visible;
}

.seccion1img h2{
	color: black;
}
@media (min-width: 1200px) {
.seccion1img {
  padding-top: 40px;
} 
}

/* ------------------------- */
/* imagens imputs */
/* ------------------------- */
.input-icono {
  background-image: url('..img/success.png');
  background-repeat: no-repeat;
  background-position: 4px center;
  background-size: 20px;
  display: flex;
  align-items: center;
  width: 300px;
  padding-left: 28px;
  height: 30px;
  border: 1px solid rgba(9, 113, 163, 1);
  border-radius: 3px;
}
.input-icono input {
  width: 100%;
  font-size: 0.9em;
  border: none;
}
.input-icono input:focus {
  outline: none;
}

/* ------------------------- */
/* radio boton estados */
/* ------------------------- */
/* Radio button */
.formsucursales span{
  display: block;
  margin-bottom: 20px;
}

.formsucursales .labelradio{
  padding: 6px 30px;
  border-radius: 20px;
  border: 2px solid #ccc;
}

.tiporadio:checked + label{
  background: rgb(1, 145, 235);
  color: white;
  border: 2px solid rgb(1, 145, 235);
}

.tiporadio{
  display: none;
}

.myButtonsuc {
  color: rgb(0, 0, 0);
  font-size: 15px;
  line-height: 12px;
  padding: 11px;
  border-radius: 7px; 
  font-family: aeromatics, serif; 
  font-weight: normal; 
  text-decoration: none; 
  font-style: normal; 
  font-variant: normal; 
  text-transform: none; 
  background-image:  rgb(255, 255, 255) ;
  border: 2px solid rgb(1, 145, 255); 
  display: inline-block;}

  @media (max-width: 580px) {
    .myButtonsuc {
      color: rgb(0, 0, 0);
      font-size: 12px;
      line-height: 12px;
      padding: 8px;
      border-radius: 7px; 
      font-family: aeromatics, serif; 
      font-weight: normal; 
      text-decoration: none; 
      font-style: normal; 
      font-variant: normal; 
      text-transform: none; 
      background-image:  rgb(255, 255, 255) ;
      border: 2px solid rgb(1, 145, 255); 
      display: inline-block;}

  }

  .myButtonsuc:hover {
    color: rgb(255, 255, 255);
    background-image: linear-gradient(rgb(1, 145, 255) 0%, rgb(177, 220, 253) 0%, rgb(1, 145, 255) 100%); 
    border: 2px solid rgb(1, 145, 255); }

  .myButtonsuc:active {
    color: rgb(255, 255, 255);
     }
  
     .checked:active{
      color: rgb(255, 255, 255);
      background-image:  rgb(1, 145, 255) ;
     border: 2px solid rgb(1, 145, 255);
     }




/* ------------------------- */
/* letrafooter celular */
/* ------------------------- */
@media (max-width: 768px) {
  .footerletra a{
    font-size:10px;
  }
  .footerletra h4{
    font-size:8px;
  }
}

.animated3 {
	-webkit-animation: flipInX 2s ease-in-out 800ms both;
	animation: flipInX 2s ease-in-out 800ms both;
}
.animated1 {
	-webkit-animation: lightSpeedIn 1s ease-in 800ms both;
	animation: lightSpeedIn 1s ease-in 800ms both;
}
.animated2 {
	-webkit-animation: bounceIn 1s ease-in 800ms both;
	animation: bounceIn 1s ease-in 800ms both;
}

.modalredondeado{
  border-radius: 20px 20px 20px 20px;
  -moz-border-radius: 20px 20px 20px 20px;
  -webkit-border-radius: 20px 20px 20px 20px;
  border: 0px solid #000000;

  -webkit-box-shadow: -1px 2px 53px 2px rgba(0,0,0,0.75);
  -moz-box-shadow: -1px 2px 53px 2px rgba(0,0,0,0.75);
  box-shadow: -1px 2px 53px 2px rgba(0,0,0,0.75);

}

.modalredondeado input{
  line-height: 0px !important;
  height: 26px;
  
}
@media (min-width: 1400px) {
  .modaltamanocentrado {
    width: 400px;
    height: 400px;
    position: absolute;
    left: 70%;
    top: 30%; 
    margin-left: -150px;
    margin-top: -150px;
  }
  }
 
@media (min-width: 768px) {
.modaltamanocentrado {
  width: 400px;
  height: 400px;
  position: absolute;
  left: 45%;
  top: 30%; 
  margin-left: -150px;
  margin-top: -150px;
}
}
@media (max-width: 767px) {
.modaltamanocentrado {
  width: 340px;
  position: absolute;
  left: 45%;
  top: 30%; 
  margin-left: -150px;
  margin-top: -150px;
}
.form-group{
  margin-bottom: .5rem !important;
}
}
.resizedTextbox {
  height: 32px !important; 
  padding: 1px
} 

.myButton2 {
	box-shadow: 0px 2px 13px -1px #1564ad;
	background:linear-gradient(to bottom, #79bbff 5%, #378de5 100%);
	background-color:#79bbff;
	border-radius:5px;
	border:1px solid #337bc4;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:14px;
	font-weight:bold;
	padding:4px 20px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528ecc;
}

#capa h2{
  color: #1564ad;
font-size: 18px !important;
}

.myButton2:hover {
	background:linear-gradient(to bottom, #378de5 5%, #79bbff 100%);
	background-color:#378de5;
}
.myButton2:active {
	position:relative;
	top:1px;
}

/* ------------------------- */
/* slider imagnes */
/* ------------------------- */

/*works*/
#works{padding-top:1em;}

/*works*/
@media (max-width: 1200px) {
	
	figure.effect-oscar figcaption{padding: 12%;}
	figure.effect-oscar figcaption::before,figure.effect-chico figcaption::before{top: 20px;right: 20px;bottom: 20px;left: 20px;}

}

@media (max-width: 900px) {
	figure.effect-oscar figcaption {padding: 20%;}
}


@media (max-width: 767px) {
	
	#works {padding-top: 5em;}

}

.btn-primary{
	background-color: #009cde !important;

}

.botonestilo {
  background: #FFFFFF;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  color: #000000;
  font-size: 16px;
  font-weight: 100;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 18px;
  padding-right: 18px;
  border: solid #000000 2px;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
  text-align: center;
  }
  
  .botonestilo:hover {
  color: #fffefe;
  background: #000000;
  border: solid #FFFFFF 2px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  text-decoration: none;
  }

  .logocentrado{
    display: flex; 
    align-items: flex-start;
  }


  @media (max-width: 580px) {
  .logocentrado{
    display: flex; 
    align-items: center;
  }
  .padbut{
    padding-top: 10px;
    padding-bottom: 5px;
  }

}

.espaciopad{
  padding: 8px;
}
.espaciopad20{
  padding: 20px;
}

@media (max-width: 580px) {
.fondomodprod{
  background-color: white;
}
}
@media (min-width: 581px) {
  .fondomodprod{
    background:url(../img/fondomodalprod.jpg);
    background-position:center;
    background-size:100%;
    background-repeat:no-repeat;
    background-attachment:scroll;
    margin: 0;
  }
  }

  .masprodfondo{
    
  }

  .whatsapp {
    text-decoration: none;
    position:fixed;
    width:60px;
    height:60px;
    bottom:40px;
    right:40px;
    background-color:#25d366;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    font-size:30px;
    z-index:100;
  }
  
  .whatsapp-icon {
    margin-top:13px;
  }

.botonwhatsapp {
  position:fixed;
  width:180px;
  height:50px;
  bottom:40px;
  right:40px;
	background-color:#44c767;
	-webkit-border-radius:28px;
	-moz-border-radius:28px;
	border-radius:28px;
	border:1px solid #18ab29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:19px;
	padding:3px 10px;
	text-shadow:1px 2px 1px #2f6627;
  z-index:1000;
}
.botonwhatsapp:hover {
	background-color:#44c767;
  color:#006319;
  text-shadow:1px 2px 1px #ffffff;
}



/* Animación con keyframe llamada "latidos" */
@keyframes latidos {
  from { transform: none; }
  50% { transform: scale(1.4); }
  to { transform: none; }
}
/* En la clase corazon vamos a llamar latidos en la animación  */
.corazon {
display: inline-block;
font-size: 150px;
text-shadow: 0 0 10px #222,1px 1px  0 #450505;
color:rgb(255, 255, 255);
animation: latidos 2s infinite;
transform-origin: center;
}

.corazon2 {
  display: inline-block;
  font-size: 150px;
  color:rgb(255, 255, 255);
  animation: latidos 2s infinite;
  transform-origin: center;
  }

/* RESPONSIVO L CAPTCHA  */
@media screen and (max-height: 575px){
  .g-recaptcha, #rc-imageselect   {
    transform: scale(0.84);
    transform-origin: 0 0;
   }
}

/*--------------------------------------------------------------
# seccion 4.1 banner telefonos
--------------------------------------------------------------*/
.BannerTelefono{
    background:url(../img/banner_sucursales.jpg);
    background-position:center;
    background-size:100%;
    background-repeat:no-repeat;
    background-attachment:scroll;
    margin: 0;
    height: auto;
    width: 100%;
    
}
.BannerTelefono h1{
  font-family: D-DIN-Bold;
  text-align: center;
  padding-top: 20px;
  font-size: 50px ;
}
.BannerTelefono h3{
  font-family: aeromatics, serif;
  text-align: center;
  font-size: 18px ;
}
.BannerTelefono p{
  font-family: Oswald-Regular, serif;
}
.suctelefonos{
  position: relative;
  display: flex;
  flex-flow: row;
  align-items: center;
  justify-content: center;
}

.sucsegmentos{
  padding: 20px;
  text-align:center;
  font-size: 12px ;
  height: 100%;
}
.imagentitulo{
height: 60px;
}
.parrafo{
  height: 120px;
}
.telsucursalbotom{
  height: 30px;
}

.botonsuc {
	box-shadow: 0px 10px 14px -10px #276873;
	background:linear-gradient(to bottom, #40bae6 5%, #408c99 100%);
	background-color:#40bae6;
	border-radius:5px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:12px;
	font-weight:bold;
	padding:8px 14px;
	text-decoration:none;
	text-shadow:0px 1px 0px #3d768a;
}
.botonsuc:hover {
	background:linear-gradient(to bottom, #408c99 5%, #40bae6 100%);
  background-color:#408c99;
  color:#ffffff;
  text-decoration:none;
}
.botonsuc:active {
	position:relative;
	top:1px;
}
/* RESPONSIVO 1024  */
@media screen and (max-width: 1024px){
  .suctelefonos{
    flex-wrap: wrap;
  }
  }

/* RESPONSIVO 575  */
@media screen and (max-width: 575px){
  .suctelefonos{
    flex-flow: column;
  }
  .BannerTelefono{
    background-color: #FFF;
    margin: 0;
    height: auto;
    width: 100%;
    
}
.BannerTelefono h1{
  font-size: 25px ;
}
  }

/* efecto mov letras  */
  

.palpitar {
  display:inline;
  
  -webkit-animation: glow 2s ease-in-out infinite alternate;
  -moz-animation: glow 2s ease-in-out infinite alternate;
  animation: glow 2s ease-in-out infinite alternate;
}

@-webkit-keyframes glow {
  from {
    color: rgb(255, 0, 0);
    text-shadow: 0 0 2px #dafcfa, 0 0 4px #dafcfa, 0 0 6px #dafcfa, 0 0 8px #dafcfa, 0 0 10px #dafcfa, 0 0 12px #dafcfa, 0 0 14px #dafcfa, 0 0 16px #dafcfa;
  }
  to {
    color: rgb(255, 255, 255);
    text-shadow: 0 0 4px #dafcfa, 0 0 6px #dafcfa, 0 0 8px #dafcfa, 0 0 10px #dafcfa, 0 0 12px #dafcfa, 0 0 14px #dafcfa, 0 0 16px #dafcfa, 0 1 18px #dafcfa;
  }
}

    /* tamaño icono pdf */
    @media (min-width: 581px) {
      .icono-pdf {
        width: 5%;
       
      }
    }
    @media (max-width: 580px) {
      .icono-pdf {
        width: 20%;
       
      }
    }