/** 
 * Copyright 2008 Breezy New Media
 * =====================================     
 */     

/* -- Basics -- */
html, body, div, p, li, ul, ol, form, fieldset, h1, h2, h3, h4, h5, h6   { margin: 0; padding: 0; list-style: none; }

body{ font: normal 62.8%/1.3 Helvetica,Verdana,serif;font-size: 11px; /*background: #006699 url('/static/images/bg-body.jpg') repeat-x;*/ color: #585c5e; padding: 40px 0; }

a { color: #148d04; }
a:link { text-decoration:none; }   
a:hover { text-decoration: none !important; color: #000;}


a img { border: 0; }
/*img { border: 3px #ecf8ff solid !important; }*/

input
select, 
/*textarea { font-family: Arial, lucida, sans-serif; font-size: 1em; vertical-align: middle; }*/
input, 
textarea { background: #044979; padding: 2px 0; margin: 0; border: 1px solid #1776a4; color: #cde2f0; }
button { vertical-align: middle; margin: 0; padding: 0; height: 18px; border: none; color: #00CCFF; cursor: pointer; }
.submit { width: auto !important; overflow: visible; background-color: #312b2a; 
      border: 1px solid #000 !important; padding: 0 0px; 
        color: #fff; cursor: pointer; }

h1  { font-size: 2em; }
h2  { font-size: 1.6em; }
h3  { font-size: 1.4em; }
h4  { font-size: 1.2em; }
h5  { font-size: 1.1em; }
h6  { font-size: 1em; }

p { line-height: 20px; color:black; font-size: 1em }

#copete_justificado { font-style: italic }

.justificado { text-align: justify;}

hr#separador {height: 2px; width: 80% ; margin-bottom: 3%;   float: center}

/*COLOR DE LOS TITULOS*/
h1, h2, h3, h4, h5, h6  { color: #024877; font-family: sans-serif }

table           { border-collapse: collapse; width: 95%; }
table td,
table th        { border: 1px #d8d8d8 solid; padding: 10px; }
table th        { text-align: left; }
table td.right  { padding-left: 5px; }
table th.right  { padding-left: 5px; }
table td.left   { padding-right: 5px; }
table th.left   { padding-right: 5px; }

blockquote  { margin: 0; padding: 10px 20px; color: #333; line-height: 1.6; font-family: Georgia, serif; }
fieldset    { border: 0 !important; }

/* -- Icons list -- */
.ico              { padding-left: 15px; }
.ico-breezy       { /*background: url('../images/ico/ico-breezy.gif') 2px 0 no-repeat*/; padding: 2px 0 1px 25px; }
/*.ico-breezy:hover { background-position: 2px -18px; }*/

/* -- User friendly features -- */
.hidden   { display: none; }

/* -- Basics layout -- */
#view     { width: 900px; margin: 0 auto; }
#head     { font-size: 1.2em; position: relative; float: left; width: 100% }
#content  { font-size: 1.2em;  }
#foot     { font-size: 1.2em; clear: both;}

/* -- Logo constructs -- */
#main       { position: relative; padding-left: 25px; margin-bottom: 12px; }
#main h1    { font-family: Helvetica,Verdana,serif; font-size: 2.2em; }
#main h1 a  { text-decoration: none; color: #fff !important; }
#main h2    { font-weight: normal; font-size: 1em; padding-left: 2px; margin-top: -3px; }
#main h2,
#main h2 a  { color: #8bcced; text-decoration: none; }

#head a:hover { text-decoration: none !important; }

/*#logo { height: 43px; background: #63b7dd  url('../images/bg-logo.jpg') no-repeat;}   */
#logo *     { color: #eaafa3; text-decoration: none !important; }
#logo h2    { font-weight: normal; font-size: 1.5em; color: #d6ecf9; margin: 100px 0 0 70px; }
#logo .block{ position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; text-decoration: none; }

/* -- Main classes -- */
.fr       { float: right !important; }
.fl       { float: left !important;}

div#foot-data{width: 5%; position: relative; float: left; height: 95%; }
div#foot-data a img{ height: 95%;width:83%; margin-left: 5px; margin-top: 3px }
div#foot-izq{ width: 30%; position: relative; float: left; margin-left: 1%; margin-top: 0.5%}
div#foot div#foot-izq p.fl {   }

div#foot-cen{ width: 30%; position: relative; float: left;  margin-top: 1.5% }
div#foot-cen p a {text-decoration: underline;}

div#foot-der{ width: 33%;position: relative; float: left;  margin-top: 1.5%}
div#foot-der p{ position: relative;  float:right; }
div#foot-der p a{text-decoration: underline;}

.clear    { clear: both !important; }
.right    { text-align: right !important; }
.left     { text-align: left !important; }
.center   { text-align: center !important; }
.last     { margin-right: 0 !important; margin-bottom: 0 !important; border-bottom: none !important; 
          font-size: 1.2em; color: black ;font-style: bold;}
.small    { font-size: .90em; }
.big      { font-size: 1.5em; }
.item     { margin-bottom: 1.5em; clear: both; }
.info     { font-size: .95em; margin: 2px 0 6px !important; color: #148d04; }
.img      { padding: 3px; border: 1px #dff1f9 solid; float: left; }
.img img  { padding: 0; border: none !important; }
.self     { padding-left: 1px; float: center; margin-top: 5px; }
.self-rotulo {font-size: 1em; color: #0a1520 ; position: relative; float: right; margin-left: 10px}
.self-rotulo-cuenta {font-size: 1.2em; color: #0a1520 ; position: relative; float: right; 
                      margin-left: 10px; margin-top: 3px}
.self-nombre {font-size: 1em; color: #8bcced ; width: 100%; position: relative; float: right;}
.self-nombre p {margin-top: 1px}
.date , div#fecha_noticia { font-weight: bold; color: #50911e; margin-left: 0%; margin-bottom: 10px;}
div#fecha_noticia_completa { position: relative;float: left; width: 100%; font-weight: bold; color: #50911e; margin-left: 5%; margin-bottom: 10px;}
.relacion { font-weight: bold; font-size: 1.2em; color: #50911e; margin-left: 10% ; position: relative;float: left; }

.forgot { background: none }

.texto_noticia    { margin-bottom: 0 !important; }
.col1     { width: 48%; float: left; margin-left: 1%; margin-right: 1% }
.col2     { width: 48%; float: right; margin-right: 1% ;margin-left: 1%;}

.col2 *   { padding-left: 0 !important; }
img.left  { margin-left: 0 !important; }
img.right { margin-right: 0 !important; }

/*TEXTO FIJO*/
#info_block {
  position: relative;
  margin-left: 0%;
  width: 100%;

}

#titulo_block {
position: relative;
  width: 90%;
  text-align: center;
  margin-bottom: 5px;
}

div#texto_block p {

 text-align: justify;
}

div#cabecera_detalle {
position: relative;
width: 90%; 
font-family: 'Lucida sans' , Arial;
font-size: 1.2em;
color: black;
font-style: bold;
/*border: solid #ccc 1px;*/
margin-left: 5%;
/*margin-bottom: 15px;*/
/*margin-top:5px;  */
}

div#view div#cabecera_base { position: relative; float: left; width:100%; height: 100px; }

div#view div#cabecera_base div#cabecera_izq {position: relative; float: left; width: 30%;height:29%}
div#view div#cabecera_base div#cabecera_izq div#logo { position: relative; float: left;
       height: 108px; width: 198px; margin-top: -20px}

div#view div#cabecera_base div#cabecera_der {position: relative; float: right; width: 65%;height:29% }


div#cabecera_factura_izq {
width: 40%; position: relative; float: left;
font-family: 'Lucida sans' , Arial;
font-size: 1.2em;
color: black;
margin-left: 10%;
}

div#cabecera_factura_der {
width: 43%; position: relative; float: left;
margin-left: 5%;
font-family: 'Lucida sans' , Arial;
font-size: 1.2em;
color: black;
margin-bottom: 2%;

}

#grilla_detalle {
position: relative;
width: 90%;
margin-top: 5%;
margin-bottom: 10px;

}

/*tablas detalles y facturas*/
.tabladetalle {
  width: 90%; 
  font-family: 'trebuchet MS' , 'Lucida sans' , Arial;
  font-size: 14px;
  color: black;
  border: solid #ccc 1px;
  border-collapse: separate;
  border-spacing: 0;
  margin-left: 10%;

}

.tabladetalle > tbody > tr > td, .tabladetalle > thead > tr > th {
  border-left: 1px solid #ccc;
  border-top: 1px solid #ccc;
  padding: 5px;
  text-align: left; height: 10px;
}
 
.tabladetalle > thead > tr > th, .tabladetalle > thead > tr > td {
  background-color: #dce9f9;
}
.tabladetalle > thead > tr > th {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ebf3fc), to(#dce9f9));
  background-image: -webkit-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -moz-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -ms-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -o-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: linear-gradient(to bottom, #ebf3fc, #dce9f9);
  -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  border-top: none;
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
}

.tablafacturas {
  width: 100%; 
  font-family: 'trebuchet MS' , 'Lucida sans' , Arial;
  font-size: 14px;
  color: black;
  border: solid #ccc 1px;
  border-collapse: separate;
  border-spacing: 0;
}

.tablafacturas > tbody > tr > td, .tablafacturas > thead > tr > th {
  border-left: 1px solid #ccc;
  border-top: 1px solid #ccc;
  padding: 5px;
  text-align: left; height: 10px;
}
 
.tablafacturas > thead > tr > th, .tablafacturas > thead > tr > td {
  background-color: #dce9f9;
}
.tablafacturas > thead > tr > th {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ebf3fc), to(#dce9f9));
  background-image: -webkit-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -moz-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -ms-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -o-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: linear-gradient(to bottom, #ebf3fc, #dce9f9);
  -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  border-top: none;
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
}


.tablaarchivos {
  width: 100%; 
  font-family: 'trebuchet MS' , 'Lucida sans' , Arial;
  font-size: 14px;
  color: black;
  border: solid #ccc 1px;
  border-collapse: separate;
  border-spacing: 0;
}

.tablaarchivos > tbody > tr > td, .tablaarchivos > thead > tr > th {
  border-left: 1px solid #ccc;
  border-top: 1px solid #ccc;
  padding: 0px;
  text-align: center; height: 10px;
}
 
.tablaarchivos > thead > tr > th, .tablaarchivos > thead > tr > td {
  background-color: #dce9f9;
}
.tablaarchivos > thead > tr > th {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ebf3fc), to(#dce9f9));
  background-image: -webkit-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -moz-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -ms-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: -o-linear-gradient(top, #ebf3fc, #dce9f9);
  background-image: linear-gradient(to bottom, #ebf3fc, #dce9f9);
  -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  -moz-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  border-top: none;
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
}



button.boton_macro
{
    margin-top: -7%;
   width: 100px;
   height: 40px;
}

button.boton_macro {
   background: url('../images1/btnmacro.png') no-repeat;
     background-position: center;
  background-size: cover;
  position: relative;

}


/* -- Layout constructs -- */
/*div#cabecera_base div#cabecera_izq div#logo { position: relative;  height: 100px; width: 100px; 
      background: url('../images/logo.png'); -webkit-background-size: cover;
            -moz-background-size: cover; -o-background-size: cover; }
*/
div#cabecera_base div#cabecera_izq div#logo { position: relative;  height: 100px; width: 100px; 
      background: url('../images/SAPEM logo.jpg'); -webkit-background-size: cover;
            -moz-background-size: cover; -o-background-size: cover; }


#mainMenu   { width: 110%; margin-bottom: 15px; height: 43px ;padding: 0 12px   ;background:url('../images/bg-menu.gif') no-repeat;
            -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;background-size: cover;}

#content    { width: 100%; height: 100%; background: #fff ; float: left; }
#foot       { background: #0f2132 url('../images/bg-foot.gif') no-repeat; }

/* -- Main Menu -- */
#mainMenu ul                { position: relative; height: 100%;  }
#mainMenu li                { position: relative; float: left; }
#mainMenu li a              { display: block; width: 105px; height: 27px; padding-top: 13px; 
                            float: left; font-size: .9em; color: #fff; text-decoration: none;
                            text-align: center; 
                             }
#mainMenu li.active a,
#mainMenu li:hover        { background-color: #0a1520; background-position: 0 -43px; height: 100% }

/* -- Search block -- */
#search { position: relative; float: right; width: 100%; text-align: right; margin-top: 10px;}
/*#search .button { width: 166px !important; height: 17px; border: none; background: url('../images/bg-input.gif'); padding: 3px 12px; }
#search .submit { width: 22px !important; height: 23px; background: url('../images/bg-submit.gif') no-repeat; border: none !important; padding: 0; margin-left: 5px; } 
*/
/* -- SUB MENU - DERECHO (submenu) block -- */
#menuBlock                      { width: 20%; float: right; }
#menuBlock .box                 { margin-bottom: 20px; margin-top: 15px ;padding: 0 0px 0 0; overflow: hidden; clear: both; }
#menuBlock .firstBox            { padding-top: 25px; }
#menuBlock .box h3              { margin-bottom: 15px; padding-left: 20px; color: #064e81; font-weight: normal; background: url('../images/bg-heading.gif') 2px 45% no-repeat; }
#menuBlock .boxText p,
#menuBlock .boxText a           { color: #0b1621; }
#menuBlock .subMenu ul          {/* padding-left: 20px;*/ }
#menuBlock .subMenu ul li       { margin: 9px 0; }
#menuBlock .subMenu li a        { padding: 0 5px 0 25px; color: #064e81; overflow: hidden; background: url('../images/bg-submenu_item1.gif') 10px 60% no-repeat; }
#menuBlock .subMenu li a:hover,
#menuBlock .subMenu li.active a { color: #022a47; background: url('../static/images/bg-submenu_item2.gif') 0 60% no-repeat; }

/* -- IZQUIERDO (content) block -- */
#content > #contentBlock        { margin-bottom: 0; }
#contentBlock                   { position: relative; left: 1%; float: left; width: 79%; min-height: 550px; margin-bottom: -20px;padding: 20px 0;} 
#contentBlock img               { margin: 3px; }
/*#contentBlock table tr.add td,*/
/*#contentBlock table tr.add th   { background: url('../images/bg-table_line.gif') repeat-x; }*/

/*#contentBlock .noticia_principal { font-weight: normal; position: relative; left: -1px; padding: 0 15px 0 25px; padding-right: 0; height: 200px }*/

#contentBlock .item h2,
#contentBlock .item h3,
#contentBlock .item h4,
#contentBlock .item p           { font-weight: normal; }*/
#contentBlock .itemOdd          { position: relative; width: 100%; padding-right: 0; }
#contentBlock .itemEven         { padding-right: 0; }
#contentBlock .mainItem         { padding-right: 0; height: 200px }


div#noticia_principal {
position: relative;width :95% ; float: left; margin-left: 4%; 

}

div#lista_contactos {
  position: relative; width: 80%; float: left; margin-left: 25%; margin-top: 2%; 
}

div#info_block div#texto_block div#lista_contactos h4 { margin-top: 3%; font-size: 2.5;
}


div#imagen_nosotros {position: relative;  float: left ; margin-left: 20%; margin-top: 3%; width: 55%;
  height: 300px; background-image: url('../images/empresa-SAPEM.jpeg') ; }
div#imagen_segmentacion {
    display: block;
  margin: 0 auto;
  max-width: 100%;
  width: 80%;
  /*height: 300px;relative;  float: left ; margin-left: 20%; margin-top: 3%; width: 55%;*/
   background-image: url('../images/imagen_segmentacion.jpg') ; }

div#noticia_principal div#titulo_notiprincipal a h1 { 
  font-weight:bold;
  font-size:2.5em;
  font-color:red;
  width: 100%;
  font:Helvetica,Verdana,serif;
  /*font-family: Century, sans-serif;*/
}

div#imagencopete_notiprincipal {
  position: relative ; width: 100% ; height: 100%;
}


