* {
    padding: 0; box-sizing: border-box; margin: 0 auto; font-family: 'Kanit', sans-serif;  
}
#mapa {
    text-align: center;
    width: 100%;
    height: 300px;
    padding: 0;
    
}
img{
    max-width: 100%;
    height: auto;
}
header{   
    width: 100%;
    padding-bottom: .5rem;
    margin-top: 1.5rem;
    
}

section {
    width: 100%;
}

#botonera {
    display: none;
    
}

h1 {
    width: 34px;
    height: 28px;
    position: absolute;
    background-image: url(imagenes/logoxs.png) ;
    background-repeat: repeat;
    font-size: 0;
    margin-left: 1rem;
    margin-top: .5rem;
}


#nav {  
    justify-content: end; 
    
}

#banner {
  margin-top: .5rem;
  margin-bottom: 2rem;
}

#burger{
    margin-top: .5rem;
    margin-right: .5rem;
    background-color: transparent;
    border: none;
    border-radius: 0;
    background-repeat: no-repeat;
    width: 19px;
    height: 17px;
    background-image: url(imagenes/burgerchica.png);
}

.offcanvas-header {
    margin: 0;
    justify-content: end;}

#ulbotoneraburger {
    font-weight: 800;
    font-size: 1.2rem;
}

#ulbotoneraburger li {
    margin-top: 2rem;
}

#ulbotoneraburger li a {
    color:#661b7a;
    
}
.offcanvas {
    background-color: #9aea28;
    
}

.offcanvas-body{
    padding: 0;
}

.btn-close{
    opacity: 100%;
    background-image: url(imagenes/cruz.png);
}


#ulbotonera li {
    display: inline-block;
    padding: 2rem;
    font-size: 1.3rem;
    font-weight: 500;
}
#ulbotonera {
    text-align: center;
}
#ulbotonera a {
    text-decoration: none;
    color: #661b7a;
}

.boton {
    text-align: center;
}

.boton a {
width: auto;
background-color: #9aea28 !important;
padding: .5rem !important;
color:#661b7a;
text-decoration: none;
border-radius: 2px;
font-weight: 800;
}

.shadow-lg {
    box-shadow: 0 1rem 3rem rgba(0,0,0,.400)!important;
}

.shadow {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.25)!important;
}

#presupuesto a {
    font-size: .8rem;
}

.boton a:hover, #seccion3 a:hover{
   color: #ffffff;
}

#ola {
margin-top: 1rem;
color: #ffffff;
text-align: center;
display: flex;
background-image: url(imagenes/ola576x676.png);
background-color: #661b7a;
background-position: right;
background-repeat: no-repeat;
background-size: cover;
flex-direction: column;


}

#ola h2{
    text-align: center;
    margin-top: 20vh;
    margin-bottom: 1rem;
    padding: 1rem .5rem;
    font-size: 1.2rem;  
    font-family: 'Oswald', sans-serif ;
    font-weight: 900;
    
}

#ola h2 span {
    
    color: #9aea28;
    font-size: 1.2rem;  
    font-family: 'Oswald', sans-serif ;
    font-weight: 900;
}

#ola p{
width: 50px;
height: 50px;
font-size: 0;
margin-bottom: 0;
}

#años p {
    background-image: url(imagenes/icono1.50x50.png);
}
#pioneros p {
    background-image: url(imagenes/icono2.50x50.png);
}
#trabajos p {
    background-image: url(imagenes/icono3.50x50.png);
}
#ola h3 {
    font-size: 1rem; 
    padding: 1rem .5rem;
    margin-bottom: 1rem; 
}

#ola h3 span {
    color: #9aea28;
}

#presupuestoxl {
    display: none;
}

#olainvertida div{
    width: 100%;
    background-image: url(imagenes/olainvertida300x100.png);
    height: 70px;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #ffffff;
    text-align: center;
    font-size: 0;   
}

#olainvertida div p {
    margin: 0;
}

#olainvertida h2{
    margin-top: 2rem;
   padding-top: 1rem;
   font-weight: 800;
   text-align: center;
   margin-bottom: 2rem;
   color: #6c6d6a;
}


#olainvertida article {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center ;
    padding: 2rem 1rem;
}

#olainvertida img {
    max-width:100% ;
    width: 100px;
    height: 100px;
    
}

#olainvertida p {
    margin: 1rem 0;
    font-weight: 500;
    color: #6c6d6a;

}

#olainvertida a {
    text-decoration: none;
    background-color: #661b7a;
    color: #ffffff;
    padding: .3rem;
    border-radius: 5px;
    font-size: small;
}

#olainvertida a:hover {
    opacity: .9;
    background-color: #82229c;
}

#seccion3 {
    background-image: url(imagenes/background.png);
    height: 200px;
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #8A8B87;
    text-align: center;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 2rem 0;
    margin-top: 2rem;
}

#seccion3 a{
    text-align: center;
    width: auto;
    background-color: #9aea28;
    padding: .5rem 1rem;
    color:#661b7a;
    text-decoration: none;
    border-radius: 2px;
    font-weight: 800; 
    font-size: .8rem;
}

