*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    --color-gris: #f2f2f5;
    --color-celeste:#3376bc;  /*#007aff;    #007DF4*/
    --color-negro:#202221;
   /* --color-gris:#565656;*/
    --color-gris-oscuro:#565656;
}
  
body{
    font-family: 'Baloo Da 2', cursive;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.lineal{
    display: flex;
    flex-wrap: wrap;
    margin: auto;
    justify-content: space-between;
}

.vertical{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    text-align: center;
    margin: auto;
}

.container{
    width: 100%;
    max-width: 1100px;
    display: flex;
    flex-direction: column;
    margin: auto;
}

.container2{
    width: 100%;
}

.box{
    height: 90px;
}

.menu-opciones{
    display: none;
}

.menu-opciones-det{
    display: none;
}

/* ----------------------------------------------- */


/* INICIO - HEADER */

header{
    width: 100%;
    height: 130px;
    padding-top: 5px;
    margin-bottom: 10px;
    margin-bottom: 25px;
}

/* FIN - HEADER */


.division{
    height: 50px;
}


/*  UNO */ 
.container .sectionx1{
    max-width: 100%;
    /*width: 1200px;*/
}

.container .unico{
    width: 100%;
    max-width: 100%;
    padding: 10px;

}




.container .unico img{
    max-width: 100%;
    margin: auto;
}



/* DOS PARTES */
.container .sectionx2{
    max-width: 100%;
    /*width: 1200px;*/
}

.container .media{
    /*width: 600px;*/
    width: 50%;

    max-width: 100%;
    padding: 5px;
    text-align: center;

}

.container .media .malla{
    max-width: 100%;
    width: 100%;
    margin: auto;
    padding: 5px;
    
}

.container .media .malla img{
    max-width: 100%;
    margin: auto;
}


.container .media .malla2{
    max-width: 100%;
    width: 33%;
    margin: auto;
    padding: 5px;
}


.container .media .malla2 img{
    max-width: 100%;
    margin: auto;
}


.container .media .malla3{
    max-width: 100%;
    width: 100%;
    margin: auto;
    margin: 10px;

}

.container .media .malla3 img{
    max-width: 100%;
    width: 98%;
    margin: auto;
}


.container .media .info{
    text-align: left !important;
}




/*- una imagen -*/
.container .media .imagen-uno{
    
    width: 100%;
    margin: auto;
    padding: 5px;
    
}

.container .media .imagen-uno img{
    width: 100%;
    margin: auto;
    
}


/* TERCIA  */

.container .sectionx3{
    max-width: 100%;
    /*width: 1200px;*/
  
}

.container .tercia{
    width: 33%;
    /*width: 295px;*/
    max-width: 100%;
    padding: 10px;
}






/* CUATRO PARTES */
.container .sectionx4{
    max-width: 100%;
    /*width: 1200px;*/
  
}

.container .cuarta{
    width: 25%;
    /*width: 295px;*/
    max-width: 100%;
    padding: 10px;
}

.container .cuarta img{
    max-width: 100%;
    margin: auto;
    
}

/* ----------------------------------*/ 



/* ----------------------------------*/ 

/*

                                                .formulario{
                                                    width: 100%;
                                                    max-width: 100%;
                                                    margin: auto;
                                                    padding-left: 20px;
                                                    padding-right: 20px;
                                                }


*/

.row-form{
    padding: 10px 0px 10px 0px;
}

.box-silver{
    width: 100%;
    max-width: 100%;
    margin: auto;
    justify-content: center;
    background-color: var(--color-gris);
    margin-top: 50px;
}

.box-silver .box-details{
    width: 80%;
    max-width: 100%;
}


/* ----------------------------------*/ 

footer{
    background-color: var(--color-gris);
}




/* INICIO BTN WSP  */

.wsp{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-wsp{
	margin-top:16px;
}

/* FIN BTN WSP */




@media all and (max-width:992px){
    .container .cuarta{
        max-width: 50%;
        width: 95%;
        margin: auto;
    }

    .container .logo{
        max-width: 100%;
        width: 100%;
    }
    
    .menu-rs{
        display: none;
    }
q
}


@media all and (max-width:600px){



    .swiper-image-banner1 {
        height: 450px;
        content: url(../static/banners/banners1-movil.png);
    }

    .swiper-image-banner2 {
        height: 450px;
        content: url(../static/banners/banners2-movil.png);
    }

    .swiper-image-banner3 {
        height: 450px;
        content: url(../static/banners/banners3-movil.png);
    }

    .swiper-image-banner4 {
        height: 450px;
        content: url(../static/banners/banners4-movil.png);
    }

    .swiper-image-banner5 {
        height: 450px;
        content: url(../static/banners/banners5-movil.png);
    }

    .swiper-image-banner6 {
        height: 450px;
        content: url(../static/banners/banners6-movil.png);
    }
    




    .container {
        width: 100%;
    }

    .container .media {
        max-width: 100%;
        width: 95%;
        margin: auto;
    }

    .container .tercia {
        max-width: 100%;
        width: 95%;
        margin: auto;
    }


    .container .cuarta{
        max-width: 100%;
        width: 95%;
        margin: auto;
    }

    .container .malla{
        margin: auto;
    }


   

    .container2{
        display: none;
    }

    .menu-rs{
        display: none;
    }

    .box{
        height: 100%;
    }

    .container .logo{
        margin-top: 20px;
    }

    .container .logo i{
        padding-top: 18px;
        font-size: 50px;
        font-weight: bold;
        color: var(--color-gris);
        
    }

    .logo img{
        width: 80%;
        margin: auto;
    }
 
    .menu-opciones{
        display: block;
        justify-content: center;
        padding-top: 10px;
        font-size: 18px;
    }

    .menu-movil{
        padding-top: 100px;
    }

    .menu-movil li{
        padding-top: 10px;
        padding-bottom: 10px;
        
    }

    .menu-movil i{
        font-size: 30px;
        
    }
    
    .menu-opciones-det{
        padding-top: 40px;
        background: rgba(253, 247, 247, 0.9);
        
        height: 100%;
        width: 100%;
        position: absolute;

        z-index: 1;
        -webkit-user-select: none;
        user-select: none;

    }

    .menu-opciones-det a{

        font-size: 30px;
        font-weight: bold;
        color: var(--color-celeste);
        text-decoration: none;
        transition: color 0.3s ease;
    }
 
}