/*------------------------------------------------------------------
Mangú Theme
-------------------------------------------------------------------*/
.content-layer_ocultar{
/*	opacity: 0; */
}

.cont_botonera_mab_extra{
	position:absolute;
	width:100%;
	text-align:center;
	bottom:67px;
	display: none;
}

.contenedor_circulos_arriba{
	margin-top:30px;
	width:100%;

}
.contenedor_circulos_arriba img{
	width:100%;
	height:auto;
}
.contenedor_circulos_abajo{
	margin-bottom:50px;
	width:100%;
}
.contenedor_circulos_abajo img{
	width:100%;
	height:auto;
}

.contenedor_mab{
	/*
	padding-top:30px;
	padding-bottom:30px;
*/
padding:40px;
max-width:620px;
margin:auto;


}

.botonera_mab{
	position: absolute;
	bottom:15px;
	width:100%;

}


.texto_mab{
margin: 0 0 15px 0 !important;
font-size: 22px !important;
color: #FFF !important;
line-height: 28px !important;
padding: 0px !important;
letter-spacing: -0.5px !important;
text-rendering: optimizeLegibility !important;
text-align:justify;

}


.content-layer_ocultar .texto_mab{
margin: 0 0 15px 0 !important;
font-size: 22px !important;
color: #fff;
letter-spacing:  -0.5px !important;
text-rendering: optimizeLegibility !important;
text-align:justify;
/*background-color:rgba(44,31,12,0.6);*/
padding:20px;
cursor: default;
/* text-shadow:none;*/

}

.texto_mab_texto_glosario{
margin: 0 0 15px 0 !important;
font-size: 20px !important;
color: #FFF !important;
line-height: 26px !important;
padding: 0px !important;
letter-spacing: -0.5px !important;
text-rendering: optimizeLegibility !important;
text-align:justify;
font-weight:normal !important;
}



.texto_mab_titglosario{
	font-family: 'sassoon_infant_stdbold', serif !important;
	font-size: 38px !important;
letter-spacing: -3px !important;
text-align:justify;
}

.texto_mab_sutit{
	font-family: 'sassoon_infant_stdbold', serif !important;
	font-size: 30px !important;
letter-spacing: -3px !important;
}


.resaltado_mab{
color: #f3ebaa;
font-weight:bold;
cursor:pointer;
}
.resaltado_mab:hover{
color: #f3ebaa;
text-decoration:underline;
}






.logo{
	visibility:hidden;

}

.swiper-button-next:hover, .swiper-button-prev:hover {
    background-color: #304874;
}



.cruz {
	width:30px;
	height:30px;
	position:absolute;
	right:10px;
	top:10px;
	background-image:url(../images/cruz.png);
	background-repeat:no-repeat;
	background-position:0px 0px;
	cursor:pointer;
	z-index:1000;
}
.cruz:hover {
	background-position:0px -30px;
}

.cruz_youtube {
	width:30px;
	height:30px;
	position:absolute;
	right:10px;
	top:10px;
	background-image:url(../images/cruz.png);
	background-repeat:no-repeat;
	background-position:0px 0px;
	cursor:pointer;
	z-index:1000;
}
.cruz_youtube:hover {
	background-position:0px -30px;
}

.texto_indice_D ,.texto_indice_M{
	background-color:#0d1b34;
	padding:4px 10px;
	color:#FFF;
	text-align:right;
}

.texto_indice_D:hover ,.texto_indice_M:hover{
	background-color:#0b182f;
}

.texto_indice_M{
	display:none;
}


#tabMenu{
 position: absolute;
   z-index: 40000;
  display: block;
  top:50%;
  left:0px;
  background-color:#253758;
  text-align:center;
  color:#FFF;
  width:28px;
  height:80px;
  line-height:normal !important;
margin-top:-95px;
cursor:pointer;
font-weight: bold;
font-size: 14px;


}

.texto_tabMenu{
	margin-top:7px;
}

#tabMenu:hover{
color:#fdb900;
}
#tabocultar:hover{
	background-color:#fdb900;
}

#cerrar_tabMenu{
 position: absolute;
   z-index: 40000;
  display: none;
  top:50%;
  left:0px;
  background-color:#253758;
  text-align:center;
  color:#FFF;
  padding:8px 8px;
  line-height:normal !important;
margin-top:-95px;
cursor:pointer;
-webkit-box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.6);
-moz-box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.6);
box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.6);
font-weight: bold;
font-size: 14px;

}
#cerrar_tabMenu:hover{
	color:#fdb900;
}





#tabocultar{
	cursor:pointer;
 position: absolute;
   z-index: 40000;
  display: block;
  top:0px;
  left:0px;
  background-color:#253758;

margin-top:10px;
background-image:url(../images/Fast_text.png);
width:36px;
height:40px;
background-size:90%;
background-repeat:no-repeat;
background-position:center;
top:50%;
margin-top:-12px;
display:none;
}


#modal_mab {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 50000;
  display: none;
  background-color:rgba(23,42,76,0.8);
  cursor:default;
}

#modal_mab_youtube {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 50000;
  display: none;
  background-color:rgba(23,42,76,0.8);
  cursor:default;
}



#modal_mab_menu {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 30000;

  
  cursor:default;
  padding:2px;
  display:none;
}

.casillero{
	width:25%;
	height:25%;
	float:left;
	position:relative;
	 background-color:rgba(23,42,76,0.8);
	display:none;

	}
	
	.casillero_cont{

position:absolute;
		  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
   background-color:rgba(23,42,76,0.8);
 /* background-color:#304874;*/
  margin:3px;
  display:none;
  cursor:pointer;
	}

#texto_modal_mab {
/*color:#FFF;*/


	margin:auto;
	
}