#seccion3 h2 {
    padding: 1rem;
    margin-bottom: 0;
    font-size: 1.2rem;
}

footer {
    color: #ffffff;
    background-color: #8A8B87;
    padding: 1.5rem .5rem;
    align-items:center;
    
}

#footer-up {
    display: flex;
    flex-direction: column;
    align-items: center;
    
}

#footer-up div {
    display: flex;
    
    
}

footer a {
text-decoration: none;
color: #ffffff;
font-weight: 400;
padding-left: .3rem;
}
footer a:hover {
    color: #9aea28;
}
footer ul {
    list-style: none;
    text-align: center;
    padding: 0;
    margin: 0;
    border-top: solid 5px #9aea28 ;
    border-bottom: solid 5px #9aea28 ;
    height: fit-content;
    width: 70%;   
    
}


footer li:first-child {
    margin-top: 1.5rem;
}

footer li:last-child {
    margin-bottom: 1.5rem;
}

#footer-d{
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    align-items: center;
    
    
}

#iconosescri {
    margin-bottom: 1.5rem;
    margin-top: .5rem;
    width: 80%;
    
}

#telefono {
    margin-left: 0;
    
}


#footer-d h3 {
    margin: 0;
    padding-top: 2rem;
}
#iconosescri img {
    width: 35px;
    height: 35px;
    
}

#escribinos {
    display: flex;
    flex-direction: column;
    text-align: center;
    width: 100%;
}

#escribinos h2 {
    margin-top: 1rem;
    font-size: 1.6rem;
    
}

footer img {
    width: 20px;
    height: 20px;
    margin-top: .2rem;
}
footer div p {
margin: 0;
}
#direccion, #telefono{
    display: flex;
    margin-top: 1.5rem;
    margin-right: 0;
    text-align: center; 
}

#direccion p {
    width: 100%
}

#telefono p{
    padding-left: .3rem;
}
#seccionnosotros {
    background: linear-gradient(to bottom, #ffffff, #d1d0d0, #ffffff);
    height: 100%; 
}
#nosotros {
    margin-top: 1rem;
    display: flex; 
    text-align: center;
    display: flex;
    flex-direction: column;
}
#nosotros em {
    color: #661b7a;
    font-style: normal;
}
#nosotros figure img {
    border-radius: 50%;
    box-shadow:0px 0px 20px #525252;
    
}
#seccionnosotros h2 {
    font-weight: 500;
    color: #6c6d6a;
    text-align: center;
    margin-top: 1rem;
    margin-bottom: 0;
}
#nosotros p {
    padding: 1rem;
}
#carusel, #carusel p {
    text-align: center;
    padding:0 1rem;
    margin: 0;
}
#carusel h6 {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

#seccionnosotros article {
    text-align: center;
}

#certificado img {
    width: 100px;
    height: auto;
}

#certificado {
    text-align: center;
    padding: 2rem 1rem;
}

#footercontacto ul {
    border-top: none;
    margin: auto;
}

#seccion-contacto{
    background-image: url(imagenes/salpicadura.png);
    background-position: top;
    background-size: contain;
    
}

#contacto-coti {
    margin-top: 3rem;
    padding: 2rem 0rem;
    padding-bottom: 1rem;
    text-align: center;
    color: #661b7a;
    max-width: 350px;
    border-bottom: 3px solid #9aea28;
    padding-bottom: 4rem;
    margin-bottom: 5rem;
    width: 80%;
    
   
}
#contacto-coti h2{
    font-family: 'Oswald', sans-serif ;
    font-weight: 900;
    font-size: 1.5rem;
    margin-bottom: 1rem;
    
}
#contacto-coti p {
    margin-bottom: 0;
   
}

#mailywpp p {
font-size: 1.4rem;
}
#mailywpp {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   
    
}


#mailywpp a {
    color: #661b7a;
    background-color: #9aea28;
    font-weight: 600;
    text-decoration: none;
    border-radius: 5px;
    padding: .3rem 1rem;
    margin: 1rem;
    
    
}
#contacto-coti a:hover{
    color: #ffffff;
}

#iconocasa, #iconoreloj, #iconotel, #iconomail {
    text-align: center;
}
#datos img {
    width:40px ;
    height:40px;
    margin-bottom: .5rem;
}
#datos p {
    padding-bottom: 1rem;
}

#datos {
    padding-bottom: 4rem;
    font-size: 1.3rem;
}

#seccionpinturas {
text-align: center;
color: #661b7a;
margin-top: 2rem;
margin-bottom: 3rem;

}
#seccionpinturas h2 {
    font-size: 2rem;
    
}


#pinturaPolvo img, #pinturaLiquida img {
    max-width: 90%  ;
    max-height:90% ;
    border-radius: 50%;
    margin-top: 2rem;
}

#pinturaPolvo, #pinturaLiquida {
    height: fit-content;
}


#seccionpinturas article h3{
    color: #9aea28;
    margin-top: 1rem;
    font-size: 1.8rem;
}


#seccionpinturas article a {
    text-decoration: none;
}
#textoLiquida, #textoPolvo{
    margin-top: 2rem;
    text-align: center;
    font-size: 1.2rem; 
   
    
    
}