div#imagen_notiprincipal {
  position: relative; width: 28%; float: left; overflow: hidden;
}

div#copete_notiprincipal  {
  position: relative; width: 70%; float: left; overflow: hidden; font-style: italic; text-align: justify;
}

div#resto_noti {
  position: relative; width: 100%; overflow: hidden;}

div#contentblock div#copete p {
  font-style: italic; text-align: justify;}

/*NOTICIA COMPLETA*/
div#contentBlock div#noticia_completa div#titulo_principal {font-weight:bold; font-size:2.5em;
  color:#024877; margin-left: 0%;font:Helvetica,Verdana,serif;
  position: relative; width: 100% }

div#contentBlock div#noticia_completa div#imagen_noti img {
  position: relative; width: 25%; height: 25%; float: left; 
}

div#contentBlock div#noticia_completa div#copete_noticia , 
div#contentBlock div#noticia_completa div#autor_noticia {
   font-style: italic; text-align: justify;margin-bottom: 30px ;font-size:1.3em;
   margin-left: 5%;}


div#contentBlock div#noticia_completa div#contenido_noticia ,
div#contentBlock div#contenedor_informes div#contenido_noticia
 { font-size:1.3em; text-align: justify;margin-bottom: 20px; margin-left: 5%;}

div#contentBlock div#noticia_completa div#contenido_noticia p {text-indent: 2em; 
white-space:pre-line; }
/* -- Lists -- */
div#contentBlock div#noticia_completa div#contenido_noticia p:first-letter {
  font-size: 2em; font-weight: bold
}
/* -- margenes superiores entre parramos tablas y listas -- */
#contentBlock p,
#contentBlock ul,
#contentBlock ol,
#contentBlock table,
#menuBlock .boxText p,
#menuBlock .boxText ul,
#menuBlock .boxText ol,
#menuBlock .boxText table       { margin-bottom: 0em; }

