/**=============================================================================
 *
 *	Filename: main.css
 *	
 *	(c)Autor: Guillermo Caro
 *	
 *	Description: Estilos del documento
 *	
 *	Licence: GPL|LGPL
 *	
 *===========================================================================**/

/**=============================================================================
        Para MasterPage
*===========================================================================**/
body {
    background-color:#FFF;
    margin:5px;
}

#siteCabecera {
    top: 0px;
    height: 100px;

    /* Fondo */
/*    background: #93cede;	 Old Browsers 
    background: -moz-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 FF3.6+ 
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #93cede), color-stop(41%, #75bdd1), color-stop(64%, #49a5bf), color-stop(100%, #49a5bf));	 Chrome,Safari4+  
    background: -webkit-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 Chrome10+,Safari5.1+ 
    background: -o-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 Opera 11.10+ 
    background: -ms-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 IE 10+ 
    background: linear-gradient(to bottom, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 W3C 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#93cede', endColorstr='#49a5bf', GradientType=0 );	 IE6-9 */
    
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00b7ea+0,009ec3+100;Blue+3D+%2315 */
    background: rgb(0,183,234); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(0,183,234,1) 0%, rgba(0,158,195,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,183,234,1) 0%,rgba(0,158,195,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,183,234,1) 0%,rgba(0,158,195,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 ); /* IE6-9 */

    /* Bordes */
    border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    border: 1px solid #000;

    /* Sombras */
    -webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
}
#siteCabeceraLogo {
    background-image:url(../images/siteCabeceraLogo.png);
    background-repeat:no-repeat;
    background-size: 370px 90px;
    background-position:center;

    top: 10px;
    left: 10px;

    height: 90px;
    width: 380px;
}
#siteCabeceraLogo2 {
    background-image:url(../images/logo_SIINCO.png);
    background-repeat:no-repeat;
    background-size: 90px 90px;
    background-position:center;

    top: 10px;
    right: 10px;

    height: 90px;
    width: 90px;
}
#siteCabeceraLogo, #siteCabeceraLogo2 {
    position:absolute;

    /* Bordes */
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid #000;

    /* Sombras */
    -webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
}
#siteCabeceraTitulo {
    position:absolute;

    top: 10px;
    right: 110px;

    width: 800px;

    text-align:right;
    font-size:2.5em;
    font-weight:bold;
}
#siteCabeceraBarra {
    position:absolute;

    top: 50px;
    right: 110px;

    width: 550px;

    text-align:right;
    font-size:14px;
    font-weight:bold;
    color:#FFF;
    z-index:1000;
}

#siteMenu {
    display:none;
    position:relative;

    top: 5px;
    height: 30px;

/*     Fondo 
    background: #93cede;	 Old Browsers 
    background: -moz-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 FF3.6+ 
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #93cede), color-stop(41%, #75bdd1), color-stop(64%, #49a5bf), color-stop(100%, #49a5bf));	 Chrome,Safari4+  
    background: -webkit-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 Chrome10+,Safari5.1+ 
    background: -o-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 Opera 11.10+ 
    background: -ms-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 IE 10+ 
    background: linear-gradient(to bottom, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 W3C 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#93cede', endColorstr='#49a5bf', GradientType=0 );	 IE6-9 */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00b7ea+0,009ec3+100;Blue+3D+%2315 */
    background: rgb(0,183,234); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(0,183,234,1) 0%, rgba(0,158,195,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,183,234,1) 0%,rgba(0,158,195,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,183,234,1) 0%,rgba(0,158,195,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 ); /* IE6-9 */

    
    /* Bordes */
    /*border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;*/
    border: 1px solid #000;

    /* Sombras */
    -webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
}

#siteContenido {
    position:relative;
    top: 10px;
    padding:5px;

    /* Fondo */
    background-color:#FFF;

    /* Bordes */
    /*border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;*/
    border: 1px solid #000;

    /* Sombras */
    -webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
}

#sitePie {
    position:relative;
    top: 15px;
    height: 25px;
    padding-top:5px;
    text-align:center;
    color:#FFF;
    font-size:12px;
    font-weight:bold;

    /* Fondo */
