@charset "UTF-8";
/* CSS conslandscape */

body {
	margin:0; 
	padding:0; 
	font-family:Arial, Helvetica, sans-serif;
}
.fondo {
	position:fixed;
	width:100vw;
	height:100vh;
	top:-40vw;
	z-index:-1;
}
.sombra { box-shadow: 0 0 3px #000000;}
.vallas {	
	position:fixed;
	top:28vw;
	left:-2vw;
	width:104vw;
	z-index:1;
}
.material-i {
	position:fixed;
	top:32vw;
	left:10vw;
	width:20vw;
	z-index:2;
}
.material-d {
	position:fixed;
	top:32vw;
	left:70vw;
	width:20vw;
	z-index:2;
}
.conzu-heraclito {
	position:fixed; 
	top:28vw; 
	left:2vw; 
	width:6vw; 
	height:10vw;
}
#conzu-heraclito {
	position:fixed; 
	cursor:pointer; 
	top:28vw; 
	left:2vw; 
	width:6vw; 
	height:10vw;
	z-index:2;
}
.tur {
	position:fixed; 
	top:4vw;
	left:3vw;
	width:40vw;
	height:52vh;
	font-size:2vw; 
}
.clave {
	position:absolute; 
	top:1vw; 
	left:3vw; 
	width:5vw; 
	font-size:2vw; 
	text-align:right; 
	}
#contrasena {  
	position:fixed; 
	top:4vw; 
	left:12vw; 
	width:20vw; 
	height:4vw; 
	border:0.2vw solid #F00; 
	border-radius:0.5vw; 
	text-align:left; 
	font-size:2vw; 
	padding-left:0.5vw;
}
.ojo {
	position:absolute;
	left:30vw;
	width:6vw;
	height:3vw;
	padding-top:0.2vw;
}
#ojo {
	position:absolute;
	top:-0.5vw;
	left:29.5vw;
	cursor:pointer;
	width:8vw;
	height:4vw;
	border-color:#7fa6d6;
}
[type="checkbox"] { -webkit-appearance:none; }
#ayuda2 { 
	position:absolute; 
	cursor:pointer; 
	top:12vw; 
	left:10vw; 
	width:10vw; 
	display:block;
}
#ayuda3 {
	position:absolute; 
	cursor:pointer; 
	top:12vw; 
	left:0; 
	width:10vw; 
	display:none;
}
.button {
	position:absolute; 
	top:10vw; 
	left:30vw; 
	width:8.3vw;
	height:12.3vw; 
	border-radius:1vw; 
	cursor:pointer; 
	z-index:2;
	background-color:transparent;
	border:0;
}
.button:active {
	background-color:#FFF;
	transform:translateY(0.25vw);
}
.candado {
	position:absolute; 
	top:10vw; 
	left:30vw; 
	width:8vw;
	height:12vw; 
	border:0.2vw solid #F00; 
	border-radius:1vw;
	font-size:1.2vw;
	text-align:center;
	background-color:#FFF;
	z-index:1;
}
.enigma {	
	position:fixed; 
	top:1vw;
	left:52vw; 
	width:46vw; 
	font-size:2vw; 
	text-align:center; 
	color:#00F;
}
#gracias { 
	position:fixed; 
	top:1vw; 
	left:54vw; 
	width:43vw; 
	height:26.8vw; 
	border:thin solid #F00;
	border-radius:1.3vw 1.3vw 0 0; 
	text-align:center; 
	overflow:scroll; 
	display:none;
}
#oben { cursor:s-resize;}
#lapiz { 
	position:absolute; 
	top:8vw; 
	left:17.2vw;
	z-index:2;
}
#lapicito { 
	width:0.4vw; 
	height:4vw; 
	background:#F00; 
	animation:movi ease-in-out 0.15s infinite; 
	transform-origin:50% 50%; 
	animation-direction:alternate;
}
#lapicito:before { 
	position:absolute;
	top:4vw; 
	left:0; 
	width:0; 
	height:0; 
	content:""; 
	border-top:1vw solid #000; 
	border-left:0.25vw solid transparent; 
	border-right:0.25vw solid transparent;
}
.unten { 
	position:absolute; 
	top:12.2vw; 
	left:0; 
	width:43vw; 
	background-color:#FFF; 
	cursor:s-resize;
}
p { font-size:2vw;}
@-webkit-keyframes movi { 
	0% {transform:rotate(-10deg); 
	-webkit-transform:rotate(-10deg);
} 
100% { 
	transform:rotate(8deg); 
	-webkit-transform:rotate(8deg);
}
}
.rot { color:red;}
.ente { 
	position:relative;
	left:7vw; 
	width:10vw;
}
@media (min-width: 1020px) {
.fondo {
	position:fixed;
	top:-42vw;
	width:100vw;
	height:100vh;
	z-index:-1;
}
.sombra { box-shadow: 0 0 3px #000000;}
.vallas {
	position:fixed;
	top:37.5vw;
	left:-2vw;
	width:104vw;
	z-index:10;
}
.conzu-heraclito { 
	position:absolute; 
	cursor:pointer; 
	top:32vw; 
	left:2vw; 
	width:6vw; 
	height:15vw;
}
#conzu-heraclito {
	position:absolute; 
	cursor:pointer; 
	top:32vw; 
	left:2vw; 
	width:6vw; 
	height:15vw;
	z-index:11;
}
.tur {	  
	position:fixed; 
	top:5vw;
	left:14vw;
	width:28vw;
	height:24vw;
}
.enigma {	
	position:fixed; 
	top:5vw;
	left:52vw; 
	width:46vw; 
	font-size:1.2vw; 
	text-align:center; 
	color:#00F;
}
.tur {
	position:fixed; 
	top:4vw;
	left:3vw;
	width:40vw;
	height:42vh;
}
.clave { 
	position:absolute; 
	top:2vw; 
	left:0vw; 
	width:5vw; 
	font-size:1.2vw; 
	text-align:right; 
	color:#000;
}
#contrasena { 
	position:fixed; 
	top:5vw; 
	left:10vw; 
	width:17vw; 
	height:3vw; 
	border:0.2vw solid #F00; 
	border-radius:0.5vw; 
	text-align:left; 
	font-size:1.2vw; 
	padding-left:0.5vw;
}
.ojo { 
	position:absolute;
	left:25vw;
	cursor:pointer;
	width:4vw;
	height:4vw;
	padding-top:1.2vw;
}
#ojo {
	position:absolute;
	top:-0.5vw;
	left:24vw;
	cursor:pointer;
	width:6.5vw;
	height:6vw;
	}