.desaparecer {
    display: none;
}

#textoLiquida ul, #textoPolvo ul{
    list-style: square;
    color: #6c6d6a;
    margin-left: 1.5rem;
    
}
#textoLiquida li, #textoPolvo li{
    text-align: left;
    margin-bottom: .5rem;
}
#textoLiquida h4, #textoPolvo h4{
    text-align: left;
    margin-left: 1rem;
    padding-left: .5rem;
    margin-top: 2rem;
    margin-bottom: 1.3rem;
    border-left: solid 5px #661b7a;
}

#servicioArticle{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content:space-around;
    margin: 0 2rem;
}

#servicioArticle img{
    width: 35%;
    margin: 0;
    
}
#sectionServicios{
    width: 100%;
}
#sectionServicios h2 {
    text-align: center;
    margin: 2rem 0 ;
    color: #661b7a;
    font-size: 40px;
}

#sectionServicios h3{
text-align: center;
padding: 2rem 1rem;
margin: 2rem 2rem;
font-size: 25px;
border-bottom: solid 5px #9aea28;
}

#serviciosEtapas {
    width: 40%;
    text-align: center;
    margin: 0;
    
}

#serviciosEtapas h4{
    font-size: 1.8rem;
   margin: 5rem 0; 
   
}

#serviciosEtapas h4 span{
border-radius: 3px;
padding: 0 .5rem;
color: #9aea28;
}

#articleCabinas {
    background: linear-gradient(to bottom, #ffffff, #d1d0d0, #ffffff);
    width: 100%;
    
   
}
#serviciosCabinas h4 {
    font-size: 30px;
    
}

.col-4 {
    width: 50%;
margin-bottom: 1rem;
margin-top: 1rem;}

.list-group-item.active{
    background-color: #661b7a;
    border-color: #661b7a;
}
#serviciosCabinas h3{
border: none;
width: 90%;
font-size: 1.5em;
margin-top: 4rem;
}
#serviciosCabinas ul {
    margin-top: 1rem;
}


#serviciosCabinas h4{
width: 50%;
margin: 0;
text-align: center;    }

#serviciosCabinas span{
color: #661b7a;
}

#serviciosCabinas ul li{
    text-align: center;
}
#serviciosCabinas{
    display: 
    justify-content: center;
    align-items: center;
    width: 80%;
}
.row{
    flex-direction: column;
    flex-wrap: wrap;
    padding: 2rem 0;
    width: 50%;
    margin: 0;
}
.col-8 {
    margin: 0;
    padding-top: 1.5rem;
    width: 100%; }

.col-4 {
    margin: 0;
    width: 100%;
}
#linea {
    display: flex;
    flex-direction: row;
    align-items: first baseline;
    justify-content:center;
    padding-bottom: 5rem;
}
#linea h4 {
    border-left: #661b7a 28px solid;
    height: 28px;
    
    
}

@media screen and (max-width:170px) {
    * {
        font-size: small;
    }
    #olainvertida {
        font-size: x-large;
    }
    footer ul, footer{
        font-size: larger;
    }
    
    #footer-up {
        font-size: 120%
    }

    #nosotros figure img{
        margin: 0;
    }
    #olainvertida div p {
        font-size: 0;
    }

    #olainvertida img {
        width: 50px;
        height: 50px;
    }
    #olainvertida article {
        padding-left: .5rem;
        padding-right: .5rem;
    }

    
}

@media screen and (min-width: 300px){
   
    h1 {
        width: 110px;
        height: 37px;
        background-image: url(imagenes/logoconnombrechico.png) ;
        margin-top: .5rem;
        
    }
    header {
        padding-bottom: 1rem;
    }
  
   
    #burger {
        background-image: url(imagenes/burgergrande.png);
        width: 26px;
        height: 22px;
        margin-top: .5rem;
        margin-right: 1rem;
    }
   
    #parrafos h2 {
        font-size: 1.2rem;
    }
   
    #presupuesto a {
        font-size: .9rem;
    }

    #ola {
       margin-top: 1.5rem;
       height: 810px;
       background-color: #661b7a;
        
    }
    #banner {
        margin-bottom: 2.5rem;
    }
    #ola h2 {
        font-size: 1.5rem;
        width: 10rem;
        margin-top: 3rem;
        border-right: solid 5px #9aea28;
        padding-right: .5rem;
        text-align: right;
        margin-right: 2rem;
    }

    #años {
        margin-top: 1.5rem;
    }

    #ola h2 span {
        font-size: 1.5rem;
    }

    #ola h3 {
        padding: 2rem 1rem;
        font-size: 1.2rem;
        width: 15rem;
        margin-bottom: 1rem;
    }
    #ola p {
        width: 90px;
        height: 90px;
    }
    #años p {
        background-image: url(imagenes/icono1.90x90.png);
    }
    #pioneros p {
        background-image: url(imagenes/icono2.90x90.png);
    }
    #trabajos p {
        background-image: url(imagenes/icono3.90x90.png);
    }
    
  
  #footer-d, #footer-up {
    width: 90%;
  }
  #olainvertida p {
    font-size: 1.2rem ;
 }

 #olainvertida a {
     font-size: 1rem ;
 }
 #olainvertida div {
    background-image: url(imagenes/olainv600.png);
    height: 180px;
 }
