/* Bodys
----------------------------------------------------------*/

body   
{
    background: #282460; 
    /*background: -webkit-linear-gradient(top, #e7e7e7 0, #050505 800px, #282460 1050px) no-repeat;
    background: -moz-linear-gradient(top, #e7e7e7 0, #050505 800px, #282460 1050px) no-repeat;
    background: -o-linear-gradient(top, #e7e7e7 0, #050505 800px, #ffffff 1050px) no-repeat;
    background: -ms-linear-gradient(top, #e7e7e7 0, #050505 800px, #ffffff 1050px) no-repeat; 
    -svg-background: linear-gradient(top, #e7e7e7 0, #050505 800px, #ffffff 1050px) no-repeat;
    background-attachment: fixed !important;
    margin: 0 auto;
    font-size: small;
    font-family: Cabin, Arial, 'Arial Unicode MS' , Helvetica, Sans-Serif;
    font-weight: normal;
    font-style: normal;
    position: relative;
    width: 100%;
    min-height: 100%;
    left: 0;
    top: 0;
    cursor: default;
    overflow: auto;*/
}


.bodSIS
{
    background: #282460;
	 
	background-position: center center; 
	background: radial-gradient(left, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background: -webkit-radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background: -moz-radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background: -o-radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background: -ms-radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat; 
    -svg-background: radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background-attachment: fixed !important;/*F8F8F7*/
    margin: 0 auto;
    font-size: small;
    font-family: Cabin, Arial, 'Arial Unicode MS' , Helvetica, Sans-Serif;
    font-weight: normal;
    font-style: normal;
    position: relative;
    width: 100%;
    min-height: 100%;
    left: 0;
    top: 0;
    cursor: default;
    overflow: auto;
}

.bodSISMaster
{
     background: #282460;
	 
	/*background-position: center center;
	background: radial-gradient(left, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background: -webkit-radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background: -moz-radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background: -o-radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background: -ms-radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat; 
    -svg-background: radial-gradient(center, #1D76BB -50px, #1D76BB 50px, #282460 600px) no-repeat;
    background-attachment: fixed !important;
    margin: 0 auto;
    font-size: small;
    font-family: Cabin, Arial, 'Arial Unicode MS' , Helvetica, Sans-Serif;
    font-weight: normal;
    font-style: normal;
    position: relative;
    left: 0;
    top: 0;
    cursor: default;
    overflow: auto;*/
	height:639px;
	 width: 100%;
	}

/* HEADINGS   
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6
{
    font-size: 1.5em;
    color: #666666;
    font-variant: normal;
    text-transform: none;
    font-weight: 200;
    margin-bottom: 0px;
}

h1
{
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

h2
{
    font-size: 1.5em;
    font-weight: 600;
}

h3
{
    font-size: 1.2em;
}

h4
{
    font-size: 1.1em;
}

h5, h6
{
    font-size: 1em;
}

/* this rule styles <h1> and <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
    margin-top: 0px;
}


/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/



.headerSYS
{
    height:126px;
	/*position: relative;
    margin: 0px;
    padding: 0px*/
    /*background: #282460;*/
	background-color:#282460;
    width: 100%;
	border:1px solid #0075B6;
	border-top:1px solid #0075B6;
	border-left: 0px solid #282460;
	border-right:0px solid #282460;
	margin-top:20px;
}


.header h1
{
    border-style: none;
    border-color: inherit;
    border-width: medium;
    font-weight: 700;
    margin: 0px;
    padding: 0px 0px 0px 20px;
    color: #f9f9f9;
    line-height: 2em;
    font-size: 2em;
    width: 462px;
}

.main
{
    padding: 0px 12px;
    margin: 12px 8px 8px 8px;
    min-height: 420px;
    min-width: 420px;
    position: relative;
    height: 100%;
}

.leftCol
{
    padding: 6px 0px;
    margin: 12px 8px 8px 8px;
    width: 200px;
    min-height: 200px;
}

