﻿@charset "utf-8";
/*
CSS Para la creación del diseño base para el diseño de la nueva página de grupo Zeta
Hecho por Martín Olmos 13/abr/2009
*/

/*

Etiquetas

*/

body
{
	background-color:#B2C2D9;
}

/*

Clases

*/

/*Iniciamos quitando los márgenes y los paddings de la página y escondiendo los spans con clase hideme de la página*/

*
{
	margin:0;
	padding:0;
}

#search {
    width: 50em;  height: 8em;
}

.hideme
{
	display:none;
	visibility:hidden;
}

.main_wrapper
{
	max-width:950px;
	min-width:950px;
	width:950px;
	margin-left:auto;
	margin-right:auto;
	/*Colocamos el spacer gris que delimita las esquinas y el sidebar con el contenido*/
	background: url(/pagina_internet/general/imagenes/spacer.gif) top left repeat-y;
	background-color:#FFFFFF;
}

.main_wrapper .menuspacer
{
	background-image: url(/pagina_internet/general/imagenes/spacer.gif);
	background-position: 250px 0px;
	background-repeat:repeat-y;
}



/*Iniciamos el diseño del menúi de navegación (Sidebar)*/

/*Iniciamos con el CSS del logo*/
.seccion_sidebar .main_logo
{
	background: #003581  url(/pagina_internet/general/imagenes/logo.jpg) 50% top no-repeat;
	padding-top:33px;
	padding-bottom:34px;
	margin-right:10px;
}

/*Enseguida ajustamos el menú de navegacion*/
.seccion_sidebar .seccion_menunav
{
	margin-left:20px;
	font-size:10.16pt;
	margin-top:3px;
	margin-right:20px;
}
/*Para fe informacion*/
.seccion_fe
{
color:#87C03F;
font-weight:lighter;
text-align: right;
text-decoration: none;
position:relative;
margin-top:2%;
right:25%;
}
/*
a.verde{color:#87C03F;}*/
.seccion_fe a:link
{color:text-decoration: none;color:#87C03F;
background: url(/pagina_internet/general/imagenes/flecha_verde.gif) no-repeat right;

} 

.seccion_fe a:visited
{color:text-decoration: none;color:#87C03F;
background: url(/pagina_internet/general/imagenes/flecha_verde.gif) no-repeat right;

} 

.seccion_fe a:active
{text-decoration: none;color:#87C03F;
background: url(/pagina_internet/general/imagenes/flecha_verde.gif) no-repeat right;

}

.seccion_fe a:hover
{color:#7d7d7d;
background: url(/pagina_internet/general/imagenes/flecha_gris.gif) no-repeat right;

} 
 

.seccion_sidebar .seccion_menunav .menunav li
{
	margin-bottom:0.3em;
	margin-top:0em;
	list-style-type:none;
	background: url(/pagina_internet/general/imagenes/bullet.jpg) left 50% no-repeat;
	padding-left:14px;
	border-bottom:2px solid #d4d4d4;
	margin-right:10px;
}

.seccion_sidebar .seccion_menunav .menunav a
{
	text-decoration:none;
	color:#525252;
}

.seccion_sidebar .seccion_menunav .menunav a:hover
{
	color:#85c13d;
}

/*Enseguida ajustamos la sección de Pagos en Linea*/
/*Primero ajustamos el header de los 2 encabezados de las secciones del menú*/
.subseccion_header
{
	background: url(/pagina_internet/general/imagenes/bullet_menuheader.gif) left 50% no-repeat;
	color:#FFFFFF;
	text-transform:uppercase;
	padding-top:6px;
	padding-bottom:6px;
	z-index:5000;
	height:auto;
	overflow:hidden;
	display:block;
}

/*.subseccion_header span*/
.subseccion_header div
{
	background-color:#003683;
	font-size:8pt;
	font-weight:bold;
	margin-left:30px;
	padding-left:3px;
	padding-top:3px;
	padding-bottom:2px;
	margin-right:10px;
}

.subseccion_header_verde div
{
	background-color:#87C03F;
	font-size:8pt;
	font-weight:bold;
	margin-left:30px;
	padding-left:3px;
	padding-top:3px;
	padding-bottom:2px;
	margin-right:10px;
}

.subseccion_header_verde
{
	background: url(/pagina_internet/imagenes/titlebullet_green.gif) left 50% no-repeat;
	color:#FFFFFF;
	text-transform:uppercase;
	padding-top:6px;
	padding-bottom:6px;
	z-index:10000;
}