#mostrar-contrasena {
	position:absolute;
	top:0vw;
	left:24vw;
	cursor:pointer;
	width:4vw;
	height:3.8vw;
}
[type="checkbox"] { -webkit-appearance:none; }
.candado {
	position:absolute; 
	top:10vw; 
	left:30vw; 
	width:8vw;
	height:12vw; 
	border:0.2vw solid #F00; 
	border-radius:1vw;
	font-size:1.2vw;
	text-align:center;
	background-color:#FFF;
	z-index:1;
}
#ayuda2 { 
	position:absolute; 
	cursor:pointer; 
	top:15vw; 
	left:6vw; 
	width:6vw; 
	display:block;
}
#ayuda3 {
	position:absolute; 
	cursor:pointer; 
	top:15vw; 
	left:6vw; 
	width:6vw; 
	display:none;
}
#gracias { 
	position:fixed; 
	top:5vw; 
	left:60vw; 
	width:26vw; 
	height:17vw; 
	border:0.15vw solid #F00;
	border-radius:1.3vw 1.3vw 0 0; 
	text-align:center; 
	overflow:scroll; 
	display:none;
}
#oben {
	position:absolute; 
	top:0vw; 
	left:0; 
	width:26.5vw;
	background-color:#F00; 
	cursor:s-resize;
}
#lapiz { 
	position:absolute; 
	top:4vw; 
	left:10vw;
	z-index:2;
}
#lapicito { 
	width:0.4vw; 
	height:4vw; 
	background:#F00; 
	animation:movi ease-in-out 0.15s infinite; 
	transform-origin:50% 50%; 
	animation-direction:alternate;
}
#lapicito:before { 
	position:absolute;
	top:4vw; 
	left:0; 
	width:0; 
	height:0; 
	content:""; 
	border-top:1vw solid #000; 
	border-left:0.25vw solid transparent; 
	border-right:0.25vw solid transparent;
}
.unten { 
	position:absolute; 
	top:8.6vw; 
	left:0; 
	width:26.5vw; 
	background-color:#FFF; 
	cursor:s-resize;
}
p { font-size:1.2vw;}
}