@charset "utf-8";

body {

    background:#727587;
    background:url(../images/fondo_cuadros.png) no-repeat; 
    /* background:url(../images/fondo_gris.fw.png);  ;*/
    margin: 0;
    padding: 0;
    color: #000;
    width:auto;
    font: 12px/1.5 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
    -webkit-autofill:#FFF;

}



a:-webkit-any-link{
    color: black;
    text-decoration-line: none;
}
a,button {
    color: black;
    text-decoration-line: none;
}
a:link {
    color: black;
    text-decoration-line: none;
}

/* visited link */
a :visited {
    color: black;
    text-decoration-line: none;
}

/* mouse over link */
a:hover {
    color: #333333;
    text-decoration-line: none;
}

/* selected link */
a:active {
    color: black;
    text-decoration-line: none;
}

img 

{ alignment-adjust:middle;}



p {

    alignment-adjust:central;
    color:#CCC;
    font:"Arial Black", Gadget, sans-serif;

}



input, textarea, select {

    autofill:#FFF;
    background-color: #FFF;
    background-image: none;
    color: #000;

}



/*  EL MENU DEL PROGRAMA-----------------------------*/

.mi-menu  {

    border-radius: 5px;

    list-style-type: none;

    margin: 0 auto; /* si queremos centrarlo */

    padding: 0;

    text-transform:uppercase;

    /*display:inline-block;*/

    /* la altura y su ancho dependerán de los textos 510 */

    height: 40px; 

    width: 500px;   

    /* el color de fondo  #555    #222 asi era el gradiente*/

    background: #222;

    background: -moz-linear-gradient(#222,#B7ACAC);

    background: -webkit-linear-gradient(#222,#B7ACAC); 

    background: -o-linear-gradient(#222,#B7ACAC);

    background: -ms-linear-gradient(#222,#B7ACAC);

    background: linear-gradient(#222,#B7ACAC);

}



/* si es necesario, evitamos que Blogger de problemas con los saltos de línea cuando escribimos el HTML */

.mi-menu  br { display:none; }



/* cada item del menu */

.mi-menu  li {

    display: block;

    float: left; /* la lista se ve horizontal */

    height: 40px;

    list-style: none;

    margin: 0;

    padding: 0;

    position: relative;

}

.mi-menu li a {

    border-left: 1px solid #000;

    border-right: 1px solid #E3D3D3;

    color: #fff;

    display: block;

    font-family: Calibri;

    font-size: 13px;

    font-weight: bold;

    line-height: 28px;

    padding: 0 14px;

    margin: 6px 0;

    text-decoration: none;

    /* animamos el cambio de color de los textos */

    -webkit-transition: color .2s ease-in-out;

    -moz-transition: color .2s ease-in-out;

    -o-transition: color .2s ease-in-out;

    -ms-transition: color .2s ease-in-out;

    transition: color .2s ease-in-out;

}

/* eliminamos los bordes del primer y el último */

.mi-menu li:first-child a { border-left: none; }

.mi-menu li:last-child a{ border-right: none; }

/* efecto hover cambia el color */

.mi-menu li:hover > a { color: Crimson; }



/* los submenús */

.mi-menu ul {

    border-radius: 0 0 5px 5px;

    left: 0;

    margin: 0;

    opacity: 0; /* no son visibles */

    position: absolute;

    top: 40px; /* se ubican debajo del enlace principal */

    /* el color de fondo */

    background: #222;

    background: -moz-linear-gradient(#222,#B7ACAC);

    background: -webkit-linear-gradient(#222,#B7ACAC);

    background: -o-linear-gradient(#222,#B7ACAC);

    background: -ms-linear-gradient(#222,#B7ACAC);

    background: linear-gradient(#222,#B7ACAC);

    /* animamos su visibildiad */

    -moz-transition: opacity .25s ease .1s;

    -webkit-transition: opacity .25s ease .1s;

    -o-transition: opacity .25s ease .1s;

    -ms-transition: opacity .25s ease .1s;

    transition: opacity .25s ease .1s;

}

/* son visibes al poner el cursor encima */

.mi-menu li:hover > ul { opacity: 1; }



/* cada un ode los items de los submenús */

.mi-menu ul li {



    height: 0; /* no son visibles */

    overflow: hidden;

    padding: 0;

    /* animamos su visibildiad */

    -moz-transition: height .25s ease .1s;

    -webkit-transition: height .25s ease .1s;

    -o-transition: height .25s ease .1s;

    -ms-transition: height .25s ease .1s;

    transition: height .25s ease .1s;

}

.mi-menu li:hover > ul li {

    height: 36px; /* los mostramos */

    overflow: visible;

    padding: 0;

}

.mi-menu ul li a {

    border: none;a

    border-bottom: 1px solid #E3D3D3;

    margin: 0;

    /* el ancho dependerá de los textos a utilizar */

    padding: 5px 20px;

    width: 100px;

}

/* el último n otiene un borde */

.mi-menu ul li:last-child a { border: none; }







.titu2 {

    position:absolute;

    top:15px;

    left:350px;

    width:350px;

    text-shadow: 5px 5px 5px #151313;

    font-size: 24px;

    font-family:"Comic Sans MS", cursive;

    font-weight: bold;

    /* color: #EC5555;*/

    color: #FFF;

}


.entrada{
    padding:3px;
    border:solid 1px #DEDEDE;
    border-radius:4px;
}




a img { /* este selector elimina el borde azul predeterminado que se muestra en algunos navegadores alrededor de una imagen cuando está rodeada por un vínculo */

    border: none;
    margin:3px;
    alignment-adjust:central;

}

.letrat{

    font-weight:bold;

    color:#FFF;

    /* font:"Arial Black", Gadget, sans-serif;*/

    font-size:12px;

}





#contenedor {

    display:block;

    top:10px;

    /*width: 99%;*/

    width:auto;

    height: auto;

    margin:0px auto;

    z-index: 1;

    border-radius: 5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    /*background:#666; */



}

#cabecera {

    background:#727587;

    position:relative;

    height: 75px; 

    margin:0px auto;

    color:#FFF;

}



.subcab { 

    display: inline-block;

    top: 5px;

    margin-left:300px;

    width:130px auto;

    text-align:center;

    color:#FFF;

    padding:5px;

    font:Verdana, Geneva, sans-serif;

    font-size:10px;

    font:bold;

    background-color:#986E6E; 

    border: medium;

    border-color:#000;

    border-radius: 5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

}

#cabecera_login {

    background:#727587;

    position:relative;

    top: 10px;

    height: 50px; 

    margin:0px auto;

    color:#FFF;

    z-index: 3;

    border:double;

    padding-top: 10px;

    padding-right: 5px;

    padding-bottom: 5px;

    padding-left: 5px;

}

#logo {

    position: absolute;

    left: 25px;

    top: 4px;

}

#titulo {



    position: absolute;

    left:150px;

    top: 28px;

    color:#000;

    font-weight: bold;

}





#cuerpo {

    overflow:auto;

    /*  background:#6E4040; */



    display:block;

    z-index:2;

    position:relative;

    top: 10px;

    height: 530px;  

    width:98%;

    margin:0px auto;

    z-index: 3;

    border-radius: 5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    padding-top: 2px;

    padding-right: 5px;

    padding-bottom: 5px;

    padding-left: 5px;





}





#ventana {

    position: absolute;

    display:block;

    width: 0px auto;

    height: 0px auto;

    z-index: 99;

    color:#FFF;

    /*  background-color:#930;  */

    background:#464646; 

    left: 400px;

    top: 20px;

    border-radius: 5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    Box-shawdow: 10px 10px 10px #ccc;





}







#franja {

    position:absolute;

    right:30px;

    top:-5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

}

.cinta{

    margin:0px;

    background:#900;

    width:250px;

    height:50px;

    left:20px;

    border-radius: 5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;}



#menu {

    z-index:99 !important; 

    top:25px;

    margin-left:55%; 

    text-align: center;

    /*550*/

    width: 580px;

    height: 45px;

    border-radius: none;

    padding: 0px;

    position: relative;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    z-index: 2;

}







#contenido {

    position:absolute;
    width:auto;
    height: auto;
    margin-left:10px;
    z-index: 10;
    background:#727587; 
    /* background:#993240;  es un lindo bordo*/

    z-index:3;
    webkit-border-radius: .5em; 
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    overflow:auto; 

}
#contenido1 {

    position:absolute;
    /*width:1300px; */
    width:auto;
    height:auto;
    /*  height: 650px;*/
    z-index: 10;
    background:#E9EBF0;
    /* background:#C1C2BE;*/ 
    z-index:3;
    webkit-border-radius: .5em; 
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);


}
#contenidof {

    position:absolute;
    width:1200px;
    height: 530px;
    margin:1%;
    z-index: 10;
    background:#E9EBF0;
    webkit-border-radius: .5em; 
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    overflow:auto; 

}
#contenidoTareas {

    position:relative;
    width:auto;
    height:auto;
    margin:3px;
    z-index: 10;
    background:#727587; 
    padding:0px  ;
    z-index:3;
    webkit-border-radius: .5em; 
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    overflow:auto; 

}
#contenidoHijos{

    position:relative;
    margin:100px;
    width:500px;
    height:auto;
    z-index: 10;
    background:#9A9CA4; 

    z-index:3;
    webkit-border-radius: .5em; 
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    overflow:auto; 

}


