/*------------------- FUENTES -------------------*/
@font-face 													{ font-family: roboto-regular; src: url('../fonts/Roboto-Regular.ttf'); }
@font-face 													{ font-family: roboto-medium; src: url('../fonts/Roboto-Medium.ttf'); }
@font-face 													{ font-family: roboto-medium; src: url('../fonts/Roboto-Light.ttf'); }
.fuente-roboto-normal 										{ font-family: 'roboto-regular'; }
.fuente-roboto-medium 										{ font-family: 'roboto-medium'; }
.fuente-roboto-light 										{ font-family: 'roboto-light'; }

/*------------------- COLORES DE FONDO -------------------*/
.bg-azul 													{ background-color: #0072bc; }
.bg-blanco 													{ background-color: #fff; }
.bg-negro 													{ background-color: #000; }
.bg-gris 													{ background-color: #f5f8fa; }

/*------------------- COLORES FUENTE -------------------*/
.ft-gris-claro												{ color: #ddd; }
.ft-blanco													{ color: #fff; }
.ft-rojo													{ color: #d32525; }

/*------------------- ESTILOS GENERALES -------------------*/
body, html 													{ margin:0; padding: 0; font-family: 'roboto-regular'; height: 100%}
.cursor-pointer 											{ cursor: pointer; }
a 															{ text-decoration: none; }
ul 															{ list-style: none }
/*------------------- FLOAT -------------------- */
.float-left 												{float: left }
.float-right 												{float: right }
/*------------------- DISPLAY -------------------*/
.display-table 												{ display: table; }
.display-table-cell											{ display: table-cell; }
.display-inline-block 										{ display: inline-block; }
.display-block 												{ display: block; }
.display-none 												{ display: none; }

/*------------------- ALINEACIONES -------------------*/
.vertical-align-middle										{ vertical-align: middle; }
.text-align-center 											{ text-align: center; }
.text-align-left 											{ text-align: left; }
.text-align-right 											{ text-align: right; }
.margin-0-auto 												{ margin: 0 auto; }

/*------------------- TEXTO -------------------*/
.text-upper 												{ text-transform: uppercase; }

/*------------------- POSICIONES -------------------*/
.position-relative 											{ position: relative; }
.position-absolute 											{ position: absolute; }
.position-fixed 											{ position: fixed; }

/*------------------- PORCENTAJES -------------------*/
.w100 														{ width: 100% }
.w80 														{ width: 80% }
.w50 														{ width: 49% }
.w20														{ width: 20% }
.w25														{ width: 25% }

.h100 														{ height: 100%; }
.h80 														{ height: 80%; }
.h50 														{ height: 50%; }

/*------------------- FORMULARIO -------------------*/
input[type="text"], input[type="password"] 					{ margin-bottom: 12px; color: #555; padding: 6px 12px; font-size: 16px; border-radius: 4px; border: 1px solid #ccc; box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); }
input[type="text"]:focus, input[type="password"]:focus 		{ -moz-box-shadow: 1px 1px 10px 1px #62b4e2 #62b4e2; -webkit-box-shadow: 1px 1px 10px 1px #62b4e2; box-shadow:         1px 1px 10px 1px #62b4e2; border-color:transparent;}
input[type="submit"] 										{ border: 0 none; border-radius: 4px; padding: 8px; letter-spacing: 0.5px; }

/*------------------- PARTICULARES DEL SITIO -------------------*/
.cont-formulario											{ min-width: 250px; max-width: 400px; }
.titular 													{ padding-top: 15px; padding-bottom: 15px; letter-spacing: 2px; font-size: 18px; }
.form-login 												{ padding-top: 15px; padding-bottom: 15px; display: block; }
.error 														{ font-size: 12px; text-align: center; overflow: hidden; height: 0; }

.menu 														{  }
.menu div 													{  }
header 														{ background-color: #fff; box-shadow: 0 0 1px #222; position: relative; }
header div 													{ display: inline-block; vertical-align: middle; }
header a 													{ color: #5f6468; font-size:12px }
header span													{ color: #5f6468; font-size:16px }
header a:hover 												{ color: #30a5ff; }
.cont-header 												{ width: 95%; padding-top: 7px; padding-bottom: 7px; }
.logoTransporte 											{ width: 80%; min-width: 20px; max-width: 200px; }

.col-1 														{ background-color: #fff; width: 20%; min-width:300px; max-width:400px; height: 100%; display: inline-block; }
.titular-col 												{ margin-bottom:10px; border-bottom: 1px solid #eee; color:#5f6468; padding-top: 14px; padding-bottom: 14px; text-align: center; }
.itemMenu 													{ color: #30a5ff;  display: block; cursor: pointer; padding-left: 15px; padding-top: 10px; padding-bottom: 15px; }
.itemMenu:hover  											{ color: #fff; background-color: #30a5ff; }
.itemMenu:hover a 											{ color: #fff; }
.itemMenu.seleccionado										{ color: #fff; background-color: #287ab6;  } 
.col-cont 													{ display: inline-block;   width: 66%;
    min-width: 200px;
    /*max-width: 800px; */
    width: 79%;
    vertical-align: top;
    position: relative;

}

.formulario form 											{ margin-left: 15px; margin-top: 15px; }
.formulario label											{ margin-top: 18px; display: inline-block; margin-bottom: 18px; color: #5f6468; width: 100%;}
.formulario input[type="text"], select						{ display: block; width: 97%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555;border: 1px solid #eee; box-shadow: none; }
.formulario input[type="text"]:focus 						{ border:2px solid #287ab6; }
.formulario input[type="submit"] 							{ display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 12px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 4px; margin-top: 15px; background-color: #30a5ff; color:#fff; text-transform: uppercase; }

#precarga 													{ position: absolute; margin-top: 21px; display: none; }
#precarga img 												{ width: 20px; }

.modal 														{ overflow: hidden; width: 100%; position: absolute; text-align: center; z-index: 10; }
.ok 														{ background-color: #7fda96; }

#modal-form 												{ height: 0; -webkit-transition: height 2s; /* Safari */ -moz-transition: height 2s; /* Safari */ transition: height 2s;}
.w69 {width: 69%}
.cont-boton-salir a img {width: 20px}
.cont-boton-salir a p {margin: 5px 0 5px 0}
.color-red{color:red}
.color-white{color:white}
.background-red{background-color: red}

.form-login .login_pass_recover {text-align: center; margin-top: 20px;}
.form-login .login_pass_recover a {color: white;}