/* START BANNER */
.banner{
	width:													100%;
	height: 												auto;
	margin-bottom: 											120px;
	padding: 												170px 0;
	position:												relative;
}

.banner .imagenBanner{
	width: 													100%;
	height: 												auto;
	object-fit: 											cover;
	object-position: 										center center;
	padding-right: 											50px;
}

.banner .contenedorTitulos{
	padding: 												20px 0;
	background-color: 										#FFD000;
	font-weight: 											500;
	display: 												flex;
	flex-flow: 												row nowrap;
	justify-content: 										space-between;
}

.banner .contenedorTitulos > *{
	width: 													90px;
	text-align: 											center;
}

.banner .semaforosCiudad{
	padding: 												10px 0;
	display: 												flex;
	flex-flow: 												row nowrap;
	justify-content: 										space-between;
}

.banner .semaforosCiudad > *{
	width: 													90px;
	text-align: 											center;
}

.banner .semaforosCiudad span > img{
	width: 													23px;
	height: 												23px;
	object-fit: 											contain;
	object-position: 										center center;
}

.banner .texturaBanner{
	width: 													60%;
	height: 												100%;
	object-fit: 											cover;
	object-position: 										right bottom;
	position: 												absolute;
	top: 													0;
	left: 													0;
	z-index: 												-1;
}
/* END BANNER */

/* START INFORMATE MAS */
.informateMas{
	width: 													100%;
	height: 												auto;
	position: 												relative;
	margin-bottom: 											120px;
	padding-bottom: 										60px;
}

.informateMas .contenedorVideo{
	width: 													100%;
	height: 												570px;
}

.informateMas .contenedorVideo iframe, .informateMas .contenedorVideo .slick-list,  .informateMas .contenedorVideo .slick-track{
	width: 													100%;
	height: 												100%;
}

.informateMas .bgYellow{
	background-color: 										#FFD000;
	width: 													75%;
	height: 												70%;
	position: 												absolute;
	bottom: 												0;
	z-index: 												-1;
}

.informateMas .slick-prev:before{
	color: 													#FFFFFF;
} 

.informateMas .slick-next:before{
	color: 													#FFD000;
}

.informateMas .slick-dots{
	width: 													fit-content;
	left: 													0;
	right: 													0;
	margin: 												0 auto;
}

.informateMas .slick-dots li,
.informateMas .slick-dots li button,
.informateMas .slick-dots li button::before {
  	height: 												5px;
  	width: 										    		30px;
}

.informateMas .slick-dots li button {
  	padding: 												0;
}

.informateMas .slick-dots li button::before {
  	content: 												"";
  	background: 											#d9d9d9;
  	opacity: 												1;
}

.informateMas .slick-dots li.slick-active button::before {
  	background-color: 								 		#FFFFFF;
}
/* END INFORMATE MAS */

/* START COMUNICADO */
.comunicado{
	width: 													100%;
	height: 												auto;
	margin-bottom: 											120px;
}
/* END COMUNICADO */

/* START MENSAJE DEL RECTOR */
.mensajeRector{
	width: 													100%;
	height: 												auto;
	margin-bottom: 											120px;
}

.mensajeRector .imagenRector{
	width: 													100%;
	height: 												650px;
	position: 												relative;
	margin-bottom: 											90px;
}

.mensajeRector .imagenRector > span{
	display: 												block;
	width: 													80%;
	margin: 												0 auto;
	background-color: 										#FFD000;
	font-size: 												23px;
	text-align: 											center;
	padding: 												20px;
	position: 												absolute;
	left: 													0;
	right: 													0;
	top: 													90%;
}
/* END MENSAJE DEL RECTOR */

/* START CONOCE LOS COMUNICADOS */
.conoce{
	width: 													100%;
	height: 												auto;
	margin-bottom: 											120px;
}
/* END CONOCE LOS COMUNICADOS */

