*, ::after, ::before {
    box-sizing: inherit;
}
html {
    line-height: 1.15;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
*, body, h1, h2, h3, h4, h5, h6,figure {
    margin: 0;
    padding: 0;
}
body{
	display: block;
	overflow-x: hidden;
	line-height: 1.3;
    font-size: 16px;
    font-weight: 400;
    font-family: 'Poppins', sans-serif;
    color: #fff;
}
p{
	font-weight: 300;
}
img{
	width: 100%;
	max-width: 100%;
	object-fit: contain;
}

header {
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    align-content: center;
    align-items: center;
}
.no-webp header{
	background-image: url(../images/fondo-header-academia.jpg);
}

.webp header{
	background-image: url(../images/fondo-header-academia.webp);
}

.cabezote{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
    width: 90%;
    padding: 1em 0;
}
#logo {
	min-width: 60px;
    width: 7vw;
}
.btn-regreso-ceniflores{
	background-color: #2ba944;
	padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    flex-direction: row;
    display: flex;
    align-items: center;
    gap: 15px;
}
.btn-regreso-ceniflores img{
	min-width: 110px;
	width: 9vw;
}


#ico-academia{
	min-width: 25px;
	width: 4vw;
}
#descripcion {
    width: 90%;
    display: flex;
    flex-direction: column;
    padding: 2em 0;    
}
.columna {
    display: flex;
    flex-direction: column;
    width: 100%;
}
#descripcion h2{
	padding: 0.5em 0;
	color: #fff;
}
.logo-academia {
	min-width: 300px;
    width: 30vw;
}
article p{
	margin-bottom: 20px;
}
#secciones {
    display: flex;
    flex-direction: column;
}
#secciones .columna {
	justify-content: space-between;   
	align-items: center;
}
#videos{
	background-color: #56b4b7;
}
#centro{
	background-color: #013440;
}
#cursos{
	background-color: #a4b52a;
}
#secciones img {
	min-width: 90px;
    width: 5vw;
    margin-bottom: 1.5em;
}
hr {
    height: 1px;
    background: white;
    min-width: 80px;
    margin: 1em 0;
}
.contenedor {
    width: 80%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 3em 0;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}
#secciones a{
		text-decoration: none;
		border-bottom-left-radius: 30px;
	    padding: 10px 40px;
	    border: 1px solid #fff;
	    margin-top: 30px;
	    color: #fff;
	    transition: 300ms;
	}
	#secciones a:hover{
		background-color: #fff;
		color: #013440;
		transition: 300ms;
	}
footer{
	display: flex;
	justify-content: center;
	background-color: #6d23b6;
	width: 100%;
}
footer a{
	color: #fff;
	text-decoration: none;
}
footer .cabezote {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    width: 90%;
    padding: 1em 0;
    align-items: center;
    align-content: center;
    text-align: center;
}
footer .logo-academia{
	min-width: 190px;
	width: 10vw;
}
#redes {
    display: flex;
    gap: 15px;
    padding: 1em 0;
}
.ico-redes{
	background-image: url(../images/sprite-redes-academia.svg);
	background-repeat: no-repeat;
	width: 25px;
    height: 25px;
    background-size: 790%;
}
#instagram{
	background-position-x: 24%;
}
#twitter{
	background-position-x: 49%;
}
#linkedin{
	background-position-x: 98%;
}
#youtube{
	background-position-x: 73%;
}
/*Estilo Videos*/
/*.pagina-videos header{
	background-image: url(../images/fondo-header-videos.jpg);
}*/

.contenedor-btn-inicio{
	display: flex;
	justify-content: center;
}

.btn-inicio, .boton-canal{
	padding: 1rem!important;
	margin: 2rem;
    border-top-right-radius: 30%;
    border-bottom-left-radius: 30%;
    flex-direction: row;
    display: flex;
    align-items: center;
    gap: 15px;
}

.btn-inicio:hover{
	background-color: orangered;
	color: #fff;
	transition: 400ms;
}

.no-webp .header-videos{
	background-image: url(../images/fondo-header-videos.jpg);
}

.webp .header-videos{
	background-image: url(../images/fondo-header-videos.webp);
}

.pagina-videos #secciones{
	justify-content: center;
	    align-items: center;
	    flex-direction: column;
	    width: 100%;
	    height: auto;
}
.pagina-videos .contenedor{
	flex-direction: column;
	padding: 0;
}
.ultimo{
	justify-content: center;
}
.video-academia {
    width: 45%;
    display: flex;
    height: auto;
    flex-direction: column;
    margin-bottom: 2em;
}
.video-academia-lista {
    width: 60%;
    display: flex;
    height: auto;
    flex-direction: column;
    margin-bottom: 2em;
    height: 28vw;
}
.video-academia iframe{
	height: 44vw;
}
.pagina-videos h3{
	color: #013440;
}

/*Escritorio grande*/
@media (min-width: 1100px) {
	.cabezote{
		width: 80%;
		padding: 1vw 0;
	}
	.btn-regreso-ceniflores{
		font-size: 1.2vw;
		gap: 1vw;
		padding-top: 1em;
	    padding-left: 1.5em;
	    padding-right: 1.5em;
	    padding-bottom: 1em;
	    border-top-right-radius: 1em;
	    border-bottom-left-radius: 1em;
	    color: #fff;
	}
	#descripcion{
		flex-direction: row;
		justify-content: space-between;
    	align-items: center;
    	padding: 4vw 0;
    	width: 80%;
	}
	#descripcion .columna {
	    display: flex;
	    flex-direction: column;
	    width: 50%;
	}
	#descripcion h2{
		font-size: 1.5vw;
   		max-width: 28vw;
   		padding: 1vw 0;
	}
	article p{
		font-size: 1.3vw;
		margin-bottom: 1vw;
	}
	#secciones {
	    display: flex;
	    flex-direction: row;
	}
	#secciones .columna {
	   display: flex;
	    flex-direction: column;
	    width: 33.33333%;
	}
	#secciones h3{
		font-size: 1.3vw;
   		padding: 1vw 0;
	}
	.contenedor {
	    padding: 4vw 0;
	}
	#secciones a{
		font-size: 1rem;
		border-bottom-left-radius: 2em;
	    padding: 1vw 3vw;
	    border: 2px solid #fff;
	}
	footer .cabezote {
	    display: flex;
	    justify-content: space-between;
	    flex-direction: row;
	    width: 90%;
	    padding: 1vw 0;
	}
	footer a{
		font-size: 1vw;
	}
	.ico-redes{
		width: 2vw;
	    height: 2vw;
	}
	#redes {
		gap: 1vw;
	}
	.video-academia {
	    width: 45%;
	    height: 24vw;
	}
	.pagina-videos .contenedor{
		flex-direction: row;
	}
}
@media (max-width: 1099px){
	.d-flex{
		display: block!important;
	}
	.categorias{
		align-items: center!important;
		width: 100%;
		padding-bottom: 2rem;
	}
	#lista-menu {
	    width: 50%!important;
	    display: flex!important;
	    flex-direction: column!important;
	    align-items: center!important;
	    align-content: center!important;
	}
	.contenedor-principal-videos{
		width: 100%;
	}
	.video-academia-lista{
		height: 36vw;
	}
}