body, html, legend, caption {
  	font-family: Arial;
    font-size: 10px;
  	color: Black;
    vertical-align: top;
	margin:0;
	padding:0;
}
select, input, textarea {
    font-family: Arial;
    font-size: 10px;
    color: Black;
    border: 1px solid Gainsboro;
    background-color: White
}
fieldset {
    margin: auto;
}

/* ************************************************************************** */
/* Sección de links
/* ************************************************************************** */

a {
    color: Black;
    text-decoration : none;
    display: block;
}
a:visited {
    color: Black;
    text-decoration : none;
}

/* ************************************************************************** */
/* Sección de tablas y celdas
/* ************************************************************************** */
.tablamod {
	background-color: WhiteSmoke;
	border: 1px solid LightSteelBlue;
}
.tablamodtop {
	background-color: WhiteSmoke;
	border-left: 1px solid LightSteelBlue;
	border-right: 1px solid LightSteelBlue;
	border-top: 1px solid LightSteelBlue;
}
.tablamodbottom {
	background-color: WhiteSmoke;
	border-left: 1px solid LightSteelBlue;
	border-right: 1px solid LightSteelBlue;
	border-bottom: 1px solid LightSteelBlue;
}
.modulo1 {
    font-size: 10px;
    font-weight: bold;
  	color: DarkBlue;
    line-height: 24px;
    background-image: url(pics/modulo1.jpg);
    background-repeat: repeat-x;
    background-position: bottom;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;

}
.modulo2 {
    line-height: 26px;
    background-image: url(pics/modulo2.jpg);
    background-repeat: repeat-x;
    background-position: bottom;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    border-bottom: 0px solid DeepPink
}
.modulo2:hover {
    background-image: url(pics/modulo2sel.jpg);
    background-repeat: repeat-x;
}
.titulo0 {
    line-height: 20px;
    font-weight: bold;
    color: MidnightBlue;
    background-image: url(pics/titulo0.jpg);
    background-repeat: repeat-x;
}
.titulo1 {
    line-height: 20px;
    font-weight: bold;
    color: MidnightBlue;
    background-image: url(pics/titulo1.jpg);
    background-repeat: repeat-x;
}
.titulo2 {
    line-height: 18px;
    font-weight: bold;
    color: #003399;
    background-image: url(pics/titulo2.jpg);
    background-repeat: repeat-x;
    background-position: bottom
}
.titulo3 {
    line-height: 18px;
    font-weight: bold;
    background-color: #EAEAEA;
}
.titulo4 {
    font-weight: bold;
    background-color: White;
    text-align: right;
}
.titulo3_sel {
	line-height: 18px;	
	font-weight: bold;
	background-color: White;
}
.titulo3_sel:hover {
	background-color: HoneyDew;
}
.nivel1 {
	line-height: 18px;	
	font-weight: bold;
	background-color: SkyBlue;
}
.nivel2 {
	line-height: 18px;	
	font-weight: bold;
	background-color: PowderBlue;
}
.nivel3 {
	line-height: 18px;	
	font-weight: bold;
	background-color: Lavender;
}
.item_nosel {
    background-color: White;
}
.item_sel {
    background-color: White;
}
.item_sel:hover {
    background-color: #C9F1F0;
}
.item_selb {
    background-color: White;
    font-weight: bold;
}
.item_selb:hover {
    background-color: #C9F1F0;
}
.item_sel0 {
    background-color: #FBFFFD;
}
.item_sel1 {
    background-color: White;
}
.item_sel0:hover {
    background-color: #C9F1F0;
}
.item_sel1:hover {
    background-color: #C9F1F0;
}
.titulo1x {
    line-height: 20px;
    font-weight: bold;
  	color: Maroon;
    background-image: url(pics/titulo1x.jpg);
    background-repeat: repeat-x;
}
.titulo2x {
    line-height: 18px;
    font-weight: normal;
    background-image: url(pics/titulo2x.jpg);
    background-repeat: repeat-x;
    background-position: bottom
}
.titulo1sel {
    line-height: 20px;
    font-weight: bold;
  	color: Maroon;
    background-image: url(pics/titulo1sel.jpg);
    background-repeat: repeat-x;
}
.titulo2sel {
    line-height: 18px;
    font-weight: bold;
    background-image: url(pics/titulo2sel.jpg);
    background-repeat: repeat-x;
    background-position: bottom
}