#olainvertida div p {
    font-size: 0;
}
#olainvertida h2 {
    padding-top: 0;
}

#seccion3 h2 {
    font-size: 1.3rem;
}

#seccion3 a {
    font-size: 1rem;
}
#nosotros p {
    padding: 1rem;
}
#nosotros figure img {
    width: 250px;
    height: 250px;
}
}


@media screen and (min-width: 400px){
    h1 {
        width: 196px;
        height: 60px;
        background-image: url(imagenes/logoconnombre.png) ;
        background-repeat: no-repeat;
        background-size: 70%;
    }
    #ola {
        margin-top: 1.5rem;
        height: 820px;
    }

    #presupuesto a {
        font-size: 1.1rem;
    }
    #banner {
        margin-bottom: 4rem;
    }
    #ola h2 {
        width: 20rem;
        margin-top: 5rem;
        margin-bottom: 2rem;
        font-size: 2rem; 
        border-right: solid 5px #9aea28;
        padding-right: .5rem;
        text-align: right;
        margin-right: 2rem;
    }
    #ola h2 span {
        font-size: 2rem;
    }

    #ola h3 {
        font-size: 1.2rem; 
        width: 20rem;
    }

  
    #footer-d {
        border: none;
        text-align: center;
        
    }
   
    #footer-up{
        margin-top: .5rem;
        flex-direction: row;
        align-items: center;
    }
    footer ul {
        border: none;
        border-left: solid 5px #9aea28;
    }

    #direccion {
        margin: 0;
        margin-top: 1.5rem;
    }
    #telefono {
        margin-top: .5rem;
    }

    #iconos div p {
       width: 95px;
       height: 95px;
       background-repeat: no-repeat;
       background-size: cover;
    }
    
    #olainvertida div {
        height: 200px;
    }
    
    #iconosescri {
        width: 60%;
       }

    #iconosescri a{
        padding: 0;
    }

    #escribinos {
        width: 50%;
    }

    footer ul {
        width: 50%;
    }
    #seccion3 h2 {
        font-size: 1.5rem;
    }

    #nosotros figure img {
        border-radius: 50%;
        width: 300px;
        height: 300px;
        margin: 1.5rem .5rem;
    }

    #contacto-coti h2 {
     font-size: 1.8rem;
    }
    #mailywpp {
        width: 90%;
        margin-top: 1.5rem;
    }
    #mailywpp a {
        font-size: 1.3rem;
    }
    #pinturaPolvo img, #pinturaLiquida img {
        max-width: 75%  ;
        max-height:75% ;
      
    }
   #textoPolvo li, #textoLiquida li {
    font-size: 1.5rem;
   }
   #textoPolvo h4, #textoLiquida h4 {
    font-size: 1.7rem;
    text-align: center;
    padding: 0;
    margin-left: 0;
    border-left: 0;
    
   }
   #textoPolvo, #textoLiquida {
    margin-left: 2rem;
    margin-right: 2rem;
    margin-top: 0;
    
   }

   #pinturaPolvo picture h3, #pinturaLiquida picture h3{
    font-size: 2.3rem;
    margin-bottom: 2rem;
    margin-top: 2rem;
   }
   #seccionpinturas h2{
     font-size: 2.5rem;
   }
   #seccionpinturas article {
    justify-content: center;
   }

}