#contentBlock ul,
#contentBlock ol,
#menuBlock .boxText ul,
#menuBlock .boxText ol          { padding-left: 10px; }
#contentBlock ol,
#menuBlock .boxText ol          { padding-left: 17px; }
#contentBlock ul *,
#contentBlock ol *,
#menuBlock .boxText ul *,
#menuBlock .boxText ol *        { margin-bottom: 0 !important; }
#contentBlock ul li,
#menuBlock .boxText ul li       { margin: 3px 0; }
#contentBlock ol li,
#menuBlock .boxText ol li       { margin: 3px 0 3px 10px; padding: 0; /*list-style: decimal;*/ }

#pie p 
#foot p       { padding: 18px 18px 0;  }
#foot *       { color: #5a8da6;  }
#foot a:hover { color: #fff;}

#foot { height: 50px; -webkit-background-size: cover;
            -moz-background-size: cover; -o-background-size: cover;background-size: cover; } 
/* -- Footer part -- */


/*FORMULARIOS*/

/* === Remove input autofocus webkit === */ 
/**:focus { outline: none; } */

div#login-recuadro{ position: relative;float: left; width: 100%; height: 100% ; border: 1px solid #555 ;}

div#login-recuadro div#presentacion-izq {position: relative;float: left; width: 55%; 
  height: 300px; background-image: url('../images/login1.jpg') ; margin-left: 0%; }


