*,
a {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

html,
body {
    height: 100%;
}

html {
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
}

body {
    font-family: 'Raleway', "Helvetica", "Arial";
    font-size: 13px;
    font-weight: 400;
    padding: 0;
    margin: 0;
}

input:focus,
textarea:focus {
    outline: none;
}

/* Oculta los DIVS para el POPUP y las opciones del checklist que aún no deben tener valor*/
#popup-cliente,#popup-marca, #popup-modelo, #popup-capacidad, #popup-color, #popup-detalle-ods-captura, #popup-marca-inv, #popup-modelo-inv, #popup-capacidad-inv, #popup-color-inv, #popup-marca-adm, #popup-modelo-adm, #popup-capacidad-adm, #popup-color-adm, #popup-detalle-ods, #popup-detalle-ods-mostrador, #popup-detalle-ods-reparacion, #popup-detalle-agregado-rep, #popup-repara-ods, #popup-reparacion, #popup-repara-mostrador, #popup-detalle-notas, #popup-repara-notas, #popup-detalle-ods-recibe, #popup-notas-det {
	display:none;
	background-color:#fff !important;
    border-radius:15px;
    color:#1e2123;
    display:none;
    padding:20px;
    min-width:750px !important;
    min-height: 200px;
	overflow: auto;
	overflow: scroll-y; }

#mensaje {
	display:none;
	background-color:#fff;
    border-radius:15px;
    color:#1e2123;
    display:none;
    padding:20px;
    min-width:750px;
    min-height: 150px;
	max-height: 350px; }

/* Define valores para tipo columna de 60 + 39% */
#izq-60 { width: 60%; float: left; }
#der-35 { width: 35%; float: right; }

/* Detalles del POPUP generado  */
#element_to_pop_up {
    background-color:#fff;
    border-radius:15px;
    color:#1e2123;
    display:none;
    padding:20px;
    min-width:400px;
    min-height: 180px;
}
.b-close{
    cursor:pointer;
    position:absolute;
    right:10px;
    top:5px;
}

/* --------------- JULIO CSS ------------------ */

.login-container {
    max-width: 320px;
    margin: 40px auto;
}

.login-container .logo {
    display: block;
    margin: 0 auto 40px;
    width: 140px;
}

.login-container form .input {
    margin-bottom: 20px;
}

.login-container form label {
    display: block;
    margin-bottom: 8px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 2px;
}

.login-container form input {
    width: 100%;
    height: 40px;
    padding: 10px;
    border: 2px solid #1e2123;
    font-size: 14px;
    border-radius: 3px;

    transition: border-color 0.2s ease-in-out;
    -webkit-transition: border-color 0.2s ease-in-out;
    -moz-transition: border-color 0.2s ease-in-out;
}

.login-container form input:focus { border-color: #999; }

.login-container form input[type=submit] {
    width: 50%;
    height: 50px;
    float: right;
    padding: 15px 20px;
    border: none;
    color: #fff;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: bold;
    text-align: left;
    background-color: #1e2123;

    transition: opacity 0.2s ease-in-out;
    -webkit-transition: opacity 0.2s ease-in-out;
    -moz-transition: opacity 0.2s ease-in-out;
}

.login-container form input[type=submit]:hover { opacity: 0.8; }
.login-container form input[type=submit]:active {
    position: relative;
    top: 1px;
}

.login-footer {
    position: absolute;
    bottom: 20px;
    left: 50%;
    width: 320px;
    margin-left: -160px;
    padding-top: 20px;
    border-top: 1px solid #ddd;
    text-align: center;
}

.login-container #mostrador {
    visibility: hidden;
    display: none;
}

.login-container #mostrador-trigger {
    position: relative;
    display: block;
    padding: 15px;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #fff;
    background-color: #1e2123;
    border-radius: 3px;
    cursor: pointer;

    transition: opacity 0.2s ease-in-out;
    -webkit-transition: opacity 0.2s ease-in-out;
}

.login-container #mostrador-trigger:hover { opacity: 0.9; }
.login-container #mostrador-trigger:active { top: 1px; }

.login-container #mostrador-trigger .arrow {
    position: absolute;
    right: 15px;
    top: 50%;
    width: 16px;
    margin-top: -9px;

    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);

    transition: transform 0.2s ease-in-out;
    -webkit-transition: transform 0.2s ease-in-out;
}

.login-container #mostrador-trigger.opened .arrow {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
}

.login-container #mostrador-trigger .symbol {
    fill: #fff;
}

.login-container .mostrador-list {
    display: none;
    padding: 0;
    border: 2px solid #1e2123;
}

.login-container .mostrador-list li {
    position: relative;
    display: block;
    padding: 15px;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 2px;
    background-color: #fff;
    cursor: pointer;

    transition: background-color 0.2s ease-in-out,
                color 0.2s ease-in-out;
    -webkit-transition: background-color 0.2s ease-in-out,
                        color 0.2s ease-in-out;
    -moz-transition: background-color 0.2s ease-in-out,
                     color 0.2s ease-in-out;
}

.login-container .mostrador-list li.selected,
.login-container .mostrador-list li:hover {
    color: #fff;
    background-color: #1e2123;
}

.login-container .mostrador-list li .arrow {
    position: absolute;
    right: 15px;
    top: 50%;
    width: 16px;
    margin-top: -9px;
}

.login-container .mostrador-list li .symbol {
    transition: fill 0.2s ease-in-out;
    -webkit-transition: fill 0.2s ease-in-out;
    -moz-transition: fill 0.2s ease-in-out;
}

.login-container .mostrador-list li:hover .symbol { fill: #fff; }

#generales-container {
    float: none;
}
#detalles-container {
    float: left;
    width: 1000px !important;
}
#checklist-container {
    width: 450px !important;
    float: left;
}
#historial-container {
    width: 250px !important;
    height: 300px !important;
    scrollable: true;
    float: left;
    padding: 10px 10px 10px 10px;
    overflow: scroll;
    border-color: #666;
    border-style: solid;
    border-width: 1px !important;
    height: auto;
}
#historial-container table {
    width: 200px;
}

#falla-container {
    width: 450px !important;
    height: 300px !important;
    scrollable: true;
    float: left;
    padding: 20px 20px 20px 20px;
    border-color: #666;
    height: auto;
}

#autorizacion-container {
    clear: both;
}