/*
Reglas para trabajar con CSS

1) Primero se definen los estilos para ETIQUETAS html. por ejemplo : header, footer, div, a, p, etc.

2) Despues se definen los estilos para IDENTIFICADORES (id), los id's son elementos unicos en el html,
   en el css se declaran con el simbolo de # ejemplo: #nombre-id{  estilos  } y en el html se llaman
   mediante el atributo id ejemplo :   <div id="publicidad"></div>
   
3) Al fnal se definen los estilos para las CLASES (class), las clases son elementos que se pueden
   repetir 'n' veces en el html, en el css se declaran con el simbolo de . ejemplo :   .nombre-clase{  estilos  }
   y en el html se llaman mediante el atributo class, ejemplo : <div class="borde-logos"></div> 

4) Todos los estilos se ordenan conforme van apareciendo en la disposicion del html, teniendo en cuenta
   la prioridad anterior, es decir, primero ETIQUETAS, luego IDENTIFICADORES y al final las CLASES

5) Los atributos se declaran de la siguiente forma : { atributo:valor1; atributo:valor2; ...atributoN:valorN; }

6) Todos los atributos se ordenan alfabeticamente, por ejemplo si tengo width, color, display
   entonces el orden seria primero color, luego display y al final width
   
7) Si tenemos estilos para el comodin *, o para las etiquetas html y/o body, estos estilos son los
   primeros en definirse. 

8) En el body debemos declarar un tamaņo de fuente global.

9) Si tenemos estilos para resetear elementos html, estos iran antes de cualquier estilo.

*/

/*   reseteo universal   */
* {
	border: 0;
	margin: 0;
	padding: 0;
}

@font-face {
    font-family: "Chalet";
    src: url("../fonts/Chalet.eot");	
    src: url("../fonts/Chalet.eot?#iefix") format("embedded-opentype"),	
         url("../fonts/Chalet.woff") format("woff"),
         url("../fonts/Chalet.ttf") format("truetype"),
         url("../fonts/Chalet.svg#Chalet") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Pecita";
    src: url("../fonts/Pecita.eot");	
    src: url("../fonts/Pecita.eot?#iefix") format("embedded-opentype"),	
         url("../fonts/Pecita.woff") format("woff"),
         url("../fonts/Pecita.ttf") format("truetype"),
         url("../fonts/Pecita.svg#Chalet") format("svg");
    font-weight: normal;
    font-style: normal;
}

/*   16px = 12pt = 100% = 1em   */
body {
/*
    font-size: 1em;     /*   16px = 1em.  standart, tamaņo de fuente Global 
*/
    background-color: #FFF;   
}

section#contenedor_clave {   /*   contenedor del programa de clave de acceso   */
/*
    box-shadow: .25em .25em .25em rgba(53,72,110,.5);
*/
    background-color: #FFF;
    border-radius: 8px;
    box-shadow: 4px 4px 4px rgba(53,72,110,.5);
    display:block;
    min-height: 110px;
    margin: 16px auto;
    padding: 4px;
    width: 78%;
}

article#group3 {
/*
    min-height: 110px;
    text-align: center;
    height: 190%;
    margin: 1.5% auto;
*/
    background: -webkit-gradient(linear, left top, left bottom, from(#34466D), to(#ffffff));
    background: -moz-linear-gradient(top,  #34466D,  #ffffff);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#D7E9F3', endColorstr='#ffffff');
    border-radius: 8px;
    display:block;
    margin: 1.5% 0% 0% 0%;
    max-width: 97%;   /*    ancho del header (titulo)   */
    margin: 1.8% auto;
}

/*
article#group3_parte1, article#group3_parte2, article#group3_parte3 { 
*/
article#group3_parte1, article#group3_parte2 { 
    /*
    max-width: 100%;
    vertical-align: middle;   /*  en medio del bloque  
    min-height: 110px;  
    height: 110px;  
    height: 190%;
    */
    display: inline-block;
    width: 100%;
}

/*
header hgroup1 {
*/
article#group3_parte1 { 
    /*
    background: #E0BD35;
    padding: 0.25%;
    margin: 0.2% 0% 0% 0.2%;    
    margin: 10px 0px 0px 0px;    
    */
    margin: 8px 0px 0px 8px;    
    width: 14%;  
}

article#group3_parte2 { 
    /*
    background: #CCCCCC;   
    padding: 0.25em;
    margin: -10px 0px 0px 0px;    
    */
    margin: -12px 0px 0px 0px;    
    width: 84%; 
}

/*
article#group3_parte3 { 
    margin: 0.25em auto;    
    padding: 0.25em;
    width: 8%;  
}
*/

