@charset "utf-8";
/* CSS Document */

html {
    min-height: 100%;
    position: relative;
}
body{
	margin:0px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	/*min-width:1500px;*/
    
    /*padding-bottom: 30px;*/
}

.container-principal{
    height: 100vh;
    min-height: 100%;
    width: 100%;
    background: #FFF;
      /*FLEX*/
    display: flex;
    flex-flow: column;
}


header{
    width: 100%;
    display: flex;
    flex-flow: row;
    
    justify-content: space-between;
    align-items: center;
}

.header-logo{
    padding-left: 50px;
}

.header-logo img {
    margin-right: 15px;
}

main{
    width: 100%;
    padding-top: 30px;
    padding-left: 20%;
    padding-right: 20%;
}

.flex {
    display: flex;
}

.columna{
    flex-flow: column;
}

.fila{
    flex-flow: row;
}

/* Header */
#main-header {
    background: #333;
    color: white;
    height: 80px;
    width: 100%; 
}


    #main-header a{
        color:white;
    }


nav {
    float: right;
}
    nav ul {
        margin: 0;
        padding: 0;
        list-style: none;
        font-size: 20px;
        padding-right: 40px;
    }
        nav ul li {
            display: inline-block;
            line-height: 80px;
        }
            nav ul li a{
                text-decoration: none;
                display: block;
                padding: 0px 20px;
            }
                nav ul li a:hover {
                     text-decoration: none;
                     background: #0b76a6;
                }

.active-menu{
    text-decoration: none;
    background: #0b76a6;
}


#logo-header {
	float: left;
	padding: 10px 0 0 50px;
	text-decoration: none;
}
	#logo-header:hover {
		color: #0b76a6;
	}
	
	#logo-header .site-name {
		display: block;
		font-weight: 700;
		font-size: 2em;
	}
	
	#logo-header .site-desc {
		display: block;
		font-weight: 300;
		font-size: 1.2em;
		color: #999;
	}

    #logo-header .site-name-login{
        display: block;
		font-weight: 700;
		font-size: 2em;
        padding-top: 15px;
    } 


#main-footer {
    bottom: 1px;
    width: 100%;
	background: #333;
	color: white;
	text-align: center;
    height: 30px;
	padding: 5px;
	margin-top: 20px;
    position: fixed;
    z-index: 1000;
}
	#main-footer p {
		margin: 0;
	}
	
	#main-footer a {
		color: white;
	}


.container {
  margin:0 auto;
  width:100%;
  font-size:20px;
}

/* HEADER */
header .container {
  overflow:hidden;
  height: 220px;
  position:relative;
  background-color:#ffffff;
  margin: auto 0;
 
}


/* Controles y tablas */

.totales{
    margin: auto;
    padding-top: 15px;
    width: 80%;
    justify-content: space-around;
}



.totales div input{
    border: 0px;
    height: 30px;
}

section{
	margin-top:20px;
    min-height: 100%;
}
section table tr td input{
	width:90%;
	height:35px;
	outline:none;
	font-size:14px;
}
.registros{
	margin:0 auto;
	width:100%;
	margin-top:8px;
	border:1px solid #6F96DF;
	height:auto;
	padding:5px;
}

.formulario table tr td{
	padding:10px;
}
.formulario table tr td input{
	width:100%;
	outline:none;
}
.formulario table tr td select{
	width:100%;
	height:30px;
	outline:none;
}
.bien{
	background-color:#3CBE34;
	text-align:center;
	font-size:14px;
	color:#FFF;
	padding:5px;
}


.error{
    background-color:#c50000  ;
    text-align: center;
    font-size: 14px;
    color: #FFF;
    padding: 5px;
}



#fondo-login{
    width: 100%;
    height: 100%;
    background-image: url(img/solid-color-blue-background.jpg);

}

.control-masivo{
    width: 100%;
    padding-left: 15px;
    padding-top: 8px;
    border-top: 1px solid #6F96DF;
}

/*************************************************************
/  Formulario envio de facturas
/*************************************************************/


.form-body{
    align-items: flex-start;
    width: 100%;
    padding: 20px;
    padding-left: 15%;
}

.form-body label{
    width: 150px;
    
}

.form-body div{
    margin-bottom: 15px;
    width: 100%;
}

.form-body input, .form-body select{
    width: 65%;
    height: 30px;
}

.form-body select,  .form-body input[type="email"]{
    border: 1px solid #a3a2a2;
    border-radius: 3px;
    overflow: hidden;
}

div.check{
    justify-content: flex-start;
    align-items: center;
}

div.check label{
    width: 100%;
    height: 20px;
    margin-bottom: 0px;
}

div.check input{
    height: 16px;
    width: 30px;
    margin-top: 0px;
}

a#link{
    margin-bottom: 12px;
    text-decoration: none;
}

/*************************************************************
/  Contenedor Datatables
/*************************************************************/

.contenedor-tabla{
    padding: 25px;
}

.contenedor-tabla div.controles{
    margin-bottom: 15px;
}

#tabla-obras td{
    vertical-align: middle;
}

.btn-opc{
    font-size: .9em;
    margin-left: 5px;
}

/*************************************************************
/  Modales
/*************************************************************/
.modal-body div{
    margin-bottom: 10px;
}

.modal-body input, .modal-body select{
    height: 30px;
    padding-left: 5px;
    border: 1px solid #DDD;
    border-radius: 3px;
    overflow: hidden;
}

.small-words{
    width: 100%;
    font-size: .85em;
    color: #b1b1b1;
    text-align: right;
}

.inputPagar label{
    width: 80px;
}

.fechas{
    justify-content: space-around;
    align-items: center;
}





























/*----------------------------------------------------------------- */
/* LOGIN */
/*----------------------------------------------------------------- */

.wraper{
    width: 100%;
    height: 100%;
    background: rgb(31,33,36);
    
    /*FLEX*/
    flex-flow:  column wrap;
    justify-content: center;
    align-items: center;

}

.form-login{
    flex-flow: column;
    background: #fff;
    width: 320px;
    height: 350px;
    padding: 15px;
    border: 2px solid #525151;
    border-radius: 4px;
    overflow: hidden;
    justify-content: space-around;
    align-items: center;
}

.form-login div{
    width: 100%;
    margin-bottom: 15px;
}

.form-login img{
    margin: 0 auto;
    margin-bottom: 15px; 
    color: rgb(150, 0, 0);
}

.form-login input{
    height: 40px;
}

.form-login span{
    width: 20px;
    padding-left: 2px;
    color: #3a3a3a;
}

.form-login input#usuario, .form-login input#password{
    width: 260px;
    padding-left: 5px;
    border: 1px solid #DDD;
    border-radius: 4px;
    overflow: hidden;
}

.form-login a{
    width: 100%;
    font-size: .75em;
    text-decoration: none;
    color: #b3b3b3;
    text-align: right;
    padding: 5px;

}

.form-login a:hover{
    color: #5378be;
}

.form-login input#btn_login{
    width: 100%;
    margin: 0 auto;
    background: #3e86d9;
    color: #fff8f8;
    border: 1px solid #3e86d9;
    border-radius: 4px;
    overflow: hidden;
}

.form-login input#btn_login:hover{
    background: #1675e2;
}