@import url("header.css");
@import url("contacto.css");
@import url("oscuro.css");
@import url("servicios.css");
@import url("somos.css");
@import url("home.css");
@import url("footer.css");

@font-face {
    font-family: ShantellSans;
    src: url(../fuentes/ShantellSans-Light.ttf);
  }
  @font-face {
    font-family: NotoSans;
    src: url(../fuentes/NotoSans-Medium.ttf);
  }
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    scroll-behavior: smooth;
}
html{
    font-size: 16px;
}
body{
	margin-left: 60px;
	margin-top:80px;
	transition: 0.5s ease all;
	-webkit-transition: 0.5s ease all;
	-moz-transition: 0.5s ease all;
	-ms-transition: 0.5s ease all;
	-o-transition: 0.5s ease all;
}
/*Variables para javascript*/
.body-move{
	margin-left:250px;
}
.animar{
	width:250px;
}
.contenedor, .section, .footer{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.titulo-alerta{
    color: #F23095;
    font-family: ShantellSans;
}
.botonconfirmar_alerta{
    font-family: ShantellSans;
}
/*Menu modo oscuro*/
@media(max-width: 1199px){
    .section__content-apraxia{
        padding: 1rem;
    }
    form{
        width: 100%;
        align-items: start;
        flex-direction: row;
    }
    form input, textarea{
        width: 100%;
    }
}
@media(max-width: 800px){
    html{
        font-size: 12px;
    }
    body{
		margin-left:0px;
	}
	nav{
		transform:translateX(-100px);
		-webkit-transform:translateX(-100px);
		-moz-transform:translateX(-100px);
		-ms-transform:translateX(-100px);
		-o-transform:translateX(-100px);
}
    /*Variables de javascript*/
    .animar{
        width:60px;
        transform: translateX(0px);
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        -o-transform: translateX(0px);
}
    .body-move{
        transition: 0.5s ease all;
        margin-left: 60px;
        -webkit-transition: 0.5s ease all;
        -moz-transition: 0.5s ease all;
        -ms-transition: 0.5s ease all;
        -o-transition: 0.5s ease all;
}
    .section__content-apraxia{
        padding: 1rem;
    }
    .section__content-apraxia, .content-apraxia__parrafo, .content-apraxia__doctor,
    .content-ideatoria__imagen, .content-ideatoria__content-lista, .content-lista__parrafo, .parrafo__boton{
        width: 100%;
    }
    .nav__titulo{
        display: none;
    }
    .section__content-cardapraxia, .eventos-publicidad{
        grid-template-columns: repeat(1,1fr);
    }
    .spot-video{
        width: 100%;
    }
    .spot-stand{
        width: 100%;
    }
    .section__quienes-somos{
        grid-template-columns: repeat(1,1fr);
    }
    .quienes-somos__card:nth-child(3){
        transform: translateX(0%);
    }
    .quienes-somos__card{
        padding: 1rem;
        text-align: center;
    }
    .container__directa, .container__imageninicial{
        width: 100%;
    }
    .content-juego__descarga h2{
        font-size: 2rem;
    }
    .content-juego__descarga p{
        font-size: 1rem;
 
    }
    .cohete{
        transform: rotate(290deg) translate(10%);
    }
    .swiper {
        width: 100%;
        height: 600px;
    }
    .content-formulario__animacion, .content-formulario__contacto{
        width: 100%;
    }
    form{
        width: 100%;
        align-items: start;
        flex-direction: row;
    }
    form input, textarea{
        width: 100%;
    }
    form h2{
        width: 100%;
        text-align: center;
        font-size: 2rem;
    }
    .content-nombres{
        width: 100%;
        justify-content: center;
    }
    .content-redes-sociales{
        width: 100%;
    }

}