/* bd.css */

.bordeDash { border: dashed 1px Red !important; }
.bordeDashAzul { border: dashed 1px Blue !important; }

.w3-spin-slow{animation:spinslow 4s infinite linear}
@keyframes spinslow{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}


body,div,h1,h2,h3,h4,h5,h6
{
	font-family: "Josefin Sans",sans-serif; /*line-height: 1;*/
}
p { font-family: inherit; }
div { margin: 0; padding: 0; box-sizing: border-box; vertical-align: top; }

.claroscuro {}	/* sólo es para identificar los DIVs que cambian */
.modoOscuro { background-color: Gray; color: White; }
.modoClaro { background-color: White; color: Black; }
.modoClaroBody { background: url(img/RedMX-patron-fb-X.png); background-size: 48px 48px; }
/*.modoOscuroBody { background: url(img/RedMX-patron-osc.png); background-size: 48px 48px; }*/
.modoOscuroBody { background: DimGray; }

/*
.w3-theme-d1 {color:#fff !important; background-color:#3f75a2 !important}
.w3-theme-l5 {color:#000 !important; background-color:#faf8f7 !important}
*/
.bloqueClaro {color:#fff; background-color: #3f75a2; } 			/* w3-theme-d1 */
/*.bloqueOscuro {color:#000; background-color:#eee8e4}*/		/* w3-theme-l4 */
.bloqueOscuro {color:#fff; background-color: #3f75a2; }/* iguales por ahora */

.bordeInf{border:none;border-bottom:solid 1px Gray;}

.fuente_logo { font-family: "Marcellus", serif; font-weight: 400; color: #dcd1ca; }
.fuente_condensada { font-family: "Open Sans Condensed", sans-serif; }
.peso_ligero{font-weight: 300 !important;}
.peso_medio{font-weight: 400 !important;}
.peso_negrita{font-weight: bold !important;}


.hover_gris:hover { background-color: WhiteSmoke; }
.inline {display: inline-block;}
.input_inline { display: inline-block; border: none; 
	border-bottom: solid 1px LightGray; padding: 4px 8px 2px;}
.nowrap {white-space:nowrap;}

.barra_top { display; block; position: relative; min-height: 38px; 
	margin-bottom: 0px; padding: 0px; vertical-align: top; border-bottom: solid 2px White;
}
.barra_top > div { display: inline-block; position: relative;
	width: 33.33%; min-height: 38px; 
	margin: 0px; padding: 0px; }
.barra_top > div:nth-child(1) { min-width: 360px; }
.barra_top > div:nth-child(2) { min-width: 160px; padding-top: 10px; }
.barra_top > div:nth-child(3) { min-width: 240px; text-align: right; }


.grid_3 { display: grid; grid-template-columns: auto auto auto;
	grid-row-gap: 0px; grid-column-gap: 8px; padding:0;
}


.grid_encabezado { display: grid; grid-template-columns: auto 240px;
	grid-row-gap: 0px; grid-column-gap: 8px; background-color: White;
}
.grid_encabezado > div:nth-child(2) { text-align: center; vertical-align: top;}

.grid_encabezado_corto { display: grid; grid-template-columns: auto 400px;
	grid-row-gap: 0px;  grid-column-gap: 8px; background-color: White;
}
.grid_encabezado_corto > div:nth-child(2) { display: grid; 
	grid-template-columns: 160px 240px; grid-row-gap: 0px; grid-column-gap: 2px;
	border: dashed 0px cyan;
}
.grid_encabezado_corto > div:nth-child(2) > div:nth-child(1) {text-align:right;}
.grid_encabezado_corto > div:nth-child(2) > div:nth-child(2) {text-align:center;
	/*padding-right:1px;*/}


/* w3-button w3-block w3-large w3-padding-16 w3-theme-l2 w3-hover-theme */
.boton_menu_flota { display: inline-block; width:100%; cursor: pointer; padding: 16px;
	font-size: 18px; text-align:center; 
	border-bottom: solid 1px White;
}


.tabla_titulo { display; block; padding: 0px; 
	margin-bottom: 0px; min-height: 32px; vertical-align: top;
}

.tabla_titulo div { display: inline-block; padding: 0px; }

.tabla_titulo div:nth-child(1) { width: 15%; padding-left: 16px; }
.tabla_titulo div:nth-child(2) { width: 70%; text-align: center; padding: 8px 16px; }
.tabla_titulo div:nth-child(3) { width: 15%; text-align: right; padding-right: 16px; }


.fila_tabla { display: block; position: relative; clear: left; clear: right;
	min-height: 32px;
	padding: 0;
	font-size: 16px;
	border-bottom: solid 2px Gray;
}

.fila_tabla > div { display: inline-block;
	width: auto; min-width: 40px;
	padding: 8px;
}



.botonCircSemi { display: inline-block; 
	width: 32px !important; height: 32px !important; 
/*	position:relative; top:+2px;
	border-radius:50%!important;*/
	border-radius: 16px !important;
	color:white; 
	background: rgba(255,255,255,.1); 
	z-index:+2;
	
	padding:8px 16px;
	text-align:center;
	vertical-align:middle;
	overflow:hidden;
	text-decoration:none;
	cursor:pointer;
	white-space:nowrap;
}
.botonCircSemi:hover{color:#fff!important;background-color:#000!important}


.boton_fila { width: 48px !important; height: 43px; min-height: 34px !important;
	box-sizing: border-box;
	display: inline-block;
/*	float: right; */
	font-size: 16px !important;
	text-align: center !important; vertical-align: top !important;
	cursor: pointer;
	background: WhiteSmoke;
	color: Gray;
	padding: 13px 8px 2px !important;
	margin-right: 2px;
	margin-bottom: 1px;
	border-bottom: solid 1px White;
}
.boton_fila:hover { background: Gainsboro; color: Black; }


.boton20x20 { display: inline-block; width: 20px !important; height: 20px !important;  
	padding: 4px 0 2px;
	font-size: 12px; text-align:center; vertical-align:middle;
	cursor:pointer;
	background: Gainsboro; color: DimGray;
}
.boton20x20:hover { background: DimGray; color: White; }

/*
.pantallaEspera { display: block; position: fixed; left: 0px; top: 0px; bottom: 0px;
	width: 100%; height: 100%;
	background: rgba(0,0,0,0.3); opacity:0.7; 
	text-align: center;
	vertical-align: middle;
	cursor:progress;
	display:none;
	z-index:+3000;
}
.pantallaEspera img { position: relative; top: 50%;
	margin-left:auto; margin-right:auto; }
*/

.animar_a_izquierda{position:relative;animation:animaaIzq 0.4s}@keyframes animaaIzq{from{left:0px;opacity:1} to{left:-300px;opacity:0}}


.mitad_480 { display: inline-block; width: 50%; min-width: 240px; }
.tercio_720 { display: inline-block; width: 33.3333%; min-width: 240px; }

@media screen and (max-width: 1080px)
{
	.barra_top > div:nth-child(1) { width: 40%; }
	.barra_top > div:nth-child(2) { width: 30%; }
	.barra_top > div:nth-child(3) { width: 30%; }
}

@media screen and (max-width: 900px)
{
	.barra_top > div:nth-child(1) { width: 100%; border-bottom: solid 1px rgba(255,255,255,0.2); }
	.barra_top > div:nth-child(2) { width: 50%; background: transparent !important; }
	.barra_top > div:nth-child(3) { width: 50%; }
}

@media screen and (max-width: 720px)
{
	.tercio_720 { width: 100%; }
	
	.grid_encabezado_corto > div:nth-child(1) { width: 100%; }
	
	/*.barra_top > div:nth-child(1) { width: 50%; }
	.barra_top > div:nth-child(2) { width: 50%; }
	.barra_top > div:nth-child(3) { width: 100%; }*/
}

@media screen and (max-width: 480px)
{
	.mitad_480 { width: 100%; }
	
	.grid_encabezado { grid-template-columns: 100%; }
}

@media screen and (max-width: 360px)
{
	.barra_top > div:nth-child(1) { border-bottom: none; }
	.barra_top > div:nth-child(2) { width: 100%; background: rgba(255,255,255,0.12) !important; }
	.barra_top > div:nth-child(3) { width: 100%; text-align: center; }
}

@media screen and (orientation: portrait)
{
	.mitad_480 { width: 100%; }
}