@media screen and (min-width: 576px) {
    
    h1 {
        background-size: 90%; 
     }
   

    #burger {
        background-image: url(imagenes/burgergrande.png);
        width: 26px;
        height: 22px;
        margin-top: 1.4rem;
        margin-right: 1rem;
        
    }
   
    #banner {
        text-align: center;
        margin-bottom: 0;
        padding-right: 1rem;
         
    }

    #ulbotoneraburger {
        font-size: 1.5rem ;
    }
    #button {
        margin-top: .8rem;
        margin-right: 1rem;
        font-size: 1rem;
    }
    
  
    
     #parrafos{
        width: 50%;
        padding: 0;
        margin: 0;
        margin-top: 1rem;
        padding: 2rem .4rem;
     }
     #parrafos h2{
        font-size: 1.3rem;
        margin-bottom: 2rem;
     }

   #contenedor {
    justify-content: center;
    align-items:first baseline
   }


   #presupuesto {
    display: none;
   }

   .boton a {
    font-size: 17px;
   }
  
   #ola {
    background-image: url(imagenes/ola21000x600.png);
    background-position: left;
    height: auto;
    
   }

   #ola h2{
    font-size: 2rem;
    text-align: left;
    width: 15rem;
    margin-left: 0;
    margin-left: 1rem;
    margin-top: 0;
    margin-bottom: 0;  
    border-left: solid 5px #9aea28;
    border-right: none;
   }
   
   #ola h2 span {
    color: #9aea28;
    font-size: 2rem;
   }

   #ola div{
    margin-left: 0;
    margin-left: 2rem;
    display: flex;
    align-items: center;
    padding:   1rem;
    padding-bottom: 1rem;
    margin-top: 2rem; 
   }
   
   #iconos {
    margin-left: 0;
    
    
   }
  
   #ola h3 {
    margin: 0;
    padding: 0;
    padding-left: 1rem;
    width: 60vw;
    font-size: 1.4rem;
    
   }
  
   #presupuestoxl {
    display: flex;
    align-self:flex-end ;
    margin: 0;
    margin-right: calc(25% - 100px) ;
    
   }
   #olainvertida {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
   
   #olainvertida div {
    height: 150px;
    background-position: bottom;
   }
   
  #olainvertida article {
    justify-content: space-between;
    width: 50%;
    padding-bottom: 2.5rem;
  }
  #olainvertida p {
    width: 15rem;
  }
 #olainvertida h2 {
    width: 100%;
    font-size: 2rem;
 }
 
 #olainvertida img {
    width:125px ;
    height: 125px;
 }

 #colores {
    align-items: last baseline;
 }
 #seccion3 h2 {
    font-size: 1.5rem;
 }
 footer {
    display: flex;
   }

   #footer-up {
    font-size: 1.2rem;
    margin: 0;  
    order: 2;
    border-left: solid 5px #9aea28;
    
   }

   #footer-d {
    margin: 0;
    width: 40%; 
    padding: 1rem; 
    order: 1;
    
   }

   #escribinos {
    
    border-right: solid 5px #9aea28;
    border: none;
    width: 50%;  
    

   }

   #escribinos h2 {
    margin: 0;
    font-size: 1.3rem;  
   }

   footer ul {
    border: none;
    width: 50%;
    border-left: solid 5px #9aea28;
   }

  footer li:first-child {
    margin-top: 0;
  }

    footer li:last-child {
        margin-bottom: 0;
    }
    footer ul a {
        font-size: smaller;
    }
   
   #direccion {
    margin-top: 0;
   }

   #seccion3 {
    background-image: url(imagenes/background1000.png);
    background-position: center;
    height: 300px;
}

#seccion3 h2 {
    font-size: 2rem;
}

#seccion3 a {
    font-size: 1.3rem;
}

#iconos div p {
    width:125px ;
    height: 125px;
}
#años p {
    background-image: url(imagenes/icono1.150x150.png);  
}
#pioneros p {
    background-image: url(imagenes/icono2.150x150.png);  
}
#trabajos p {
    background-image: url(imagenes/icono3.150x150.png);  
}
#nosotros figure img{
    width: 300px;
    height: 300px;
    
}
#nosotros figure{
    margin-right: 2rem;
}
#nosotros {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;   
}
#nosotros h2 {
    text-align: left;
    padding-left: 2rem;
}
#nosotros div {
    width: 60%;
}
#nosotros p {
    margin: 0;
    text-align: start;
    padding-left: 2rem;
    font-size: 1.2rem;
}
#carusel p {
    text-align: start;
    font-size: 1.2rem;
}
#carusel h6 {
    font-size: 1.2rem;
}

#carusel img {
    max-width:800px ;
    max-height:500px ;
}
#certificado {
    display: flex;
    align-items: center;
    padding: 4rem 0;
    width: 85%;
}
#certificado div{
    width: 50%;
}

#certificado p{
    width: 70%;
    padding: 0;
    margin: 0;
    font-size: 1.2rem;
}
#certificado div p {
    width: 100%;
    padding: 0;
    margin-bottom: .5rem;
}
#datos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: start ;
}
#datos img {
width:50px ;
height:50px ;
}
#iconocasa {
    width:50% ;
    font-size: 1.2rem;
}
#iconoreloj {
    width:50% ;
    font-size: 1.2rem;
}
#iconotel {
    width:50% ;
    font-size: 1.2rem;
}
#iconomail{
    width:50% ;
    font-size: 1.2rem;
}
#contacto-coti  {
    font-size: 1.2rem;
    max-width: 90%;
}
#mailywpp {
    max-width: 300px;
}

#contacto-coti h2 {
    font-size: 2rem;
}

#pinturaPolvo picture h3, #pinturaLiquida picture h3{
    font-size: 2rem;
    
   }

#seccionpinturas h2{
    font-size: 2.5rem;
  }
  #pinturaPolvo img, #pinturaLiquida img {
    max-width: 65%  ;
    max-height:65% ;}
  
#pinturas {
    display: flex;
    flex-direction: row;}



}


@media screen and (min-width: 700px){

#ola {
    margin-top: 0;
    height: 525px;
}

#presupuestoxl {
    padding-top: 2rem;
    padding-bottom: 1.5rem;
    
}

#ola h3 {
    font-size: 1.2rem;
    width: auto;
    padding: 1rem;

   }

   #iconos{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items:first baseline;
    margin: 0;
    margin-top:4.5rem;
    padding-bottom: 0;
    
}

#iconos div {
    width: 100%;
}

#años, #trabajos, #pioneros{
flex-direction: column;
}