.div_tabla{
display:inline-table;
table-layout: fixed;
width:80%;
margin-left:10%;
margin-right:10%;
height:100%;
}

.div_celda{
display:table-cell;
vertical-align: middle;
position:relative;

}

.div_celda img{
	margin:auto !important;
	height:auto;
	
}
.div_celda img:hover{
	outline: 2px dotted rgb(246, 120, 40);
	cursor:pointer;
}

.swiper-button-next, .swiper-button-prev {
    margin-top: 0px !important;
}

.logos_final{
/*	max-width:300px;*/
	padding:10px 20px;
}



#player_modal{
	width:100%;
	margin-top:10px;
}


@font-face {
	font-family: 'sassoon_infant_stdregular';
	src: url('../fonts/sassooninfantstd-webfont.woff2') format('woff2'), url('../fonts/sassooninfantstd-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'sassoon_infant_stdbold';
	src: url('../fonts/sassooninfantstd-bold-webfont.woff2') format('woff2'), url('../fonts/sassooninfantstd-bold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
html, body {

		font-family: 'sassoon_infant_stdregular', serif;
	font-size: 16px;
	position: relative;
	height: 100%;
	margin: 0;
	padding: 0;
    background-color: #253758;
    text-shadow: -1px 0 #1e3348, 0 1px #1e3348, 1px 0 #1e3348, 0 -1px #1e3348;
	color:#FFF;
   
}
a {
    color: #f0f1e1;
    text-decoration: underline;
}
a:hover {
    color: #f0f1e1;
    text-decoration: none;
}
.text-white span {
    color: #f0f1e1;
}
p {
	margin: 0 0 15px 0;
	font-size: 22px;
	color: #FFF;
	line-height: 28px;
	padding: 0px;
    letter-spacing: -0.5px;
    text-rendering: optimizeLegibility;
}
.small, small {
    font-size: 20px;
	line-height: 26px;
}
.h1, h1, .h2, h2 {
	font-family: 'reportregular', serif;
	color: #FFF;
}
.h1, h1 {
	font-size: 76px;
letter-spacing: -8px;
}
.h2, h2 {
	font-size: 38px;
	letter-spacing: -3px;
}
h2.subtitle {
	font-size: 22px;
	letter-spacing: -2px;
}
.swiper-container {
	width: 100%;
	height: calc(100% - 52px);
}
.swiper-slide {

	text-align: center;
	font-size: 18px;
background: #253758;


	/* Center slide text vertically */

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
/*
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	
	align-items: center;
	*/

}
.parallax-bg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	-webkit-background-size: cover;
	background-size: cover;
	background-position: center;
	z-index: 0;
}
.content-layer {
	z-index: 999;
    margin-bottom: 0px;
	position:absolute;
	width:100%;	
	height:100%;

}
.container {
	padding: 30px;
}
.pt-40 {
	padding-top: 40px;
}
.pb-40 {
	padding-bottom: 40px;
}
.logo {
/*	width: 66%;
	max-width:400px;*/
}


.texto_indice_M{
	display:none;
}


#casillero_1{
	width:25%;
}
#casillero_14{
	width:25%;
}
#casillero_15{
	width:25%;
}
#casillero_16{
	width:25%;
	background-color:#182d4f;
}





@media (max-width: 360px) {

#casillero_16 .texto_indice_M, #casillero_17 .texto_indice_M {
	font-size:12px;
}
}


@media (max-width: 560px) {
#casillero_1{
	width:50%;
}
#casillero_14{
	width:50%;
}
#casillero_15{
	width:50%;
}
#casillero_16{
	width:50%;
}

.casillero{
	height:20%;
}	
}
@media (max-width: 470px) {
	
	

	
	
	
.texto_indice_M{
	display:block;
}
.texto_indice_D{
	display:none;
}
}


@media (min-width: 768px) {
	.container {
		width: 500px;
	}
	.swiper-pagination-bullet {
		width: 16px;
		height: 16px;
	}
}
@media (min-width: 992px) {
	.container {
		width: 660px;
	}
}
@media (min-width: 1200px) {
	.container {
		width: 800px;
	}
}
@media (max-width: 767px) {
	p {
		margin: 0 0 15px 0;
		font-size: 16px;
		line-height: 24px;
		padding: 0px;
	}
	.swiper-button-next, .swiper-button-prev {
		-moz-background-size: 27px 44px;
		-webkit-background-size: 27px 44px;
		background-size: 16px 27px;
        height: 30px !important;
        margin-top: 15px !important;
	}
    .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
        bottom: 20px !important;
    }
    .small, small {
        font-size: 14px;
    }
    .logo {
	 width: 100%;
    }
}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
	bottom: 40px;
}
.swiper-button-next, .swiper-button-prev {
	position: relative;
	top: 50%;
	width: 100px;
	height: 60px;
	margin-top: 45px;
}
.btn.active, .btn:active {
	background-image: inherit;
	outline: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline: none;
}
.btn {
  /*  margin-top: 120px;*/
    width: 150px;
    color: #fff;
    font-size: 18px;
  /* font-weight: 700; */
    border: 1px solid #253758;
	background-color: #253758;
	border-radius: 25px;
}


.btn.focus, .btn:focus, .btn:hover {
    color: #fff;
    text-decoration: none;
	background-color: #304874;
}
.swiper-button-next, .swiper-button-prev {
    background-color: #253758;
    width: 50px !important;
    height: 50px !important;
    border-radius: 50px;
    margin-left: 25px;
    margin-right: 25px;
    -moz-background-size: 14px 24px;
    -webkit-background-size: 14px 24px;
    background-size: 14px 24px;
}