.ventanas {

    display:block;

    width: auto;

    height: auto;

    margin-top:50px;

    padding:0px;

    color:#000;

    background-color:#666;

    left:300px;

    top: 120px;

    border-radius: 5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    Box-shawdow: 10px 10px 10px #ccc;

}





#pieabm {

    position: absolute;

    width: 980px;

    height: 25px;

    z-index: 2;

    left: 8px;

    top: 565px;

    background-color: #071672;

    border-radius: 5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    font-family: "Courier New", Courier,      monospace;

    font-size: 9px;

    font-style: normal;

    color: #FFF;

    text-align:center;

}

#titu {

    position:absolute;
    left: 40%; 
    top:5px;
    display:inline;
    font-size: 14px;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-weight: bold;
    color: #000;

}
#titublanco {

    position:absolute;
    left: 40%; 
    top:5px;
    display:inline;
    font-size: 14px;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-weight: bold;
    color: #FFF;

}




#form_datos {

    position:relative;

    display:inline-block;

    padding:20px;

    overflow:auto;

    left:70px;

    width:200px;

    font-weight: bold;

    border-style:solid;

    border-color:#000;

    text-align:center;

    background-color:#808080;

    height:340px;

    z-index:90;

}





/* div para formularios que usan cebra -----------------------------------*/