#ola div {
    padding: 0;
    margin: 0;
    
}
#ola h2 {
    width: 20rem;
    font-size: 2rem;
}

   #olainvertida div {
    background-image: url(imagenes/olainv1000.png);
    height: 130px;
    background-position: bottom;
    margin-bottom: 3rem;
   }

   #olainvertida img {
    width: 150px;
    height: 150px;
   }

   #olainvertida p {
    width: 90%;
  }
  #olainvertida h2 {
    margin-top: 3rem;
    font-size: 2rem;
    margin-bottom: 3rem;
  }
  #proceso p{
    width: 70%;
  }

 
  #iconos h3 {
    font-size: 1.3rem;
  }

  #seccion3 {
    flex-direction: row;
    justify-content: space-around;
    padding: 2rem;
    
  }
  #seccion3 a {
    margin: 0;
  }

  #seccion3 h2{
    font-size: 2rem;
    margin: 0;
    
  }
  .mb-5 {
    margin-bottom: 0 !important;
  }
  #carusel {
    margin-top: 2rem;
  }
  #nosotros figure img {
    width:350px ;
    height:350px ;
    margin: 0;
  }
  #carusel h6, #certificado p {
    font-size: 1.3rem;
  }
  #certificado img {
    width: 125px;
    height: auto;
  }

 #seccionnosotros {
    width: 100%;
    margin-top: 3rem;
 }

 #seccionnosotros h2 {
    margin-top: 0;
    font-size: 2rem;
   
 }
 #certificado p {
   width: 90%;
 }

 #contacto-coti {
    max-width: 90%;
 }
 
 #contacto-coti h2 {
    font-size: 2.5rem;
 }
 
 #mailywpp{
    max-width: 400px;
 }

 #mailywpp p {
    font-size: 1.5rem;
 }
 #mailywpp a {
    font-size: 1.2rem;
 }

}
@media screen and (min-width: 900px){

    h1 {
        background-size: 100%;
    }

    #banner button {

        font-size: 1.1rem;
     }

     #burger { display: none;}

     #botonera {
        display: block;
        margin-top: 1.5rem;
        margin-right: 1rem;
        background-color: #9aea28;
        padding: .2rem .8rem;
        border-radius: 1rem;
        margin-bottom: 0;
        
    }
    #botonera a {
        text-decoration: none;
        color: #661b7a;
        padding:  0 .4rem;
        font-weight: 500;
        
    }
    #botonera a:hover {
        color: #ffff;
    }
    #botonera li {
        list-style: none;
        display: inline;
        font-size: 1rem;
        
    }
   
    #presupuestoxl{
        padding-top: 1rem;
        padding-bottom: 3rem;
    }
    #banner {
        margin-bottom: 1rem;
    }

    #presupuestoxl a{
        font-size: 1.2rem;
        
    }
    
    #ola div{
        flex-direction: column;
        margin: 0;
        padding: 0;
        margin: 2rem;
        margin-bottom: 0;
    }

    #ola  h3{
        font-size: 1.5rem;
        width: auto;
        margin: 0;
        padding: 0;
        padding: .5rem;
    }
    
    #iconos{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items:first baseline;
        margin-top: 4rem;
        padding-bottom: 0;
    }

    #iconos div p {
        
        width: 125px;
        height: 125px;
    }


   #años, #trabajos, #pioneros{
    flex-direction: column;
   
   }
   
   #ola {
    margin-top: 0;
    background-image: url(imagenes/ola21000x600.png);
    height: 620px;
   }

   #ola h2 {
    margin-left: 2rem;
    padding-bottom: 0;
    padding-top: 0;
    font-size: 2.3rem;
    width: 15rem;
   
   }

   #ola h2 span {
    border: none;
    font-size: 2.3rem;
   }

  #olainvertida div {
    height: 150px;
    
  }

  #olainvertida h2 {
    font-size: 2.3rem;
  }

  #olainvertida article p {
    font-size: 1.4rem;
  }

  #olainvertida article a {
    font-size: 1.2rem;
  }

  #escribinos h2 {
    font-size: 1.7rem;
  }
  #iconosescri img {
    width: 50px;
    height: 50px;
  }

  #footer-d {
    font-size: larger;
  }

  footer ul {
    font-size: larger;
  }

  #seccion3 a {
    padding: .5rem 3rem;
    margin: 0;
    margin-left: 1rem;
    
  }
  #seccion3 {
    width: 100%;
  }

  #seccion3 h2 {
    margin: 0;
    margin-right: 1rem;
  }
  footer {
   padding-top: .5rem 3rem;
  }
  
  #nosotros p, #carusel p, #carusel h6, #certificado p {
    font-size: 1.3rem;
  }
  #certificado img {
    width:180px ; 
  }

  #nosotros figure img {
    width:400px ;
    height:400px ;
  }
  
  #carusel h6 {
    margin-top: 3rem;
  }
 
#nosotros, #carusel  {
    width: 90%;
    margin: auto;
} 
#carusel {
    margin-top: 2.5rem;
  }

#mailywpp {
    flex-wrap: nowrap;
    max-width: 100%;  
    align-items: center;
    justify-content: space-between;
    width: 100%;
    
    
}  
#contacto-coti{
    width: 800px;
    max-width: 800px;
   
}
#mailywpp p {
width: 50%;
font-size: 1.7rem;

}