div#texto-login {position: relative;float: left; margin-left: 5%; margin-top: 5%; font-size: 1em;
  text-shadow:0 -1px 0 #396715; }

div#texto-login ul li { list-style: circle ; width: 70%; margin-top : 5%}

div#form-der {position: relative; float: right; width: 35% ; margin-right: 5%}

div#items-login ul {margin-left: -50px}


/* === Form Typography === */
.contact_form { font: 14px/21px Helvetica,Verdana,serif; } 
.contact_form h2, 
.contact_form label { font-family: Helvetica,Verdana,serif; }
/*.form_hint, .required_notification { font-size: 11px; font-color:; }*/

/* === List Styles === */ 
.contact_form {  width: 100% ; margin-left: 24%; margin-top: 10%;
        border-radius: 10px; /*padding: 5px 8px;*/ }
.contact_form ul { height: 50%, width: 100%; padding: 0px; float: left; } 
.contact_form li { position: relative; float: left;}  

/* === Form Header === */ 
.contact_form h2 { margin: 0; display: inline; } 
.required_notification { color: #d45252; margin: 5px 0 0 0; display: inline; float: right; } 

/* === Form Elements === */ 
.contact_form label { width: 150px; margin-top: 3px; display: inline-block; padding: 3px; } 
.contact_form input { height: 15px; width: 70%; padding: 5px 8px; font-size: 1.2em; color: black} 
/*.contact_form textarea { padding: 8px; width: 300px; } */

.detalle_factura_form button.submit
  { margin-left: 32% ;margin-top: 10px ; height: 30px; }


form#frm_factura_electronica button.submit
  { margin-left: 32% ;margin-top: 10px ; height: 30px; }

.contact_form button
{ margin-left: 15% ;margin-top: 10px ; height: 30px; } 
/* form element visual styles */ 

.contact_form div#btn-ingresar { position: relative;float: left; width: 90% }
.contact_form div#btn-forgot {position: relative;float: left; width: 90% ; margin-left: -18px}
.contact_form input,
.contact_form input, 
/*.contact_form textarea { border: 1px solid #aaa; box-shadow: 0px 0px 3px #ccc, 0 10px 15px #eee inset; 
    border-radius: 2px; padding-right: 30px; -moz-transition: padding .25s;
    -webkit-transition: padding .25s; -o-transition: padding .25s; transition: padding .25s; } 
*/
/*.contact_form input:focus, */
.contact_form textarea { background: #fff; border: 1px solid #555; box-shadow: 0 0 3px; }

/* === Button Style === */ 
button.submit { background-color: #66a3ff;
  background: -webkit-gradient(linear, left top, left bottom, from(#66a3ff), to(#1a75ff)); 
  background: -webkit-linear-gradient(top, #66a3ff, #1a75ff); 
  background: -moz-linear-gradient(top, #66a3ff, #1a75ff); 
  background: -ms-linear-gradient(top, #66a3ff, #1a75ff); 
  background: -o-linear-gradient(top, #66a3ff, #1a75ff); 
  background: linear-gradient(top, #66a3ff, #1a75ff); 
  border: 1px solid #509111; border-bottom: 1px solid #5b992b; border-radius: 3px; 
  -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; 
  -o-border-radius: 3px; box-shadow: inset 0 1px 0 0 #9fd574; 
  -webkit-box-shadow: 0 1px 0 0 #9fd574 inset; 
  -moz-box-shadow: 0 1px 0 0 #9fd574 inset; 
  -ms-box-shadow: 0 1px 0 0 #9fd574 inset; 
  -o-box-shadow: 0 1px 0 0 #9fd574 inset; color: white; padding: 6px 10px 6px 10px; 
  text-align: center; text-shadow: 0 -1px 0 #396715; } 
button.submit:hover { opacity: .85; cursor: pointer; } 
button.submit:active { border: 1px solid red; box-shadow: 0 0 10px 5px #356b0b inset; 
  -webkit-box-shadow: 0 0 10px 5px #356b0b inset; 
  -moz-box-shadow: 0 0 10px 5px #356b0b inset; 
  -ms-box-shadow: 0 0 10px 5px #356b0b inset; -o-box-shadow: 0 0 10px 5px #356b0b inset; } 
  /*- See more at: http://www.developerji.com/Post/Aprenda-a-crear-formularios-profesionales-con-HTML5-y-CSS-/2108#sthash.Tp3JQzub.dpuf*/






/*SIGNUP  */
.signup_form { font: 14px/21px Helvetica,Verdana,serif; } 
.signup_form h2, 
.signup_form label { font-family:Helvetica,Verdana,serif; }


/* === List Styles === */ 
.signup_form {  width: 50% ; margin-left: 24%; margin-top: 5%;
        border-radius: 10px; /*padding: 5px 8px;*/ }
.signup_form ul { width: 100%; list-style: none; 
          margin-left: 5%; padding: 0px; } 
.signup_form li { position: relative; width: 100%; text-decoration: none; }  

/* === Form Header === */ 
.signup_form h2 { margin: 0; } 
/*.required_notification { color: #d45252; margin: 5px 0 0 0; display: inline; float: right; } */

/* === Form Elements === */ 
.signup_form label { width: 100%; padding: 3px; display: inline ;text-decoration: none } 
.signup_form input { height: 15px; width: 100%; padding: 5px 8px; font-size: 1.2em; color: black} 
/*.contact_form textarea { padding: 8px; width: 300px; } */
.signup_form button { margin-left: 32% ;margin-top: 10px ; height: 30px; } 
/* form element visual styles */ 
.signup_form input, 

/*.contact_form input:focus, */
.signup_form textarea { background: #fff; border: 1px solid #555; box-shadow: 0 0 3px ;
   }



/*NOTICIAS  */
.noticia_form , .noticia_form input , .noticia_form textarea { font: 14px/21px "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode" , sans-serif; } 
.noticia_form h2, 
.noticia_form label { font-family: Helvetica,Verdana,serif; }

/* === List Styles === */ 
.noticia_form {  width: 70% ; margin-left: 5%;float: left; margin-top: 1%;
        border-radius: 10px; /*padding: 5px 8px;*/ }
.noticia_form ul { width: 100%; list-style: none; 
          margin-left: 5%; padding: 0px; }
.noticia_form li { position: relative; width: 95%; text-decoration: none; margin-bottom: 30px }  

/* === Form Header === */ 
.noticia_form h2 { margin: 0; } 
/*.required_notification { color: #d45252; margin: 5px 0 0 0; display: inline; float: right; } */

/* === Form Elements === */ 
.noticia_form label { width: 90%; margin: 5px;} 
.noticia_form input { height: 20px; width: 100%; padding: 5px 8px; font-size: 1.2em; color: black;} 
input#imagen-clear_id {width: 90%; box-shadow: 0 0 0 0; margin-left: -20%; margin-bottom: 50px}
label[for=imagen-clear_id]{ position: relative; float: left; width: 0%;   }

.noticia_form ul textarea {width: 100%; text-align: justify;}
#id_principal { height: 20px; width: 20px; padding: 5px 8px; font-size: 1.2em; color: black;} 

#id_imagen { height: 25px; width: 80%; padding: 5px 8px; font-size: 1.2em; color: black;} 
/*.noticia_form textarea { position: relative; float: left;width: 100%; }

.noticia_form textarea { border: 1px solid #aaa; box-shadow: 0px 0px 3px #ccc, 0 10px 15px #eee inset; 
    border-radius: 2px; -moz-transition: padding .25s;
    -webkit-transition: padding .25s; -o-transition: padding .25s; transition: padding .25s; 
    float: left;margin-left: 0%; margin-top: 15px;} 

.noticia_form textarea { background: #fff; border: 1px solid #555; box-shadow: 0 0 3px ;color: black}
*/

div#form_adjuntos { position: relative;float: left; width: 90%; border: 1px solid #555; box-shadow: 0 0 3px #aaa; margin-left: 8%  }
div#titulo_adjuntos{ position: relative;float: left; margin-left: 19%; margin-top: 1% }

.noticia_form textarea { background: #fff; border: 1px solid #aaa; box-shadow: 0 0 3px #aaa , 0 10px 15px #eee inset; 
                        padding-left: 5px;padding-right: 5px ;color: black ; border-radius: 2px; -moz-transition: padding .25s;
    -webkit-transition: padding .25s; -o-transition: padding .25s; transition: padding .25s;} 
.noticia_form textarea:focus {width: 100%; background: #fff; border: 1px solid #555; box-shadow: 0 0 3px #aaa; padding-left: 5px ;padding-right: 5px ;color: black } 
.noticia_form button { margin-left: 32% ;margin-top: 10px ; height: 30px; margin-right: 10px } 
/* form element visual styles */ 
.noticia_form input { background: #fff; border: 1px solid #555; box-shadow: 0 0 3px }
/*.contact_form input:focus,*/

input#id_archivo_noticia { margin-left: 13% }



/*LISTA NOTICIAS*/
div#lista_noticias { position: relative; float: left; margin-left: 0%; width: 100%;}



/*UPLOADS  */
.
#upload_form { font: 14px/21px Helvetica,Verdana,serif; } 
#upload_form h2 { font-family: Helvetica,Verdana,serif; }
#upload_form label { visibility: hidden; font-family: Helvetica,Verdana,serif; }


/* === List Styles === */ 
#upload_form {  width: 70% ; margin-left: 10%;float: left; margin-top: 1%;
        border-radius: 10px; /*padding: 5px 8px;*/ }
#upload_form ul { width: 100%; list-style: none; float: center;
          margin-left: 5%; padding: 0px; } 
#upload_form li { width: 95%; text-decoration: none; margin-bottom: 10%; 
                margin-top: 10%; }  

/* === Form Header === */ 
.upload_form h2 { margin: 0; } 
/*.required_notification { color: #d45252; margin: 5px 0 0 0; display: inline; float: right; } */

/* === Form Elements === */ 
#upload_form ul li label { width: 90%; margin : 10px; margin-top: 4%} 
#upload_form input { height: 20px; width: 80%; padding: 5px 8px; font-size: 1.2em; color: black;} 
#upload_form textarea {width: 100%; float: left}

#upload_form textarea { border: 1px solid #aaa; box-shadow: 0px 0px 3px #ccc, 0 10px 15px #eee inset; 
    border-radius: 2px; -moz-transition: padding .25s;
    -webkit-transition: padding .25s; -o-transition: padding .25s; transition: padding .25s; 
    float: left;margin-left: 0%; margin-top: 10px;} 

#upload_form button { margin-left: 40% ;margin-top: 10px ; height: 30px; } 
/* form element visual styles */ 

#upload_form input, 
/*.contact_form input:focus,*/
#upload_form textarea { background: #fff; border: 1px solid #555; box-shadow: 0 0 3px ;color: black
   }

#id_tipo_archivo { margin-top: 15px }

div#titulo_upload  { margin-left: 5%;font-size:2.5em; color:#024877;
  font:Helvetica,Verdana,serif; font-style: italic; position: relative; width: 90%;}



/*#####################################################################*/

div.round{ position: relative; float: left; margin-left: 0%;
   /*width:45%;*/
   height:30px; 
   height:auto;
   width: 30%;
   background:#2E4AB7;
   border-radius: 10px;
   box-shadow: 3px 3px 2px black;
/*-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
opacity: 0.5;
*/}
div.round-red{ position: relative; float: left; margin-left: 2%;
   /*width:45%;*/
   height:30px; 
   height:auto;
   width: 35%;
   background:#C82020;
   border-radius: 10px;
   box-shadow: 3px 3px 2px black;
/*-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
opacity: 0.5;
*/}
div.round-enargas{ position: relative; float: left; margin-left: 2%;
   /*width:45%;*/
   height:30px; 
   height:auto;
   width: 30%;
   background-image: url('../images/logoenargas.jpg');
   background-repeat: no-repeat;
   background-size: 100% 100%;
   border-radius: 10px;
   height: 180%;
   box-shadow: 3px 3px 2px black;
   
/*-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
opacity: 0.5;
*/}


p.titulo-cuadro {
font-size: 1.3em; text-align: center;
font-style: Arial, Helvetica, Verdana, Trebuchet, Tahoma, monospace ;
text-shadow: 3px 3px 2px black;
letter-spacing: 1px;
 color: #FFFFFF;
  font-weight: 900;

}

p.nro-cuadro {
font-size: 2em; text-align: center;
font-style: Arial, Helvetica, Verdana, Trebuchet, Tahoma, monospace ;
text-shadow: 3px 3px 2px black;
letter-spacing: 1px;
 color: #FFFFFF;
  font-weight: 900;
}
/* En este contenedor va todo lo que queremos mostrar. No le damos margen vertical puesto ese lo generarán los span del borde */
div.contenido{ 
   margin:0 10px;
}
/* Generamos los estilos de las span, los cuales contendrán las imágenes GIF */
span.top, span.bottom{
   width:100%;
   height:6px; /* El alto debe ser la mitad de alto de la imagen GIF */
   display:block;
}
/* A continuación viene el verdadero truco, la posición de las imágenes de fondo es importante*/

span.top span, span.bottom span{
   width:6px; /* De acuerdo al tamaño de la imagen GIF */
   /*height:6px; De acuerdo al tamaño de la imagen GIF */
   float:right;
   font-size:6px; /* Esto es para IE6, que no respeta el height del span si el tamaño de letra es mayor a este  */
}

div#recover-pass { position: relative;  float: left;width: 100%; margin-top: 5px; margin-left: 8%}
div#mensaje_login { position: relative; float: left; width: 100% }
div#mensaje_signup { position: relative; float: left; margin-left: 35%; width: 100%; margin-top: 5px   }
p.mensajes_formularios {text-align: justify; color: red}


div#fac_elec { margin-top: 6%;position: relative; float: left; margin-left: 4%}
div#fac_elec h4 {color: black; margin-top: 3%;} 

div#contentBlock .contenedor_informes div#fac_elec div#banner_factura_elec { position: relative;float: left;
 background-image: url('../images/image-envio-factura-por-mail.png'); margin-left: 4%; width: 100%; height:190px ; margin-top: 2% }

 div#items {position: relative; float: left; width: 70%; margin-top: 5%}
 div#items ul li {margin-top: 10px}


     /*<![CDATA[*/
<!--
div.ic_myCarousel {
    margin: 20px auto 0 auto;
    clear:right;
}
.infiniteCarousel {
    box-shadow: 0px 3px 3px #333;
    border: 3px solid #333;
}
.ic_left_nav, .ic_right_nav {
    display: none;
}




.enlaceboton { height: 15px; font-size: 0.95em ; width: auto !important; overflow: visible; background-color: #312b2a; 
      border: 1px solid #000 !important;  
        color: #fff; cursor: pointer;
  background-color: #66a3ff;
  background: -webkit-gradient(linear, left top, left bottom, from(#66a3ff), to(#1a75ff)); 
  background: -webkit-linear-gradient(top, #66a3ff, #1a75ff); 
  background: -moz-linear-gradient(top, #66a3ff, #1a75ff); 
  background: -ms-linear-gradient(top, #66a3ff, #1a75ff); 
  background: -o-linear-gradient(top, #66a3ff, #1a75ff); 
  background: linear-gradient(top, #66a3ff, #1a75ff); 
  border: 1px solid #509111; border-bottom: 1px solid #5b992b; border-radius: 3px; 
  -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; 
  -o-border-radius: 3px; box-shadow: inset 0 1px 0 0 #9fd574; 
  -webkit-box-shadow: 0 1px 0 0 #9fd574 inset; 
  -moz-box-shadow: 0 1px 0 0 #9fd574 inset; 
  -ms-box-shadow: 0 1px 0 0 #9fd574 inset; 
  -o-box-shadow: 0 1px 0 0 #9fd574 inset; color: white; padding: 6px 6px 7px 7px; 
  text-align: center; text-shadow: 0 -1px 0 #396715;  
} 

.enlaceboton:hover { opacity: .85; cursor: pointer; color: white }

.enlaceboton:active { border: 1px solid red; box-shadow: 0 0 10px 5px #356b0b inset; 
  -webkit-box-shadow: 0 0 10px 5px #356b0b inset; 
  -moz-box-shadow: 0 0 10px 5px #356b0b inset; 
  -ms-box-shadow: 0 0 10px 5px #356b0b inset; -o-box-shadow: 0 0 10px 5px #356b0b inset; } 


div#botones {position: relative;width: 95%; height: 40px}
div#botones a {position: relative;float: right; padding: 6px 20px 6px 20px; margin-top: 10px;}
div#botones button {position: relative;float: right;}



div#botones_modificar {position: relative;width: 100%; height: 40px ;}
div#botones_modificar a {position: relative;float: right; margin-right: -40px; margin-top: 10px; 
                         padding: 4px 20px 9px 20px;}
div#botones_modificar button {position: relative;float: right;}

div#ayuda-login { position: relative; float: right; width: 20px; margin-right: 40px; 
}

/* Style the Image Used to Trigger the Modal */
#myImg {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg:hover {opacity: 0.7;}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption { 
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {-webkit-transform:scale(0)} 
    to {-webkit-transform:scale(1)}
}

@keyframes zoom {
    from {transform:scale(0)} 
    to {transform:scale(1)}
}

/* The Close Button */
.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}

img#muestra { width: 0px ; height: 0px;
  visibility: hidden; }

img#tildeok {width: 30px; height: 30px}
img#cargando {width: 25px; height: 25px}
input#id_dia { background:white; color: black; }