/*    background: #93cede;	 Old Browsers 
    background: -moz-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 FF3.6+ 
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #93cede), color-stop(41%, #75bdd1), color-stop(64%, #49a5bf), color-stop(100%, #49a5bf));	 Chrome,Safari4+  
    background: -webkit-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 Chrome10+,Safari5.1+ 
    background: -o-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 Opera 11.10+ 
    background: -ms-linear-gradient(top, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 IE 10+ 
    background: linear-gradient(to bottom, #93cede 0%, #75bdd1 41%, #49a5bf 64%, #49a5bf 100%);	 W3C 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#93cede', endColorstr='#49a5bf', GradientType=0 );	 IE6-9 */
    
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00b7ea+0,009ec3+100;Blue+3D+%2315 */
    background: rgb(0,183,234); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(0,183,234,1) 0%, rgba(0,158,195,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,183,234,1) 0%,rgba(0,158,195,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,183,234,1) 0%,rgba(0,158,195,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 ); /* IE6-9 */

    /* Bordes */
    border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -webkit-border-radius: 0px 0px 5px 5px;
    border: 1px solid #000;

    /* Sombras */
    -webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
}

#alertBoxes{
    display: block;
    width: 100%;
    text-align: left;
    margin-bottom: 5px;
    margin-top: 5px;
}
.timer{
    display: inline-block;
    width: 15px;
    height: 15px;
    background-image: url('../images/indicator.gif');
    background-position: 50% 50%;
    background-repeat: no-repeat;
}
.box-info, .box-success, .box-alert, .box-error{
    clear: both;
    border-width: 1px;
    border-style: solid;
    margin: 0px;
    padding: 5px;
    background-repeat: no-repeat;
    background-position: 0px 50%;
    text-align: left;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

    position:absolute;
    width:98%;
}
.box-info {
    color: #00529b;
    background-color: #bde5f8;
    border-color: #00529b;
}
.box-success {
    color: #4f8a10;
    background-color: #dff2bf;
    border-color: #4f8a10;
}
.box-alert {
    color: #9f6000;
    background-color: #feefb3;
    border-color: #9f6000;
}
.box-error {
    color: #d8000c;
    background-color: #ffbaba;
    border-color: #d8000c;
}
/**=============================================================================
        Para Login
*===========================================================================**/
.login_membrete {
    background-image:url(../images/logoini.png);
    background-repeat:no-repeat;
    background-position:center;
}
.login_form {
    background-image:url(../images/index.jpeg);
    background-repeat:no-repeat;
    background-position:top;
}

.loginBlock{
    background-image:url(../images/login_cab.fw.png);
    background-repeat:no-repeat;
    background-position:top;

    display: block;
    /*width: 300px;*/
    border: 1px solid #eaeaea;
    background-color: #fafafa;

    /*Border*/
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.loginBlock div input[type=text], .loginBlock div input[type=password]{
    display: inline-block;
    margin: 5px;
    border: 1px solid #dadada;
    background-color: #eaeaea;
    padding: 3px;
    color: #404040;
    width: 180px;

    /*Border*/
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
#login_capcha {
    display: inline-block;
    margin: 5px;
    border: 1px solid #dadada;
    background-color: #eaeaea;
    padding: 3px;
    color: #404040;
    width: 50px;
    text-align:center;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.loginBlock div button{
    display: inline-block;
    margin: 2px;
    border: 1px solid #dadada;
    background-color: #eaeaea;
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    color: #404040;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;

    cursor:pointer;

    -webkit-transition: background-color .4s;
    -moz-transition: background-color .4s;
    transition: background-color .4s;
}
.loginBlock div button:hover {
    background-color:#069;
    color: #FFF;

    /* Sombras */
    -webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
}

/**=============================================================================
        Para Seleccionar Sistemas
*===========================================================================**/
div.SisContenedor{
    position:relative;
    width: 90%;
    padding: 0px;
}
div.SisPanel{
    width: 500px;
    height: 90px;
    padding: 5px;

    cursor:pointer;

    -webkit-transition: height .4s;
    -moz-transition: height .4s;
    transition: height .4s;
}
.SisPanelInicio{
    /* Bordes */
    border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
}
.SisPanelFin{
    /* Bordes */
    border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -webkit-border-radius: 0px 0px 5px 5px;
}

div#uno{
    background-color: rgb(208,101,3);
}

div#dos{
    background-color: rgb(233,147,26);
}

div#tres{
    background-color: rgb(22,145,190);
}

div#cuatro{
    background-color: rgb(22,107,162);
}

div#cinco{
    background-color: rgb(27,54,71);
}

div#seis{
    background-color: rgb(21,40,54);
}

