@font-face {
	font-family: "Stem-Regular";
	src: url("fonts/Stem-Regular/Stem-Regular.eot");
	src: url("fonts/Stem-Regular/Stem-Regular.eot#iefix") format("embedded-opentype"),
	url("fonts/Stem-Regular/Stem-Regular.woff") format("woff"),
	url("fonts/Stem-Regular/Stem-Regular.ttf") format("truetype"),
	url("fonts/Stem-Regular/Stem-Regular.svg") format("svg");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Stem-Bold";
	src: url("fonts/Stem-Bold/Stem-Bold.eot");
	src: url("fonts/Stem-Bold/Stem-Bold.eot#iefix") format("embedded-opentype"),
	url("fonts/Stem-Bold/Stem-Bold.woff") format("woff"),
	url("fonts/Stem-Bold/Stem-Bold.ttf") format("truetype"),
	url("fonts/Stem-Bold/Stem-Bold.svg") format("svg");
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "Stem-Medium";
	src: url("fonts/Stem-Medium/Stem-Medium.eot");
	src: url("fonts/Stem-Medium/Stem-Medium.eot#iefix") format("embedded-opentype"),
	url("fonts/Stem-Medium/Stem-Medium.woff") format("woff"),
	url("fonts/Stem-Medium/Stem-Medium.ttf") format("truetype"),
	url("fonts/Stem-Medium/Stem-Medium.svg") format("svg");
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "Stem-Regular";
	src: url("fonts/Stem-Regular/Stem-Regular.eot");
	src: url("fonts/Stem-Regular/Stem-Regular.eot#iefix") format("embedded-opentype"),
	url("fonts/Stem-Regular/Stem-Regular.woff") format("woff"),
	url("fonts/Stem-Regular/Stem-Regular.ttf") format("truetype"),
	url("fonts/Stem-Regular/Stem-Regular.svg") format("svg");
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "sosa";
	src: url("fonts/sosa/sosa.eot");
	src: url("fonts/sosa/sosa.eot#iefix") format("embedded-opentype"),
	url("fonts/sosa/sosa.woff") format("woff"),
	url("fonts/sosa/sosa.ttf") format("truetype"),
	url("fonts/sosa/sosa.svg") format("svg");
	font-weight: normal;
	font-style: normal;
}

html{
	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    -webkit-text-size-adjust:none;
    text-size-adjust:none;
    -ms-text-size-adjust: none;

}

p{
	margin:0;
}
a{
	text-decoration: none;
	

}
a:hover{
	text-decoration: none;

}

a[href='#']{ display: none }
#html_completo,#html_inicio{
	
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;

    background-size: 100% 100%;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    background-image:url("images/fondo.jpg");

}
#body_inicio,#body_completo{
	max-width: 1260px;
	max-height: 600px;
	min-width: 1260px;
	min-height: 600px;
	overflow: visible;
	
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;

    background-size: 100% 100%;
    background-repeat: no-repeat;
	display: inline-block;
	
	
	opacity:1;



	padding-bottom: 5px;




}
.imagen_fp{
	position:absolute;
	-moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    z-index: -20;
    
}
.barra_inferior{
	position:absolute;
	background-color: #1665A1; 
	box-shadow: 0px -1px 20px rgba(0,0,0,.5);
	width: 1366px;
	top: 665px;
}


.banner{
	background-color: #1665A1; 
	box-shadow: 0px 3px 20px rgba(0,0,0,.5);
	position: absolute; 
	top:0; 
	left:0; 
	height:110px; 
	width: 1366px;
	z-index:-5;
}
.rombo {
	background-color: #1665A1; 
	box-shadow: 0px 3px 20px rgba(0,0,0,.5);
	position: absolute; 
	top:0px; 
	left:60px; 
	height:220px; 
	width:220px;
	border-radius: 25px;
	overflow:hidden;
	z-index:-4;
	-ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Safari */
    transform: rotate(45deg)
}
.lineahzt{
	position: absolute;
	left:130px;
	
	height:622px;
	
	border-left: 1px solid rgba(218, 41, 28, 0.3);
	z-index:-6;
}
.lineas{
	position: absolute;
	left:25px;
	width:1320px;
	border-top: 1px solid rgba(22, 101, 161, 0.1);
	z-index:-7;
}
#linea1{
	margin-top:140px;
}
#linea2{
	margin-top:170px;
}
#linea3{
	margin-top:200px;
}
#linea4{
	margin-top:230px;
}
#linea5{
	margin-top:260px;
}
#linea6{
	margin-top:290px;
}
#linea7{
	margin-top:320px;
}
#linea8{
	margin-top:350px;
}
#linea9{
	margin-top:380px;
}
#linea10{
	margin-top:410px;
}
#linea11{
	margin-top:440px;
}
#linea12{
	margin-top:470px;
}
#linea13{
	margin-top:500px;
}
#linea14{
	margin-top:530px;
}
#linea15{
	margin-top:560px;
}
#linea16{
	margin-top:590px;
}
#linea17{
	margin-top:620px;
}
.fondo{
	position:absolute;
	margin-left: auto;
	margin-right: auto;
	left:0;
	
	width:1366px;
	height:665px;
	background-image:url("images/fondo_general.png");
	background-repeat: no-repeat;
    background-size: content;
	z-index:-3;
	
}
.fondo_rectangulos{
	position: absolute;
	bottom:1px;
	left:880px;
	width:460px;
	height:470px;
	background-image:url("images/fondo_rectangulos.png");
	background-position: right bottom, left top;
    background-repeat: no-repeat;
    z-index:-8
}
.nombre_curso,.nombre_curso_inicial{
	
	font-family: "agcd";
	font-size:14px;
	text-align: center;
	position: absolute;
	top:0;
	left:0; 
	color:#E6E6E6;
	z-index:-10;
	font-weight: bolder;
	visibility: hidden;
	

	
}

.contenedor_nombre_curso{
	position: absolute;
	top:0;
	left:0;
	
	height:auto;
	width: auto;
	font-family: "wlr";
	color:#636466;
	
  	
  	visibility: hidden;
  	font-size: 14px;
	

  	display: none;
	
}

.contenedor_nombre_capitulo{
	position: absolute;
	top:0;
	left:0;
	border-radius: 20px;
	height:32px;
	width: auto;
	font-family: "Stem-Bold";
	color:#620283;
	font-size: 30px;
	line-height: 27px;
	
	background-color: #14A399;
  	z-index: 1;
  	visibility: hidden;

  	background-color: transparent;
  	
  	text-shadow: 1px 0px 0 rgba(0,0,0,.4);
  
  
  	
	
}
.contenedor_nombre_capitulo span{
	font-family: "PFBeauSansPro-Thin";
	color: #620283;
	
}
.contenedor_numero_capitulo{
	position: absolute;
	top:0;
	left:0;
	border-radius: 15px;
	height:90px;
	width: 90px;
	
	background-color: #7A3994;
	
  	box-shadow: 0 0 8px rgba(0,0,0,.35);
  	visibility: hidden;
}

.contenedor_nombre_leccion{
	position: absolute;
	top:0;
	left:0;
	
		
	width: auto;
	
	background-color: transparent;
  
  	visibility: hidden;
  	font-family: "Stem-Bold";
	color:#ffffff;
	font-size: 17px;
	
	letter-spacing: 3px;
	
	
  	text-shadow: 0 0px 0 rgba(0,0,0,.35);
	
	
	height:30px;
	line-height: 30px;
	padding: 0 120px 0 30px;
	border-radius: 100px 40px 40px 0;
	

	
}


.contenedor_nombre_curso img,.contenedor_nombre_capitulo img,.contenedor_nombre_leccion img{
	display: inline-block;
	float: left;
	
	
}

.contenedor_nombre_curso p{
	margin-top: 10px;
	color:#636466;
	font-size: 20px;

}
.contenedor_nombre_curso p span{
	color:#333333;
	font-family: "wbr";
}
.contenedor_nombre_leccion img{
	margin: 5px 5px 0px 5px; 

}
.segunda_linea{
	background: transparent;
    text-shadow: 0px 0px 0px #000000;
    font-size: 42px;
    color:#D10019;
    margin-left:0px;
  	display: block;
  	font-family: "wlb";
    margin-top:-10px;
    margin-left:38px;

}
.tercera_linea{
	background: transparent;
    text-shadow: 0px 0px 0px #000000;
    font-size: 18px;
    color:#E8AE4A;
    margin-left:10px;
    margin-top:-5px;
  	display: block;
  	font-family: "agcd";

}
.curso{
	font-family: "ql";
	font-size: 14px;
	color:#ba2a23;
	font-weight: bolder;
	
}
.art{
	font-size: 16px;
}
.numero_modulo{
	font-family: "hnc";
	text-align: center;
	position: absolute; 
	font-size: 20px;
	color:rgb(255,245,0);
	z-index:4;
	visibility: hidden;
	
	

}

.modulo{
	font-family: "hnc";
	font-size: 17px;
	position: absolute;
	top:0;
	left:0;
	visibility: hidden;
	color:rgb(255,255,255);
	z-index: 4;
	font-weight: bolder;
}
.numero_mod{
	
	display: block;
	font-size:55px;
	color:rgba(0,0,0,1);
		
	margin-top: -9px;

}


.numero_leccion{
	font-family: "Stem-Regular";
	text-align: center;
	position: absolute; 
	color:rgb(255,255,255);

	z-index:-4;
	visibility: hidden;
	padding: 0px 12px 0 12px;
	height: 81px;
	letter-spacing: 2px;

}
.leccion{
	
	display: inline-block;
	margin-right: 7px;
	font-weight: bolder;
	font-size:19px;
}
.numero_lecc{
	
	display: inline-block;
	
	font-size:19px;
	color:rgba(0,0,0,1);
		
	

}



.flecha_encabezado{
	position: absolute;
	width: 23px;
	height: 35px;
	margin-top: 7px;
	margin-left: 185px;
}
.nombre_modulo{
	position: absolute;
	font-family: "ql";
	font-size:32px;
	
	text-align: left;
	color:rgba(118,42,42,1);
	color:#fff500;
	
	z-index: 4;
	visibility: hidden;
	border-radius: 0 0 10px 10px;
	
	line-height: 32px;
	width:270px;

}
.nombre_modulo_2{
	font-family: "hnc";
	padding: 20px 35px 10px 35px;
	color: rgb(2,57,94);
	background-color: rgba(255,245,0,1);
	visibility: hidden;
	position: absolute;
	top:0;
	left: 0;
	border-radius: 0 0 10px 10px;
	width:270px;
	z-index: -5;
}
.segundo_renglon{
	color:rgb(218,37,29);
	font-size:29px;
}
.nombre_leccion{
	position: absolute;
	font-family: "Stem-Regular";
	font-size:25px;
	text-align: center;
	color:rgba(0,0,0,1);
	padding: 3px 20px;
	z-index: -4;
	visibility: hidden;
	letter-spacing: 1px;
}
.art2{
	font-size: 20px;
}
.icono{
	width: 100px;
	height: 100px;
	position: absolute;
	top: 5px;
	left: 1160px;

}
.numero_pagina{
	position: absolute;
	top:0;
	left:0;
	font-family: "ProximaNova-Semibold";
	font-size:50px;
	color: #da251d;
	z-index:1;
	width:40px;
	text-align: right;
	background-color: #52A30A;
	background-color: #ff0000;
	
}
.boton_cerrar{

	visibility: hidden;
	padding: 6px 12px;
	background-color: transparent;
	position: absolute;
	top:0px;
	left:0;
	font-family: "Stem-Regular";
	font-size:15px;
	border-radius: 0 0 7px 7px;
	color:#620283;
	
	
	z-index: 20;
	text-align: center;

}
.boton_cerrar_b,.boton_cerrar_b2{
	
	
	color:#333333;
	width:35px;
	height:35px;
	border-radius:20px;
	font-family:"sosa";
	line-height: 35px;
	margin-left:7px;
	font-size:18px;
	cursor: pointer;
	display: inline-block;
	background-color: #FCAB00;
	color:#620283;
	box-shadow: 0 0px 5px rgba(0,0,0,.2);
	border:2px solid #ffffff;


	
}
.boton_cerrar_b2{
	
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	color:#ffffff;
}
.boton_cerrar div:hover{
	background-color: #06CFDC;
	
}


.txt_pagina{
	color: rgb(22,101,161);
}