#mailywpp a {
    width: 25%;
    font-size: 1.3rem;
    } 
}
#datos img{
    width:70px ;
    height:70px ;
}
#datos p {
    font-size: 1.3rem;
}

#pinturaPolvo picture h3, #pinturaLiquida picture h3 {
    font-size: 2.5rem;
    margin-bottom: 4rem;
}

@media screen and (min-width: 1000px){
    #banner {
        margin-top: 0;
    }
    header, section{
        width: 95%;
    }
    #ola {
        width: 100%;
        background-position: top;
       
    }
    #ola h2 {
        border-left: solid 8px #9aea28;
        padding: 1rem .5rem;
    }

    #ola h3 {
        padding: 1rem 0;
        font-size: 1.6rem;
    }

    #iconos div p {
        width:150px ;
        height: 150px;
    }
    #iconos {
        margin-top: 3rem;
    }
    #años p {
        background-image: url(imagenes/icono1.150x150.png);  
    }
    #pioneros p {
        background-image: url(imagenes/icono2.150x150.png);  
    }
    #trabajos p {
        background-image: url(imagenes/icono3.150x150.png);  
    }

    #presupuestoxl {
        margin-right: calc(30% - 134px) ;
    }
    #presupuestoxl a {
       font-size: 1.3rem;
    }
    
    #olainvertida {
        width: 100%;
    }

    #olainvertida div{
      height: 200px;
    }

    #olainvertida img {
        width: 200px;
        height: 200px;
    }

    #olainvertida article p{
        font-size: 1.8rem;
    }
   
    
    #seccion3 a {
        padding: .5rem 4rem;
        margin: 0;
        font-size: 1.5rem;
        
      }
      #seccion3 {
        width: 100%;
        justify-content: space-around;
      }
    
      #seccion3 h2 {
        margin: 0;
        font-size: 2.3rem;
      }
      #olainvertida h2 {
        font-size: 2.5rem;
        margin-top: 4rem;
    }

    #olainvertida article a {
        font-size: 1.5rem;
    }

    #nosotros p, #carusel p, #carusel h6 {
        font-size: 1.5rem;
      }
     #carusel h6 {
        margin-bottom: 3rem;
     }
     #certificado {
        width: 70%;
     }
     #certificado p{
        width: 80%;
     }
     #botonera li {
        font-size: 1.1rem;
     }
    #seccion-contacto {
        width: 100%;
    }

    #iconocasa, #iconotel, #iconomail, #iconoreloj {
       display: flex;
       align-items: center;
       width: 45%;
       max-width: 500px;
       margin-bottom: 3rem;
    }

    #datos p {
        padding-bottom: 3rem;
        margin: 0;
        width: 80%;
        font-size: 1.5rem;
    }
    #datos {
        padding: 2rem;
        padding-bottom:3rem;
        max-width: 1300px;
    }

}


@media screen and (min-width: 1200px) {

    #banner button {
        font-size: 1.2rem;
        margin-top: .1rem;
        border: 2px solid #661b7a;
     }

     #botonera li {
        font-size: 1.3rem;
        
     }
     #botonera {
       margin-top: 2.5rem;
       
     }

     h1 {
        background-image: url(imagenes/logoxl.png);
        width: 250px;
        height: 83px;
     }
    
   
     #parrafos  {
        margin-top: 2.5rem;
     }
     #parrafos h2 {
        font-size: 1.7rem;
     }
     #parrafos a {
        font-size: 1.3rem;
     }
   

    #presupuestoxl {
        padding-top: 1rem;
        margin-right: calc(30% - 153px) ;
        padding-bottom: 5rem;
    }
    #presupuestoxl a {
       font-size: 1.5rem;
    }

    #iconos div {
        padding-top: 1rem;
        padding-left: 1rem;
        padding-right: 1rem;
            
    }
    #ola h3 {
        font-size: 1.8rem;
        padding: 1rem 0;
        
    }
    #ola h2 {
        font-size: 3rem;
        padding: 1rem .5rem;
        width: 30rem;
    }
    #ola h2 span {
        font-size: 3rem;
    }
    #ola {
        height: 100%;

    }

    #iconos div p {
        width:175px ;
        height: 175px;
    }
   
    #años p {
        background-image: url(imagenes/icono1.175x175.png);  
    }
    #pioneros p {
        background-image: url(imagenes/icono2.175x175.png);  
    }
    #trabajos p {
        background-image: url(imagenes/icono3.175x175.png);  
    }

    #olainvertida div {
        background-image: url(imagenes/olainv2000.png);  
        height: 210px;
    }

    #olainvertida img {
        width:300px ;
        height:300px ;
    }
    #olainvertida h2 {
        font-size: 3rem;
    }

    #nosotros p, #carusel p, #carusel h6  {
        font-size: 1.6rem;
      }

    #certificado img {
        width:180px ; 
      }
    
      #nosotros figure img {
        width:500px ;
        height:500px ;
      }
     #seccionnosotros h2 {
        font-size: 2.5rem;
     }
     #nosotros {
        justify-content: space-around;
     }
     #certificado p {
        font-size: 1.6rem;
        width: 90%;
     }

     #certificado {
        width: 60%;
     }

     

}

    