h1 {
    /*
    color: #ac965d;   
    font-size: 1.6em;
    margin: 0.60em auto;    
    */
    font-size: 26px;
    font-family: Georgia, "Times New Roman", Times, serif;
    margin: 2% 0% 0% 0%;    
    text-align:center;
    text-shadow: .20em .20em .20em rgba(255,255,255,0.5);   
}

h2 {
    /*
    color: #ac965d;   
    font-weight: lighter;
    */
    font-size: 22px;
    margin: 1.8% 0% 0% 0%;    
    text-align:center;
/*  text-shadow: 5px 5px 10px rgba(255,255,255,0.5);  */
}

#acceso_texto {                  /*   Texto   - Acceso al Mantenimiento de Docentes -   */
    /*
    text-shadow: .20em .20em .20em rgba(255,255,255,0.5);   
    margin: -1.3% 0% 0% 10%;    
    margin: -1.6% 0% 0% 10%;    
    margin: -2% 0% 0% 10%;    
    */
    color: #34466D;        
    font-size: 18px;     /*   16px = 1em.  standart, tamaņo de fuente Global */
    margin: -1% 0% 0% 0%;
    text-align: center;   
    text-shadow: 4px 4px 4px rgba(53,72,110,0.5);   
    width: 100%;
}

/*  Para la Imagen de la izquierda (logo)   */
.fade1 {
    border-radius: 0.5em;
    opacity: 1;
    filter: alpha(opacity=10);
    -ms-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    -webkit-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
    
    height: 5.6em;
    width: 6.0em;   
    
}

.fade1:hover {
/*
    height: 5.6em;
    width: 12.5em;  
*/
    border-radius: 7.5em 7.5em 7.5em 7.5em;
    opacity: 0.7;
    filter: alpha(opacity=7);
    -ms-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
    
    height: 5.6em;
    width: 6.0em;   
    
}

#tit_sistema {                  /*   Texto   Facturacio   */
    /*
    margin: 0px 0px 0px -20px;
    */
    color: #34466D;        
    font-size: 16px;     /*   16px = 1em.  standart, tamaņo de fuente Global */
    margin: 0px 0px 0px 30px;
    text-shadow: 4px 4px 4px rgba(53,72,110,0.5);   
}


article#formulario_add {
    /*
        background-color: #FFF;   *//*  background-color: #F47D31;   */  /* fondo naranja   
        background-color: #2B6145;   */     /* fondo verde     
        background-color: #065;   
        background-color: #34466D;   */   /* fondo Azul      
        background-color: #CCCCCC;   */      /* fondo plomo      
        border-radius: 0.5em;
    margin: 8px auto;   
    padding: 4px;
    */
    background: -webkit-gradient(linear, left bottom, left top, from(#CCCCCC), to(#ffffff));
    background: -moz-linear-gradient(top,  #CCCCCC,  #ffffff);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#D7E9F3', endColorstr='#ffffff');
	
	border-radius: 8px;
    /*
        box-shadow: .25em .25em .25em rgba(255,153,0,.5);   
        box-shadow: .25em .25em .25em rgba(94,107,120,.5);  
        box-shadow: .25em .25em .25em rgba(53,72,110,.5);   
    */
	display:block;
	margin: 4px auto;   
	max-width: 97%;   /*	ancho del block formulario   */
    min-height: 110px;
    padding: 2px;
}

nav#docente_menu_add {
    /*
    line-height: 0.05em;
    margin: -0.70em auto;
    margin: 10px auto;
    min-height: 1.5em;
    padding: 0.7em 0.5em 0.1em 1.5em;   
    */
    background: #E0BD35;      /*   color amarillo   */
	border-radius: 8px;
	font-color: #fff;              /* color blanco     */
    font-family:'Trebuchet MS', Tahoma, Arial;
    font-weight: normal;
	margin: 10px 0px 0px 0px;
	max-width: 97%;   /*	ancho del header (titulo)   */
    min-height: 24px;
    padding: 10px 8px 2px 24px;   
    text-decoration: none;
}

nav#docente_menu_add  ul {      /* le quitamos los puntos de la izquierda al Ul   */
    list-style: none;
}

nav#docente_menu_add li {     
 	display: inline-block;
/*	padding: 0.4em 1.05em 0 2.50em;   */
/*	padding: 0.4em 0.01em 0 0.50em;   */
	vertical-align: top;      /*  arriba (al tope) del bloque  */
    text-decoration: none;
}

nav#docente_menu_add a {     
    background-color: #FFF;