.subseccion_header_guatemala div
{
	font-size:8pt;
	font-weight:bold;
	margin-left:30px;
	padding-left:3px;
	padding-top:3px;
	padding-bottom:2px;
	margin-right:10px;
}
/* Enseguida ajustamos la seccion de información al cliente*/
.contenido_infocliente .header_subseccion_infocliente
{
	font-size:10.77pt;
	padding-left:10px;
	font-weight:bold;
}

/* A la numereación le damos un margen para que aparezcan los números y le damos formato*/
.contenido_infocliente .infocliente_contenido .lista_comunicados_sener
{
	padding-left:10px;
	margin-right:10px;
}

.contenido_infocliente .infocliente_contenido .lista_comunicados_sener li
{
	padding:0;
	margin:0;
/*	border-bottom:#86C03F 2px solid;*/
	padding-bottom:5px;
	list-style:none;
/*	background: url(/pagina_internet/general/imagenes/numbering_sener.jpg) no-repeat;*/
	padding-left:35px;
	padding-top:9px;
	padding-bottom:8px;
}

/*Ajustamos cada uno de los li de los comunicados para acomodar la imagen*/
.contenido_infocliente .infocliente_contenido .lista_comunicados_sener .numuno
{
	background: url(/pagina_internet/general/imagenes/numberuno.jpg) no-repeat;
	background-position:left 50%;
}

.contenido_infocliente .infocliente_contenido .lista_comunicados_sener .numdos
{
	border-top:#86C03F 2px solid;
	border-bottom:#86C03F 2px solid;
	background: url(/pagina_internet/general/imagenes/numberdos.jpg) no-repeat;
	background-position:left 50%;
}

.contenido_infocliente .infocliente_contenido .lista_comunicados_sener .numtres
{
	border-bottom:#86C03F 2px solid;
	background: url(/pagina_internet/general/imagenes/numbertres.jpg) no-repeat;
	background-position:left 50%;
/*	border:transparent;*/
}

.contenido_infocliente .infocliente_contenido .lista_comunicados_sener .numcuatro
{
	background: url(/pagina_internet/general/imagenes/numbercuatro.jpg) no-repeat;
		border-bottom:#86C03F 2px solid;
	background-position:left 50%;
}
.contenido_infocliente .infocliente_contenido .lista_comunicados_sener .numcinco
{
	background: url(/pagina_internet/general/imagenes/numbercinco.jpg) no-repeat;
	background-position:left 50%;
}

.contenido_infocliente .infocliente_contenido .lista_comunicados_sener li a, .contenido_infocliente .infocliente_contenido .lista_comunicados_sener li .bold
{
	font-size:9pt;
	font-weight:normal;
	color:#7D7D7D;
	text-decoration:none;
}

.contenido_infocliente .infocliente_contenido .lista_comunicados_sener li .bold
{
	font-weight:bold;
	color:#000000;
}

/*MOLMOS (29/abr/2009) Se agregan las listas de los precios oficiales ordenados por año. Se les da formato a dichas listas*/
.infocliente_contenido .listaprecios
{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9pt;
	letter-spacing:-1px;
	margin-left:50px;
}

.infocliente_contenido .listaprecios li
{
	list-style:none;
	background:url(../../imagenes/flechitaverde.gif) left 5px no-repeat;
	padding-bottom:5px;
	font-weight:bold;
}

.infocliente_contenido .listaprecios li a
{
	padding-left:10px;
	color:#7d7d7d;
	text-decoration:none;
}

.infocliente_contenido .listaprecios li a:hover
{
	text-decoration:underline;
}

/*damos formato a los submenus*/
.infocliente_contenido .listaprecios .listaprecios_submenu1 li
{
	background:none !important;
	list-style-type:square;
	margin-left:25px;
	font-weight:normal;
}
.infocliente_contenido .listaprecios .listaprecios_submenu1 li a
{
	padding-left:0 !important;
}

/*Por último damon un padding superior a la sección de contenido para que se pueda ver todo el contenido del canvas*/

.seccion_contenido .main_content
{
	padding-top:70px;
}

/*Enseguida damos estilo al menú superior*/
.seccion_supmenu
{
	float:left;
	/*background-color:#666666;*/
	font-size:11pt;
	font-weight:bold;
}

.seccion_supmenu .supmenu
{
	float:left;
	width: 100%;
  	list-style: none;
}