/* START DESCARGA Y CONOCE LAS GUIAS */
.descarga{
	width: 													100%;
	height: 												auto;
	margin-bottom: 											120px;
}

.descarga .contenedorProtocolo{
	display: 												flex !important;
	justify-content: 										space-between;
	padding: 												20px 20px 20px 40px;
	background-color: 										#F6F6F6;
	border-radius: 											20px;
	align-items: 											center;
	margin-bottom: 											10px;
}

.descarga .contenedorProtocolo .btn-bg-yellow{
	width: 													fit-content;
	padding-right: 											50px;
}

.descarga .contenedorProtocolo .btn-bg-yellow::after{
	content: 												"";
	width: 													21px;
	height: 												21px;
	background-image: 										url("../../images/right-arrow-black.svg");
	background-size: 										20px;
	background-position: 									center center;
	background-repeat: 										no-repeat;
	position: 												absolute;
	right: 													15px;
	top: 													0;
	bottom: 												0;
	margin: 												auto 0;
	transform: 												rotate(90deg);
}

.descarga .slick-prev:before{
	color: 													#FFD000;
} 

.descarga .slick-next:before{
	color: 													#FFD000;
}

.descarga .slick-dots{
	width: 													fit-content;
	left: 													0;
	right: 													0;
	margin: 												0 auto;
}

.descarga .slick-dots li,
.descarga .slick-dots li button,
.descarga .slick-dots li button::before {
  	height: 												5px;
  	width: 										    		30px;
}

.descarga .slick-dots li button {
  	padding: 												0;
}

.descarga .slick-dots li button::before {
  	content: 												"";
  	background: 											#d9d9d9;
  	opacity: 												1;
}

.descarga .slick-dots li.slick-active button::before {
  	background-color: 								 		#FFD000;
}
/* END DESCARGA Y CONOCE LAS GUIAS */

/* START RECOMENDACIONES */
.recomendaciones{
	width: 													100%;
	height: 												auto;
	margin-bottom: 											120px;
}

.recomendaciones .btnTabs{
	flex: 													1 0 0;
	border: 												unset;
	background-color: 										#D9D9D9;
	font-weight: 											600;
	font-size: 												16px;
	padding: 												25px 15px;
	text-align: 											center;
}

.recomendaciones .btnTabs.active{
	background-color:  										#FFD000;
}

.recomendaciones .btnTabs:first-of-type{
	border-radius: 											15px 0 0 0;
}

.recomendaciones .btnTabs:last-of-type{
	border-radius: 											0 15px 0 0;
}

.recomendaciones #nav-tabContent{
	padding: 												50px;
	background-color: 										#F9F9F9;
}

.recomendaciones .wysiwyg-content ul{
	margin-top: 											15px;
	font-size: 												23px;
}

.recomendaciones .wysiwyg-content ul li{
	margin-bottom: 											20px;
}
/* END RECOMENDACIONES */

/* START HECHOS CETYS */
.hechos{
	width: 													100%;
	height: 												auto;
	margin-bottom: 											120px;
}

.hechos .principal > nav{
	flex: 													0 0 21%;
}

.hechos #nav-tabPrincipal{
	flex-flow: 												column nowrap;
	gap: 													20px;
	padding: 												40px 0;
}

.hechos .btnTabsPrincipal{
	background-color: 										#EDEDED;
	border-radius: 											20px;
	padding: 												20px 15px;
	margin: 												0 15px;
	font-size: 												23px;
	font-weight: 											600;
	border: 												unset;
	transition: 											margin 0.3s ease;
	display: 												flex;
	gap: 													20px;
	align-items: 											center;
	text-align: 											start;
}

.hechos .btnTabsPrincipal.active{
	background-color: 										#FFD000;
	border-radius: 											20px 0 0 20px;
	margin-right: 											0;
}

.hechos .btnTabsPrincipal > img{
	width: 													65px;
	height: 												70px;
	object-fit: 											contain;
	object-position: 										center center;
}