/* le puse el ancho para que de justo, pues no pude centrarlo */

#formbox{width:335px auto;  /* lo hago auto para que se extienda segun el ancho del formulario*/

         margin:5px;

         /*border:double;*/ 

         padding:0px,10px,0px,20px;

}





.cuadroa {margin-left:95%;  /* lo hago auto para que se extienda segun el ancho del formulario*/
          text-align:right;
          display:inline;

}

.cuadrito{  /* lo uso en reclamos modificar*/
    margin-left:40%;
    hight:25px;
    color:#fff;
    display:inline;
    position:absolute;
    width:530px auto;
    font-size:16px;
    font-weight:500;
    font-weight:bold;
}
.cuadrito2{ color:#000;
            text-align: left;
            font-family: "Trebuchet MS";
            font-weight:bold;
            cursor: move;
            width:auto;
            font-size:16px;
            font-weight:500;
            font-weight:bold;
            padding-left:20px;
}



#formbox h3{color:#fff;

            text-align: center;

            font-family: "Trebuchet MS";

            font-weight:bold;

            cursor: move;}



#formbox_login{

    border-radius: 5px;

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    width:335px;

    height:150px; 

    margin:15% auto;

    border:0;

    padding:50px,10px,10px,10px;

    background-color:#727587; 

    position:relative;

}



.formu {width:335px;

        margin:20% auto;

        /* border:#000;*/

        padding:20px,20px;

        background-color:#000; 



}

.cabe {width:335px;

       margin:10%;

       padding:20px,20px;

       background-color:#5C5A5A ; 



}

#detalle_ped {

    alignment-adjust:central;

}





.button {

    display: inline-block;

    outline: none;

    cursor: pointer;

    text-align: center;

    margin:5px;

    text-decoration: none;

    font: 14px/100% Arial, Helvetica, sans-serif;

    padding: 0.2em 1em 0.2em;

    text-shadow: 0 1px 1px rgba(0,0,0,.3);

    -webkit-border-radius: .5em; 

    -moz-border-radius: .5em;

    border-radius: .5em;

    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);

    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);

    box-shadow: 0 1px 2px rgba(0,0,0,.2);

}

.button2 {

    display: inline-block;

    outline: none;

    cursor: pointer;

    text-align: center;

    margin:5px;

    text-decoration: none;

    font: 12px/100% Arial, Helvetica, sans-serif;

    padding: .5em 2em .55em;

    text-shadow: 0 1px 1px rgba(0,0,0,.3);

    -webkit-border-radius: .5em; 

    -moz-border-radius: .5em;

    border-radius: .5em;

    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);

    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);

    box-shadow: 0 1px 2px rgba(0,0,0,.2);

}

.button:hover {

    text-decoration: none;

}

.button:active {

    position: relative;

    top: 1px;

}

.agregar {
    display: inline-block;
    outline: none;
    cursor: pointer;
    text-align: center;
    margin:5px;
    text-decoration: none;
    font: 12px/100% Arial, Helvetica, sans-serif;
    padding: 0.3em 1em 0.3em;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
    -webkit-border-radius: .5em; 
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);

}
.grabar {

    display: inline-block;
    text-align:end;
    outline: none;
    cursor: pointer;
    text-align: center;
    margin:5px;
    text-decoration: none;
    font: 12px/100% Arial, Helvetica, sans-serif;
    padding: 0.3em 1em 0.3em;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
    -webkit-border-radius: .5em; 
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);

}


/* ~~ El pie de página ~~ */

footer {

    padding: 0 0 0 15px;

    color:#333333;

    text-align:center;

    position: absoluta;

    top:500px;

    /* esto da a IE6 el parámetro hasLayout para borrar correctamente */

}
#idreclamos{ 

    margin-left:750px;
    font-family: "Trebuchet MS";
    font-size:18px;
    font-weight:bold;
    cursor: move;}


.titu3 {
    position:absolute;
    top:25px;
    left:850px;
    width:500px;
    text-shadow: 5px 5px 5px #151313;
    font-size: 16px;
    font-family:"Comic Sans MS", cursive;
    font-weight: bold;
    color: #FFF;  
}