/*	border: 0.1em solid #57ABB8;   */
	border-radius: 0.25em;
	color: #CCCCCC;   
 	display: block;
	font-family: "Pecita", Helvetica, Verdana;
	font-size: 1.2em;
/*    line-height: 1.1em;   */
/*	padding: 0.2em;      */
    text-decoration: none;
	
	-ms-transition: all 0.5s ease-in;      
	-moz-transition: all 0.5s ease-in;     
	-o-transition: all 0.5s ease-in;       
	-webkit-transition: all 0.5s ease-in;  
	transition: all 0.5s ease-in;          
}

nav#docente_menu_add a:hover {      
    background-color: #212121;
/*	border: 0.1em dashed #F60;   */
/*	border-radius: 0.5em 0.5em 1.5em 1.5em;   */
/*	color: #2B6145;   */
	color: #999999;   
	font-size: 1.2em;
/*    line-height: 1.1em;   */
	
	-ms-transition: all 0.5s ease-out;      
	-moz-transition: all 0.5s ease-out;     
	-o-transition: all 0.5s ease-out;       
	-webkit-transition: all 0.5s ease-out;  
	transition: all 0.5s ease-out;          
}

section#detalle_input {
    /*
        background-color: #FFF;   *//*  background-color: #F47D31;   */  /* fondo naranja   
        background-color: #2B6145;   */     /* fondo verde     
        background-color: #065;   
        box-shadow: .25em .25em .25em rgba(255,153,0,.5);
        box-shadow: .25em .25em .25em rgba(94,107,120,.5);
        box-shadow: .25em .25em .25em rgba(53,72,110,.5);
    */
    background-color: #34466D;      /* fondo Azul      */
	border-radius: 8px;
    box-shadow: 4px 4px 4px rgba(53,72,110,.5);
	display:block;
	margin: 8px auto;   
	max-width: 100%;   /*	ancho del block formulario   */
    min-height: 110px;
    padding: 4px;
}


form {
    /*
        padding: 0.3em 0.3em 0.7em 0.01em;
        width: 89%;
    font-size: 0.85em;
    margin: 1em 1em 1em 1em;
    */
    font-size: 18px;
	margin: 16px 16px 16px 16px;
	max-width: 97%;
}

form div {
    /*
    margin: 1%;   
    margin: 0.9em;
    */
    margin: 10px;
}

fieldset {
    /*
    border: .1em solid #F60;   
    border: .1em solid #34466D;
    border: .1em solid #FFF;   
    */
    border: 1px solid #FFF;   
    border-radius: 8px;
    padding: 16px;
    text-align: left;
}

/*
iframe {
    border: .1em solid #F60;   
    border-radius: .5em;
    text-align: center;
}
*/

input[type="email"]:focus, input[type="text"]:focus, textarea:focus {
}

input[type="submit"] {
    /*
        border: 0.1em solid #57ABB8;
        font-size: 1.2em;
        line-height: 1.1em;
        padding: 0.2em;
        padding: 0.7em 0.5em 0.1em 1.5em;
    border-radius: 0.25em;
    font-size: 1.0em;   
    padding: 0.18em 0.5em 0.18em 0.5em;   
    */
    background-color: #FFF;
	border-radius: 4px;
	color: #CCCCCC;   
 	display: block;
	font-family: "Pecita", Helvetica, Verdana;
	font-size: 18px;   
    padding: 2px 8px 2px 8px;   
    text-decoration: none;
	
	-ms-transition: all 0.5s ease-in;      
	-moz-transition: all 0.5s ease-in;     
	-o-transition: all 0.5s ease-in;       
	-webkit-transition: all 0.5s ease-in;  
	transition: all 0.5s ease-in;          
}

input[type="submit"]:hover {
    /*
        border: 0.1em dashed #F60;
        border-radius: 0.5em 0.5em 1.5em 1.5em;
        color: #2B6145;
        font-size: 1.2em;
        line-height: 1.1em;
    font-size: 1.0em;   
    */

    background-color: #212121;
	color: #999999;   
	font-size: 18px;   
	
	-ms-transition: all 0.5s ease-out;      
	-moz-transition: all 0.5s ease-out;     
	-o-transition: all 0.5s ease-out;       
	-webkit-transition: all 0.5s ease-out;  
	transition: all 0.5s ease-out;          
}

label {
    color: #FFF;
    cursor: pointer;
}

legend {
    /*
    color: #F90;
    font-weight: bold;
    font-weight: 600;
    */
    color: #FFF;
    font-size: 16px;
    font-weight: 500;
}

textarea {
    resize:none;
}