.hechos #nav-tabContentPrincipal{
	width: 													79%;
	background-color: 										#F6F6F6;
	border-radius: 											20px 0 0 20px;
}

.hechos #nav-tabContentPrincipal > .tab-pane{
	padding: 												60px 30px 65px 40px;
	height: 												100%;
}

.hechos #nav-tabContentPrincipal > .tab-pane.active{
	display: 												flex;
	flex-direction: 										column;
}

.hechos .secundario{
	position: 												relative;
	flex: 													1 0 0;
}

.hechos .secundario > nav{
	/* flex: 												0 0 30%; */
	width: 													31.5%;
	height: 												100%;
	position: 												absolute;
	right: 													0;
}

.hechos #nav-tabSecundaria{
	height: 												100%;
	flex-flow: 												column nowrap;
	gap: 													5px;
	overflow-y: 											auto;
	padding-left: 											25px;
}

.hechos .btnTabsSecundaria{
	background-color: 										#EDEDED;
	padding: 												30px;
	font-size: 												20px;
	font-weight: 											700;
	border: 												unset;
	position: 												relative;
	text-align: 											center;
	color: 													#000000;
}

.hechos .btnTabsSecundaria.active{
	background-color: 										#FFFFFF;
}

.hechos .btnTabsSecundaria.active::before{
	content: 												"";
	width: 													50px;
	height: 												50px;
	background-color: 										#FFD000;
	background-image: 										url("../../images/arrowDown.svg");
	background-position: 									center center;
	background-repeat: 										no-repeat;
	background-size: 										17px 13px;
	position: 												absolute;
	top: 													0;
	bottom: 												0;
	margin: 												auto 0;
	left: 													-25px;
	transform: 												rotate(90deg);

}

.hechos #nav-tabContentSecundaria{
	width: 													70%;
	margin-bottom: 											50px;
}

.hechos #nav-tabContentSecundaria > .tab-pane{
	background-color: 										#FFFFFF;
	padding: 												65px 90px 130px 85px;
}

.hechos #nav-tabSecundaria::-webkit-scrollbar {
	width: 													8px;
}

.hechos #nav-tabSecundaria::-webkit-scrollbar-track {
	background: 											#D9D9D9;
	border-radius: 											12px;
}

.hechos #nav-tabSecundaria::-webkit-scrollbar-thumb {
	background: 											#FFD000;
	border-radius: 											12px;
}
/* END HECHOS CETYS */

/* START NOTAS DE REGRESO */
.notas{
	width: 													100%;
	height: 												auto;
}

.notas .contenedorNota{
	display: 												flex;
	flex-flow: 												column nowrap;
	justify-content: 										end;
	gap: 													10px;
	color: 													#FFFFFF;
	height: 												380px;
	padding: 												0 30px 30px 30px;
	margin: 												0 10px;
}

.notas .contenedorNota > span{
	display: 												block;
	font-style: 											italic;
}

.notas .contenedorLeerMasPrincipal{
	margin-top: 											20px;
	margin-left: 											auto;
	display: 												flex;
	align-items: 											center;
	gap: 													10px;
}

.notas .contenedorLeerMasPrincipal > a{
	display: 												block;
	text-decoration: 										none;
	color: 													#000000;
	padding-bottom: 										5px;
	border-bottom: 											1px solid #000000;
	font-weight: 											600;
	font-size: 												23px;
}

.notas .contenedorLeerMasPrincipal > a:hover{
	color: 													#FFD000;
	border-bottom: 											1px solid #FFD000;
}

.notas .contenedorLeerMas{
	margin-top: 											20px;
	margin-left: 											auto;
	display: 												flex;
	align-items: 											center;
	gap: 													10px;
}

.notas .contenedorLeerMas > a{
	display: 												block;
	text-decoration: 										none;
	color: 													#FFFFFF;
	padding-bottom: 										5px;
	border-bottom: 											1px solid #FFFFFF;
}