.seccion_supmenu .supmenu li
{
	float:left;
	margin-right:5px;
}

.seccion_supmenu .supmenu li a
{
	display:block;
	text-decoration:none;
	color:#FFFFFF;
	padding-top:26px;
	padding-bottom:26px;
	text-align:right;
	padding-left:0px;
	padding-right:6px;
	white-space:normal;
	width:220px;  /*Propuesto a cambios para hacer el tamaño de los botones ajustables*/
	letter-spacing:-1px;
}

.seccion_supmenu .supmenu .clientes_residenciales
{
	background-color:#C8C8C8;
}
.seccion_supmenu .supmenu .clientes_residenciales a
{
	color:#243C7B;
}

/*Clases temporales para el hover en los menús superiores*/
.seccion_supmenu .supmenu .clientes_residenciales a:hover
{
	background-color:#e6e5e6;/*#EEEEEE*/
}

.seccion_supmenu .supmenu .clientes_industriales
{
	background-color:#6686B3;
}

.seccion_supmenu .supmenu .clientes_industriales a
{
	padding-bottom:8px;
}

.seccion_supmenu .supmenu .clientes_industriales a:hover
{
	background-color:#b1c2da;/*#6AABDB;*/
}

.seccion_supmenu .supmenu .proveedores
{
	background-color:#003581;
	margin-right:0;
}

.seccion_supmenu .supmenu .proveedores a:hover
{
	background-color:#7f99c1;/*#0061F2;*/
}

/*Ajustamos el footer de la página*/
/*Hay que limpiar el float del menu superior para evitar overlapping con el toolbar*/
.seccion_contenido
{
	margin-left:256px;
	margin-right:2px;
}

/*Creamos el ajuste de la sección de búsquedas*/
.footer_searchbar
{
	border-top:1px solid #d4d4d4;
	float:left;
	width:100%;
}
.seccion_contenido .footer_searchbar form
{
	float:left;
	width:37%;
	text-transform:uppercase;
	padding-left:20px;
	font-size:9pt;
	line-height:0;
	padding-bottom:3px;
}

.seccion_contenido .footer_searchbar .gobutton
{
	line-height:0;
	border:none;
	background-color:#FFFFFF;
	color:#86C03F;
	padding-top:8px;
	padding-bottom:8px;
}

.seccion_contenido .footer_searchbar form label
{
	padding-top:15px;
}

.seccion_contenido .footer_searchbar .link_canvas
{
	float:right;
	width:60%;
	text-align:right;
	/*padding-right:20px;*/
	margin-top:6px;
}

.seccion_contenido .footer_searchbar .link_canvas div
{
	display:inline;
	padding-right:15px;
	font-size:8pt;
}

.seccion_contenido .footer_searchbar .link_canvas div a
{
	text-decoration:none;
	color:#000000;
	padding-left:15px;
}

.seccion_contenido .footer_searchbar .link_canvas .pedidos_linea a
{
	background: url(/pagina_internet/general/imagenes/pedidos.jpg) left 50% no-repeat;
}

.seccion_contenido .footer_searchbar .link_canvas .aviso a
{
	background: url(/pagina_internet/general/imagenes/candadito_icon.png) left 50% no-repeat;
	padding-top: 3px;

}

.seccion_contenido .footer_searchbar .link_canvas .contactanos a
{
	background: url(/pagina_internet/general/imagenes/sobre.jpg) left 50% no-repeat;
	padding-left:19px;
}
/*COMIENZA EL SHOW....Comenzamos el ajuste del layout de la página*/
/* Primero ajustamos el main_wrappe a un width de 100%*/
.main_wrapper
{
	width:100%;
}

/*Flotamos a la derecha el menu de navegación*/
.seccion_sidebar
{
	float:left;
	width:250px;
	/*background-color:#FFFFFF;*/
	padding-left:6px;
}
/* Este div ayuda a colocar el spacer gris en la parte derecha del menú de navegación*/
/*.seccion_sidebar .spacerright_div*/
.mainspacer_right
{
	background: url(/pagina_internet/general/imagenes/spacer.gif) top right repeat-y;
	padding-right:4px;
}