.footer
{
    color: #ffffff;
    padding: 8px 0px 0px 0px;
    margin: 0px auto;
    text-align: center;
    line-height: normal;
}



/* FORM ELEMENTS   
----------------------------------------------------------*/

fieldset
{
    margin: 1em 0px;
    padding: 1em;
    border: 1px solid #ccc;
}

fieldset p 
{
    margin: 2px 12px 10px 10px;
}

fieldset.login label, fieldset.register label, fieldset.changePassword label
{
    display: block;
}

fieldset label.inline 
{
    display: inline;
}

legend 
{
    font-size: 1.1em;
    font-weight: 600;
    padding: 2px 4px 8px 4px;
}

input.textEntry 
{
    width: 320px;
    border: 1px solid #ccc;
}

input.passwordEntry 
{
    width: 320px;
    border: 1px solid #ccc;
}

div.accountInfo
{
    width: 42%;
}


/* Div*/

.Div1
	{
		float:left;
		position: absolute;
		/*nos posicionamos en el centro del navegador*/
		top:50%;
		left:50%;
		/*determinamos una anchura*/
		width:635px;
		/*indicamos que el margen izquierdo, es la mitad de la anchura*/
		margin-left:-550px;
		/*determinamos una altura*/
		height:300px;
		/*indicamos que el margen superior, es la mitad de la altura*/
		margin-top:180px;
		padding:5px;
	}

.Div2
	{
	/*border: 2px solid #CCC;
	padding: 1em;
	margin: 1em 0 1em 4em;
	width: 300px;*/
		float:right;
		position: absolute;
		/*nos posicionamos en el centro del navegador*/
		top:50%;
		left:50%;
		/*determinamos una anchura*/
		width:400px;
		/*indicamos que el margen izquierdo, es la mitad de la anchura*/
		margin-left:100px;
		/*determinamos una altura*/
		height:400px;
		/*indicamos que el margen superior, es la mitad de la altura*/
		/*border: 2px solid #CCC;*/
		margin-top:90px;
		padding:5px;
	}

.DivInterior
	{
	/*border: 2px solid #CCC;
	padding: 1em;
	margin: 1em 0 1em 4em;
	width: 300px;*/
		float:right;
		position: absolute;
		/*nos posicionamos en el centro del navegador*/
		top:50%;
		left:50%;
		/*determinamos una anchura*/
		width:360px;
		/*indicamos que el margen izquierdo, es la mitad de la anchura*/
		margin-left:-192px;
		/*determinamos una altura*/
		height:300px;
		/*indicamos que el margen superior, es la mitad de la altura*/
		/*border: 2px solid #F02522;*/
		margin-top:-188px;
		padding:5px;
		height:100px;
	}

.DivInterior2
	{
	/*border: 2px solid #CCC;
	padding: 1em;
	margin: 1em 0 1em 4em;
	width: 300px;*/
		float:right;
		position: absolute;
		/*nos posicionamos en el centro del navegador*/
		top:50%;
		left:50%;
		/*determinamos una anchura*/
		width:360px;
		/*indicamos que el margen izquierdo, es la mitad de la anchura*/
		margin-left:-192px;
		/*determinamos una altura*/
		height:400px;
		/*indicamos que el margen superior, es la mitad de la altura*/
		/*border: 2px solid #F02522;*/
		margin-top:21px;
		padding:5px;
		height:229px;
	}


/*Tipografia*/
@font-face{
font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
   font-style: normal;
   font-weight: er;
   src: url(../Fonts/Raleway_Thin.otf);
}

/*H's*/
h1{
font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
   color: #0075B6;
}

h2{
font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
   color: #0075B6;
   font-size:x-small;
}

h3{
font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
   color: #0075B6;
   font-size:medium;
}

/*Tabla*/
table td
{
	padding: 3px;
}

.tableCentrar
{
	margin: 0 auto 0 auto;
}