.notas .contenedorLeerMas > a:hover{
	color: 													#000000;
	border-bottom: 											1px solid #000000;
}

.notas .slick-prev:before{
	color: 													#FFD000;
} 

.notas .slick-next:before{
	color: 													#FFD000;
}

.notas .slick-dots{
	width: 													fit-content;
	left: 													0;
	right: 													0;
	margin: 												0 auto;
}

.notas .slick-dots li,
.notas .slick-dots li button,
.notas .slick-dots li button::before {
  	height: 												5px;
  	width: 										    		30px;
}

.notas .slick-dots li button {
  	padding: 												0;
}

.notas .slick-dots li button::before {
  	content: 												"";
  	background: 											#d9d9d9;
  	opacity: 												1;
}

.notas .slick-dots li.slick-active button::before {
  	background-color: 								 		#FFD000;
}
/* END NOTAS DE REGRESO */

@media (max-width: 992px){
	/* START BANNER */
	.banner{
		margin-bottom: 											80px;
		padding: 												0;
	}
	
	.banner .imagenBanner{
		padding-right: 											0;
		margin-top: 											70px;
		margin-bottom: 											105px;
	}

	.banner .tituloBanner{
		font-size: 												32px;
		text-align: 											center;
	}
	
	.banner .texturaBannerMovil{
		width: 													100%;
		height: 												45%;
		object-fit: 											cover;
		object-position: 										center bottom;
		position: 												absolute;
		top: 													0;
		z-index: 												-1;
	}

	.banner .row{
		gap: 													50px;
	}
	/* END BANNER */

	/* START INFORMATE MAS */
	.informateMas{
		margin-bottom: 											80px;
		padding-bottom: 										30px;
	}
	
	.informateMas .contenedorVideo{
		height: 												300px;
	}
	/* END INFORMATE MAS */

	/* START COMUNICADO SEGURO */
	.comunicado{
		margin-bottom: 											80px;
	}
	/* END COMUNICADO SEGURO */

	/* START MENSAJE DEL RECTOR */
	.mensajeRector{
		margin-bottom: 										30px;
		text-align: 										center;
	}
	
	.mensajeRector .imagenRector{
		height: 											400px;
	}
	
	.mensajeRector .imagenRector > span{
		width: 												120%;
		font-size: 											16px;
		top: 												90%;
		margin-left: 										50%;
		transform: 											translateX(-50%);
	}
	/* END MENSAJE DEL RECTOR */

	/* START CONOCE LOS COMUNICADOS */
	.conoce{
		margin-bottom: 											80px;
	}
	/* END CONOCE LOS COMUNICADOS */

	/* START DESCARGA Y CONOCE LAS GUIAS */
	.descarga{
		margin-bottom: 											80px;
	}
	
	.descarga .contenedorProtocolo{
		flex-direction: 										column;
		gap: 													20px;
		padding: 												25px 50px;
		border-radius: 											10px;
	}
	
	.descarga .contenedorProtocolo > p{
		font-size: 												23px;
	}
	/* END DESCARGA Y CONOCE LAS GUIAS */

	/* START RECOMENDACIONES */
	.recomendaciones{
		margin-bottom: 											80px;
	}

	.recomendaciones .accordion-item{
		border: 												unset;
		margin-bottom: 											10px;
	}

	.recomendaciones .accordion-button{
		padding:  												30px 60px 30px 30px;
		background-color: 										#D9D9D9;
		font-size: 												23px;
		font-weight: 											600;
		border-radius: 											10px;
	}

	.recomendaciones .accordion-button::after{
		width: 													17px;
		height: 												13px;
		background-image: 										url("../../images/arrowDown.svg");
		background-position: 									center center;
		background-repeat: 										no-repeat;
		background-size: 										17px 13px;
		position: 												absolute;
		top: 													0;
		bottom: 												0;
		margin: 												auto 0;
		right: 													30px;
	}

	.recomendaciones .accordion-button:not(.collapsed){
		background-color: 										#FFD000;
		color: 													#000000;
		border-radius: 											10px 10px 0 0;
	}

	.recomendaciones .accordion-body{
		background-color: 										#F9F9F9;
	}

	.recomendaciones .wysiwyg-content > h2{
		font-size: 												23px;
		text-align: 											center;
		margin-top: 											10px;
	}

	.recomendaciones .wysiwyg-content ul{
		margin-top: 											20px;
		font-size: 												16px;
	}
	
	.recomendaciones .wysiwyg-content ul li{
		margin-bottom: 											10px;
	}
	/* END RECOMENDACIONES */

	/* START HECHOS CETYS */
	.hechos{
		margin-bottom: 										80px;
	}
	
	.hechos #nav-tabPrincipal{
		flex-flow: 											row nowrap;
		gap: 												5px;
		padding: 											0;
	}
	
	.hechos .btnTabsPrincipal{
		border-radius: 										10px;
		padding: 											10px;
		margin: 											0 0 10px 0;
		flex:  												1 0 0;
	}
	
	.hechos .btnTabsPrincipal.active{
		border-radius: 										10px 10px 0 0;
		margin-bottom: 										0;
	}
	
	.hechos .btnTabsPrincipal > img{
		width: 												100%;
		height: 											auto;
		padding: 											20px;
	}

	.hechos .btnTabsPrincipal > span{
		display: 											none;
	}
	
	.hechos #nav-tabContentPrincipal{
		width: 												100%;
		border-radius: 										0;
	}
	
	.hechos #nav-tabContentPrincipal > .tab-pane{
		padding: 											30px 0 30px 0;
	}

	.hechos .btnsMovil{
		height: 											420px;
		display: 											flex;
		flex-flow: 											column nowrap;
		gap: 												5px;
		overflow-y: 										auto;
	}

	.hechos .btnsMovil::-webkit-scrollbar {
		width: 													8px;
	}
	
	.hechos .btnsMovil::-webkit-scrollbar-track {
		background: 											#D9D9D9;
		border-radius: 											12px;
	}
	
	.hechos .btnsMovil::-webkit-scrollbar-thumb {
		background: 											#FFD000;
		border-radius: 											12px;
	}

	.hechos  .modal-content{
		background-color: 										transparent;
		border: 												unset;
	}

	.hechos .modal-header{
		border: 												unset;
		position: 												relative;
	}

	.hechos .modal-body{
		background-color: 										#FFFFFF;
		padding: 												70px	 50px 80px;
	}

	.hechos .btn-closeModal {
		position: 												absolute;
		width: 													40px;
		height: 												40px;
		background-color:										#FFD000;
		font-weight: 											700;
		font-size: 												25px;
		left: 													0;
		right: 													0;
		margin: 												0 auto;
		bottom: 												-20px;
		z-index: 												1;
		border: 												unset;
	}

	.hechos .modal-content .wysiwyg-content ul{
		margin-top: 											12px;
	}
	
	.hechos .modal-content .wysiwyg-content ul li{
		margin-bottom: 											20px;
	}
	/* END HECHOS CETYS */

	/* START NOTAS DE REGRESO */
	.notas{
		margin-bottom: 										60px;
		position: 											relative;
	}

	.notas .contenedorNota{
		gap: 												5px;
		height: 											310px;
		padding: 											0 15px 20px 15px;
		margin: 											0;
		align-items: 										start;
	}

	.notas .contenedorLeerMasPrincipal{
		width: 												fit-content;
		margin:												0;
		position: 											absolute;
		top: 												105%;
		left: 												0;
		right: 												0;
		margin: 											0 auto;
	}

	.notas .contenedorLeerMas{
		margin:												15px 0 0 auto;
	}
	/* END NOTAS DE REGRESO */
}