/* ************************************************************************** */
/* Sección de Tablas con gerarquía
/* ************************************************************************** */

.tr1 {
    background-color: Lavender;
}
.tr2 {
    background-color: AliceBlue;
}
.tr3 {
    background-color: #FFFFCC;
}
.tr4 {
    background-color: LightYellow;
}
.tr1:hover, .tr2:hover, .tr3:hover, .tr4:hover {
    background-color: #EAEAEA;
}

/* ************************************************************************** */
/* Sección de FILTRO
/* ************************************************************************** */

#filtro table {
    border: 1px solid PaleGoldenRod;
}
#filtro tr.filtro_titulo1 {
    background-color: LemonChiffon;
    font-weight: bold;
    color: Chocolate;
    background-image: url(pics/filtro1.jpg);
    background-repeat: repeat-x;

}
#filtro tr.filtro_item {
    background-color: LightYellow;
    background-image: url(pics/filtro2.jpg);
    background-repeat: repeat-x;
}
#filtro td.filtro_item {
    background-color: LightYellow;
    color: Chocolate;
    background-image: url(pics/filtro2.jpg);
    background-repeat: repeat-x;
}
#filtro select, #filtro input, #filtro textarea {
    color: Chocolate;
    background-color: #FFFFFF;
    border: 1px solid PaleGoldenRod;
}

/* ************************************************************************** */
/* Sección de campos de formularios y botones
/* ************************************************************************** */

.botonxx {
    font-size: 9px;
    color: Black;
    vertical-align: top;
    cursor: pointer;
    border: 0px;
    background-color: transparent;
}
.boton, .boton_negro, .boton_icon {
    font-family: Arial;
    font-size: 9px;
    color: Black;
    vertical-align: top;
    cursor: pointer;
    border: 0px;
    background-color: transparent;
}
.boton_azul, .boton_blue {
    font-family: Arial;
    font-size: 9px;
    color: MediumBlue;
    vertical-align: top;
    cursor: pointer;
    border: 0px;
    background-color: transparent;
}
.boton_verde, .boton_green {
    font-family: Arial;
    font-size: 9px;
    color: DarkGreen;
    vertical-align: top;
    cursor: pointer;
    border: 0px;
    background-color: transparent;
}
.boton_rojo, .boton_red {
    font-family: Arial;
    font-size: 9px;
    color: FireBrick;
    vertical-align: top;
    cursor: pointer;
    border: 0px;
    background-color: transparent;
}