.Desplegable{
    /* Debe tener especificadas las dimensiones
    para poder animarlas */
    width: 100%;
    height: 50px;
    background-image:url("Imagenes/Logo_Siscobros.png");
	/*background: url(http://placekitten.com/100/100) center center no-repeat;*/
    cursor: pointer;
    
    /* Definir transiciones */
     -webkit-transition-property:height, line-height;  
     -webkit-transition-duration: 0.3s;  
     -webkit-transition-timing-function: linear; 
        
     -moz-transition-property:height, line-height;  
     -moz-transition-duration: 0.3s;  
     -moz-transition-timing-function: linear; 
     
     transition-property:height, line-height;  
     transition-duration: 0.3s;  
     transition-timing-function: linear; 
    
    /* Estilos adicionales */
    color:#FFF;
    font-size: 22px;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 50px; /* Igual que la altura para centrar verticalmente */
    text-align: center;
    border-radius: 6px;
    box-shadow: 1px 1px 6px rgba(0,0,0,0.5);
	border: 2px solid #F02522;
}
 
.Desplegable:hover{
    height: 500px;
	min-height:500px;
    line-height: 80px;
}


span.Errores{
    color: red;
    font-size: small;
}

.MensajeInfo{
    width: inherit;
    background: #F59221;
    position: absolute;
    width: 100%;
    top:0px;
}

#divboton{
    width: 30px; 
    margin-top: 24px;
}

#btnSalir{
    color:#FFFFFF; 
    font: 12px ;
    font-family:Arial;
    font-size:13.3333px;
    font-stretch:normal;
    font-style:normal;
    font-variant:normal;
    font-weight:;
}

.Log-row{
    margin: 0;
}

.Log-bar{
    background-color: #E6E7E8;
    text-align: left;
    font-family:'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;;
    border-radius: 0px 0px 9px 9px;
    padding: 0px;
    min-height: 70px;
    height:100%;
}

#lnkOlvidoPassword{
    font-size: 10px;
}

h2.tittle{
font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
   font-size: 20px;
   margin: 0;
   padding-top: 5%;
   padding-left: 5%;
}

h2.box{
font-family: 'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;
   font-size: 20px;
   margin: 0;
   padding-top: 0%;
   padding-left: 0%;
}

input.longbar{
    width: 95%;
    margin-bottom:5px;
    margin-top:5px;
}

.password-wrapper{
    display: flex;
    align-items: center;
}

.password-wrapper input.longbar{
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
}

.password-toggle-icon{
    flex: 0 0 auto;
    margin-left: 8px;
    cursor: pointer;
    color: #888888;
}

.centerbutton{
    padding: 0px;
    padding-top: 1%;
    padding-right: 0.5%;
    padding-bottom: 1%;
}

.content-row{
    padding: 0px;
    margin: 0px;
}


.NoP{
    padding: 0;
}

.null{
    top: -5px;
}

.register-box{
    background-color: #E6E7E8;
    text-align: left;
    font-family:'Segoe UI', Frutiger, 'Frutiger Linotype', 'Dejavu Sans', 'Helvetica Neue', Arial, sans-serif;;
    border-radius: 9px;
    margin: 25%;
    margin-top: 3% !important;
    margin-bottom: 3% !important;
    padding: 2%;
    margin-top: 25%;
}


.image-box
	{
		margin-top:90px;
        padding-left:10%;
        padding-right:90px;
	}

.image-box > img{
    width: 100%;
}

.checkbox-center{
    padding-top:5%;
}

input:disabled{
    cursor:not-allowed !important;
}

.void-bar{
    width: 38%;
    height: 1px;
    float: left;
}

.tooltip-inner{
    color: black;
    background-color: white;
    border-color : black;
    border : solid 1px;
}

.tooltip-arrow{

}

.errortitle{
    color: red;
}

.error{
    color: #F02522;
}

.linkbuttonX{
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
}

.row{
    margin:0;
    padding:0;
}

#messageError{
    white-space: pre-wrap;
}

.comousuar-img{
    height: 250px;
    width: 250px;
    padding-top:5%;
}

.footer-page{
    padding: 5%;
    text-align:center;
}