@media screen and (min-width: 1500px){
     
     #banner {
        margin-top: 0;
     }
    
     #botonera li {
        font-size: 1.5rem;
        
     }
     #parrafos h2 {
        font-size: 2rem;
     }
     #parrafos a {
        font-size: 1.5rem;
     }
     #contenedor{
        height: 40rem;
     }
     
     
     
     #presupuestoxl a{
        font-size: 2.2rem;
        padding: 1rem;
     }
     #presupuestoxl {
        margin-right: calc(25% - 200px);
     }

     #ola h3 {
        font-size: 2rem;
        
     }
     #ola {
        background-image: url(imagenes/ola22000x900.png);
        height: 950px;

    }
    
    #iconos {
        margin-top: 2rem;
        padding-top: 2rem;
        
    }

    #iconos div p {
        width:200px ;
        height: 200px;
    }
   
    #años p {
        background-image: url(imagenes/icono1.200x200.png);  
    }
    #pioneros p {
        background-image: url(imagenes/icono2.200x200.png);  
    }
    #trabajos p {
        background-image: url(imagenes/icono3.200x200.png);  
    }
    
    #olainvertida div{
        height: 290px;
    }

    #iconos {
        margin-top: 3rem;
    }
   
    #iconos h3 {
        font-size: 2.3rem;
    }
    #ola h2 {
        margin-top: 3rem;
        width: 20%;
        font-size: 3.5rem;
    }
    #ola h2 span {
        font-size: 3.5rem;
    }

    #olainvertida h2 {
         font-size: 3.5rem;
    }

    #olainvertida article p {
        font-size: 2rem;
    }
    #olainvertida article a{
        font-size: 1.6rem;
    }

    #seccion3 h2 {
        font-size: 3rem;
    }
    #seccion3 a {
        font-size: 2rem;
    }
    #footer-d {
        font-size: 1.5rem;
    }
    #footer-up h2 {
        font-size: 2.3rem;
    }
    footer ul {
        font-size: 1.8rem;
    }
    #iconosescri img{
        width:65px ;
        height: 65px;
    }
    #nosotros p, #carusel p, #carusel h6, #certificado p {
        font-size: 1.9rem;
      }
    #nosotros {
        justify-content: space-around;
        width: 80%;
    }
    #carusel  {
        margin: auto;
        width: 80%;
    }

    #certificado img {
        width:250px ; 
      }
    
      #nosotros figure img {
        width:550px ;
        height:550px ;
      }
     #seccionnosotros h2 {
        font-size: 3rem;
     }
     #certificado {
        padding: 6rem 0;
        width: 80%;
     }
     #certificado p {
        width: 70%;
        padding-left:2rem ;
     }

     #datos p {
        font-size: 1.7rem;
    }
    #datos img {
        width:85px ;
        height:85px ;
    }
    #mailywpp p {
     font-size:2.2rem ;
     width: 65%;
    }
    #mailywpp a {
        font-size: 1.8rem ;
    }
    #contacto-coti h2 {
        font-size: 3rem ;
        
    }
    #datos {
        max-width: 1500px;
    }

    #contacto-coti {
       width: 1300px; 
       max-width: 1300px;  
    }

}

@media screen and (min-width: 2000px){

    h1 {
        background-image: url(imagenes/logoxxl.png);
        width: 400px;
        height: 133px;
        background-size: 80%;
    }

    #botonera li {
        font-size: 2rem;  
     }
     #botonera {
        margin-top: 3rem;
        
     }

    header, section {
        max-width: 2000px ;
    }
    #banner {
        text-align: center;
    }
    #ola h3 {
        font-size: 2.5rem;
        
     }
   
     #ola h2 {
        width: 20%;
        font-size: 3.5rem;
        
     }
     #ola h2 span{
        font-size: 3.5rem;
        
     }
    
     #presupuestoxl a{
        font-size: 2.2rem;
        padding: 1.2rem;
     }
    
    #ola {
        height: 950px;
    }
    footer {
        max-width: 2000px;
    }

    #olainvertida img {
        width:400px ;
        height:400px ;
    }

   

    #olainvertida article p {
        font-size: 2rem;
    }

    #olainvertida article a {
        font-size: 2rem;
    }

    #olainvertida h2 {
        margin-top: 6rem;
        font-size: 4rem;
    }
    #footer-d p{
        font-size: 2rem;
    }
    footer ul {
        font-size:2rem ;
    }
    #escribinos h2 {
        font-size:3rem;
    }
    #iconosescri img{
        width: 80px;
        height: 80px;
    }
    #seccion3 h2 {
        font-size: 3.3rem;
    }
    #seccion3 a {
        font-size: 2.5rem;
    }
    #olainvertida article p {
        font-size: 2.5rem;
    }
    #ola h2{
        font-size: 4rem;
    }
    #ola h2 span{
        font-size: 4rem;
    }

    #ola div p {
        height: 200px;
    } 

    #olainvertida h2 {
        font-size: 4.5rem;
    }
    #certificado {
        padding: 6rem 0;
        
     }
     #certificado p {
        padding-left: 10rem;
        padding-right:10rem ;
     }
     
}