img.SisIcon{
    display: block;
    margin:10px auto;
    background-color: rgba(255,255,255,.15);
    width:20px;
    padding:10px;

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;

    -webkit-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
    -moz-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
    box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);

    -webkit-transition:box-shadow .4s;
    -moz-transition:box-shadow .4s;
    transition:box-shadow .4s;
}

p.SisTitulo{
    font-size: 1.2em;
    color:white;
    text-align: center;
    padding:0px;
    opacity: .6;
}
p.SisDescripcion{
    display:none;

    font-size: .9em;
    color:white;
    text-align: center;
    padding-top:15px;
    opacity: .6;
}

div.SisPanel:hover{
    height:130px;
}
div.SisPanel:hover p.SisTitulo{
    opacity: 1;
    text-decoration:underline;
}
div.SisPanel:hover p.SisDescripcion{
    display:block;
    opacity: 1;
}

div.SisPanel:hover img.SisIcon{
    -webkit-box-shadow:0px 0px 0px 0px rgba(255,255,255,.6);
    -moz-box-shadow:0px 0px 0px 0px rgba(255,255,255,.6);
    box-shadow:0px 0px 0px 0px rgba(255,255,255,.6);
}

/**=============================================================================
        Para Index de Búsquedas
*===========================================================================**/
#ListaMenu, #ListaMenu2 {
    margin: 0 auto;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    border: 1px solid #cccccc;
    text-align: left;
    font-size: 12px;
    width: 100%;
    background-color: #ffffff;

    -moz-box-shadow: 0px 2px 5px #666;
    -webkit-box-shadow: 0px 2px 5px #666;
    box-shadow: 0px 2px 5px #666;
}
#ListaMenu3 {
    margin: 0 auto;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    border: 1px solid #cccccc;
    text-align: left;
    font-size: 12px;
    background-color: #ffffff;

    -moz-box-shadow: 0px 2px 5px #666;
    -webkit-box-shadow: 0px 2px 5px #666;
    box-shadow: 0px 2px 5px #666;
}
#ListaMenu th, #ListaMenu2 th, #ListaMenu3 th {
    font-size: 12px;
    font-weight: bold;
    background-color: #336699;
    text-align: center;

    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;

    padding: 2px;
}
#ListaMenu thead, #ListaMenu2 thead, #ListaMenu3 thead {
    height:30px;
    font-size: 12px;
    color:#fff;
    /*background-color:#336699;*/
    background-color:#336699;
}

#ListaMenu tbody, #ListaMenu2 tbody, #ListaMenu3 tbody {
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-right-width: 1px;
}
#ListaMenu tbody td, #ListaMenu2 tbody td, #ListaMenu3 tbody td {
    font-size: 12px;
    height: 25px;
}
#ListaMenu tbody tr:hover, #ListaMenu2 tbody tr:hover, #ListaMenu3 tbody tr:hover {
    background-color:#CCC;
}
#ListaMenu tfoot, #ListaMenu2 tfoot, #ListaMenu3 tfoot {
    color:#fff;
    /*background-color:#336699;*/
    background-color:#E1CC7B;
}

#tbBusqueda {
    font-size:14px;
    background-color:#E5E5E5;
    /* Bordes */
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid #000;

    /* Sombras */
    -webkit-box-shadow: 0px 2px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 2px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
}
#tbBusqueda * {
    font-size:14px;
}

/**=============================================================================
        Para Mantenimientos
*===========================================================================**/
#tbCampos * {
    font-size:12px;
}
#tbCampos{	
    /* Bordes */
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid #000;

    /* Sombras */
    -webkit-box-shadow: 0px 2px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 2px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
}
#tbCampos td {
    height:25px;
}
#tbCampos .TitDetalle {
    padding-left:10px;
}

#tbCampos input {
}

.fieldset{
    padding: 10px;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    /*background: #F5F5F5;*/
}
.legend{
    padding: 0.5em 0.8em;
    text-align:left;
    text-transform: uppercase;
}

#Modificar{
    width: 120px;
    height: 80px;
}

/**=============================================================================
        Para Migrador
*===========================================================================**/
.BtnMigrador {
    width:100px;
    text-align:center;
    cursor:pointer;
    background-color:#CCC;

    /* Bordes */
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid #000;

    /* Sombras */
    -webkit-box-shadow: 0px 2px 3px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 2px 3px rgba(0,0,0,0.4);
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
}
.BtnMigrador:hover {
    font-weight:bold;
    background-color:#369;
    color:#FFF;
}