.seccion_sidebar, .seccion_supmenu, .seccion_footer, .footer_searchbar
{
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
/*Ajustamos el spacer azul (El mas dificil jejejeje)*/
.seccion_footer
{
	margin-right:2px;
	margin-left:6px;
}

.seccion_footer .blue_spacer
{
	clear:both;
	background-color:#003581;
}
.facturacion_elec{
	font-size:10.16pt;
	margin-left:30px;
	margin-right:20px;
	margin-top:3px;
	letter-spacing:-1px;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	padding-bottom:5px;
}

/* Fue bastante dificil fiiuuuuuu :D)*/

/* Yo digo que el martín puso ese último comment...*/

/* Que onda muchachos mas trabajo menos commets jajajaja :) */

.accesos_en_linea, .accesos_en_linea_ultimo{
	font-size:10.16pt;
	margin-left:20px;
	margin-right:20px;
	margin-top:3px;
	letter-spacing:-1px;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	font-family:Tahoma,Helvetica,sans-serif;
	border-bottom-color:#86C03F;
	border-bottom-style:solid;
	border-bottom-width:2px;
	color:#7D7D7D;
	background:transparent url(../../imagenes/flechitaverde.gif) no-repeat scroll left 50%;
	padding-bottom:5px;
	padding-left:15px;
}
.accesos_en_linea_ultimo{
	border-bottom:0px;
}

/* ESTILOS PARA TABLAS */
.data_table
{
	font-family:Tahoma, Helvetica, sans-serif;
	font-size:10pt;
	border-collapse:collapse;
	margin-top:20px;
	margin-right:10px;
}

.data_table th
{
	padding:5px;
	color:#ffffff;
	font-weight:bold;
	background-color:#6687B4;
	text-transform:uppercase;
	border-right:2px solid #ffffff;
	border-left:2px solid #ffffff;
	border-bottom-width:4px;
}
.data_table_dos
{
	font-family:Tahoma, Helvetica, sans-serif;
	font-size:10pt;
	border-collapse:collapse;
	margin-top:20px;
	margin-right:10px;
}

.data_table_dos th
{
	padding:5px;
	color:#ffffff;
	font-weight:bold;
	background-color:#6687B4;
	border-right:2px solid #ffffff;
	border-left:2px solid #ffffff;
	border-bottom-width:4px;
}


.data_table_dos .mult_values
{
	text-align:center;
	white-space:nowrap;
}

.data_table_dos td
{
	padding:3px;
	background-color:#CCCCCC;
	color:#656565;
	border:2px solid #ffffff;
}

.data_table_dos .impar
{
	background-color:#E6E6E6 !important;
}

.data_table_dos .fixedcolumn
{
	background-color:#B2C2D9;
	font-weight:bold;
}

.data_table_dos .sectiontitle
{
	background-color:transparent!important;
	padding:0;
}

.data_table_dos .sectiontitle .menuarea
{
	padding:0 !important;
	background:transparent !important;
}


.letra_s
{
font-size:8pt !important;
}

.letra_xs
{
font-size:7pt !important;
}

.data_table .mult_values
{
	text-align:center;
	white-space:nowrap;
}

.data_table td
{
	padding:3px;
	background-color:#CCCCCC;
	color:#656565;
	border:2px solid #ffffff;
}

.data_table .impar
{
	background-color:#E6E6E6 !important;
}

.data_table .fixedcolumn
{
	background-color:#B2C2D9;
	font-weight:bold;
}

.data_table .sectiontitle
{
	background-color:transparent!important;
	padding:0;
}

.data_table .sectiontitle .menuarea
{
	padding:0 !important;
	background:transparent !important;
}

/*MOLMOS(2009-jul-29):Modificación para agregar la nueva sección de Bolsa de trabajo:*/
.seccion_bolsa_trabajo
{
	position:relative;
	padding-top:23px;
	zoom:100%;
	margin-right:10px;
}

.seccion_bolsa_trabajo .subseccion_header
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	padding-right:0 !important;
	margin-right:0;
}

.seccion_bolsa_trabajo .subseccion_header div
{
	margin-right:0;
}

.seccion_bolsa_trabajo .contenido_bolsatrabajo
{
	/*margin-right:10px;*/
	font-size:9pt;
	font-style:italic;
	font-weight:bold;
	background:#dbebc4 url(../imagenes/bolsa_trabajo.gif) right top no-repeat;
	line-height:1.4;
	/*padding:15px 47px 15px 15px;*/
	padding:15px 47px 15px 15px;
}

.seccion_bolsa_trabajo .contenido_bolsatrabajo a
{
	color:#000000;
	font-size:10pt;
	font-weight:bold;
}

#Entrar {
    position:relative;
    margin-top:1%;
    left:18%;
    width: 50%;
    height: 50%;
    }