* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
/* DEFINICION DE COLORES */
.fondobody { color: #CFE7F3}
.fondotabla { color: #278dbc}
.fondopar { color: #ffffff}
.fondoimpar { color: #bfe0f0}
.fondopie { color:#278dbc}
.fondoencabezado { color:#278dbc}

.color1 { color: #d0e3f4}
.color2 { color: #c7e6fb}
.color3 { color: #0087bf}
.color4 { color: #c3e8ff}
.color5 { color: #cae5fa}

.color-normal { color:#01618A }	   /* Color Primario Azul verdoso*/
.color-clarito { color:#079DDE }   /* Celeste Claro */
.color-claro { color:#027BAF }     /* Celeste Oscuro */ 
.color-oscuro { color:#014D6E }    /* Primario Oscuro */
.color-masoscuro { color:#003850 } /* Primario Mas oscuro*/
.color-medio {color:#7CC1E2}       /* Celeste Medio */
.color-boton {color:#0077B0}       /* Fondo de boton */
.color-t-titulo {color:#007f9f}
.color-letra-celeste {color:#bfe0f0} /*Color letra celeste para titulo tabla*/

@import url('https://fonts.googleapis.com/css?family=Open+Sans');
 
:root {
  --color-principal: #01618A;
  --color-fondo-encabezado: #01618A;
  --color-oscuro:#0077B0;
  --color-claro: #DF2435;
  --color-secundario:#014D6E; /*#b53b3b;*/
  --color-gris-oscuro:#7f8c8d;
  --color-gris-medio:#cccccc;
  --color-gris-claro:#e0e0e0;
  --color-gris: #f2f2f2;
  --color-boton:#0077B0; 
  --color-boton-over:#7f8c8d;
  --color-fondo-tabla: #01618A;
  --color-titulo-tabla: #0077B0;
  --color-cebra-impar:#fbeeee;
  --color-cebra-par:#efe9e9f7;
  --color-cebra-texto:black;
  --color-positivo:green;
  --color-negativo:#cccccc;


}
@font-face {
    font-family: myFCQFont;
    src: url('https://fonts.googleapis.com/css?family=Open+Sans');
    font-weight: bold;
}

body {
	/*font-family: Arial, Helvetica, sans-serif;*/
    font-family: 'Open Sans', sans-serif;
	/*font-family: myFCQFont;*/
	font-size: 12px;
	/*background-color:#CFE7F3 ; 
	background-color:var(--color-gris-medio) ; */
	background-color: #e0e0e0;


	margin : 0;
	
}


h1 {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	/*font-family: myFCQFont;*/
	font-size: 18px;
    color: white;
}

h2{
	font-family: 'Open Sans';
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-size: 16px;
    color: white;
}

.tituA{
		color: white;
		font-size: 28px;
		font-weight: bold;
		text-decoration: none;
		font-family:'Open Sans';
		
} 

.tituB{
		color: white;
		font-size: 24px;
		text-decoration: none;
		font-family:'Open Sans';
		
} 
.tituC{
		color: white;
		font-size: 20px;
		text-decoration: none;
		font-family:'Open Sans';
		
} 

td {
	font-family: 'Open Sans';
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-size: 12px;
}

th {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 12px;
	font-style:inherit;
}

form {
    font-family: 'Open Sans';
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-size: 12px;
	}

input {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 12px;
	vertical-align: middle;
}


textarea {
	font-family: 'Open Sans';
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-size: 12px;
	text-align: justify;
	/*height: 5cm;
	width: 13cm;*/
	
}
select {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 12px;
}

ul {
	font-family: 'Open Sans';
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-size: 12px;
	list-style-type: square;
	list-style-position: outside;
}

li {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 12px;
}

ol {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 12px;
	list-style-type: decimal;
	list-style-position: outside;
}

.small {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 9px;
}

.smallXL {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 10px;
}

.big {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 18px;
}

.bodystyle {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 12px;
}

.box1 {
	padding: 3px;
	border-width: thin;
	border-style: solid;
	border-color: #CCCCCC #666666 #666666 #CCCCCC;
}

.box2 {
	border-width: 3px;
	border-style: solid;
	padding: 5px;
}

.miBoton{
	display: block;
	/*width: 150px;*/
	height: 40px;
	border: outset;
	border-color: #0077B0 #0077B0 #0077B0 #0077B0;
	padding-right: 35px;  /* 40 píxeles a la izquierda para que no se amontone con la flecha */
	background: url(../img/flecha.png) no-repeat bottom right ; /* Imagen sin repetir y en la parte superior */
	font-size: 14px; /*Aumentamos el tamaño de la fuente */
	font-weight: bold; /* Y la ponemos en negrita */
	background-color:#0077B0;
	color: white;
	cursor:hand;
}
.miBoton:hover{
	
	background-color:#278dbc ;
	height: 42px;
	border: inset;
	/*background-position: bottom; /* Al pasar el ratón se ubica en la parte inferior */
	/*border: solid white;*/
}

.BotonSimple{
	display: block;
	/*width: 150px;*/
	height: 40px;
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	/*border: outset;*/
	border-color: #0077B0 #0077B0 #0077B0 #0077B0;
	font-family: Arial, Helvetica, sans-serif;
	/*padding-right: 35px;  /* 40 píxeles a la izquierda para que no se amontone con la flecha */
	font-size: 14px; /*Aumentamos el tamaño de la fuente */
	font-weight: bold; /* Y la ponemos en negrita */
	background-color:#0077B0;
	color: white;
	cursor:hand;
}
.BotonSimple:hover{
	
	/*background-color:#278dbc ;*/
	height: 40px;
	border: inset;
	border-color: #0077B0 #0077B0 #0077B0 #0077B0;
	/*color: red;*/
	/*background-position: bottom; /* Al pasar el ratón se ubica en la parte inferior */
	/*border: solid white;*/
}



.tabla_login { 
	border-style:solid;
	background-color:aliceblue;	
    border-spacing:12px;
	*background-image: url(../img/logo-fcq.png) ; 
	background-image: url(../img/fachada.png) ; 
	background-repeat: no-repeat;
	background-position : middle;
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 18px;
    color: black;
	vertical-align:middle;
}

.td_login {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Open Sans';
	font-size: 18px;
    color: black;
	vertical-align:middle;
}

.tabla_enc {
font-size: 16px;
font-family: 'Open Sans';
color: white;
/*background-color: #278dbc;*/
background-color: #BA1928;

}

.tabla_enc th {
	/*background-color: #278dbc; /* fondotabla;*/
	/*--background-color: var(--color-primario);*/
	/*border-top: solid white 1.0pt;
	border-bottom: solid white 1.0pt;*/
	text-align: center;    
	color:#fff;
	font-weight: normal;
	font-size:14px;
	padding: 4px;
}

.tabla_enc td {
	/*background-color: #278dbc; /* fondotabla;*/
	/*--background: var(--color-secundario);
	/*border-top: solid white 1.0pt;
	border-bottom: solid white 1.0pt;*/
	text-align: center;    
	color:#fff;
	font-weight: normal;
	font-size:14px;
	padding: 4px;
}

.tabla_enc img{
	max-height:80px;
	height: 100%;
	width:auto;
}

.tabla01 {     
	font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    font-size: 12px;    
	background-color: #007f9f; /*este color no se ve, porque lo tapan los otros*/
	margin: 45px;     
	/* width: 480px; */
	text-align: left;    
	border-collapse: collapse; }

.tit01 {     
	font-size: 16px;     
	font-weight: bold; 
	text-align: center;    
    color:#bfe0f0; 
	padding: 8px;     
	/*background:#0087BF;/*Celeste Oscuro */
	background: var(--color-fondo-tabla); /*#01608A;/*Azul Oscuro*/
	/*background:#7CC1E2;/*Celeste Medio */
	/*background:#027BAF;/*color-claro*/ 
	border-bottom: 3px solid var(--color-gris-oscuro); /*#003850; /*color-masoscuro*/

	/*background:#278dbc; /*#007f9f;*/
    /*background-image: url(../img/cuadradito.png);
	background-repeat: no-repeat;*/
    /*border-top: 3px solid #80c3df;
	border-bottom: 3px solid #80c3df; 
	border-bottom: 3px solid #fff; */
	
	/* color: #e8f1fb; color usado hasta febrero 2016 */
	}
.th01 {     
	font-size: 13px;     
	font-weight: normal;     
	padding: 8px;     
	background: #278dbc; /*#b9c9fe;*/
    border-top: 4px solid #aabcfe;
	border-bottom: 1px solid #fff; 
	color: #039; }

.td01d {    
	padding: 8px;     
	background: #278dbc ; /* #007f9f; */
	text-align: right;    
	border-bottom: 1px solid #fff;
    color: #669;    
	border-top: 1px solid transparent; }

.tencabezado {    
	padding: 8px;     
	font-size: 15px;     
	font-weight: bold; 
	/*font-family:helvetica,arial,sans-serif;*/
	font-family: 'Open Sans';
	background: #278dbc ; /* #007f9f; */
	text-align: right;    
	border-bottom: 1px solid #fff;
    color: white;    
	border-top: 1px solid transparent; }
.td01i {    
	padding: 8px;     
	background: #278dbc; /* #007f9f;     */
	text-align: left;    
	border-bottom: 1px solid #fff;
    color: #669;    
	border-top: 1px solid transparent; }
.td01 {    
	padding: 8px;     
	background: #278dbc ; /* #007f9f; */
	text-align: center;    
	border-bottom: 1px solid #fff;
    color: #669;    
	border-top: 1px solid transparent; }


.tr01:hover td01 { background: #d0dafd; color: #339; }

.zebra {     
	/*font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;*/
	font-family: 'Open Sans';
    font-size: 12px;    
	background-color:#007f9f;
	margin: 10px;/*45px;     */
	/* width: 480px; */
	text-align: left;    
	border-collapse: collapse; }

.ztit {     
	font-size: 14px;     
	font-weight: bold; 
	text-align: center;    
	padding: 8px;     
	background:#007f9f;
    border-top: 3px solid #80c3df;
	border-bottom: 3px solid #80c3df; 
	/*border-top: 4px solid #aabcfe; */
	/*border-top: 3px solid #fff;  
	border-bottom: 3px solid #fff; */
	color: #e8f1fb;
	/*color: #bfe0f0;*/
	/*color: #039; */}

.zth {     
	font-size: 13px;     
	font-weight: normal;     
	padding: 8px;     
	background: #b9c9fe;
    border-top: 4px solid #aabcfe;
	border-bottom: 1px solid #fff; 
	color: #039; }


.ztdd {    
	padding: 8px;     
	background: #007f9f; 
	text-align: right;    
	border-bottom: 1px solid #fff;
    color: #669;    
	border-top: 1px solid transparent; }

.ztdi {    
	padding: 8px;     
	background: #007f9f;     
	text-align: left;    
	border-bottom: 1px solid #fff;
    color: #669;    
	border-top: 1px solid transparent; }


.ztr:hover td01 { background: #d0dafd; color: #339; }

/* Tabla cebra para mostrar resultados */

#mitabla{
/*estilo de el cuerpo de nuestra tabla*/
background-color: #1e8cbe;
width:80%;
margin:24px auto;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
/*font-family:helvetica,arial,sans-serif;*/
font-family: 'Open Sans';

font-weight:normal;
text-transform: uppercase;
}

#mitabla th{
/*estilo de los elementos(th)*/
background-color: #278dbc;
color:#fff;
font-weight: normal;
font-size:14px;
padding: 8px;
}

#mitabla td{
/*estilo a los elementos (td)*/
width:100px;
height: 24px;
}
#mitabla tdd{
/*estilo a los elementos (td)*/
text-align: right;    
width:100px;
height: 24px;
}

#mitabla tdi{
/*estilo a los elementos (td)*/
text-align: left;    
width:100px;
height: 24px;
}
#mitabla.tdc{
/*estilo a los elementos (td)*/
text-align: center;
background-color: #278dbc;
color:#fff;
font-weight: normal;
font-size:14px;
padding: 8px;
width:100px;
height: 24px;
}

/* **Aqui esta la magia ahora vamos usar el  nth-child()** */
#mitabla tr:nth-child(odd){
/*para los colores de las filas impares*/
background-color: #ffffff;
background-color: var(--color-cebra-impar);
}
#mitabla tr:nth-child(even){
/*para los colores de las filas pares*/
background-color: var(--color-cebra-par);
}




/* Tabla cebra para mostrar resultados como CEBRA*/

table.cebra{
/*estilo de el cuerpo de nuestra tabla*/
	background-color: var(--fondo-tabla); 
	/*width:90%;*/
	margin:12px auto;
	margin: 0px ;
	border-left: 6px solid var(--fondo-tabla);
	border-right: 6px solid var(--fondo-tabla);
	border-bottom: 6px solid var(--fondo-tabla);
	/*font-family:helvetica,arial,sans-serif;*/
	font-family: 'Open Sans', sans-serif;
	font-weight:normal;
	text-transform: capitalize;
}
table.cebra caption{
/*estilo de los elementos(th)*/
    background-color: var(--color-oscuro);  /*#278dbc;*/
	border-bottom: 1px solid #bfe0f0;  /* azul oscuro*/
	/*
	border-top: 2px solid #0077B0;  
	border-left: 2px solid #0077B0; 
	border-right: 2px solid #0077B0;
	*/
	
	text-align: left;    
	color: #bfe0f0; /* #fff;*/
	font-weight: bold;
	font-size:16px;
	padding: 4px;
	border-spacing:0px;
	text-transform: uppercase;
}

table.cebra th{
/*estilo de los elementos(th)*/
  /*background-color: #0077B0;  /*#278dbc;*/
    background-color: var(--color-oscuro);
	/*
	background: -webkit-linear-gradient(var(--color-oscuro), var(--color-claro));
    background: -moz-linear-gradient(var(--color-oscuro), var(--color-claro));
    background: -moz-linear-gradient(#0077B0, #278dbc);
    background: -o-linear-gradient(var(--color-oscuro), var(--color-claro));
	*/
	border-bottom: 4px solid var(--color-oscuro);  /* azul oscuro*/
	border-top: 2px solid var(--color-oscuro);  /* azul oscuro*/
	border-left: 2px solid var(--color-oscuro);  /* azul oscuro*/
	border-right: 2px solid var(--color-oscuro);  /* azul oscuro*/
	
	font-family: 'Open Sans', sans-serif;
	text-align: center;    
	color:#fff;
	font-weight: bold;
	font-size:14px;
	padding: 4px;
	border-spacing:0px;
}

table.cebra td{
	/*estilo a los elementos (td)*/
	font-family: 'Open Sans', sans-serif;
	width:100px;
	height: 24px;
	text-align: center;
	color: var(--color-cebra-texto);
}


.cebra_c{
	width:100px;
	height: 24px;
	font-family: 'Open Sans', sans-serif;
}

.cebra_l{
	width:100px;
	height: 24px;
	text-align:left !important;    
	font-family: 'Open Sans', sans-serif;

}

.cebra_r{
	width:100px;
	height: 24px;
	text-align: right !important;    
	font-family: 'Open Sans', sans-serif;
}

/* Este es para cerrar las tablas con una fila vacía */
.cebra_f{
    background-color: var(--color-oscuro); /*#278dbc;*/
	color:white;
	font-weight: bold;
	font-size:16px;
	width:100px;
	height: 24px !important;
	text-align: right !important;    
	font-family: 'Open Sans', sans-serif;
}


.cebra tr:hover td { background: #d0dafd; color: #339; }

table.cebra tr:nth-child(odd) {
   background-color: var(--color-cebra-impar); /*#ffffff;*/
   color:#777;
}

table.cebra tr:nth-child(even) {
   background-color: var(--color-cebra-par); /*#bfe0f0;*/
   color:#777;
}

/* -------------------------------------------------*/
/* Tabla para mostrar opciones al pie del resultado */
/* -------------------------------------------------*/
table.pie{
/*estilo de el cuerpo de nuestra tabla*/
	/*background-color: fondopie; /*#1e8cbe;*/
	
	/*margin:12px auto;*/
	
	border: 4px outset var(--color-claro); /* #0077B0;*/
	background-color: var(--fondo-tabla); /*#278dbc;*/
	align:center;
	
	border-bottom: 4px solid var(--color-oscuro);/*#01608A; /*Azul Oscuro*/
	border-top: 4px solid  var(--color-oscuro); /* #01608A; /*Azul Oscuro*/
    border-spacing:0px;
	padding: 0px;
	/*
	border-left: 2px outset #1e8cbe;
	border-right: 2px outset #1e8cbe;
	border-bottom: 2px outset #1e8cbe;
	border-top: 2px outset #1e8cbe;
	
	font-family:helvetica,arial,sans-serif;*/
	font-family: 'Open Sans';
	font-weight:normal;
	/*text-transform: uppercase;*/
}

table.pie th{
/*estilo de los elementos(th)*/
	background-color: var(--color-principal); /*#278dbc;*/
	/*border-style: inset;*/
	text-align: center;    
	color:#fff;
	font-weight: normal;
	font-size:12px;
	padding: 4px;*/
}

/* -------------------------------------------------*/
/* Tabla para mostrar resultados no tabulares       */
/* -------------------------------------------------*/
table.general{
/*estilo de el cuerpo de nuestra tabla*/
	/*
	background-color: #1e8cbe;
	margin:24px auto;
	border-left: 2px outset #1e8cbe;
	border-right: 2px outset #1e8cbe;
	border-bottom: 2px outset #1e8cbe;
	border-top: 2px outset #1e8cbe;
	font-family:helvetica,arial,sans-serif;
	font-weight:normal;*/
	/*font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;*/
	background-color: fondotabla; /*#278dbc;*/ /*#007f9f;*/
    /*font-family:helvetica,arial,sans-serif;*/
	font-family: 'Open Sans';
    font-size: 12px;   
	font-weight:normal;
	margin: 5px;     

	text-align: left;    
	vertical-align: middle;
	border-collapse: collapse;
	border-left: 2px solid var(--color-principal) ; /*#1e8cbe;*/
	border-right: 2px solid var(--color-principal);
	border-bottom: 2px solid var(--color-principal);
	
}

table.general th{
/*estilo de los elementos(th)*/
	background-color: var(--color-fondo-tabla); /*#278dbc; /*fondotabla;*/
	border-style: outset;
	text-align: center;    
	color:#fff;
	font-weight: normal;
	font-size:14px;
	padding: 2px;
}

table.general tp{
/*estilo de los elementos(td)*/
	background-color: var(--color-claro);
	border-style: inset;
	text-align: left;    
	/*color:#fff;*/
	color : color1;
	font-weight: normal;
	font-size:12px;
	padding: 2px;
}

.gral_th {
	background-color: var(--color-fondo-tabla); /*	#278dbc; /* fondotabla;*/
	/*border-style: solid;*/
	border-top: solid white 1.0pt;
	border-bottom: solid white 1.0pt;
	/*border-left: solid black 2.0pt;*/
	/*border-right: solid black 2.0pt;*/
	text-align: center;    
	color:#fff;
	font-weight: normal;
	font-size:14px;
	padding: 4px;
}
.gral_th_r {
	background-color: var(--color-fondo-tabla); /*#278dbc; /* fondotabla;*/
	/*border-style: solid;*/
	border-top: solid white 1.0pt;
	border-bottom: solid white 1.0pt;
	/*border-left: solid black 2.0pt;*/
	/*border-right: solid black 2.0pt;*/
	text-align: right;    
	color:#fff;
	font-weight: normal;
	font-size:14px;
	padding: 4px;
}
.gral_td {
	background-color: #bfe0f0;  /*#278dbc;*/ /* important!; */
	/* fondotabla*/
	/*border-style: solid important!;*/
	border-top: solid white 1.0pt;
	border-bottom: solid white 1.0pt;

	text-align: center important!;    
	color:#fff important!;
	font-weight: normal important!;
	font-size:12px important!;
	padding: 4px important!;
}

.gral_titu {
/*estilo de los elementos(th)*/
	background-color: var(--color-oscuro); /*#278dbc; /*fondotabla*/
	background-image: url(../img/puntito2.png);
	background-repeat: no-repeat;
	background-position: left top;
	/*border-style: outset;*/
	text-align: center;    
	color: white; /*#fff;*/
	font-weight: bold;
	font-size:14px;
	padding: 6px;
}

.gral_titu_l {
/*estilo de los elementos(th)*/
	background-color: var(--color-fondo-tabla); /*#278dbc; /*fondotabla*/
	background-image: url(../img/puntito2.png);
	background-repeat: no-repeat;
	background-position: left top;
	/*border-style: outset;*/
	text-align: left;    
	color: white; /*#fff;*/
	font-weight: bold;
	font-size:14px;
	padding: 6px;
}



.gral_pie {
/*estilo de los elementos(th)*/
	background-color: #278dbc; /*fondotabla*/
	/*background-image: url(../img/puntito2.png);*/
	background-repeat: no-repeat;
	background-position: left top;
	/*border-style: outset;*/
	text-align: center;    
	color: white; /*#fff;*/
	font-weight: bold;
	font-size:14px;
	padding: 6px;
}

/* ************************************ */



.ztabla.tdd{
/*estilo a los elementos (td)*/
text-align: right;    
width:100px;
height: 24px;
}

.ztabla.tdi{
/*estilo a los elementos (td)*/
text-align: left;    
width:100px;
height: 24px;
}

.zmitabla.tdc{
/*estilo a los elementos (td)*/
text-align: center;
background-color: #278dbc;
color:#fff;
font-weight: normal;
font-size:14px;
padding: 8px;
width:100px;
height: 24px;
}

/* -------------------------------------------------*/
/* Tabla para mostrar botones de MENU en el head    */
/* -------------------------------------------------*/
table.cabeza{
/*estilo de el cuerpo de nuestra tabla*/
	/*background-color: fondopie; /*#1e8cbe;*/
	
	/*margin:12px auto;*/
	
	/*border: 4px outset #0077B0;*/
	background-color:var(--color-secundario); /*#d9dadb ;/* #278dbc;*/
	/*background-image: url(../img/home.png);*/
	border-top: 4px solid   var(--color-oscuro) ; /*#0077B0; /*Azul Oscuro*/
	border-bottom: 4px solid var(--color-oscuro); /* #0077B0; /*Azul Oscuro*/
	margin: 0px;
	padding:0px;
	border-spacing:0px;

	
    
	/*
	border-left: 2px outset #1e8cbe;
	border-right: 2px outset #1e8cbe;
	border-bottom: 2px outset #1e8cbe;
	border-top: 2px outset #1e8cbe;
	*/
	font-family: 'Open Sans', sans-serif;
	font-weight:normal;
	vertical-align: middle;
	/*text-transform: uppercase;*/
}

table.cabeza th{
/*estilo de los elementos(th)*/

	/*background-color: #278dbc; /*gray;/* #d9dadb; */
	background-color: var(color-secundario);
	/*
    background: -webkit-linear-gradient(#278dbc, #079DDE);
    background: -moz-linear-gradient(#278dbc, #079DDE);
    background: -o-linear-gradient(#278dbc, #079DDE);
	/*background-image: url(../img/homito.png);*/
	/*border-style: inset;*/
	text-align: center;
	vertical-align: middle;
	color:#fff;
	font-weight: normal;
	font-size:12px;
	padding: 4px;*/
}


.opacity { 
background-color:#D0E3F4;
color : black;
opacity: 0.8;
border: outset;
/*width: 200px;*/

}

/*------------------------------------------ --------------------------------------------------------- */
/*                                               Estilo para los formularios                            */
/* --------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------*/
/* Tabla para mostrar FORMULARIOS                    */
/* -------------------------------------------------*/
f_tabla{
/*estilo de el cuerpo de nuestra tabla*/
	background-color:  var(--color-gris-oscuro);/*#278dbc; /*#278dbc;*/ /*#007f9f;*/
    /*font-family:helvetica,arial,sans-serif;*/
	font-family: 'Open Sans', sans-serif;
    font-size: 10px;   
	font-weight:normal;
	margin: 5px;     
    margin-top: 5px;
	text-align: left;    
	vertical-align: middle;
	border-spacing:0px;
	border-collapse: collapse;
	border-left: 2px solid #1e8cbe;
	border-right: 2px solid #1e8cbe;
	border-bottom: 2px solid #1e8cbe;
	
	-webkit-box-shadow: 5px 5px 5px 0 #C2C2C2;
    -moz-box-shadow: 5px 5px 5px 0 #C2C2C2;
    box-shadow: 3px 3px 5px 0 #C2C2C2;
	
	
}


/* Filas de las tablas de un formulario*/ 
.f_t_td {
	background-color: var(--color-gris-medio); /*#278dbc; /* fondotabla;*/
	color: var(--color-oscuro);
	border-style: none;
	/*border-top: solid white 1.0pt;
	border-bottom: solid white 1.0pt;*/
	/*border-left: solid black 2.0pt;*/
	/*border-right: solid black 2.0pt;*/
	text-align: left;    
	vertical-align: middle;
	/*color:#fff;*/
	font-weight: normal;
	font-size:14px;
	padding: 4px;

	
}

.f_t_titulo {

/*estilo de los elementos(th)*/
	background-color: #278dbc; /*fondotabla*/
	background-image: url(../img/puntito2.png);
	background-repeat: no-repeat;
	background-position: left top;
	/*border-style: outset;*/
	border-top: solid white 1.0pt;
	text-align: center;    
	color: #bfe0f0; /*white; /*#fff;*/
	font-weight: bold;
	font-size:16px;
	padding: 10px;
}

.f_t_titulos {

/*estilo de los elementos(th)*/
	background-color: #01618A; /* #278dbc; /*fondotabla*/
	background-image: url(../img/puntito2.png);
	background-repeat: no-repeat;
	background-position: left top;
	/*border-style: outset;*/
	border-top: solid white 1.0pt;
	text-align: center;    
	color: #bfe0f0; /*white; /*#fff;*/
	font-weight: bold;
	font-size:16px;
	padding: 10px;
}

/* -------------------------------------------------*/
/* Tabla para mostrar Datos                         */
/* -------------------------------------------------*/

.f_datos{
/*estilo de el cuerpo de nuestra tabla*/
	background-color:  var(--color-fondo-tabla); /*#278dbc; /*#278dbc;*/ /*#007f9f;*/
	font-family: 'Open Sans', sans-serif;
    font-size: 10px;   
	font-weight:normal;
	margin: 5px;     
    margin-top: 5px;
	text-align: center;    
	vertical-align: middle;
	border-spacing:0px;
	border-collapse: collapse;
	border-left: 2px solid var(--color-oscuro);
	border-right: 2px solid var(--color-oscuro);
	border-bottom: 2px solid var(--color-oscuro);
	
	-webkit-box-shadow: 5px 5px 5px 0 #C2C2C2;
    -moz-box-shadow: 5px 5px 5px 0 #C2C2C2;
    box-shadow: 3px 3px 5px 0 #C2C2C2;
	
	
}
.f_datos caption{
	background-color:  var(--color-fondo-tabla); /*#278dbc; /*#278dbc;*/ /*#007f9f;*/
	font-family: 'Open Sans', sans-serif;
    font-size: 14px;   
	color:white;
	padding:5px;
}
.f_datos_th {
  
    /*background: #0077B0; Original*/ 
	background: var(--color-oscuro); /*#01618A;
	/*background: -webkit-linear-gradient(#01618A, #079DDE);
    background: -moz-linear-gradient(#01618A, #079DDE);
    background: -o-linear-gradient(#01618A, #079DDE);*/
    border: 1px solid #CCC;
    border-right: 1px solid #C2C2C2;
    
    height: 36px;
    line-height: 36px;
    margin-right: 0;
	margin-left:5px;
	margin-bottom:5px;
	padding : 0px 10px 0px 10px;
    /*width: 150px !important;*/
    color:white;
	text-align: center;
}
.f_datos_izq {

    /*background: #0077B0;  */
	background: #01618A;
    border: 1px solid #CCC importan!;
	

	border-right: white 1px solid !important;
	border-bottom: white 1px solid !important;
    
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 0 0 10px;
    -webkit-border-radius: 10px 0 0 10px;
	
    /*border-right: 5px solid white;
	border-bottom: 5px solid white;*/
    height: 36px;
    line-height: 36px;
    margin-right: 0;
	margin-left:5px;
	margin-bottom:5px;
	/*padding : 0px 10px 0px 10px;*/
    color:white;
	text-align: right;
}

.f_datos_der {

    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    background: #0077B0;  
	/*background: #01618A;*/
    border: 1px solid #CCC;
    border-radius: 5px 5px 5px 5px;
    border-right: 1px solid #FFF;
	border-right: white 1px solid !important;
	border-bottom: white 1px solid !important;
	
    
    height: 36px;
    line-height: 36px;
    margin-right: 0;
	margin-left:5px;
	margin-bottom:5px;
	padding : 0px 10px 0px 10px;
    color:white;
	text-align: left;
}

.titulotabla{
	
    background-color: var(--color-titulo-tabla); /*#0077B0 !important;  /*#278dbc;*/
	border-bottom: 2px solid var(--color-titulo-tabla) !important;  
	text-align: left !important;    
	color: white !important; /*#bfe0f0; /* #fff;*/
	font-weight: bold !important;
	font-size:16px !important;
	padding: 6px !important;
	border-spacing:0px;
	text-transform: uppercase !important;
}
.alumno{
	
    background: #0077B0 !important;  /*#278dbc;*/
	/*border-bottom: 2px solid #bfe0f0 !important;  /* azul oscuro*/
	text-align: left !important;    
	color: yellow !important; /*#bfe0f0; /* #fff;*/
	font-weight: bold !important;
	font-size:10px !important;
	padding: 6px !important;
	border-spacing:0px;
	text-transform: uppercase !important;
}

.docente{
	
    background: #0077B0 !important;  /*#278dbc;*/
	/*border-bottom: 2px solid #bfe0f0 !important;  /* azul oscuro*/
	text-align: left !important;    
	color: yellow !important; /*#bfe0f0; /* #fff;*/
	font-weight: bold !important;
	font-size:14px !important;
	padding: 6px !important;
	border-spacing:0px;
	text-transform: uppercase !important;
}
.areatexto{
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
	background: url(../img/lapiz.png) no-repeat 50px 0 #EBEBEB;
    background-position: right bottom ; /*5px 7px !important;*/
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    /*height: 38px;
    line-height: 24px;*/
    /*margin: 0 8px 0 -5px;*/
    margin: 0px 0px 0px 0px;
    padding:  10px;
	resize  : none;
    overflow: auto;
	
}

/* Estilo para las etiquetas de FIELDSET */
.legend_label {

    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    /*background: #0077B0; Original*/ 
	background: #01618A;
    border: 1px solid #CCC;
    border-radius: 5px 5px 5px 5px;
    border-right: 1px solid #FFF;
    display: inline-block;
    height: 36px;
    line-height: 36px;
    margin-right: 0;
	margin-left:5px;
	margin-bottom:5px;
	padding : 0px 10px 0px 10px;
    /*width: 150px !important;*/
    color:white;
	text-align: left;
}

.input_label {
    /*cuadrado de la etiqueta*/
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    background: #0077B0;
    border: 1px solid #CCC;
    border-radius: 5px 0 0 5px;
    border-right: 1px solid #FFF;
    display: inline-block;
    height: 36px;
    width: 320px;
    line-height: 36px;
    margin-right: 0;
	margin-left:5px;
	margin-bottom:5px;
    width: 150px !important;
    color:white;
}
.input_label_importante {
    /*cuadrado de la etiqueta*/
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    background: #0077B0;
    border: 1px solid #CCC;
    border-radius: 5px 0 0 5px;
    border-right: 1px solid #FFF;
    display: inline-block;
    height: 36px;
    width: 320px;
    line-height: 36px;
    margin-right: 0;
	margin-left:5px;
	margin-bottom:5px;
    width: 150px !important;
    color:white;
    font-weight: bold;
}

#contact input[type=text] {
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    /*background: #ccc;*/
	
	/*background: -webkit-gradient(linear, left top, left bottom, from(#BCBCBE), to(#FFF));
    background: -moz-linear-gradient(top, #BCBCBE, #FFF);*/
	background: url(../img/lapiz.png) no-repeat 50px 0 #EBEBEB;
    background-position: right center ; /*5px 7px !important;*/
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    height: 38px;
    line-height: 24px;
    margin: 0 8px 0 -5px;
    outline: none;
    padding:  3px;
	/*width: 150px;*/
}
#contact input[type=checkboxxx] {
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    /*background: #ccc;*/
	
	/*background: -webkit-gradient(linear, left top, left bottom, from(#BCBCBE), to(#FFF));
    background: -moz-linear-gradient(top, #BCBCBE, #FFF);*/
	background: url(../img/lapiz.png) no-repeat 50px 0 #EBEBEB;
    background-position: right center ; /*5px 7px !important;*/
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    height: 38px;
    line-height: 24px;
    margin: 0 8px 0 -5px;
    outline: none;
    padding:  3px;
	/*width: 150px;*/
}

#contact input[type=checkbox] + label {
  color: white;
  display: inline-block;
  font-style: italic;
  font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
} 

#contact input[type=checkbox]:checked + label {
  color: white;
  display: inline-block;
  font-style: normal;
  font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
  
  
}

#contact input[type=date] {
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    background:  #EBEBEB;
	
	/*background: -webkit-gradient(linear, left top, left bottom, from(#BCBCBE), to(#FFF));
    background: -moz-linear-gradient(top, #BCBCBE, #FFF);*/
	
	/*background: url(../img/lapiz.png) no-repeat 50px 0 #EBEBEB;
    background-position: right center ; /*5px 7px !important;*/
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    height: 38px;
    line-height: 24px;
    margin: 0 8px 0 -5px;
    outline: none;
    padding:  3px;
	/*width: 150px;*/
}
#contact input[type=number] {
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    background:  #EBEBEB;
	
	/*background: -webkit-gradient(linear, left top, left bottom, from(#BCBCBE), to(#FFF));
    background: -moz-linear-gradient(top, #BCBCBE, #FFF);*/
	
	/*background: url(../img/lapiz.png) no-repeat 50px 0 #EBEBEB;
    background-position: right center ; /*5px 7px !important;*/
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    height: 38px;
    line-height: 24px;
    margin: 0 8px 0 -5px;
    outline: none;
    padding:  3px;
	/*width: 150px;*/
}
#contact input[type=password] {
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    /*background: #ccc;*/
	
	/*background: -webkit-gradient(linear, left top, left bottom, from(#BCBCBE), to(#FFF));
    background: -moz-linear-gradient(top, #BCBCBE, #FFF);*/
	background: url(../img/lapiz.png) no-repeat 50px 0 #EBEBEB;
    background-position: right center ; /*5px 7px !important;*/
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    height: 38px;
    line-height: 24px;
    margin: 0 8px 0 -5px;
    outline: none;
    padding:  3px;
	/*width: 150px;*/
}
#contact input[type=password] {
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    /*background: #ccc;*/
	
	/*background: -webkit-gradient(linear, left top, left bottom, from(#BCBCBE), to(#FFF));
    background: -moz-linear-gradient(top, #BCBCBE, #FFF);*/
	background: url(../img/lapiz.png) no-repeat 50px 0 #EBEBEB;
    background-position: right center ; /*5px 7px !important;*/
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    height: 38px;
    line-height: 24px;
    margin: 0 8px 0 -5px;
    outline: none;
    padding:  3px;
	/*width: 150px;*/
}

#contact select {
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    background: #EBEBEB;
	/*background: url(../img/lapiz.png) no-repeat 50px 0 #EBEBEB;
    background-position: right center ; */
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    height: 38px;
    line-height: 24px;
    margin: 0 8px 0 -5px;
    outline: none;
    padding:  3px;
	/*width: 150px;*/
}





#contact input:read-only {
    background: -webkit-gradient(linear, left top, left bottom, from(#BCBCBE), to(#FFF));
    background: -moz-linear-gradient(top, #BCBCBE, #FFF);
    font-weight: bold;
	/*background:#BCBCBE;*/
}

#contact input:focus {
	background: #F4F7A6;
}
#contact label {
    display: block;
    height: 36px;
    line-height: 34px;
    padding: 0 5 0 10px;
    text-align: right;
}




.input_search {
    /*cuadrado de la etiqueta*/
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    background: #0077B0;
    border: 1px solid #CCC;
    border-radius: 5px 0 0 5px;
    border-right: 1px solid #FFF;
    display: inline-block;
    height: 36px;
    width: 320px;
    line-height: 36px;
    margin-right: 0;
	margin-left:5px;
	margin-bottom:5px;
    width: 100px !important;
    color:white;
}

#busqueda input[type=text] {
    /*el imput */
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    /*background: #ccc;*/
	
	background: -webkit-gradient(linear, left top, left bottom, from(#BCBCBE), to(#FFF));
    background: -moz-linear-gradient(top, #BCBCBE, #FFF);
	
	
    border: 1px solid #CCC;
    border-radius: 0 5px 5px 0;
    color: #333;
    font: 13px/1.6 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    height: 38px;
    line-height: 24px;
    margin: 0 8px 0 -5px;
    outline: none;
    padding:  3px;
	/*width: 150px;*/
}

#busqueda input:focus {
	background: #F4F7A6;
}


.fradio label{
    display: inline-block;
    cursor: pointer;
    /*color: #0077B0;*/
	color: white;
	background : rgba (188,188,188,0.1);
    position: relative;
    padding: 5px 15px 5px 51px;
    font-size: 1em;
    border-radius: 5px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; }

.fradio label:hover
{
      background: rgba(0,119,176, 0.3); }

.fradio label:before
 {
      content: "";
      display: inline-block;
      width: 17px;
      height: 17px;
      position: absolute;
      left: 15px;
      border-radius: 50%;
      background: none;
      border: 3px solid #0077B0; }

.fradio input[type="radio"] {
    display: none; }

.fradio input[type="radio"]:checked + label:before {
      display: none; }

.fradio input[type="radio"]:checked + label {
      padding: 5px 15px;
      background: #0077B0;
      border-radius: 2px;
      color: white; 
	  font-weight: bold;
	  border: 1px solid white;}


/*-----------------------------------------------------------*/
/*      Esto coloca un box inclinado en la pantalla          */
/*-----------------------------------------------------------*/
.fs_inclinado {
width:500px;
border:4px double #0080FF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 8px 8px 6px #808080;
-moz-box-shadow: 8px 8px 6px #808080;
box-shadow: 8px 8px 6px #808080;
background-color: #CEECF5;
padding: 10px;
font-family: Verdana, Geneva, sans-serif;
color: #0B173B;
-webkit-transform: rotate(-6deg);
-moz-transform: rotate(-6deg);
-o-transform: rotate(-6deg);
}
.linclinado {
text-align:center;
font-weight:bold;
font-size:18pt;
color:#B4045F;
text-shadow: 0px 0px 10px #BA55D3;
}


.hanillo {
/*estilo de los elementos(th)*/
	background-color:#01608A;  /*fondotabla*/
	background-image: url(../img/hanillo.png);
	background-repeat: repeat-x;
	background-position: left center;
	/*border-style: outset;*/
	text-align: center;    
	color: white; /*#fff;*/
	font-weight: bold;
	font-size:14px;
	padding-top: 7px;
	padding-bottom: 7px;
}
.vanillo {
/*estilo de los elementos(th)*/
	background-color: gray;/*#01608A;  /*fondotabla*/
	background-image: url(../img/vanillo.png);
	background-repeat: repeat-y;
	background-position: top left;
	/*border-style: outset;*/
	text-align: center;    
	color: white; /*#fff;*/
	font-weight: bold;
	font-size:14px;
	padding-top: 7px;
	padding-bottom: 7px;
	
}
.hoja-a {
/*estilo de los elementos(th)*/
	background-color: gray;/*#01608A;  /*fondotabla*/
	background-image: url(../img/anillo-izq.png);
	background-repeat: repeat-y;
	background-position: top right;
	/*border-style: outset;*/
	text-align: center;    
	color: white; /*#fff;*/
	font-weight: bold;
	font-size:14px;
	padding-top: 7px;
	padding-bottom: 7px;
	padding-right: 20px;
	padding-left:10 px;
	border-top: 10px solid #0077B0;

	
}
.hoja-b {
/*estilo de los elementos(th)*/
	background-color:#CACBCC; /*#d9dadb;/*#01608A;  /*fondotabla*/
	background-image: url(../img/anillo-der.png);
	background-repeat: repeat-y;
	background-position: top left;
	/*border-style: outset;*/
	text-align: center;    
	color: white; /*#fff;*/
	font-weight: bold;
	font-size:14px;
	padding-top: 7px;
	padding-bottom: 7px;
	padding-left: 20px;
	padding-right: 10px;
	border-top: 10px solid #0077B0;
}


calendario{
/*estilo de el cuerpo de nuestra tabla*/
	background-color:  #01608A; /*#278dbc;*/ /*#007f9f;*/
	font-family: 'Open Sans', sans-serif;
    font-size: 10px;   
	font-weight:normal;
	text-align: center;    
	vertical-align: middle;
	padding-top: 10px;
	margin-top: 0px;
	
	/*
		margin: 5px;     
    margin-top: 5px;

	border-spacing:0px;
	border-collapse: collapse;
	border-left: 2px solid #1e8cbe;
	border-right: 2px solid #1e8cbe;
	border-bottom: 2px solid #1e8cbe;
	
	-webkit-box-shadow: 5px 5px 5px 0 #C2C2C2;
    -moz-box-shadow: 5px 5px 5px 0 #C2C2C2;
    box-shadow: 3px 3px 5px 0 #C2C2C2;
	*/
}
.meses {
	background-color:#01608A;
	font-family: 'Open Sans',sans-serif ;
	font-weight: bold;
	color:white; /*#278dbc;*/
	/*display:inline-block;*/
	font-size:14px;
	margin:0px;
	margin-right: 0px;
	padding:3px;
	text-align:center;
	border-bottom: 2px solid #1e8cbe;
	/*
	padding:10px 0;	
	width:120px;
	height: 15px;
	
	text-decoration:none;
	box-shadow:0px 3px 0px #373c3c;
	*/
	
}
.semanas {
	background-color:#01608A;
	font-family: 'Open Sans',sans-serif ;
	font-weight: bold;
	color:white; /*#278dbc;*/
	/*display:inline-block;*/
	font-size:10px;
	text-align:center;
	padding:3px;
	/*
	padding:10px 0;	
	width:120px;
	height: 15px;
	
	text-decoration:none;
	box-shadow:0px 3px 0px #373c3c;
	*/
	
}
.dias {
	background-color:#017FBA;
	font-family: 'Open Sans',sans-serif ;
	/*font-weight: bold;*/
	color:white; /*#278dbc;*/
	/*display:inline-block;*/
	font-size:10px;
	margin:1px;
	margin-right: 0px;
	text-align:center;
	border: 1px solid #1e8cbe;
	padding:3px;
	/*
	padding:10px 0;	
	width:120px;
	height: 15px;
	
	text-decoration:none;
	box-shadow:0px 3px 0px #373c3c;
	*/
}
.eldia {
	background-color:red;
	font-family: 'Open Sans',sans-serif ;
	font-weight: bold;
	color:white; /*#278dbc;*/
	/*display:inline-block;*/
	font-size:16px;
	margin:1px;
	margin-right: 0px;
	text-align:center;
	text-decoration:bold;
	/*
	padding:10px 0;	
	width:120px;
	height: 15px;
	
	
	box-shadow:0px 3px 0px #373c3c;
	*/
}
/*
 Muestra una esquina doblada
*/
.note {
    background: none repeat scroll 0 0 #017FBA; /* color de fondo */
    color: #FFFFFF; /* color de texto */
    margin: 0.3em auto;
	margin: 0.3em 0.3em;
    overflow: hidden;
    padding: 1em 1.5em;
    position: relative;
    /*width: 480px; /* ancho */
	width:90%;
	font-family: 'Open Sans',sans-serif ;
	font-size: 14px;
}
.note:before {
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3), -1px 1px 1px rgba(0, 0, 0, 0.2);
    background: none repeat scroll 0 0 #53A3B4; /* color esquina */
    border-color: #FFFFFF #FFFFFF #53A3B4 #53A3B4; /* color de borde */
	border-color: grey grey #53A3B4 #53A3B4;
    border-style: solid;
    border-width: 0 16px 16px 0;
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 0;
}

.note.blue {
    background: none repeat scroll 0 0 #53A3B4; /* color de fondo */
    color: #FFFFFF; /* color de texto */
    margin: 2em auto;
    overflow: hidden;
    padding: 1em 1.5em;
    position: relative;
    width: 480px; /* ancho */
}
.note.blue:before {
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3), -1px 1px 1px rgba(0, 0, 0, 0.2);
    background: none repeat scroll 0 0 #658E15; /* color de fondo */
    border-color: #FFFFFF #FFFFFF #658E15 #658E15; /* color de esquina */
    border-style: solid;
    border-width: 0 16px 16px 0;
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 0;
}

.note.verde {
    background: none repeat scroll 0 0 #53A3B4; /* color de fondo */
    color:#373c3c;/* #FFFFFF; /* color de texto */
    margin: 1em auto;
    overflow: hidden;
    padding: 1em 1.5em;
    position: relative;
    /*width: 480px; /* ancho */
}
.note.verde:before {
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3), -1px 1px 1px rgba(0, 0, 0, 0.2);
    background: none repeat scroll 0 0 #658E15; /* color de fondo */
    border-color: #FFFFFF #FFFFFF #658E15 #658E15; /* color de esquina */
    border-style: solid;
    border-width: 0 16px 16px 0;
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 0;
}

.colorPrimario{
color:#BA1928 ;
}
.colorOscuro{
color:#7F131D;
}

.colorClaro{
color:#DF2435;
}

.warning{
	color:red;
	background: white;
}

.fondoPrimario{
background-color: var(--color-principal) ;
}
.fondoGrisClaro{
	background:#FEFEFE;}

.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('../img/espera.gif') 50% 50% no-repeat rgb(249,249,249);
	opacity: .8;
}

/*
Colores
Celeste (cyan): #0086C5
Amarillo: #ffd200
Gris, es un 20% de negro. En web: #d9dadb
Verde Oscuro  #007f9f

Celeste Claro #D0E3F4 (logo)
Celeste Oscuro # (logo)
*/