@font-face { font-family: Futura; src: url('futura.ttf'); }
body{font-family: Futura;}
:focus{outline: none;}

#encabezado, #icono, #instruc, #chatDiv, #noEncabezado{position:fixed;}
h1, #arbolDiv, .cajaLog{text-align:center;}
#arbolDiv, #instruc, #chatDiv, .cajaLog{/*background:#dc1d1d24;*/}
h1, .lenguaje, #recoNombre{margin:0;}
.lenguaje, #arbolDiv, #menuNodo, #logeos, .equis{position:absolute;}
#recoNombre, #tDescl, .etiquetaLog{position: relative;}
h1, .logb, .equis{color:white;}
#arbolDiv, #chatDiv, #noEncabezado{height: calc(100% - 45px);}
#ventanaChat, .campoLog, .logb{border: none;}

#encabezado{left:0; top:0;width:100%; height:45px;background-image: linear-gradient(140deg, #295b65 51%, #2cb5e8 85%);}
h1{letter-spacing: 5px; font-weight: normal;}
.lenguaje{top:11px;right:5px;color: #e0e0e0;}
#log{text-decoration: none;}
#log:hover{cursor:pointer;}
.linkLeng{text-decoration: none;}
#arbolDiv{text-align: left; top:45px;width: 70%;}
#icono{width:220px; background: rgba(255, 255, 255, 0.88);}
#logoCaja{margin: 10px 30px;}
#recoNombre{
	top: -10px;
	left: 0;
	font-size: 1.0em;
	font-weight: normal;
	letter-spacing: 2px;
	text-align: center;
	background: linear-gradient(to right, #000000, #195c69, #2cb5e8);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-shadow: 0px 0px 5px #6f6f6f;
}
#instrucciones{
	position: relative;
    text-align: center;
    left: 90px;
}
#tDescL{width:96%;margin:5px;
	font-weight:1; font-size:1em;
	text-align:justify;
}
.sq{position:relative;top: 10px;border: 0px solid #888888;}
.tablBoton{background: #a7a7a7;text-align:center;width:100%;padding:5px;
	color:#ffffff; 
	border: none;
	box-shadow: 3px 3px 10px #a0a0a0, -4px -4px 10px #8c8c8c;
	border-radius: 2px;
}
.tablBoton:hover{background: #d2d2d2;}
.tablBoton a{color: rgb(0 0 0);}
.tablBoton a:hover{color: rgb(67 119 255);cursor: pointer;}
table{width:100%; border-bottom: 2px solid #8c8c8c;}
table tr:nth-child(even) {background-color: #f2f2f2;}
table td{padding:0; text-align:center;}
.fVars, .fVarsAct, .fVarsGris{
	width:200px;
	border:none;
	padding:5px;
	background: transparent;
	text-align:center;
	color: #4c4c4c;
}
.fVarsAct{color: #e82397;}
.fVarsGris{color: #afafaf;}
#plantillas{width: 100%; text-align-last:center;}
#instruc{width:200px;right:30%; 
	font-size:1.5em;line-height:50%;text-align:right;
	margin-right:50px;
	background: rgba(255, 255, 255, 0.5);
}
#tinstrucciones{text-decoration:underline;}
.hotLink{color:#e82397; cursor:pointer; text-decoration: underline;}
#chatDiv{right:0; top:45px;width: 30%;
	box-shadow: -5px 10px 8px #888888;
}
#ventanaChat{width: calc(100% - 2px); height: 99%;
    overflow: hidden;
}
#menuNodo{top:400px;background: #ffffffeb;
	display: none;
	border: 2px solid #d3d3d3;
	box-shadow: 5px 5px 8px #888888;
	padding-left:5px;padding-right:5px;
	cursor: context-menu;
}
#menuNodo p{margin:5px;}
#menuNodo p:hover{background: #a8dcce;}
#menuNodo input{
	width: 130px; padding-left: 5px;
	font-family: Futura; font-size: 1em;
	color: #2cb5e8;
}
#menuOpciones{top:550px;background: #ffffffeb;
	position: absolute;
	display: none;
	border: 1px solid #e82397;
	padding-left:5px;padding-right:5px;
	cursor: context-menu;
}
#menuOpciones input{ color:#2cb5e8;
	background: transparent;
	min-width:10px;
	max-width:100%;
	border: none;
	border-bottom: 1px #2cb5e8 solid;
	outline: none;
	text-align:center;
}
#menuOpciones input:focus{border-bottom:1px #e82397 solid;}
#menuOpciones p{
	text-align:center;
	margin-top:5px;
	margin-bottom:5px;
}
#menuOpciones p:hover{background: #a8dcce;}
#noEncabezado{display:none;left:0; top:45px;width:100%;background:#ffffffc7;}
#logeos{width:500px; height:340px;background-color: white;top: 0; bottom: 0; left: 0; right: 0;
	margin: auto;
	border:2px solid;
	border-image-source: linear-gradient(140deg, #b4decc 0%, #1fc8db 51%, #2cb5e8 85%);border-image-slice: 1;
	box-shadow: 10px 10px 16px #dcdcdc;
}
.cajaLog{width:230px; height:280px;
	float: left;
	margin: 5px; padding:5px;
}
.titulo{font-size:2em;line-height: 0;}
.campoLog{
	border-bottom: 2px solid #1fc8db;
	line-height: 15px;
	margin: 13px;
	outline:none;
}
.campoLog:focus + .etiquetaLog{top:-40px;left:-60px;font-size: .8em;cursor:context-menu;}
.campoLog:valid + .etiquetaLog{top:-40px;left:-60px;font-size: .8em;cursor:context-menu;}
.etiquetaLog{color:#2cb5e8;top:-25px;left:-40px;
	display:block;
	line-height: 0px;
	cursor: text;
	-webkit-transition: 1s; /* Safari prior 6.1 */transition: .5s;
}
.logb{background-color: #22c8da;
  	padding: 8px 35px;
  	font-size: 15px;
}
.logb:hover{background-color:#2cb5e8;}
.equis{right: 1px;top: 1px;background-color:#c56363;
	font-size: 2em;
	cursor: pointer;
	line-height: 26px;
}
#logToast{
	width: calc(100% - 40px);
	margin: 0px 10px;
	padding: 5px 10px;
    float: left;
    color: white;
    border-radius: 2px;
    box-shadow: 3px 3px 3px grey;
	background: #c56363;
	display: none;
	/*alerta #c56363, mensaje #22c8da */
}

/*@media screen and (min-aspect-ratio:12/10){
body{
	font-size: 1em;
}
.contPrincipal{
	width: 400px;
}
}*/