.flecha_arriba, .flecha_abajo{
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	left:0;
	right:0;
	width: 66px;
	height: 47px;
	cursor: pointer;
	visibility:hidden;	
}
.flecha_arriba{
	left:2px;
	top:24px;
	visibility:hidden;	
}
.flecha_abajo{
	-ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari */
    transform: rotate(180deg);
    right:3px;
    bottom:28px;
}
.flecha_abajo:hover, .flecha_arriba:hover { 
    opacity: 0.5;
}
.titulo_pagina{
	position: absolute;
	top:0px;
	text-align: left;
	font-family: "Stem-Regular";
	color: #017272;
	font-size: 29px;
	visibility: hidden;
	z-index: 1;
	background-color: transparent;
	
	border-radius: 23px;
	height:auto;
	padding: 0;
	display:flex;		
    align-items:center;
    cursor: default;
    color: #ffffff;
    background-color:#620283;
    border-radius: 0px;
	padding: 3px 30px 3px 20px;
	border-left: 0px solid #e5007d;
}
.titulo_pagina p{
	margin-left: 10px;
}
.titulo_pagina:before {
  content:''; 
  width:0px; 
  height:100%; 
  background:#620283; 
  background: linear-gradient(#620283 0, #620283 25%, #e5007d 25%, #e5007d 50%, #620283 50%, #620283 100%);
  background: #e5007d;
  position:absolute; 
  left:0px;
  top:0px;
  border-radius: 0px;
  
}
.numero_pag{
	margin: 0 0px 0 10px;
	border:1px solid transparent;
	font-family: "Stem-Bold";
   	
}
.texto_inicial{
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	left:0;
	right:0;
	top:0;
	text-align: left;
	font-family: "aggtee";
	font-size: 24px;
	color:#FFFFFF;
	visibility: hidden;
	width: 270px;
	padding: 25px;
	background-color: rgb(131,120,111);
	border-radius: 25px;
	z-index:-1;
}
.instruccion_circulos{
	width: 100%;
	position: absolute;

	top:0px;
	text-align: left;
	font-family: "Stem-Regular";
	font-size: 17px;
	text-align: center;
	
	color:rgb(127,117,108);
	color:rgb(255,231,1);
	color:#15A399;
	
	color: #A0A1A2;
	color: #666666;
	
	z-index:-1;
	visibility: hidden;
	width: 1140px;

	
	margin-left: 10px;
	
	
}

.instruccion_circulos div:before {
  content:''; 
  width:0px; 
  height:5px; 
  background:#76828E; 
  position:absolute; 
  left:0px;
  bottom:-3px;
  border-radius: 10px;
  
}
.instruccion_circulos div{
padding: 5px 25px;

	color: #620283;
	background-color:#FCAB00;
	background-color:#E6E6E6;
	border:0px solid #FCAB00;
	display: inline-block;	
	letter-spacing: 1px;
	
}

.tabla_instruccion{
	
	margin: 0 auto; 
}

.azul{
	color:rgb(58,137,177);
}

.titulo_c,.titulo_c2{
	position: absolute;
	top:0;
	text-align: center;
	font-family: "Stem-Medium";
	font-size: 22px;
	color:rgb(236,27,35);
	color:rgba(0,0,0,1);
	color:rgb(0,0,0);
	color:rgb(128,128,128);
	color:#005f98;
	color:#555759;
	color:#620283;
	letter-spacing: 2px;
	background-color: transparent;

	
	
	visibility: hidden;
	width: 250px;
	line-height: 25px;
	height: auto;
	border-radius: 0px;

	z-index:-1;

	
    padding: 0 ;

    border-bottom: 0px solid #620283;
	
}
.titulo_c2{
	background-color: transparent;
	color:#620283;
	
	font-family: "Stem-Medium";
	line-height: 20px;
	font-size: 20px;

}
.titulo_c{
	display:flex;		
    align-items:center;
    
}

.numero_titulo_c{
	
	color:#620283;
	display: inline-block;
	border-radius: 16px 0 0 16px;
	height: 34px;
	padding: 0;
	margin: 0 5px 0 0;
	display:flex;		
    align-items:center;
    font-family: "Stem-Medium";
}
.numero_titulo_c2{
	color:#620283;
	font-size: 17px;
	font-family:"Stem-Medium";
	display: block;
}
.numero_titulo_c_over{
	display: inline-block;
}
.c_principal_1, .c_principal_2, .c_masinfo_1, .c_masinfo_2,.mas_personaje{
	position: absolute;
	left:0;
	top:0;
	visibility: hidden;
	z-index:-1;
	text-align: justify;
	text-align: left;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
	background-position: center; 
	
	overflow: visible;
	
}

.c_principal_1{
	width:1138px;
	height:auto;
	

	

}
.c_principal_2{
	width:1160px;
	height: 390px;	
}
.c_masinfo_1,.c_masinfo_2,.mas_personaje{
	background-color: rgba(255,255,255,1);
  	border: 5px solid #D10019;

  	border-radius: 10px 10px 10px 0;
  	
  	box-shadow: 0px 0px 15px rgba(0,0,0,.5);

  	
}
.c_masinfo_1,{
	width:535px;
	height:365px;
}
.mas_personaje{
  	border-radius: 20px 20px 0px 20px;
  	
  	width:945px;
	height:375px;
	z-index: 3;
	background-color: rgba(255,255,255,.97);
	border-color: #898991;
	text-align: center;
	font-family: "Stem-Regular";
}
.c_masinfo_2{
	width:500px;
	height:310px;
  	border-radius: 20px 20px 20px 0px;
  	background-color: #ffffff;
  	border: 5px solid #D10019;
  	border: 5px solid #898991;

}


.txt_principal_1_1,.txt_principal_1_2,.txt_principal_2_1,.txt_masinfo_1_1,.txt_interno,.txt_interno_anima,.txt_principal_2_2,.txt_masinfo_2_2,.txt_masinfo_2_1{
	display: inline-block;
	float:left;
	margin: 0 10px 0 0px;
	font-family: "Stem-Regular";
	font-size: 16px;
	color:rgb(0,0,0);
	color:rgb(70,70,70);
	color:#004996;
	color:#555759;
	line-height: 25px;
	overflow: hidden;
	border:none;
	
	margin: 0 10px 0 15px;
	text-align: justify;
	

}
.txt_dec{
	position: relative;
	margin-left: 15px;
}
.txt_dec:before {
  content:''; 
  width:3px; 
  height:35px; 
  background:#620283; 
  position:absolute; 
  left:-15px;
  top:6px;
  
}
.txt_interno,.txt_interno_anima{
	visibility: hidden;
	position: absolute;
	top:0;
	left:0;
	font-family: "Stem-Regular";
	font-size: 16px;
	line-height: 26px;
	margin: 0 auto;
	width:99%;
	
	text-align: left;
	overflow: hidden;


}
.txt_interno{
	visibility:hidden;
	position:absolute;
	max-height: 0;
	top: 0;
	left:0;
}
.txt_interno_anima{
	visibility:visible;
	max-height: auto;
	position: relative;
	-webkit-animation: fadein 0.5s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 0.5s; /* Firefox < 16 */
        -ms-animation: fadein 0.5s; /* Internet Explorer */
         -o-animation: fadein 0.5s; /* Opera < 12.1 */
            animation: fadein 0.5s;
}


@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.txt_principal_1_1{
	width:1200px;
}
.txt_principal_1_2{
	width: 650px;
	

}
.txt_principal_2_1{
	width:1100px;

	

}
.txt_principal_2_2{
	width:670px;
	margin-top:10px;
	height:87%;
}


.txt_masinfo_1_1{
	margin:25px 30px 10px 30px;

}
.txt_masinfo_2_1{
	margin:25px 30px 10px 30px;

}
.txt_masinfo_2_2{
	margin:25px 10px 10px 30px;
	width:370px;
	
	
}


.negrilla,.negrilla2{
	font-family: "Stem-Bold";
}


.div_clic,.div_clic2,.img_masinfo_1_1,.img_principal_1_1,.img_principal_1_2,.img_masinfo_1_1_menor,.img_principal_2_2,.img_masinfo_2_1,.img_masinfo_2_2{
	display: inline-block;
	float:left;
	height: 100%;
	background-size: 98%;
	background-repeat: no-repeat;
	overflow: hidden;
	background-position: center center;
	background-repeat: no-repeat;
	background-position: center; 
	border:none;
	

	display:flex;		
    align-items:center;


	
}
.div_clic,..div_clic2{
	margin-top: 10px;
	margin-left:20px;
	height:300px;



}

.imagen{
	margin: 0 auto; 
}
.img_principal_1_1{
	width:99%;

	
}
.img_principal_1_2{
	height: 95%;
	width:530px;
	margin-right: 0;
	
	margin-top: 10px;
	
}
.img_masinfo_1_1{
	height: 150px;
	margin:0px 30px 10px 30px;
}

.img_principal_2_2{
	width:415px;
	
	height: 85%;


	
}
.img_masinfo_2_1{
	
	margin:0px 30px 0px 30px;
	height:90px;
	width:770px;

}
.img_masinfo_2_2{
	width:380px;
	margin:25px 0px 0px 10px;
	height: 190px;
}


.txt_masinfo_1_1,.img_masinfo_1_1{
	width: 860px;
}





.descripcion_imagen_c, .descripcion_imagen_c_ancho,.descripcion_imagen,.descripcion_imagen_2_2{
	padding: 5px 10px;
	font-family: "agm";
	font-size: 15px;
	line-height: 15px;
	
	background-color: rgba(255,255,255,0.8);
	text-align: center;
	
	border:none;
	
	border-top: 2px dotted #bd8228;
	border-bottom: 2px dotted #bd8228;
	
	color:rgba(0,147,221,1);
	color:#bcbe00;
	color:rgb(0,147,221);
	color: #005f9c;

	width:498px;
	display: inline-block;
	float: left;
	
	
}
.descripcion_imagen_2_2{
	width:437px;
}
.descripcion_imagen_c_ancho{
	
	width:870px;
}

.negrilla_sensible,.negrilla_sensible2{
	background-color:#e5007d;
	color:rgb(255,255,255);
	padding: 0px 10px;
	font-weight: bold;
	cursor: pointer;
	
	border-radius: 0px;
	padding: 1px 4px;
	font-family: "Stem-Regular";
	border-bottom: 0px solid #4d4d4d;
	background: linear-gradient(-45deg, #e5007d, #ff0000, #e5007d, #ff0000);
	background: linear-gradient(-45deg, #620283, #382351, #620283, #382351);
	background: linear-gradient(-45deg, #0066D0, #06CFDC, #0066D0, #06CFDC);

	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	letter-spacing: 2px;
}

 @keyframes colorchange
    {
     0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
    }

@-webkit-keyframes colorchange /* Safari and Chrome - necessary duplicate */
    {
     0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
    }
.negrilla_sensible2{
	background: #999999;
}
.negrilla_sensible:hover,.negrilla_sensible2:hover { 
    opacity:0.8;
}

.instruccion_interna{
	position: relative;
	display: inline-block;
	width:auto;
	text-align: justify;
	font-family: "Stem-Regular";
	
	font-size: 15px;
	line-height: 15px;
	color:rgb(0,147,221);
	color:#A0A1A2;
	
	padding: 5px;
	
	padding: 5px 15px;

	color: #620283;
	background-color:#FCAB00;
	background-color:#E6E6E6;
	border:0px solid #FCAB00;
	z-index: 30;
	letter-spacing: 1px;
	
	border-radius: 0px;
	
	margin-bottom: 5px;

}

.instruccion_interna:before {
  content:''; 
  width:35px; 
  height:5px; 
  background:#008B45; 
  background:transparent; 
  position:absolute; 
  left:0px;
  bottom:-3px;
  border-radius: 10px;
  
}
.instruccion_interna2{
	position: relative;
	display: inline-block;
	width:100%;
	text-align: center;
	font-family: "Stem-Regular";
	font-size: 16px;
	color:rgb(0,147,221);
	color:#333333;
	
	padding: 5px;
	letter-spacing: 2px;
	padding: 0px;

	font-style: italic;
	

}
.instruccion_interna2 div{
	color: #4D4D4D;
	background-color:#E6E6E6;
	z-index: 30;
	font-style: italic;
	border-radius: 230px;
	padding: 10px 25px;
}
.zona_sensible,.zona_sensible2{
	position: absolute;
	width: 182px;
	height: 125px;
	top:124px;
	background-color: rgba(255,255,255,.5);
	cursor: pointer;
	text-align: center;
  	display: table; 
  	opacity: .01;


 }
 .zona_sensible2{
 	opacity: .8;	
 }

 .zona_sensible:hover { 
    opacity: 1;
}
.zona_sensible2:hover{
	opacity: 1;	
}
 .texto_zona_sensible{
 	
 	font-family: "aggtee";
  	font-size: 17px;
  	color:#FFFFFF;
  	
 }
img.imagen_sensible{
	width: 100%;
	opacity:.01;
	
}
img.imagen_sensible:hover { 
    opacity:.4;
}
.infografia{
	
}
.pop{
	position: absolute;
	max-width: 500px;
	left: 0;
	top:0;
	border: 1px solid #FFFFFF;
	font-family: "Stem-Regular";

  	font-size: 16px;	
	border-radius: 20px;
	
  	border: 1px solid #4d4d4d;
	border: 1px solid #4d4d4d;
	border-bottom: 1px solid #4d4d4d;
  

	color: #ffffff;
	text-align: justify;
	line-height: 19px;
	
	padding: 15px 18px 15px 18px;
	height: auto;
	letter-spacing: 1.5px;
	letter-spacing: normal;
	

	background: -webkit-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* Standard syntax */
  	background: #333333;

  
	visibility:hidden;
	z-index: 3;
	
}
.titulo_pop{
	
	
	font-size: 17px;
	display: block;
	margin-bottom: 7px;
	padding-bottom: 7px;
	letter-spacing: normal;
	font-family: "Stem-Bold";
	color:#ffffff;
	letter-spacing: 3px;
}
.negrilla_pop{
	
	font-family: "Stem-Bold";
	color:#FCAB00;
	letter-spacing: 2px;
	
}
.pop_instruccion{
	position: absolute;
	max-width: 465px;
	left: 0;
	top:0;
	border: 4px solid rgba(0,0,0,1);
	font-family: "ql";
  	font-size: 16px;	
	border-radius: 7px;
	background-color: #0099ff;
  	background-color: rgba(0,0,0,1);
  	border: 4px solid #0099ff;
	border: 4px solid rgba(0,0,0,1);
	border-bottom: 4px solid rgba(0,0,0,1);
	color: #ffffff;
	text-align: center;
	font-weight: 100;
	padding: 10px 15px;
	height: auto;
	
	visibility:hidden;
	z-index: 3;
	
}
.enlace-arriba{
	
	width: 1px;
	border-bottom: .6em solid #333333;
  	border-bottom: .6em solid #333333;
  	border-left: 7px solid transparent;
  	border-right: 7px solid transparent;
  	
  	top:0px;
  	left: 0px;

  	visibility: hidden;
  	z-index: 3;


  }

  .enlace-abajo{
	
	width: 1px;
	border-top: .6em solid #333333;
  	border-top: .6em solid #333333;
  	border-left: 7px solid transparent;
  	border-right: 7px solid transparent;

  	top:0px;
  	left: 0px;

  	visibility: hidden;
  	z-index: 3;

  	
  }

  .contenido_cr{
  	
  	position: absolute;
	margin-left: auto;
	margin-right: auto;
	padding:15px;
	left:0px;
	right:0;
	top:130px;
	width:1050px;
	
	visibility: hidden;
	z-index:-1;
	overflow: hidden;
	border-radius: 0px 30px;
	
	background: -webkit-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* Standard syntax */
	
	text-align: center;

	border: 2px solid rgba(219,219,219,.8);


  }

  .texto_c_ancho_2{
  	width: 99%;
  	color:rgb(131,120,111);
  	text-align: center;
  }
  .negrilla_subt{
  	color: rgb(238,200,45);
  	font-weight: bold;
  	
  }
  .negrilla_subt{
  	font-size: 24px;
  }
  .listado{
  	font-size: 16px;
  	line-height: 19px;
  	margin-left: 10px;
  }

 table.tabla_sensible, td.celda_sensible {
    
    border-collapse: collapse;
    text-align: center;
    background-color: rgba(255,255,255,.7);

}
table{
	border-collapse: collapse;
}
td{
	padding: 0;
}
td.celda_sensible{
	padding: 5px;
	visibility: hidden;
  	opacity: 0;
  	font-size: 16px;	
  	
}

table{
	
	
}
th{
	
	font-family: "Stem-Regular";
	border: 0px dotted rgba(0,147,221,1);
	text-align: center;
	color:#4d4d4d;
	font-size: 20px;


}
.td_linea{
	border:1px solid #4d4d4d;
}

.opciones_arrastre,.textos_arrastre,.boton_enviar{
	width: 1260px;
	height: 30px;
	display: table;
	float: left;
	text-align: center;
	
	font-family: "Stem-Regular";
	margin-left: 0px;
	margin-top: 0px;



}
.textos_arrastre{
	margin-top:110px;	
	margin-left: 7px;
}


.contenedor1{
	display: table-cell;
	vertical-align: middle;
	
	width: 1240px;
	
	

}
.contenedor2,.retroalimentacion{
	padding: 4px 0px;
	border-radius: 4px;
	margin-left: 5px;
	width: 1110px;
	font-family: "Stem-Regular";
  	font-size: 18px;
  	color:rgba(255,255,255,1);
  	
  	background-color: rgba(58,137,177,1);
  	overflow: visible;
  	

  	
}
.retroalimentacion{
	
	text-align: center;
	width: 1000px;
	display: block;
	margin: 10px auto;
}
.opcion,.opcion_3,.opcion_4,.opcion_5,.opcion_6,.opcion_7,.opcion_8{
	
	margin: 0px 2px;
	border-radius: 10px;
	color:white;
  	width:140px;
  	height:55px;
  	z-index: 3;
  	cursor: pointer;
  	border:3px solid white;
	box-shadow: 0px 0px 5px rgba(0,0,0,.4);
	background-color:#D10019;
	vertical-align: middle;
	display: flex;
    align-items: center;
	justify-content: center;
	font-size: 14px;
	line-height: 15px;
	position: absolute;
	background-color: #620283;
  	visibility: hidden;

}
.opcion_3{
	width: 325px;
}
.opcion_4{
	width: 235px;
}
.opcion_5{
	width: 175px;
}
.opcion_6{
	width: 142px;
}
.opcion_7{
	width: 158px;
}
.opcion_8{
	width: 108px;
}
.columna{
	width: 195px;
	display: block;
	float: left;
	

}


.columna{
	width: 195px;
	display: block;
	float: left;
	

}
.enunciado,.enunciado_3,.enunciado_4,.enunciado_5,.enunciado_6,.enunciado_7,.enunciado_8{
	position: relative;
	display:inline-block;
	float: left;
	margin: 3px 7px;
	width:140px;
	border: 2px solid #620283;
	border-radius: 10px;
	text-align: left;
	font-family: "Stem-Regular";
	font-size: 14px;
	line-height: 15px;
	
	padding: 10px 15px;
	color:#656566;
	background-color: white;
  	z-index: 0;
}

.enunciado_3{
	width: 325px;
}
.enunciado_4{
	width: 235px;
}
.enunciado_5{
	width: 175px;
}
.enunciado_6{
	width: 142px;
}
.enunciado_7{
	width: 158px;
}
.enunciado_8{
	width: 108px;
}

.espacio{
	height: 62px;
	border-bottom:2px solid #620283	;
	margin-bottom: 10px;
}


.enunciado_vf{
	width: 1050px;
	font-family: "Stem-Regular";
	font-size: 17px;
	color:rgb(0,0,0);
	text-align: right;
	padding: 5px;
}

.recuadro{
	position: absolute;
	top:0;
	left:0;
	width: 150px;
	height: 100px;
	
	cursor: pointer;
	visibility: hidden;
}

.final_modulo{
	visibility: hidden;
	color:rgba(255,255,255,1);
	background-color: rgba(58,137,177,1);
	padding: 12px 0px;
	border-radius: 10px;
	margin-top: 5px;
	font-size: 18px;
}
.btn_zoom{
	border:1px solid red;
}
.boton_masinfo,.boton_volver,.boton_masinfo_on,.boton_masinfo_visto{
	height: 52px;
	width: 62px;
	padding-left:5px;
  	font-size: 41px;
  	line-height: 45px;
  	text-align: center;
  	border:0px solid #F2F2F2;
  	background-color: #F2F2F2;
  	box-shadow: 0px 0px 5px rgba(0,0,0,.4);
  	text-shadow: 0px 2px 0px rgba(0,0,0,.4);
  	color:#e5007d;
  	cursor:pointer;
  	visibility: hidden;
  	z-index: 0;
  	border-radius: 10px 35px 35px 10px;
  	font-family: "sosa";
  	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
  	
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	color:#ffffff;
  	
}
.descarga,.descarga_visto{
	line-height: 45px;
  	text-align: center;
  	border:0px solid #F2F2F2;
  	background-color: #F2F2F2;
  	box-shadow: 0px 0px 5px rgba(0,0,0,.4);
  	
  	color:#ffffff;
  	cursor:pointer;
  	z-index: 0;
  	border-radius: 5px;
  	font-family: "Stem-Medium";
  	padding: 7px 15px;
  	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background-size: 400% 400%;
	color:#ffffff;
	font-size:15px;
	letter-spacing: 3px;

	
}
.descarga{
	animation: colorchange 3s ease infinite;

}
.descarga_visto{
	background: #CCCCCC;
	color:#4d4d4d;

	

}
.boton_masinfo_on{
	color:#F2F2F2;
	background-color: #e5007d;
  	border: 0px solid #00a9b1;
}
.boton_masinfo_visto{
	animation: colorchange 3s ease 0;

}
.boton_volver{
	display: none;
}

.texto_masinfo,.texto_descarga,.texto_masinfo_on{
	position: absolute;
	top:0;
	left:0;
	font-family: "hnc";
	padding: 0px 30px 5px 40px;
  	font-size: 17px;
  	text-align: left;
  	border: 2px solid #00a9b1;
  	color:transparent;
  	color: rgb(0,147,221);
  	visibility: hidden;
  	z-index: -1;
	color:#7a3994;
	background-color: #fbb900;
	border-radius: 0 15px 15px 0;
	font-family: "Stem-Regular";
	border:none;
	color: #620283;
	background-color:transparent;

}
.texto_masinfo_on{
	color:#fbb900;
	background-color: #7a3994;
  	border: 1px solid #00a9b1;

}

video{
	height: 100%;
	
	display: block;
	margin: 0 auto;
	
    
}

/*
@media screen and (orientation:portrait) {
#html_completo {


	-ms-transform: scale(1.35,1.35) rotate(90deg) origin (0 0); 
    -webkit-transform: scale(1.35,1.35) rotate(90deg); 
    transform: scale(1.35,1.35) rotate(90deg);


    margin-left:1376px;
    
    
  }
}

@media screen and (orientation:landscape) {
#html_completo {


	-ms-transform: scale(0.9,0.9) ; 
    -webkit-transform: scale(0.9,0.9); 
    transform: scale(0.9,0.9) ;

    
    
  }
}
*/
.contenedor_clics,.contenedor_clics_scroll{
	width: 100%;
	max-height: 85%;
	overflow-y:scroll;
	
	border:0px solid #333333;
	border-radius: 30px;
	background-color:transparent;
	padding: 10px ;
	margin-right: 10px;
	margin-left: 5px;

	
}
.contenedor_clicsb{
	width: 100%;
	border: 2px solid #00a9b1;
	border: 2px solid #faab4f;
	border: 0px solid #7a3994;
	
	padding: 0px;
	border-radius:30px;
	text-align: center;
	background-color: #E6E6E6;
	background-color: transparent;
	
}
.clic,.clic_seleccionado,.clic_visto,.clic_abierto,.clic_abierto2{
	font-family: "Stem-Regular";
	font-size: 17px;
	color:#008b92;
	color:#ffffff;
	background-color: #898991;
	text-align: center;
	border-radius: 100px;
	box-shadow: 0px 0px 2px #636466;
	margin: 5px;
	cursor: pointer;
	width: 200px;
	padding: 6px;
	border: 2px solid #ffffff;
	line-height: 19px;
	text-shadow: 0px 1px 0px #666666;
	padding: 7px;
	letter-spacing: 2px;

}
.clic_seleccionado{
	background-color:#00a9b1;
	color:#ffffff;
}
.clic_visto{
	background-color:#620283;
	
	
	


}
.clic_abierto{
	
	
	border-color: #ffffff;
	background-color: #620283;

	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	color:#ffffff;
}
.clic_abierto2{
	
	
	border-color: #ffffff;
	background-color: #0066D0;
	}

.clicb,.clic_vistob,.clic_abiertob,.clicb2,.clic_abiertob2{
	
	
	font-family: "Stem-Regular";
	font-size: 15px;
	color:#008b92;
	color:#ffffff;
	background-color: #898991;
	text-align: center;
	border-radius: 100px;
	margin: 2px;
	cursor: pointer;
	width: 200px;
	padding: 4px 6px;
	border: 2px solid #ffffff;
	line-height: 19px;
	box-shadow: 0px 0px 2px #636466;
	text-shadow: 1px 1px 1px #636466;

	letter-spacing: 2px;
	


}
.clicb2{
	box-shadow: 0px 0px 7px transparent;
	cursor: initial;
	padding-top: 0;
	padding-bottom:0;
	margin-top:0;
	margin-bottom: 0;
	background-color: transparent;
	border-color: #ffffff;
	visibility: hidden;

}
.clic_vistob{
	background-color:#e5007d;
	
	border-color: #ffffff;

	background-color:#620283;

	
}
.clic_abiertob{
	border-color: #ffffff;
	background-color: #620283;

	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);

	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
}
.clic_abiertob2{
	border-color: #ffffff;
	background-color: #620283;
	background-color: #0066D0;
	

}
.clic_nosensible{
	font-family: "ql";
	text-align: center;
	border:none;
}
.indicador_clic{
	border:none; 
	color:rgba(22,96,151,1); 
	color: rgba(231,120,23,1);
	color:#1665a1;
	
	
	visibility: hidden;
	vertical-align: middle;
	margin-top: 10px;
}
.indicador_clicb{
	visibility: hidden;
}
.textos_clic{
	width:650px;
	
	
	display: table-cell;
	height: 255px;
	padding: 20px;
	border-radius: 20px;
	background: -webkit-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* Standard syntax */
  	background: #FFFFFF;
	text-align: left;
	vertical-align: middle;
	font-family: "Stem-Regular";
	font-size: 16px;
	color:rgb(127,117,108);
	color:#666666;
	margin:1px;
  	overflow: hidden;
	box-shadow: 3px 3px 9px rgba(0,0,0,.2);
}

.textos_clicb{
	width:650px;
	
	
	display: table-cell;
	height: 255px;
	padding: 20px 30px;
	border-radius: 30px;
	background: -webkit-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* Standard syntax */
  	background: #FFFFFF;
	text-align: left;
	border: 2px solid #D9D9D9;
	margin-left: 10px;
	vertical-align: middle;
	font-family: "Raleway-Regular";
	
	font-size: 16px;
	
}
.texto_interno{
	visibility: hidden;
	position: absolute;
	top:0;
	left:0;
}
.documents{
	visibility: hidden;
	position: absolute;
	top:0;
	left:0;

}

.enunciado_s{
	width:auto;
	font-family: "itcagbookc";
	font-size: 17px;
	color:rgb(127,117,108);
	text-align: right;
	padding: 5px;

}
.opcion_s{
	width:30px;
	cursor:pointer;
	background-color: rgba(131,120,111,.7); 
}
.derechos{
	position: absolute;
	top:430px;
	left: -75px;
	font-family: "aggtee";
	font-size: 17px;
	color:rgba(127,117,108,.5);
	
	-ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Safari */
    transform: rotate(-90deg)
}
.clave,.clave2{
	position: absolute;
	top:0;
	left:0;
	font-family: "hnc";
	text-align: left;
	font-size: 23px;
	
	visibility: hidden;
	color: rgba(0,0,0,1);
	text-align: center;
	
}
.clave{

}
.clave2{
	font-family: "ql";
	color:rgba(236,27,35,1);
	color: rgba(0,77,154,1);
	color:rgba(118,42,42,1);

	
}


.barra_amarilla0{
	background-color: rgba(255,231,1,1);
	width: 1255px;
	height: 35px;
	border-radius:10px 10px 0px 0px;
	visibility: hidden;
	position: absolute;
	top:0px;
	left: 0;


}
.barra_negra{
	background-color: rgba(0,0,0,1);
	width: 1045px;
	height: 35px;
	border-radius:10px 40px 0px 0px;
	visibility: hidden;
	background-repeat: no-repeat;
	background-position: 700px;
	position: absolute;
	top:0px;
	left: 0;
}
.logo{
	background-image:url("images/icono.png");
	background-size: 75%;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: rgba(255,231,1,1);
	width:210px;
	height: 117px; 
	visibility: hidden;
	margin-left: 1045px;
	border-radius: 10px;
	position: absolute;
	top:0px;
	left: 0;

}

.curso,.nombre_curso{
	
	
	
	visibility: hidden;
	position: absolute;
	top:0;
	left: 0;
	
	font-weight: bolder;
}
.barra_amarilla{

	
	overflow: hidden;
	visibility: hidden;
	position: absolute;
	top:0px;
	left: 0;

	border-radius: 100px;
	background: #ffffff;
	box-shadow: 0 0 10px rgba(0,0,0,.5);
	padding: 10px 40px;
	
	
}
.barra_amarilla_1{
	display: inline-block;
	float: left;
	width: 520px;
	height: 81px;
	background-color: rgba(255,231,1,1);
	border-radius: 0 0 0px 10px;
	border-right: 5px solid rgba(252,252,0,1);
	
}

.barra_amarilla_2{
	display: inline-block;
	float: left;
	width: 0;
	height: 0;
	border-top: 70px solid rgba(255,231,1,1);
	border-right: 100px solid transparent;
	margin-left: -19px;
}


.barra_naranja{

	
	overflow: hidden;
	visibility: hidden;
	position: absolute;
	top:0px;
	left: 0;
	z-index: -8;
	
}
.barra_naranja_1{
	display: inline-block;
	float: left;
	width: 360px;
	height: 81px;
	background-image:url("images/fondo_naranja.png");
	background-size: 100% 100%;
	
	
}


.menu_numeros{
	width: 800px;
	height: 60px;
	background-color: rgba(255,231,1,1);
	border-radius: 30px 0 0 30px;
	visibility: hidden;
	background-image:url("images/fondo_menu_numeros.png");
	
	background-position: 28px 12px;
	background-repeat: no-repeat;
	
}

.menu_numeros2{
	width: 740px;
	height: 58px;
	margin-left: 60px;
	background-color: rgba(255,255,255,1);
	border-radius: 0 0 0 20px;
}
.flechas{
	position: absolute;
	top:0;
	left:0;
	width: 164px;
	height: 70px;
	border-radius: 35px;
	background-color: rgba(255,231,1,1);
	visibility: hidden;
	overflow:hidden;
	z-index:0;
}
.flechas2{
	position: absolute;
	top:0;
	left:0;
	width: 130px;
	margin-left: 30px;
	margin-top: 4px;
	height: 62px;
	border-radius: 31px;
	background-color: rgba(255,255,255,1);
	background-image:url("images/fondo_flechas.png");
	background-repeat: no-repeat;
	background-position: center 15px;
	overflow:hidden;
	z-index:0;
}



.cont_over_principal,.cont_over_circulos_internos,.cont_over_principalb,.cont_globo_texto{

	position: absolute;
	visibility: hidden;
	display: inline-block;
	z-index: 11;
	
	overflow: hidden;
	display: inline-block;
}
.cont_globo_texto{
	padding: 30px;
}
.cont_enlace_principal,.cont_enlace_principalb
{
	
	
	overflow: hidden;
	display: inline-block;
	float: left;
	margin-top: 7.1px;
	width:auto;
	
	
}
.cont_enlace_principalb{
	display: inline-block;
	float: left;
	
	margin-top: 20px;
	text-align: right;
}
.cont_enlace_circulos_internos
{
	
	
	overflow: hidden;
	text-align: right;
	
	
	
}

.cont_enlace_globo_texto
{
	
	overflow: hidden;
	display: inline-block;
	vertical-align: top;
	margin-top: 39px;

	
	
}

.enlace_principal,.enlace_principalb{
	display: inline-block;
	
	float: right;
  	

  	border-top: 16px solid transparent;
 	border-bottom: 16px solid transparent;
  
  	border-right: 16px solid #1D1D1B;
  	
}
.enlace_principalb{
	border-bottom: 0px solid #1D1D1B;
  	border-right: 5px solid transparent;

  	
}

.enlace_circulos_internos{
	display: inline-block;
	float:right;
	margin-right: 20px;
	position: relative;
	border-bottom: 20px solid #4d4d4d;
  	border-left: 15px solid transparent;
  	
  	
}

.enlace_globo_texto{
	display: inline-block;
	float:left;
	position: relative;
	border-top: 30px solid rgb(249,249,249);
	border-top: 30px solid #0066D0;

  	border-left: 25px solid transparent;
  	z-index: 7;
}

.enlace_globo_texto2{
	display: inline-block;
	float:left;
	position: relative;
	border-top: 30px solid rgb(249,249,249);
	border-top: 30px solid #0066D0;

  	border-right: 25px solid transparent;
  	margin-left: -4px;
  	z-index: 7;
}

.enlace_principal2{
	

	
	border-bottom: 20px solid #1D1D1B;
  	border-right: 15px solid transparent;
  	float: left;
  	margin-left: 20px;
}
.enlace_principal2{
	

	
	border-bottom: 20px solid #1D1D1B;
  	border-right: 15px solid transparent;
  	float: left;
  	margin-left: 20px;
}
.over_principal{
	overflow: hidden;
	display: inline-block;
	
	margin-top: -1px;
	position: relative;
	background-color: rgb(255,77,154);
	background: -webkit-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* Standard syntax */
	
	background: -webkit-linear-gradient(90deg,rgba(72,72,72,1),rgba(0,0,0,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(90deg,rgba(72,72,72,1),rgba(0,0,0,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(90deg,rgba(72,72,72,1),rgba(0,0,0,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(90deg,rgba(72,72,72,1),rgba(0,0,0,1)); /* Standard syntax */

  	background: #1D1D1B;

	
	margin-left: -6.5px;

	padding: 15px 20px 15px 20px;
	color: #ffffff;
	
	font-family: "Stem-Regular";
	font-size: 18px;
	line-height: 18px;
	border-radius:50px;
	
	
}
.over_principalb{
	background-color: transparent;
	padding: 0;
	

	display: inline-block;
	float: left;
	width: auto;
	
	padding: 25px 35px;
	border-radius: 10px;
	background-color: #ffffff;
	box-shadow: 0 0 10px rgba(0,0,0,0.3);
	font-family: "Stem-Regular";
	margin:10px 0 10px 10px;

}

.over_circulos_internos{

	display: inline-block;
	float::left;
	margin-left: -1px;
	position: relative;
	background-color: rgb(0,77,154);
	background: -webkit-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* Standard syntax */

  	background: -webkit-linear-gradient(90deg,rgba(72,72,72,1),rgba(0,0,0,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(90deg,rgba(72,72,72,1),rgba(0,0,0,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(90deg,rgba(72,72,72,1),rgba(0,0,0,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(90deg,rgba(72,72,72,1),rgba(0,0,0,1)); /* Standard syntax */

	background:#4d4d4d;
	padding: 10px 20px 10px 20px;
	color: #ffffff;
	font-family: "Stem-Regular";
	font-size: 17px;
	line-height: 17px;
	border-radius:30px;
 

	
	
}

.globo_texto{
	display: inline-block;
	float::left;
	margin-left: -2px;
	position: relative;
	text-align: center;
	background: -webkit-linear-gradient(rgba(255,255,255,1),rgba(250,250,250,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgba(255,255,255,1),rgba(250,250,250,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgba(255,255,255,1),rgba(250,250,250,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgba(255,255,255,1),rgba(250,250,250,1)); /* Standard syntax */


	box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
	padding: 25px;
	color: rgba(128,128,128,1);
	color:#636466;
	font-family: "Stem-Regular";
	font-size: 17px;
	line-height: 21px;
	border-radius: 40px;
	max-width: 700px;

	border: 3px solid #0066D0;

	background:#0066D0;
  	color:#ffffff;

}
.mensaje_avance{
	
	
	width: 547px;
	background: -webkit-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* Standard syntax */
  	background: #620283;
	visibility: hidden;
	overflow: hidden;
	font-family: "Stem-Regular";
	font-size: 17px;
	line-height: 19px;
	color:rgba(0,77,154,1);
	border:0px solid #FFFFFF;
	border-radius: 20px;
	z-index: 104;
	text-align: center;
	color:#ffffff;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
	border-radius: 50px;
	border: 0px solid #e5007d;
	overflow: visible;

	position: relative;
	

}


.equis_mensaje{
	position: absolute;
	font-family: "sosa";
	display: inline-block;
	float: left;
	font-size: 20px;
	height: 35px;
	width:35px;
	top: 0px;
	right: -35px;	
    cursor:pointer;
    z-index: 3;
 


	color:#333333;
	width:35px;
	height:35px;
	border-radius:20px;
	font-family:"sosa";
	line-height: 35px;
	margin-left:7px;
	font-size:18px;
	cursor: pointer;
	display: inline-block;
	background-color: #FCAB00;
	color:#620283;
	box-shadow: 0 0 10px rgba(0,0,0,.2);

}
.equis_mensaje:hover{
	background-color: #06CFDC;
	
}
.texto_mensaje_avance{
	display: inline-block;

	
	margin: 40px 40px 35px 40px;
	padding-left: 20px;
	position: relative;
	text-align: left;
}

.texto_mensaje_avance:before {
  content:''; 
  width:0px; 
  height:100%; 
  background:#620283; 
  background: linear-gradient(#620283 0, #620283 25%, #e5007d 25%, #e5007d 50%, #620283 50%, #620283 100%);
  position:absolute; 
  left:0px;
  top:0px;


  border-radius: 10px;
  
}

.simbolos,.simbolos_color,.simbolos_pop{
	font-family: 'sosa';
	vertical-align: top;
	position: relative;
	padding: 0;
	margin: 0;
	
	
}
.simbolos_color{
	color:#620283;
	padding-right: 10px;
	text-shadow: 0 1px #4d4d4d;

}
.simbolos_pop{
	color: rgba(255,231,1,1);
}
.texto_titulo_pantalla{
	vertical-align: top;
	
	position: relative;
	padding: 0;
	
	
}
.simbolos_texto{
	font-family:'agcb';
	vertical-align: top;
	position: relative;
	padding: 0;
	margin: 0;
	
	color:rgba(236,27,35,1);
	

}
.simbolos_texto2{
	font-family:'agcb';
	vertical-align: top;
	padding: 0;
	margin: 0;
	
}
.negrilla_descripcion{
	font-weight:900;
}
.italica{
	font-style: italic;
}
.resaltado_especial{
	background: #ffffff; /* For browsers that do not support gradients */

	border-style: solid;
 	border: 2px solid #620283;
 	
 	border-radius: 0px;
 	
 	width:auto;
 	padding: 15px 35px; 
 	font-size: 16px;
 	line-height: 25px;
	font-family: "Stem-Regular";

	
	text-align: left;
	height: auto;
	
	color:#1D1D1B;

	background-color: transparent;

	box-shadow: 0 0 0px rgba(0,0,0,0.3);

	margin:5px;
 	
}
.resaltado_especial2{
	background: #ffffff; /* For browsers that do not support gradients */

	border-style: solid;
 	border: 0px solid #555759;
 	border-radius: 0px;
 
 	
 	width:auto;
 	padding: 15px 35px; 
 	
 	font-size: 16px;
 	line-height: 21px;
	font-family: "Stem-Regular";
	
	
	text-align: left;
	height: auto;
	margin:5px;
	background-color: transparent;
	background-color: #0066D0;
	color:#ffffff;

	box-shadow: 0 0 0px rgba(0,0,0,0.3);

 
}
.texto_fin{
	position:absolute;
	top:0;
	left:0;
	visibility: hidden;
}


.menu_principal,.menu_visto,.menu_abierto{
	width: 60px;
	height:24px;
	border-radius:25px;
	background-color: white;
	position:absolute;
	top:0;
	left:0;
	visibility: hidden;
	cursor: pointer;

	text-align: center;
	font-family: "Stem-Bold";
	font-size: 16px;
	z-index: 10;
	
	border:0px solid #333333;
	color:#fbb900;
	
	
	line-height: 26px;
	background-color:rgba(0,0,0,.1);
	background-color: #F2F2F2;

  	border-color: #E6E6E6;
  	border:1px solid #ffffff;
	background-color: #ffffff;
	border-radius: 0 0 10px 0;
	
}


.desarrollado,.desarrollado_activo{
	box-shadow: 0px 0px 1px rgba(0,0,0,.5);
	height: 26px;
	width: 26px;
	font-family: "agcb";
	
	font-size: 17px;
	line-height: 26px;
	
	display: flex;
    align-items: center;
	justify-content: center;
	border-radius:20px 0px 0px 20px;
	color:#4b494d;
	position: absolute;
	background-color: #012E6F;
	

	top:0;
	left:0;
	cursor: pointer;
	visibility: hidden;

	box-shadow: 0px 3px 5px rgba(0,0,0,0.1);
	

	background-color: #620283;
	line-height: 40px;
	height: 40px;
	width:40px;
	color:#ffffff;
	font-size:27px;
	z-index: 11;
	
}
.desarrollado_activo{
	box-shadow: 0 3px 5px rgba(0,157,223,0.3);
	color:#3d3d3d;

	

}
.desarrollado:hover{
	box-shadow: 0 3px 5px rgba(0,157,223,0.3);
	color:#3d3d3d;


}

.logo_didacsis{
	font-family: "robot";
	position: absolute;
	top:0;
	left:0;
}

.linea_verde{
	height: 3px;
	width:100%;
	background-color:#c6205d;
	background-color:#bcbe00;
	margin:20px 0;
	

}
.simbolo_retroalimentacion{
	position: absolute;
	top:0;
	font-family: "sosa";
	font-size: 40px;
	padding: 8px;
	color:white;
	border-radius: 50%;
	visibility: hidden;
	
	background-color:#620283;

	z-index: 10;
	width:50px;
	height:50px;
	line-height:50px;
	text-align: center;
	


	
}
.loader{
	position: absolute;
	left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    top:35%;
    display: none;
    z-index: 0;
}
.logo_cliente,.logo_cliente2{
	position:absolute;
	visibility: hidden;
	top:0;
	left:0;
	
}
.logo_cliente{
	background-color: #009ee3;
	background-color: #009ee3;
	background-color: #F1F1F1;
	background-color: #dcdcdc;
	background-color: rgba(0,158,227,.4);
	background-color: #ffffff;

	box-shadow: 0 5px 5px rgba(0,0,0,.23);
	box-shadow: 0 4px 2px -2px rgba(0,0,0,.23);
	width:1260px;
	height:600px;
	border-radius: 20px;
	border:5px solid #620283;
	border:0px solid red;
	
}
.logo_cliente div{
	margin-top: 50px;
	margin-left: 97px;
	width:1155px;
	height:547px;
	background-color: #ffffff;
	border-radius: 20px 80px 20px 20px;
	
}
.logo_cliente2{
	
}
.logo_cliente2{
	
}
.txt_capitulo,.txt_leccion,.num_capitulo{
	color:red;
	
}
.txt_leccion{
	visibility: hidden;
}
.txt_capitulo,.txt_leccion{
	font-family: "Stem-Regular";
	font-size: 8px;
}

.num_capitulo{
	font-family: "Stem-Bold";
	font-size: 50px;
	text-shadow: 0px 0px 7px rgba(0,0,0,.5);
	text-align: center;
	color:#FAAB4F;
}
.txt_capitulo{
	color:#ffffff;
	font-size: 14px;
	margin-top: -5px;
	text-align: center;
	text-shadow: 0 2px 0 rgba(0,0,0,.7);
}
.cont_txt_leccion{
	width:85px;
	height: 25px;
	border-radius: 0 0 0px 10px;
	background-color: #6A6A6A;
	position: absolute;
	visibility: hidden;
}
.img_cap{
	text-align: center;
	margin-top: -17px;
	color:#ffffff;
	text-shadow: 0 0 7px rgba(0,0,0,.95);
	font-size: 35px;
}
.txt_leccion{
	
	padding: 0;
	background-color: transparent;
	width: auto;
	height: auto;
	font-size: 21px;
	color:#DFE0DC;
	font-family: "Stem-Regular";
	
	text-align: left;
	border-radius: 100px;
	
	line-height: auto;
	

}
.txt_leccion_txt{
	position: absolute;
	top:30px;
	left:80px;
	width:1100px;
}
.txt_leccion_txt2{
	position: absolute;
	top:12px;
	left:50px;
	width:1100px;
}
.txt_lecc_1a,.txt_lecc_1b,.txt_lecc_2a,.txt_lecc_2b{


	
	font-family: "Stem-Bold";
	font-size: 33px;
  	text-shadow:0px 4px 0px rgba(0,0,0,.4);
  	line-height: 30px;
  	color:#009ee3;
  	text-align: center;
}
.txt_lecc_2a span{
  	color:#fbb900;
	font-family: "Stem-Regular";


}
.txt_lecc_1a,.txt_lecc_1b{
	font-size: 22px;
	padding-top: 10px;
	font-family: "Stem-Regular";
	color:#ffffff;
	text-shadow: 0 2px 0px rgba(0,0,0,.4);

}
.txt_lecc_1b,.txt_lecc_2b{
	display: inline-block;
	float: left;
	font-size:22px;
	padding-top: 20px;
  	line-height: 18px;
  	color:#333333;
}
.txt_lecc_2b{
	margin-left: 10px;
	color:#e5007d;
}
.cont_tita,.cont_tita2{
	width:430px;
	height:80px;
	background-color: #620283;
	border-radius: 100px;
	padding-left: 10px;
	padding-right: 10px;
}

.cont_tita2{
	width:760px;
	height:60px;
	padding-left: 0px;
	background-color: transparent;
}
.modulo_numero{
	display: inline-block;
	float: left;
	margin-left: 0px;
	font-family:"Stem-Bold";
	color:#ffffff;
	letter-spacing: 2px;
	
}
.corchetes_instrucciones{
	font-family: "agm";
	font-size: 40px;
	color: #e8ae4a;


}

	
.tabla_instruccion{
	color:#636466;	
	font-family: "wlr";
}
.boton_especial{
	position: absolute;
	display: flex;
    align-items: center;
	justify-content: center;
}
.txt_especial{
	background-color: transparent;
	border:1px solid #15A399;
	z-index: -2;
	margin-left: -15px;
	padding: 0 20px 0 30px;
	height: 30px;
	border-radius: 15px;
	color: white;
	color:#15A399;

	display: flex;
    align-items: center;
	justify-content: center;
}

.instruccion_especial,.instruccion_especial2{
	position: absolute;
	top:0;
	left:0;
	visibility: hidden;
	z-index: 3;
	color:rgb(0,147,221);
	
	border: 1px solid #278655;
	border:none;
	width:auto;
	padding: 5px 15px;
	font-family: "Stem-Regular";
	
	font-size: 18px;
	line-height: 30px;
	background-color: #FFFFFF;
	
	border-radius: 230px;
	
	text-align: center;
	box-shadow: 10px 0px 15px transparent;

	color:#15A399;

	color: #620283;
	background-color:transparent;
	z-index: 0;
	
}
.table_decora{
	border-collapse: separate;
	border-spacing: 5px;
}
.th_decora{
	font-family: "Stem-Medium";
	

	line-height: 16px;
	padding: 10px;
	border: 0px solid #e5007d;
	color:#620283;
	border-radius: 0px;
	background: #D6D6D6;
	letter-spacing: 3px;
}
.td_decora{
	font-family: "Stem-Regular";
	color:#1D1D1B;
	border: 0px solid #4d4d4d;
	padding: 5px;
	text-align:center;
	border-radius: 0px;
	background: #E8E8E8;
}

.txt_arrastre,.txt_arrastreclon{
	background-color: #7a3994;
	cursor: pointer;
	padding: 1px 5px;
	border-radius: 35px;
	color:#FFFFFF;
	border:0px solid white;
	box-shadow: 0px 0px 2px rgba(0,0,0,.4);
	white-space:nowrap;	
	z-index: 1;
	
	

	font-family: "Stem-Regular";
	font-size: 18px;
	line-height: 26px;
	height:26px;

	
	width:320px;
	text-align: center;
	
}
.txt_arrastre:hover{
	color:#faab4f;
}
.txt_arrastreclon{
	background-color: #999999;
	border:2px solid white;
	padding: 1px 4px;
	color:#FFFFFF;
	box-shadow: 0px 0px 5px rgba(0,0,0,0);
	cursor:none;
	
}

.texto_arrastretxt{
	font-family: "scala";
	width:520px;
	font-size: 17px;
	display: inline-block;
	float:left;
	padding: 40px 0px 0px 40px;
	line-height: 31px;

	

}
.opciones_arrastretxt{
	width: 560px;
	display: inline-block;
	float:left;
	margin-top: 20px;
}

.opcion_arrastretxt,.opcion_arrastretxt2{
	width:230px;
	height:100px;
	
	border-radius: 10px;
	color:rgba(102,102,102,1);
	
  	z-index: 1;
}
.opcion_arrastretxt{
	border: 2px solid rgba(219,219,219,.8);
	padding: 15px;
	margin:7px;
	display: inline-block;
	float:left;
	background: -webkit-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* Standard syntax */
}
.opcion_arrastretxt2{
	width:350px;
	height: 48px;
	white-space:nowrap;	
	
	border: 1px solid #620283;
	border-radius: 35px;
	margin-top:5px;
	color:rgba(0,0,0,0);
	background-color: #CCCCCC;
	font-size:26px;
}

.titulo_arrastretxt{
	font-family: "roboto";
	font-size: 17px;
	text-align: center;
	height: 30px;
	border-bottom:1px solid rgba(58,137,177,.3);
	margin-bottom: 10px;
}
.espacio_simbolo_txt{
	display: inline-block;
	float: left;
	width: 90px;
	height: 90%;
	
}


.texto_parrafo{
	line-height: 44px;
	font-size: 20px;
	height: 56px;
	margin-right: 10px;
	font-family: "Stem-Bold";
	color:#4d4d4d;
}

.texto_principal{
	position:absolute;
	overflow: hidden;
	margin-left:370px;
	width:740px;
	font-family: "ProximaNova-Semibold";
	font-size: 21px;
	line-height: 20px;
	border: 0px solid #7a3994;
	border-radius:20px;
	color:#008b92;
	padding:0px;
	text-align: center;
}
.esfera {

	position: absolute;
    width: 120px;
    height: 120px;
    
    text-align: center;
    margin: 0px auto;
    border-radius: 100%;
    box-shadow: inset 0 0 35px #D1E2FF;
    color: #636466;
    padding: 7px;
    font-family: "agcd";
    font-size: 15px;
    display:flex;		
    align-items:center;
    justify-content: center;
    cursor: pointer;
    z-index: 1;

    
}
.esfera_selec{
    position: absolute;
    width: 120px;
    height: 120px;
    
    text-align: center;
    margin: 0px auto;
    border-radius: 100%;
    box-shadow: inset 0 0 35px #E9AF63;
    color: #EE8A0A;
    padding: 7px;
    font-family: "agcd";
    font-size: 15px;
    display:flex;		
    align-items:center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;

}

.esfera_selec:hover{
    
    box-shadow: inset 0 0 40px #EE8A0A;
    color:#EE8A0A;
    z-index: 3;

}
.esfera:hover{

    box-shadow: inset 0 0 40px #14A399;
    color:#14A399;
    z-index: 2;

}
.animacion1{
    animation: bubble-anim 3s ease-out 0s infinite;
}
.animacion2{
    animation: bubble-anim 2.5s ease-out 0.5s infinite;
}
.animacion3{
    animation: bubble-anim 2s ease-out 1s infinite;
}

.contenedor_vf{
	display: flex;
    align-items: center;
	justify-content: center;

	
}




.enunciado_vf{
	width: 1050px;
	font-family: "Stem-Regular";
	font-size: 18px;
	color:#4D4D4D;
	text-align: right;
	padding: 5px;
	padding-left:40px;
	padding-right:10px;
}
.verdadero, .falso,.vf_seleccionado{
	width:40px;
	height:40px;
	display: flex;
    align-items: center;
	justify-content: center;
	text-align: center;
	background-color: white; 
	border:3px solid #620283;
	cursor:pointer;
	border-radius:10px;
	font-family: "Stem-Bold";
	box-shadow: 0px 0px 5px rgba(0,0,0,.4);
	font-size: 25px;
	color:#1D1D1B;
	margin:5px;


}
.vf_seleccionado:hover{
	opacity:0.8;
}
.vf_seleccionado,.verdadero:hover, .falso:hover{
	background-color: #620283; 
	color:#FCAB00;

}
.vf_seleccionado{
	border-color:#FCAB00;
}
@keyframes bubble-anim {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1); }

  20% {
    -webkit-transform: scaleY(0.95) scaleX(1.05);
    transform: scaleY(0.95) scaleX(1.05); }

  48% {
    -webkit-transform: scaleY(1.1) scaleX(0.9);
    transform: scaleY(1.1) scaleX(0.9); }

  68% {
    -webkit-transform: scaleY(0.98) scaleX(1.02);
    transform: scaleY(0.98) scaleX(1.02); }

  80% {
    -webkit-transform: scaleY(1.02) scaleX(0.98);
    transform: scaleY(1.02) scaleX(0.98); }

  97%, 100% {
    -webkit-transform: scale(1);
    transform: scale(1); } }

.zoom,.instruccion_nav{
	-moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    position:absolute;
	top:0;
	left:0;
	z-index: 20;
	background-color: rgba(142,142,142,0.97);
	width:100%;
	height:100%;
	visibility:hidden;
	display: -webkit-flex; /* Safari */
    -webkit-align-items: center; /* Safari 7.0+ */
    display: flex;
    align-items: center;
}
.instruccion_nav{
	background-color: rgba(142,142,142,0.97);

}
.instruccion_navtxtx{
	font-family: "Stem-Bold";
	color:#ffffff;
	font-size: 27px;
	position: absolute;
}
.ayuda{
	background-color:#fbb900;
	color:#4d4d4d;
	border-radius: 10px;
	padding: 10px 30px;
	font-size: 18px;
	margin-bottom: 20px;
}
.equis_zoom{

	
	padding: 4px 9px;
	background-color: #620283;
	position: absolute;
	top: 0px;
	right: 10px;
	font-family: "Stem-Regular";
	font-size:12px;
	border-radius: 0 0 7px 7px;
	color:#FFFFFF;
	border-bottom: 3px solid #666666;
	
	z-index: 20;
	text-align: center;
	cursor: pointer;
	letter-spacing: 3px;
}
.equis_zoom:hover{
	background-color: #0066D0;
}
.equis_zoom div{
	border-left:1px solid #ffffff;
	color:#FCAB00;
	width:21px;
	height:21px;
	border-radius:0px;
	font-family:"sosa";
	line-height: 21px;
	margin-left:7px;
	font-size:15px;
	cursor: pointer;
	display: inline-block;
	padding-left: 5px;



}

.boton_zoom,.boton_zoom_a,.boton_zoom_visto{
	
	
	border-radius: 25px;
	font-family: "Stem-Regular";
	border:2px solid #ffffff;
	
  	font-size: 16px;
  	text-align: left;
  	

  	color: #fbb900;
  	cursor:pointer;
  	z-index: 3;
  	padding:5px 10px;
  	
  	background-color: #7a3994;
  	box-shadow: 0px 0px 7px rgba(0,0,0,.5);
  	margin:10px;
  	cursor: pointer;
  	text-align: center;
  	color: #7a3994;
	background-color: #fbb900;
	letter-spacing: 3px;


}
.btn_ini{
	position: absolute;
	top:0;
	left:0;
	background: linear-gradient(-45deg, #0066D0, #06CFDC, #0066D0, #06CFDC);
	
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	color:#ffffff;
	font-family: "Stem-Regular";
	font-size:24px; 
	padding: 0;
	border-radius: 10px;
	box-shadow: 0 0 7px #4d4d4d;
	text-shadow: 1px 0 0px #4d4d4d;
	cursor: pointer;
	visibility: hidden;
	z-index: 4;
	border: 5px solid #320049;
	letter-spacing: 2px;
	
}
.btn_ini div{
	border: 2px solid #ffffff;
	position: relative;
	padding: 10px 20px;
	border-radius: 10px;
}
.btn_ini:hover{
	color:#FCAB00;
}
.btn_ruleta{
	
	text-align: center;
}
.btn_ruleta{
	display: inline-block;
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	color:#ffffff;
	font-family: "Stem-Regular";
	font-size:20px; 
	padding: 0;
	border-radius: 10px;
	box-shadow: 0 0 7px #4d4d4d;
	text-shadow: 1px 0 0px #4d4d4d;
	cursor: pointer;
	z-index: 4;
	border: 5px solid #320049;
	letter-spacing: 2px;
	padding: 5px 20px;
}
.btn_ruleta:hover{
	color:#FCAB00;
}
.boton_zoom{
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	color:#ffffff;
}
.boton_zoom_a{
  	box-shadow: 0px 0px 10px  rgba(0,157,223,0.3);

}
.boton_zoom:hover{
	color: #fbb900;
	background-color: #7a3994;
}
.boton_zoom_visto{
	color: #ffffff;
	background-color: #4d4d4d;

}
.boton_zoom_visto:hover{
	background-color: #666666;
	color: #fbb900;

}

.contenido_zoom{
	

	margin: auto;
	
	height: 570px;
	background-position: center center;
	background-repeat: no-repeat;
	margin-top:45px;
}
.contenido_interno_zoom{
	width: 0;
	height: 0;
	
}
.contenedor_zoom{
	position: relative;
	display: inline-block;
}
.txt_video{
	background-color:#E6E6E6;
	border-radius: 20px;
	color:#4d4d4d; 
	padding: 10px;
	text-align: center;
	font-size: 17px;
	line-height: 17px;
	font-style: italic;
	font-family: "Stem-RegularLI";
	padding: 10px 15px;
}
.flecha_down{
 	width:30px;
 	line-height: 20px;
 	-ms-transform: rotate(225deg); /* IE 9 */
    -webkit-transform: rotate(225deg); /* Safari */
    transform: rotate(225deg);
 }
 .flecha_down2{
 	width:30px;
 	line-height: 20px;
 	-ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Safari */
    transform: rotate(-45deg);
 }
  .flecha_right{
 	width:30px;
 	line-height: 20px;
 	-ms-transform: rotate(-180deg); /* IE 9 */
    -webkit-transform: rotate(-180deg); /* Safari */
    transform: rotate(-180deg);
 }
 .flecha_up{
 	width:30px;
 	line-height: 20px;
 	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg);
 }
 .txt_desarrollado{
 	
	font-family: "Stem-Regular";
	color:#999999; 	
	font-size:10px;
	margin-top:10px;
	margin-bottom: 10px;
 }
 .pasos{
 	text-align: center;
 	border: 2px solid #333333;
 	font-size: 27px;
 	line-height: 40px;
 	border-style: solid;
 	border: 2px solid #333333;
 	border-radius: 10px;
 	padding: 8px;
 	margin-top: 20px;
 	background-color: #ffffff;	
 }
 .ind_rotado{
 		-ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Safari */
    transform: rotate(-90deg);
    vertical-align: middle;
 }
 .btn_importante{

 	text-align: center;
 	font-size: 20px;
 	
 
 	margin-top: 15px;
 	padding: 0px;
 }
 .btn_importante div{
 	width: 200px;
 	padding: 5px;
 	box-shadow: 3px 3px 0px #E6E6E6;
 	color:#333333;
 	color:#ffffff;
	font-family: "Stem-Regular";
 	border: 0px solid #636466;
 	
 }
 .negrilla_globo{
 	color:#333333;
 	font-family: "wlb";
 }
  .div_invisible{
 	position: absolute;
 	top:0;
 	left: 0;
 	visibility: hidden;

 }
 .div_txtmenu{
 	position: absolute;
 	top:0;
 	left:0;
 	visibility: hidden;
	width: auto;
	height: 300px;
	font-family: "Stem-Regular";
	color:#ffffff;
	letter-spacing: 3px;
	
	font-size: 13px;
	
	text-align: center;
	
	border-radius:0 30px 30px 0;
	
  	background: #0066D0;

	overflow: hidden;
	width:93px;
	padding: 0;
	line-height: 13px;

 }
  .div_txtmenu div{
	

  }
  .div_txtmenu2{
	
 }
  .txt_creditos{
  	position: absolute;
 	top:0;
 	left:0;
 	visibility: hidden;
	font-family: "Stem-Regular";
	font-size:15px;
	color:#333333;
  }
  .punta_globo{
  	display: inline-block;
	
	border-top: 20px solid #333333;
  	border-right: 15px solid transparent;
  	float: left;
  	margin-top: 30px;
  }
  .listado_txt{
  	margin: 10px 0 0 20px;
  }
  .color_vineta{
  	color: #D10019;
  	font-size: 28px;
  	padding-right: 10px;
  	vertical-align: top;
  }

  .mas_per{
  	position: absolute;
  	top:0;
  	left:0;
  	visibility: hidden;
  }
  .num_grande{
  	font-size: 40px;
  	color:#D10019; 
  	font-family: "hnb";
  }
  .txt_grafico{
  	position:absolute;
  	font-size:12px;
  	line-height:12px;
  	color:#D10019;
  	padding:5px;
  	background-color:#ffffff;
  	border:1px solid #D10019;
  	border-radius: 0 0 10px 0;
  	letter-spacing: 3px;
  }
  .oculto_loader{
  	position: absolute;
  	visibility: hidden;
  	z-index: -10;
  }
  .menu_visto{
  	background-color: #e5007d;
	background-color:rgba(0,0,0,.1);
	background-color: #ffffff;
  	color:#fbb900;
  }

  .menu_abierto{
  	
  	background-color: #420F5F;
	background-color:rgba(0,0,0,.1);
  	background-color: #ffffff;

  	color:#FAAB4F;
  }
  .btn_volver{
	
	position: absolute;
	background: -webkit-linear-gradient(rgba(255,0,0,1),rgba(209,0,25,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgba(255,0,0,1),rgba(209,0,25,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgba(255,0,0,1),rgba(209,0,25,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgba(255,0,0,1),rgba(209,0,25,1)); /* Standard syntax */
  	border-color: #D10019;
	top:0px;
	text-align: center;
	font-family: "Stem-Bold";
	font-size: 17px;
	color:rgb(127,117,108);
	color:rgb(255,231,1);
	color:#ffffff;
	padding: 5px 10px;
	z-index:4;
	visibility: hidden;
	border-radius: 15px;

  }
.btn_volver:hover{
	
	cursor:pointer;
	background: -webkit-linear-gradient(rgba(209,0,25,1),rgba(255,0,0,1)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgba(209,0,25,1),rgba(255,0,0,1)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgba(209,0,25,1),rgba(255,0,0,1)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgba(209,0,25,1),rgba(255,0,0,1)); /* Standard syntax */
  	border-color: #D10019;

}
.imgup{
	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg)
}
.contenedor_loader_inicio{
	position: absolute;
	top:0;
	left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
   
   	z-index: 0;
   	width:100%;
   	height: 100%;
   	z-index: -1;
  

}
.contenedor_loader_inicio{
	background: transparent;
}
.loader_inicio,
.loader_inicio:before,
.loader_inicio:after {

  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: loadb 1.8s infinite ease-in-out;
  animation: loadb 1.8s infinite ease-in-out;
}
.loader_inicio {
  color: #FCAB00;
  font-size: 40px;
  margin: 0px auto;
  position: relative;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
  margin-top:135px;
}
.loader_inicio:before,
.loader_inicio:after {
  content: '';
  position: absolute;
  top: 0;
}
.loader_inicio:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader_inicio:after {
  left: 3.5em;
}
@-webkit-keyframes loadb {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
@keyframes loadb {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

.spinner {
	position: absolute;
	top:0;
	left: 0;
	right: 0;
  margin: 230px auto;
  width: 130px;
  height: 130px;
  text-align: center;
  
  -webkit-animation: sk-rotate 2.0s infinite linear;
  animation: sk-rotate 2.0s infinite linear;
  border:1px solid transparent;
}

.dot1, .dot2 {
  width: 60%;
  height: 60%;
  display: inline-block;
  position: absolute;
  top: 0;
  background-color: #fbb900;
  border-radius: 100%;
  
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.dot2 {
  top: auto;
  bottom: 0;
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-rotate { 100% { -webkit-transform: rotate(360deg) }}
@keyframes sk-rotate { 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg) }}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}

.arrow {
 color:#FCAB00;

 display: inline-block;
 
}
.rotaterect{
	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg);
}
.bounce {
	-webkit-animation-name: bounce;
	-moz-animation-name: bounce;
	-o-animation-name: bounce;
	animation-name: bounce;
}
.bounce2 {
	-webkit-animation-name: bounce2;
	-moz-animation-name: bounce2;
	-o-animation-name: bounce2;
	animation-name: bounce2;
}
.bounceup {
	-webkit-animation-name: bounceup;
	-moz-animation-name: bounceup;
	-o-animation-name: bounceup;
	animation-name: bounceup;
}
.animated{-webkit-animation-fill-mode:both;
-moz-animation-fill-mode:both;
-ms-animation-fill-mode:both;
-o-animation-fill-mode:both;

            animation-iteration-count: infinite;
       -moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;

animation-fill-mode:both;
-webkit-animation-duration:2s;
-moz-animation-duration:2s;
-ms-animation-duration:2s;
-o-animation-duration:2s;
animation-duration:2s;
}


@-webkit-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-webkit-transform: translateX(0);}	40% {-webkit-transform: translateX(-10px);}
	60% {-webkit-transform: translateX(-3px);}
}

@-moz-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-moz-transform: translateX(0);}
	40% {-moz-transform: translateX(-10px);}
	60% {-moz-transform: translateX(-3px);}
}

@-o-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-o-transform: translateX(0);}
	40% {-o-transform: translateX(-10px);}
	60% {-o-transform: translateX(-3px);}
}
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {transform: translateX(0);}
	40% {transform: translateX(-10px);}
	60% {transform: translateX(-3px);}
}



@-webkit-keyframes bounce2 {
	0%, 20%, 50%, 80%, 100% {-webkit-transform: translateX(0);}	40% {-webkit-transform: translateX(10px);}
	60% {-webkit-transform: translateX(3px);}
}

@-moz-keyframes bounce2 {
	0%, 20%, 50%, 80%, 100% {-moz-transform: translateX(0);}
	40% {-moz-transform: translateX(10px);}
	60% {-moz-transform: translateX(3px);}
}

@-o-keyframes bounce2 {
	0%, 20%, 50%, 80%, 100% {-o-transform: translateX(0);}
	40% {-o-transform: translateX(10px);}
	60% {-o-transform: translateX(3px);}
}
@keyframes bounce2 {
	0%, 20%, 50%, 80%, 100% {transform: translateX(0);}
	40% {transform: translateX(10px);}
	60% {transform: translateX(3px);}
}


@-webkit-keyframes bounceup {
	0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}	40% {-webkit-transform: translateY(-10px);}
	60% {-webkit-transform: translateY(-3px);}
}

@-moz-keyframes bounceup {
	0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
	40% {-moz-transform: translateY(-10px);}
	60% {-moz-transform: translateY(-3px);}
}

@-o-keyframes bounceup {
	0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
	40% {-o-transform: translateY(-10px);}
	60% {-o-transform: translateY(-3px);}
}
@keyframes bounceup {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-10px);}
	60% {transform: translateY(-3px);}
}
.icono_graf,.icono_graf_visto{
	display: inline-block;
	float: left;
	font-size: 40px;
	text-align: center;
	line-height: 70px;
	width:70px;
	height: 70px;
	border:5px solid #e5007d;
	border-radius: 0px;
	background-color: white;
	color:#e5007d;
	box-shadow: 0 0 3px rgba(0,0,0,.45);


	background: #ffffff;

	background-size: 400% 400%;
}
.icono_graf{
	animation: colortxtchange 1.5s infinite alternate;

}
 @keyframes colortxtchange
    {
     0% {
		color: #0066D0;
		border-color: #0066D0;
	}
	100% {
		color:#06CFDC;
		border-color:#06CFDC;
	}
    }

@-webkit-keyframes colortxtchange /* Safari and Chrome - necessary duplicate */
      {
     0% {
		color: #620283;
		border-color: #620283


	}
	100% {
		color:#E31F83;
		border-color:#E31F83

	}
    }

.icono_graf_visto{
	border-color: #999999;
	background:#ffffff; 
	color:#999999;
}
.txt_graf,.txt_graf_visto{
	display: inline-block;
	float: left;
	margin-top: 30px;
	margin-left: 0px;
	font-family: "Stem-Regular";
	color:#ffffff;

	width: 100%;
	height: 100%;
	padding-right: 40px;
	letter-spacing: 3px;
}
.txt_graf_visto{
	

}

.img-graf,.img-graf-fadein{
	position: absolute;
	opacity: 0;
}
.img-graf-fadein{
	opacity: 1;
 


            -webkit-animation: fadeintoright 2s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadeintoright 2s; /* Firefox < 16 */
        -ms-animation: fadeintoright 2s; /* Internet Explorer */
         -o-animation: fadeintoright 2s; /* Opera < 12.1 */
            animation: fadeintoright 2s;
}

@keyframes fadeintoright {
    from { opacity: 0; margin-left: -20px; }
    to   { opacity: 1; margin-left: 0; }
}

/* Firefox < 16 */
@-moz-keyframes fadeintoright {
    from { opacity: 0; margin-left: -20px; }
    to   { opacity: 1; margin-left: 0; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadeintoright {
    from { opacity: 0; margin-left: -20px; }
    to   { opacity: 1; margin-left: 0; }
}

/* Internet Explorer */
@-ms-keyframes fadeintoright {
    from { opacity: 0; margin-left: -20px; }
    to   { opacity: 1; margin-left: 0; }
}

/* Opera < 12.1 */
@-o-keyframes fadeintoright {
     from { opacity: 0; margin-left: -20px; }
    to   { opacity: 1; margin-left: 0; }
}

.zona-grow{
	transform: scale(1,1);
	cursor: pointer;
 
            -webkit-animation: crece 2s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: crece 2s; /* Firefox < 16 */
        -ms-animation: crece 2s; /* Internet Explorer */
         -o-animation: crece 2s; /* Opera < 12.1 */
            animation: crece 2s;
}

.escala0{
	transform: scale(0,0);

}

@keyframes crece {
    from { transform: scale(0,0); }
    to   { transform: scale(1,1); }
}

/* Firefox < 16 */
@-moz-keyframes crece {
   from { transform: scale(0,0); }
    to   { transform: scale(1,1); }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes crece {
 from { transform: scale(0,0); }
    to   { transform: scale(1,1); }
}

/* Internet Explorer */
@-ms-keyframes crece {
    from { transform: scale(0,0); }
    to   { transform: scale(1,1); }
}

/* Opera < 12.1 */
@-o-keyframes crece {
    from { transform: scale(0,0); }
    to   { transform: scale(1,1); }
}

.describe_imagen{
	font-family: "PFBeauSansPro-Thin";
	line-height:17px;
	padding: 0 20% 40px 20%;
	text-align: center;
	background-image:url("images/sombra_esp.png");
	background-repeat: no-repeat;
	background-position: center bottom;

}
.linea_graf{
	background-color: #008b92;
	padding: 0;
}
.orientacion{
	position: absolute;

	font-family: "ProximaNova-Semibold";
	font-size:80px;
	width:100%;
	height:100%;
	z-index: 100;
	background-color: #ffffff;
	color:#009898;
	display:flex;		
    align-items:center;
    justify-content:center;
    flex-direction: column;
    text-align: center;
    visibility: hidden;
}
.circulos_botones_abiertos,.circulos_botones_abiertos2,.circulos_botones_vistos,.circulos_botones_cerrados{
	position: absolute;
 	top:0;
 	left: 0;
 	visibility: hidden;
 	z-index: 2;
 	width:185px;
	height:240px;
	border-radius: 150px;
	z-index: -1;
	cursor: pointer;
	background-color: #620283;
	box-shadow: 0px 5px 12px rgba(0,0,0,.3);
	border:0px solid #ffffff;
	
}
.circulos_botones_abiertos{
	background-color: #620283;
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	color:#ffffff;
}
.circulos_botones_abiertos2{
	background-color: #0066D0;

}
.circulos_botones_cerrados{
	background-color: #898991;
}

.cb_int_abierto,.cb_int_visto,.cb_int_cerrado{
	border:4px solid #ffffff;
	
	border-radius: 150px;
	width: 157px;
	height: 212px;
	margin: 10px;
	

}
.cb_int_visto{
	border-color: #ffffff;
	background-color: #620283;
}
.cb_int_cerrado{

	border-color: #ffffff;

}
.circulos_botones_sel{
	background-color: #7a3994;
	

}
.btn_abierto,.btn_visto,.btn_cerrado{
	position: absolute;
	bottom: 0px;
	
	right: -5px;
	width:50px;
	height: 50px;
	border-radius: 50%;
	
	background-color: #ffffff;
	font-family: "sosa";
	color:#620283;
	font-size: 37px;
	line-height: 50px;
	text-align: center;
	box-shadow: 0 0 15px rgba(0,0,0,.7);
	border:3px solid #7a3994;
}
.btn_visto{
	border-color:#ffffff;
	color:#620283;
	background-color: #ffffff;


}
.btn_cerrado{
	background-color: #ffffff;
	color:#898991;
	border-color: #ffffff;
}
.btn_abierto{
	border-color:#ffffff;
	color:#0066D0;
	background-color: #ffffff;


}
.btn_abierto:before {
  content: "ê";
}

.btn_visto:before {
  content: "å";
}
.btn_cerrado:before {
  content: "è";
}
.barra_azul{
	position: absolute;
	top:5px;
	left:17px;
	background-color: #008b92;
	width:3px;
	height: 47px;
	border-radius: 3px;
	box-shadow: 0 0 5px rgba(0,0,0,.35);
}
.nombre_escuela{
	position: absolute;
	top:0;
	left:0;
	
	visibility: hidden;
}
.nombre_escuela span{
	
}
.nombre_escuela div{
	
}
.nombre_escuela div span{
	
	}
.personajes{
	position: absolute;
	top:0;
	left:0;
	visibility: hidden;



	
	overflow: hidden;
	visibility: hidden;
	position: absolute;
	top:0px;
	left: 0;

	border-radius: 100px;
	background: #ffffff;
	box-shadow: 0 0 5px rgba(0,0,0,.5);
	padding: 10px 40px;
	
	padding-left: 250px;
	

}
.personajes div{
	display: inline-block;
	float: left;
	
	height: 65px;
	line-height: 65px;
	
}
.personajes div img{
	vertical-align: middle;
}
.element_per{
	position: absolute;
	top:0;
	left:0;
	visibility: hidden;
	width: 800px; 
	height: 320px;
	background-color: #620283;
	border-radius: 200px 50px 50px 200px; 
	
}
.estado_btnmasinfo{
	font-family: "sosa";
	color:transparent;
	color:#620283;

}
.estado_btnmasinfo2{
	font-family: "sosa";
	color:#620283;
}
.accion_btnmasinfo{
	font-family: "Stem-Bold";
}
.subt_clics{
	
	
	font-family: "ProximaNova-Semibold";
	font-size: 18px;
	display: inline-block;
	position: absolute;
	top:0;
	left:0;

}
.subt_clics div{
	padding: 5px 12px;
	text-align: left;
	background-color: #E6E6E6;
	

	width:200px;
	
	color:#008b92; 
	border-radius: 20px;

	border: 1px solid #008b92;

}
.recuadro_pop{
	border:2px solid #faab4f;
	background-color: white;
	border-radius: 20px;
	padding: 5px;
	margin:5px auto;
}
.num_menu_principal,.simb_menu_principal,.simb_menu_principal_visto,.simb_menu_principal_abierto,.simb_menu_principal_visto_fin{
	display: inline-block;
	float: left;
	width:22px;
	text-align: center;
	line-height: 24px;

}
.num_menu_principal,.num_menu_principal_visto,.num_menu_principal_abierto,.num_menu_principal_abierto2{
	display: inline-block;
	float: left;
	background-color: red;
	width: 33px;
	border-radius: 0 0 10px 0;
	margin: 0px;
	line-height: 20px;
	height:24px; 
	background-color: #1D1D1B;
	color:#ffffff;

}
.num_menu_principal_visto{
	background-color: #e5007d;
	background-color: #620283;

	color:#ffffff;
}
.num_menu_principal_abierto{
	background-color: #ffffff;
	color:#555759;

	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
	color:#ffffff;
}

.num_menu_principal_abierto2{
	background-color: #FCAB00;
	color:#1D1D1B;

}
.simb_menu_principal,.simb_menu_principal_abierto,.simb_menu_principal_visto,.simb_menu_principal_visto_fin{
	display: inline-block;
	float: left;
	font-family: "sosa";
	font-size: 11px;
	width:5px;
	border-radius: 30px;
	width: 15px;
	height: 15px;
	border:2px solid transparent;
	box-shadow: 0 0 2px transparent;
	line-height: 15px;
	margin: 3px 3px 3px 0;
	color:#1D1D1B;
	background-color: #ffffff;
	border-color: transparent;
}
.simb_menu_principal_visto{
	color:#1D1D1B;
	background-color: #ffffff;
	border-color: transparent;
	box-shadow: 0 0 2px transparent;


}
.simb_menu_principal_abierto{
	color:#1D1D1B;
	background-color: #ffffff;
	border-color: transparent;

	box-shadow: 0 0 2px transparent;

}
.simb_menu_principal_visto_fin{
color:#1D1D1B;
	background-color: #ffffff;
	border-color: transparent;
	box-shadow: 0 0 2px transparent;

}
.simb_menu_principal_visto,.simb_menu_principal_visto_fin{
	
}
.simb_menu_principal:before {
  content: 'è';
  
}
.simb_menu_principal_abierto:before {
  content: 'ê';
  
}
.simb_menu_principal_visto:before {
  content: 'å';
  
}
.simb_menu_principal_visto_fin:before {
  content: 'j';
  
}
.fondo_opciones{
	position: absolute;
	width:130px;
	height:260px;
	border:1px solid #620283;
	border-radius: 10px;
	background: #FFFFFF;
	font-family: "Stem-Bold";
	text-align: center;
	font-family: 18px;
	padding-top: 5px;
	color:#620283;
	z-index: -1;
}
.boton_audio,.boton_audio2,.equis_p{
	position: absolute;
	top:0;
	left: 0;
	visibility: hidden;
	z-index: 4;
}
.equis_p{
	border:1px solid red;
	cursor: pointer;
	background-color: #e54c00;
	border:2px solid #ffffff;
	color:#ffffff;
	box-shadow: 0 0 7px rgba(0,0,0,.8);
	cursor: pointer;
	background:linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);

	background-size: 400% 400%;
	width:30px;
	height: 30px;
	line-height: 31.5px;
	text-align: center;
	animation: colorchange 3s ease infinite;
	border-radius: 20px;
	font-size: 19px;
}
.btn_stop_per,.btn_play_per{
	position: absolute;
	top:50%;
	text-align: center;
	width: 0px;
	overflow: hidden;
}
.btn_play_per{
	width: 75px;
}
.boton_audio,.boton_audio2{
	width:70px;
	height:70px;
	background-color: red;
	border-radius: 100%;
	line-height:70px;
	font-size:32px;
	text-align: center;
	background-color: #e54c00;
	border:4px solid #ffffff;
	color:#ffffff;
	box-shadow: 0 0 7px rgba(0,0,0,.8);
	cursor: pointer;
	background: linear-gradient(-45deg, #0066D0, #620283, #0066D0, #620283);

	background-size: 400% 400%;

}
.boton_audio2{
	border-color:#FCAB00;
	color:#FCAB00;
}
.boton_audio{
	animation: colorchange 3s ease infinite;

}

.contiene_boton_audio{
	position: relative;
}

 @keyframes colorchange
    {
     0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
    }

@-webkit-keyframes colorchange /* Safari and Chrome - necessary duplicate */
    {
     0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
    }
    .vineta_color{
    	color:#620283;
    }
    .txt_inf{
	font-family: "Stem-Regular";
	color: #fbb900;
	color: #ffffff;
	text-shadow: 0 0 7px rgba(0,0,0,0.9);
	font-size: 37px;
	padding-left: 40px;
    }
    .cantidad_preguntas_cuest{
    	font-size: 20px;
    	text-align: right;
    	margin:20px;
    	visibility: hidden;
	color:#555759;
	color:#ffffff;
	background-color: #4d4d4d;
	background-color: #620283;
	background-color: #004996;
		padding: 3px 20px;
		border-radius: 20px;
    }

     .flecha_inactiva,.flecha_activa,.flecha_activa_sig,.flecha_invisible{
    position: absolute;
	top:0;
	left: 0;
	visibility: hidden;
	z-index: 4;
	cursor:pointer;
	background: #4d4d4d;
	border-radius: 40px;
	height:30px;
	line-height: 30px;
	font-family: "Stem-Regular";
	width: 140px;
	color:#ffffff;
	text-align: center;
    box-shadow: inset 0 0 5px #4d4d4d;

    }
    .inicia_cuestionario{
    	z-index: 4;
	cursor:pointer;
	margin:0 auto;
	background: #4d4d4d;
	border-radius: 40px;
	height:30px;
	font-size: 21px;
	line-height: 30px;
	font-family: "Stem-Regular";
	width: 280px;
	color:#ffffff;
	text-align: center;
    box-shadow: inset 0 0 5px #4d4d4d;

    	background: linear-gradient(-45deg, #F18E32, #F8B328, #F18E32, #F8B328);
	background: linear-gradient(-45deg, #620283, #F8B328, #620283, #F8B328);
  	
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
    }
    .flecha_activa{
	background: #620283;

    }
     .flecha_invisible{
	background-color: blue;

    }
    .flecha_activa_sig{
		background: linear-gradient(-45deg, #F18E32, #F8B328, #F18E32, #F8B328);
	background: linear-gradient(-45deg, #620283, #F8B328, #620283, #F8B328);
  	
	background-size: 400% 400%;
	animation: colorchange 3s ease infinite;
    
    }
    .flecha_activa:hover,.flecha_activa_sig:hover,.inicia_cuestionario:hover{
    	color: #FFDC5E;
    }
        .txt_inf{
	font-family: "Stem-Regular";
	color: #fbb900;
	color: #ffffff;
	text-shadow: 0 0 5px rgba(0,0,0,0.9);
	font-size: 37px;
    }

    .esfera {

	position: absolute;
    width: 120px;
    height: 120px;
    
    text-align: center;
    margin: 0px auto;
    border-radius: 100%;
    box-shadow: inset 0 0 35px #D1E2FF;
    color: #636466;
    padding: 7px;
    font-family: "Stem-Regular";
    font-size: 15px;
    display:flex;		
    align-items:center;
    justify-content: center;
    cursor: pointer;
    z-index: 1;

    
}
.esfera_selec{
    position: absolute;
    width: 120px;
    height: 120px;
    
    text-align: center;
    margin: 0px auto;
    border-radius: 100%;
    box-shadow: inset 0 0 35px #E9AF63;
    color: #EE8A0A;
    padding: 7px;
    font-family: "Stem-Bold";
    font-size: 15px;
    display:flex;		
    align-items:center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;

}

.esfera_selec:hover{
    
    box-shadow: inset 0 0 40px #EE8A0A;
    color:#EE8A0A;
    z-index: 3;

}
.esfera:hover{

    box-shadow: inset 0 0 40px #14A399;
    color:#14A399;
    z-index: 2;

}
.animacion1{
    animation: bubble-anim 3s ease-out 0s infinite;
}
.animacion2{
    animation: bubble-anim 2.5s ease-out 0.5s infinite;
}
.animacion3{
    animation: bubble-anim 2s ease-out 1s infinite;
}
.contenedor_globos{
	display: flex;
	overflow: hidden;
	height: 400px;
	
}


.contenedor_loaderint,.escena{
	position: absolute;
	left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
   
   	z-index: 0;
   	background-color: transparent;
   	width:100%;
   	height: 100%;
   	z-index: -1;
   
}
.escena{
	visibility: hidden;
	color:red;
	padding-top: 15px;
}


.loaderint {
  margin: 150px auto;
  font-size: 25px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  text-indent: -9999em;
  -webkit-animation: load5 1.1s infinite ease;
  animation: load5 1.1s infinite ease;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
@-webkit-keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #009CD0, 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.5), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.7), 1.8em -1.8em 0 0em #009CD0, 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.5), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.7), 2.5em 0em 0 0em #009CD0, 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.5), 2.5em 0em 0 0em rgba(0, 156, 208, 0.7), 1.75em 1.75em 0 0em #009CD0, 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.5), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.7), 0em 2.5em 0 0em #009CD0, -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.5), 0em 2.5em 0 0em rgba(0, 156, 208, 0.7), -1.8em 1.8em 0 0em #009CD0, -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.5), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.7), -2.6em 0em 0 0em #009CD0, -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.5), -2.6em 0em 0 0em rgba(0, 156, 208, 0.7), -1.8em -1.8em 0 0em #009CD0;
  }
}
@keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #009CD0, 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.5), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.7), 1.8em -1.8em 0 0em #009CD0, 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.5), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.7), 2.5em 0em 0 0em #009CD0, 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.5), 2.5em 0em 0 0em rgba(0, 156, 208, 0.7), 1.75em 1.75em 0 0em #009CD0, 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.5), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.7), 0em 2.5em 0 0em #009CD0, -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.2), -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.5), 0em 2.5em 0 0em rgba(0, 156, 208, 0.7), -1.8em 1.8em 0 0em #009CD0, -2.6em 0em 0 0em rgba(0, 156, 208, 0.2), -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.5), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.7), -2.6em 0em 0 0em #009CD0, -1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0, 156, 208, 0.2), 1.8em -1.8em 0 0em rgba(0, 156, 208, 0.2), 2.5em 0em 0 0em rgba(0, 156, 208, 0.2), 1.75em 1.75em 0 0em rgba(0, 156, 208, 0.2), 0em 2.5em 0 0em rgba(0, 156, 208, 0.2), -1.8em 1.8em 0 0em rgba(0, 156, 208, 0.5), -2.6em 0em 0 0em rgba(0, 156, 208, 0.7), -1.8em -1.8em 0 0em #009CD0;
  }
}
.opcion_preg,.opcion_preg2{
	background-color: #620283;
	border-radius: 40px;
	box-shadow: 0px 0px 0 #cccccc;
	border-bottom: 6px solid #cccccc;
	color:#FFFFFF;
	margin: 15px 0; 
	padding: 10px 20px;
	line-height: 17px;
	cursor: pointer;
	font-size: 17px;
	font-family: "Stem-Regular";
	width: 100%;
	height: 100%;
	margin:5px;

}
.opcion_preg:hover{
	background-color: #7a3994;
}
.opcion_preg2{
	background-color: #e5007d;
}
.opcion_pregimg,.opcion_preg2img{
	border:1px solid #CCC;
	cursor: pointer;
}
.opcion_preg2img{
	background: rgba(98,2,131,.2);
}
.opcion_pregimg:hover,.opcion_preg2img:hover{
	background: rgba(98,2,131,.1);
}
.pop_activ,.pop_activ_aparece{
	position: absolute;
	top:0;
	left:0;
	
	visibility: hidden;
	 background-color: red;
	
	background-color: #4d4d4d;
	color:#ffffff;
	padding: 10px;
	font-family: "Verdana";
	border-radius: 10px;
	max-width: 200px;
	font-size: 15px;
	line-height: 15px;
	text-align: center;
}
.pop_activ_aparece{
	transition: opacity 1s;
	visibility: visible;

}
.txt_arrastre2{
	background-color: #620283;
	width:50px;
	height:30px;
	line-height: 30px;
	text-align: center;
	border-radius: 30px;
	cursor: pointer;
	font-family: "Stem-Bold";
	color:#ffffff;
	border-bottom: 3px solid #FCAB00;

}
.texto_arrastretxt{
	font-family: "scala";
	width:520px;
	font-size: 17px;
	display: inline-block;
	float:left;
	padding: 40px 0px 0px 40px;
	line-height: 31px;

	

}
.opciones_arrastretxt{
	width: 560px;
	display: inline-block;
	float:left;
	margin-top: 20px;
}

.opcion_arrastretxt,.opcion_arrastretxt2{
	width:230px;
	height:100px;
	
	border-radius: 10px;
	color:rgba(102,102,102,1);
	
  	z-index: 1;
}
.opcion_arrastretxt{
	border: 2px solid rgba(219,219,219,.8);
	padding: 15px;
	margin:7px;
	display: inline-block;
	float:left;
	background: -webkit-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Safari 5.1 to 6.0 */
 	background: -o-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(rgb(255,255,255),rgba(219,219,219,.5)); /* Standard syntax */
}
.opcion_arrastretxt2{
	width:450px;
	height: 48px;
	white-space:nowrap;	
	
	border: 1px solid #620283;
	border-radius: 35px;
	margin-top:5px;
	color:rgba(0,0,0,0);
	background-color: #CCCCCC;
	font-size:26px;
	text-align: center;
	
}
.titulo_arrastretxt{
	font-family: "roboto";
	font-size: 17px;
	text-align: center;
	height: 30px;
	border-bottom:1px solid rgba(58,137,177,.3);
	margin-bottom: 10px;
}
.espacio_simbolo_txt{
	display: inline-block;
	float: left;
	width: 90px;
	height: 90%;
	
}


.texto_parrafo{
	line-height: 38px;
	font-size: 20px;
	height: 56px;
	margin-right: 10px;
	font-family: "Stem-Regular";
	color:#4d4d4d;
	letter-spacing: 2px;
}


.texto_principal{
	position:absolute;
	overflow: hidden;
	margin-left:190px;
	width:840px;
	font-family: "ProximaNova-Semibold";
	font-size: 21px;
	line-height: 20px;
	border: 0px solid #7a3994;
	border-radius:20px;
	color:#008b92;
	padding:0px;
	text-align: center;
}

.no_visible{
	opacity: 0;
}
.txt_mod,.txt_mod2{
	color:#620283;
	margin-top: 20px;
	font-family: 'Stem-Regular';
	font-size: 15px;
}
.txt_mod2{
	margin-top: 7px;

}

.mensaje_cierre{
	position: absolute;
	top:0;
	left: 0;
	visibility: hidden;
	padding: 40px;
	font-family: "Stem-Regular";
	color:#4d4d4d;
	width:410px;



	background: linear-gradient(rgba(255,255,255,1),rgba(219,219,219,1)); /* Standard syntax */
  	background: #620283;
	border-radius: 100px;
	z-index: 104;
	text-align: center;
	color:#007935;
	color: #ffffff;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
	border-radius: 20px;
	border: 0px solid #F18E32;
	font-size: 17px;
	line-height: 20px;
	
}
.fondo_general{
	width: 100%;
	height: 100%;
	z-index: 103;
	background-color: rgba(0,0,0,0.3);
	position: absolute;
	top:0;
	left: 0;
	visibility: hidden;
	border-radius: 20px;
}
.btn_salida,.btn_salidab{
	background: linear-gradient(-45deg, #F18E32, #F18E32, #F18E32, #F8B328);
	background-size: 400% 400%;
	background:#FCAB00;
	color:#FFFFFF;
	font-family: "Stem-Medium";
	font-size:18px; 
	border-radius: 10px;
	box-shadow: 0 0 2px #4d4d4d;
	text-shadow: 0px 0 0px #4d4d4d;
	cursor: pointer;
	height: 30px;
	line-height: 30px;
	
	width: 150px;
}
.btn_salida:hover{
	color:#ffffff;
	background-color: #06CFDC;
}
.texto_principal_txt{
	margin-left: 400px;
	width: 730px;
	
}
.crucigrama{
	display: inline-block;
	float: left;
	margin-left: 20px;
}
.linea_crucigrama{
	height: 30px;
	width: auto;
	display: block;
}
.celda_crucigrama_vacio,.celda_crucigrama_cont,.celda_selvert,.celda_selvert2,.celda_selhoriz,.celda_selhoriz2,.celda_vertcorr,.celda_horizcorr,.celda_vertincorr,.celda_horizincorr{
	display: block;
	float: left;
	border:1px solid #ffffff;
	width: 30px;
	height: 30px;
	background: #ffffff;
	border-radius: 0px;
	font-family: "Stem-Medium";
	line-height: 30px;
	text-align: center;
}
.celda_crucigrama_cont,.celda_selvert,.celda_selvert2,.celda_selhoriz,.celda_selhoriz2{
	background: #cccccc;
	cursor: pointer;
}
.celda_selvert2,.celda_selhoriz2{
	background: #0066D0;
}
.celda_selvert,.celda_selhoriz{
	background: #620283;
	color:#cccccc;
}
.celda_selhoriz{
	background: #620283;
	color:#cccccc;

}
.celda_vertcorr,.celda_horizcorr{
	background: #06CFDC;
	color:#fff;
}
.celda_vertincorr,.celda_horizincorr{
	background-color: #A62879;
}
.pistas{
	display: inline-block;
	float: left;
	width: 500px;
	height:auto;
	margin-left: 50px;
	text-align: center;
	font-family: "Stem-Bold";
	color:#620283;
	font-size: 24px;
	margin-top: 30px;
}

.aparece_pista{
	position: absolute;
	top:0;
	left:0;
	display: inline-block;
	
}
.span_pista{
	display: none;
	position: absolute;
	top:0;
	left:0;
}
.pista_txt{
	position: relative;
	font-family: "Stem-Regular";
	margin:20px;
	color:#1D1D1B;
	font-size: 19px;
	line-height: 22px;
}
.cont_retrocruci{
	font-family: "sosa";
	color:#ffffff;
	text-align: center;
	margin-top: 20px;
	font-size: 18px;

}
.retro_cruci{
	display: inline-block;
	height: 40px;
	width: 40px;
	border-radius: 70px;
	line-height: 40px;
	text-align: center;

}
.indica_nav{
	position: absolute;
	top:0;
	left:0;
	color:#620283;
	font-size:25px;
	width: 45px;
	text-align: center;
	visibility: hidden;
	z-index: 1;
}
.pistatxt2{
	position: relative;

}
.pistatxt2 span{
	position: absolute;
	left:0;
	color:#A62879;
	display: inline-block;
	font-family: "Stem-Regular";
	font-size: 16px;
	line-height: 35px;	
	z-index: 0;
	width: 100%;
}

.enunciado_arrastre{
	width:250px;
	height: 90px;
	border: 2px dotted #0074D3;
	border-radius: 40px;
	position: absolute; 
	background-color: #cccccc;
	font-family: "OfficinaBook";
	color:#004B94;
	font-size: 17px;
}
.situacion{
	overflow: hidden;
	position: relative;
	height: 390px;
}
.situaciones{
	height: 390px;
	overflow: hidden;
	position: relative;
}
.cont_situacion{
	position: absolute;
	top:0;
	left:0;
	overflow: hidden;
	width: 100%;

}

.cuenta_situaciones{
	color:#0066D0;
	font-family: "Stem-Regular";
	font-size: 19px;
	background: #E6E6E6;
	padding: 10px;
	text-align: center;

}
.est_ruleta{
	display: inline-block;
	float: left;
	width: 50px;
	height: 50px;
	line-height: 50px;
	font-size: 25px;
	font-family:"sosa";
	background: #E6E6E6;
	margin:5px;
	text-align: center;
	color:#ffffff;
}

.opcion_ruleta,.opcion_ruleta2{
	background-color: #620283;
	border-radius: 40px;
	box-shadow: 0px 0px 0 #cccccc;
	border-bottom: 6px solid #cccccc;
	color:#FFFFFF;
	margin: 15px 0; 
	padding: 10px 20px;
	line-height: 17px;
	cursor: pointer;
	font-size: 17px;
	font-family: "Stem-Regular";
	margin:5px;

}
.opcion_ruleta:hover{
	background-color: #7a3994;
}
.opcion_ruleta2{
	background-color: #e5007d;
}

.cont_pregruleta{
	position: absolute;
	top:0;
	left:0;
	overflow: hidden;
	width: 100%;
}
.contpregs_ruleta{
	margin-top: 0px;
	position:relative;
	overflow: hidden;
	height: 380px;

}
.preg_ruleta{
	position: relative;
}
.cubre_pregruleta{
	position: absolute;
	top:0;
	left:0;
	height: 100%;
	width:100%;
	
}
.situacion_invisible{
	visibility: hidden;
	z-index: -1;
}
.retro_ruleta{
	margin: 10px 0;
	color:#0066D0;
	font-family: "Stem-Regular";
	font-size: 14px;
	background: #E6E6E6;
	background: transparent;
	height: 10px;
	line-height: 10px;
	text-align: center;
}