.boton_icon0 {
    font-family: Arial;
    font-size: 9px;
    color: #FF0000;
    vertical-align: bottom;
    cursor: pointer;
    border: 0px;
    background-color: transparent;
    height: 16px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

/* ************************************************************************** */
/* Menu flip flop
/* ************************************************************************** */

.order {
  	font-family: Arial;
    font-size: 10px;
    background-color: transparent;
    font-weight: normal;
    display: block;
    border: 0px;
}
.order:hover {
    color: RoyalBlue;
    cursor: pointer;
}

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

.item_titulo1 {
    background-color: Lavender;
    font-weight: bold;
    line-height: 16px;
    text-align: center;
}
.item_titulo2 {
    background-color: #EFEFEF;
    font-weight: bold;
}
.item_par {
    background-color: #F8F8F8;
}

.input_tra {
    font-family: Verdana;
    color: black;
    font-size: 9px;
    background-color: transparent;
    height: 14px;
    text-align: right;
    border: 0px solid Black;
}
.aceptar {
    background-image: url(iconos/accept.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 15px;
    height: 15px;
    padding-left: 100px;
}
.agregar {
    background-image: url(iconos/application_add.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 15px;
    height: 15px;
    padding-left: 100px
}
.actualizar {
    background-image: url(iconos/arrow_refresh.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 15px;
    height: 15px;
    padding-left: 100px
}
.agregar2 {
    background-image: url(iconos/add.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 15px;
    height: 15px;
    padding-left: 100px
}
.eliminar {
    background-image: url(iconos/delete.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 15px;
    height: 15px;
    padding-left: 100px
}
.buscar {
    background-image: url(iconos/magnifier.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 15px;
    height: 15px;
    padding-left: 100px
}
.editar {
    background-image: url(iconos/pencil.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 15px;
    height: 15px;
    padding-left: 100px
}
.pdf {
    background-image: url(iconos/page_white_acrobat.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 50px;
    height: 50px;
    padding-left: 100px
}
.html {
    background-image: url(iconos/page_white_world.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 50px;
    height: 50px;
    padding-left: 100px
}
.ok {
    background-image: url(iconos/tick.png);
    background-repeat: no-repeat;
    border: 0px solid #FF0066;
    width: 15px;
    height: 15px;
    padding-left: 100px
}
	* {
		margin: 0;
		padding: 0;
	}

	body {
		background-color: #252525;
		font-family: Helvetica, Arial, Sans-Serif;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	#contenedor {
		background: #252525;
		width: 100%;
		margin: 0 auto;
	
	}
	header {
		width: 100%;
		height: 90px;
		background: #ffffff;
		border-bottom: 3px solid #e66432;

	}

		header .marca-hs {
			width: 100%;
			max-width: 1200px;
			height: 90px;
			margin: 0 auto;
		}

		header .marca-hs img {
			margin: 0 auto;
			margin-top: 10px;
		}

	article {
		width: 100%;
		height: 500px;
		background-image: url(pics/slider01.jpg);
		margin: 0 auto;
	}

		.login-hs {
			width: 100%;
			max-width: 1200px;
			margin: 0 auto;
			height: 500px;
			position: relative;
			top: 50px;
		}

			/**** inicio estilos para formuario HS****/


			.form-hs {
				position: relative;
				top: 10px;
				border-radius: 5px;
				width: 100%;
				max-width: 200px;
				height: 210px;
				margin: 0 auto;
			}
			
			.recuadro {
				color: #fff;
				font-family: Arial, Helvetica, sans-serif;
				border-radius: 5px;
				line-height: 22px;
				background: rgba(255, 255, 255, 0.2);
				padding: 6px 0 6px 10px;
				margin-bottom: 23px;
				width:100%;
			  	border: 1px solid #fff;
			  
			}

			.recuadro:focus {
				color:#d5d5d5;
			  	border: 1px solid #e66432;
			}

			form .recuerdame {
				color: #fff;
				font-size: 12px;
				font-family: Arial, Helvetica, Sans-Serif;
				margin-bottom: 23px;
			}

			form .recuerdame .icon-checkbox-unchecked {
				margin-right: 7px;
			}


			#boton{
				font-family: Arial, Helvetica, sans-serif;
				width: 100px;
				background-color: #ffffff;
				color:#595959;
				font-size:10px;
				padding-top:7px;
				padding-bottom:7px;
				border-radius: 3px;
				border: none;

			}

			#boton:hover{
				background-color: #e66432;
				color: #ffffff;
			}


			form .click-aqui {
				color: #fff;
				font-size: 10px;
				font-family: Arial, Helvetica, Sans-Serif;
				margin-top: 23px;
			}

			form p a {
				color: #fff;
			}

			form p a:hover {
				color: #e66432;
			}
				

			/**** fin estilos para formuario HS ****/

	footer {
		width: 100%;
		height: 70px;
		background: #252525;
	}

		footer .text-footer {
			width: 100%;
			max-width: 1200px;
			margin: 0 auto;
			background: red;
		}

		footer .text-footer p {
			font-size: 11px;
			color: #6b6b6b;
		}

		footer .text-footer a {
			color: #00b1f0;
		}

		footer .text-footer > p {
			margin-top: 30px;
			float: left;
		}

		footer .text-footer .text-der {
			float: right;
		}