@import url("style.css");

/*-------------------*/
/*-PALETA DE COLORES-*/
/*-------------------*/
:root {
--bluedark: rgba(10,47,92, 1);
--blue: rgba(0,56,184,1);
--black: rgba(34,34,34, 1);
--violet: rgba(75,0,130, 1);
--gray: rgba(220,220,220, 1);
    }
    /*----------------------------------------*/
    /*------------ESTILOS GENERALES-----------*/
    /*----------------------------------------*/


@media(min-width:320px){
.cuatrocientos-container{
padding: 48px 16px;
position: relative;
}
.cuatrocientos-container h2{
font-size: 24px;
text-align: center;
line-height: 28px;
margin-bottom: 24px;
}
.cuatrocientos{
width: 100%;
height: 0;
padding-bottom: 46.5%;
margin: auto;
margin-bottom: 24px;
}
.cuatrocientos img{
width: 100%;
}


/*---fin de @media---*/
}
@media(min-width:480px){
.cuatrocientos{
width: 80%;
}
/*---fin de @media---*/
}
@media(min-width:540px){

/*---fin de @media---*/
}
@media(min-width:640px){
.cuatrocientos{
width: 50%;
padding-bottom: 25%;
}
/*---fin de @media---*/
}
 @media(min-width:720px){

/*---fin de @media---*/
}
 @media(min-width:800px){


/*---fin de @media---*/
}
@media(min-width:900px){

/*---fin de @media---*/
}
@media(min-width:1024px){

/*---fin de @media---*/
}
@media(min-width:1100px){



/*---fin de @media---*/
}
@media(min-width:1280px){

/*---fin de @media---*/
}
@media(min-width:1360px){

/*---fin de @media---*/
}
@media(min-width:1440px){

/*---fin de @media---*/
}
@media(min-width:1600px){

/*---fin de @media---*/
}
@media(min-width:1920px){


/*---fin de @media---*/
}