/*
  Estilos para Sistema de Administracion 1.4
  Loom Tecnologia, S.A. de C.V.
  Mauricio Reyes, octubre 2014
*/

#container { margin: 0 auto; padding: 0; width: 100%; max-width: 1920px; }

#header { position: fixed; top: 0; left: 0; right: 0; width: 100%; height: 100px; z-index: 999; background: #FFFFFF; border-bottom: 1px solid #999; }
#header_logo { float: left; margin: 10px 0 0 10px; }
#header_titulo { margin: 25px auto 5px; width: 40%; text-align: center; background-color: transparent; }
#header_idioma { position: absolute; top: 10px; right: 10px; }
#header_ambiente { margin: 0 auto; width: 40%; text-align: center; font-size: 1.2em; background-color: transparent; }
#header_fecha { position: absolute; top: 50px; right: 15px; font-size: 1.2em; text-align: right; }
#header_menu_derecha { position: absolute; top: 70px; right: 15px; font-size: 1.2em; text-align: right; z-index: 10; }

#barra_menu { position: fixed; left: 0; top: 100px; height: 100%; width: 200px; padding-top: 20px; background-color: Gray; z-index: 1000; }
.menu_item { float: left; }
#menu, #menu ul { list-style: none; padding: 0; margin: 0; width: 200px; }
#menu li { position: relative; }
#menu li span { position: absolute; top: 2px; right: 2px; }
#menu a { display: block; text-decoration: none; padding: 10px 10px 10px 40px; margin-right: 10px; font: 14px Arial; color: #FFFFFF; text-align: left; cursor: pointer; }
#menu a:hover { background-color: transparent; color: #AAA; }
#menu li ul { position: absolute; top: 0; left: 190px; display: none; border-radius: 6px; padding: 10px 3px; width: 160px; background-color: #BBB; } /* Cambiar aqui color de fondo submenu primer nivel */
#menu ul a { color: #000; font: 12px Arial; padding: 3px 7px; margin-right: 0; height: auto; cursor: pointer; }
#menu ul a:hover { background-color: transparent; color: #FFFFFF; }
#menu hr { color: #FFFFFF; border: 1px solid #999; }
#menu ul li ul { position: absolute; top: -10px; left: 155px; border-radius: 6px; padding: 10px 3px; background-color: #DDD; } /* Cambiar aqui color de fondo submenu segundo nivel */
#menu li:hover ul, #menu li.over ul { display: block; }
#menu li:hover ul ul, #menu li.over ul ul { display: none; }
#menu ul li:hover ul, #menu ul li.over ul { display: block; }
#menu ul ul a { text-align: left; margin-right: 0; }
#menu { position: relative; z-index: 1001; }
#menu ul { position: relative; z-index: 1002; }
#menu ul ul { position: relative; z-index: 1003; }

#wrapper { height: 100%; min-height: 1200px; margin-top: 100px; margin-left: 200px; margin-bottom: 0; position: relative; padding: 0; background-color: #e7ebee; }
#cuerpo { margin: 0; padding: 10px 20px 80px; vertical-align:top; background-color: transparent; }
#encabezado { margin: 0 0 10px; padding: 0; font-size: 1.4em; font-weight: normal; background-color: transparent; }
#copyright { position: fixed; bottom: 0; left: 0; right: 0; width: 100%; margin: 0; z-index: 999; padding: 8px; text-align: center; font-size: 1em; background-color: #FFFFFF; border-top: 1px solid #999; }

#login { margin: 0 auto; position: relative; top: 150px; width: 650px; height: 350px; background-color: #FFFFFF; border-radius: 10px; box-shadow: 0px 0px 20px #000000; }
#login_err { position: absolute; left: 280px; top: 20px; width: 250px; height: 30px; color: Red; font-weight: bold; font-size: 1.1em; }
#login_logo { position: absolute; left: 20px; top: 60px; width: 250px; height: 150px; text-align: center; }
#login_forma { position: absolute; left: 280px; top: 60px; width: 250px; height: 150px; }
#login_sp { position: absolute; left: 20px; top: 280px; width: 250px; height: 20px; text-align: center; }
#login_sp a { color: #00008B; text-decoration: none; font-size: 1.2em; }
#login_sp a:hover { text-decoration: underline; }
#login_olvido { position: absolute; left: 280px; top: 280px; width: 250px; height: 20px; text-align: left; }
#login_olvido a { color: #00008B; text-decoration: none; font-size: 1.2em; }
#login_olvido a:hover { text-decoration: underline; }

.lista_buscar { font-weight: bold; font-size: 1.2em; margin: 4px 5px 0 0; float: left; }
.lista_buscar_iconos { margin-right: 5px; margin-bottom: 10px; float: left; }
#lista_exportar { float: right; }
#lista_cabecera { clear: both; overflow: hidden; }
#lista_container { margin: 0; padding: 0; }
#lista_datos { margin: 0 auto 10px; width: 100%; overflow-x: hidden; overflow-y: scroll; border-bottom: 1px solid #AEE; }
#lista_insertar { float: left; margin-bottom: 20px; }
#lista_totales { margin: 0 auto; width: 40%; padding-top: 4px; text-align: center; font-size: 1.1em; }

.tabla { border-collapse: collapse; border-spacing: 0; width: 100%; margin: 0; }
.tabla th { position: relative; background-color: #666; color: #D3D3D3; font-weight: bold; font-size: 1.2em; padding: 3px; }
.tabla th a { color: #FFFFFF; }
.tabla th a:hover { text-decoration: underline; }
.tabla th a span { position: absolute; top: 2px; right: 10px; }
.tabla td { color: #666; font-weight: normal; font-size: 1.1em; padding: 3px; }
.tabla td img { width: 16px; height: 16px; border: 0; text-align: center; vertical-align: middle; }
.tabla tr:nth-child(odd) { background-color: #FFFFFF; }
.tabla tr:nth-child(even) { background-color: #F0F8FF; }
.tabla td { border-bottom: 1px solid #AEE; }

/*
  Boton            <button id='btn'>Boton</button>
  Boton con icono  <a href='#' class='icon_button ui-state-default ui-corner-all'><span class='ui-icon ui-icon-newwin'></span>Boton con icono</a>
  Icono boton      <div class='icon ui-state-default ui-corner-all' title='Tooltip'><span class='ui-icon ui-icon-search'></span></div>
  Icono            <span class='ui-icon ui-icon-trash'></span>
*/
.icon_button { margin: 0; padding: .4em 1em .4em 20px; text-decoration: none; position: relative; font-size: 1em; float: left; }
.icon_button span.ui-icon { margin: 0 5px 0 0; position: absolute; left: .2em; top: 50%; margin-top: -8px; }
.icon {margin: 0; position: relative; padding: 4px 0; cursor: pointer; float: left; }
.icon span.ui-icon { float: left; margin: 0 4px; }


.css_default { background-color: transparent; color: #666; font-size: 12px; }
.css_caja { background-color: #666; color: #FFFFFF; font-size: 1.3em; font-weight: bold; text-align: center; }
.css_prompt { background-color: transparent; color: #666; font-size: 1.2em; font-weight: bold; }
.css_input { background-color: #FFFFFF; color: #666; font-size: 1.2em; }
.css_input_error { background-color: #FFFFFF; color: #666; font-size: 1.2em; border-style: Solid; border-color: Yellow; }
.css_etq_texto { background-color: #transparent; color: #666; font-size: 1.2em; }
.css_msg_error { color: Red; font-weight: bold; font-size: 1.1em; }
.css_paginas { background-color: #transparent; color: #666; font-size: 1.2em; font-weight: bold; }


/* Estilos para LOVs */
#lovLista{ position:absolute; height: 258px; overflow:auto; }
#lovFiltro { position:relative; width: 270px; }
#filtro { float:left; }
#contLista { font-size: 1.1em; }
.chico { width: 279px; }
.mediano {	width: 479px; }
.grande { width: 679px; }
.enorme { width: 779px; }
