﻿.navbar-logo {
    float: left;
    margin-right: 10px;
    margin-top: 5px;
    /*background: #00BCD4;
    border: 10px solid transparent;
    border-color: rgba(0,0,0,0) rgba(0,0,0,0.15) rgba(0,0,0,0.3);*/
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    background-image: url('assets/img/hdi.png');
}

.stepwizard-step p {
    margin-top: 10px;
}

.stepwizard-row {
    display: table-row;
}

.stepwizard {
    display: table;
    width: 100%;
    position: relative;
    margin-left: -3%;
}

.stepwizard-step button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

.stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    z-order: 0;
}

.stepwizard-step {
    display: table-cell;
    text-align: center;
    position: relative;
    padding: 0px 15px;
}

.btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}

/*# bloqueo por accion contra el servidor */
.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.modalPopupWait {
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    width: 350px;
    padding-top: 10px;
    text-align: center;
    background-color: #ffffff;
}

.modalPopupDragHandleWait {
    border-right: gray 1px solid;
    border-top: gray 1px solid;
    border-left: gray 1px solid;
    cursor: move;
    color: black;
    border-bottom: gray 1px solid;
    background-color: #5cbf7e; /*#019429;*/
    text-align: center;
}


/*---- LOADING HDI ----*/

/*#boxy {
    height: 150px;
}*/

.contenedorLoader {
    position: relative;
    width: 100px;
    height: 100px;
    margin: 50px auto auto auto;
}


.loader {
    background: #006729;
    -webkit-animation: load1 1s infinite ease-in-out;
    animation: load1 2s infinite ease-in-out;
    animation-direction: alternate;
    width: 1em;
    height: 3em;
}

    .loader:before {
        background: #006729;
        -webkit-animation: load2 1s infinite ease-in-out;
        animation: load2 2s infinite ease-in-out;
        animation-direction: alternate;
        width: 1em;
        height: 3em;
    }

    .loader:after {
        background: #006729;
        -webkit-animation: load3 1s infinite ease-in-out;
        animation: load3 2s infinite ease-in-out;
        animation-direction: alternate;
        width: 1em;
        height: 3em;
    }

    .loader:before,
    .loader:after {
        position: absolute;
        content: '';
    }

    .loader:before {
        left: -1.4em;
    }

.loader {
    text-indent: -9999em;
    margin: 40% auto;
    position: relative;
    font-size: 11px;
    -webkit-animation-delay: 0.16s;
    animation-delay: 0.16s;
}

    .loader:after {
        left: 1.4em;
        /* -webkit-animation-delay: 0.32s;
            animation-delay: 0.32s; */
    }

@-webkit-keyframes load1 {

    0%, 25%, 64% {
        box-shadow: 0 0 #006729;
        height: 3em;
        top: 0;
    }

    5% {
        box-shadow: 0 -2em #006729;
        height: 4em;
        top: 0;
    }

    64% {
        box-shadow: 0#E60018;
        background: #E60018;
        width: 1em;
        height: 3em;
        top: 0;
    }

    85% {
        box-shadow: 0 #E60018;
        background: #E60018;
        width: 1em;
        height: 1em;
        top: 17px;
    }

    100% {
        box-shadow: 0 #E60018;
        background: #E60018;
        width: 1em;
        height: 1em;
        top: 17px;
    }
}

@keyframes load1 {

    0%, 25%, 64% {
        box-shadow: 0 0 #006729;
        height: 3em;
        top: 0;
    }

    5% {
        box-shadow: 0 -2em #006729;
        height: 4em;
        top: 0;
    }

    64% {
        box-shadow: 0#E60018;
        background: #E60018;
        width: 1em;
        height: 3em;
        top: 0;
    }

    85% {
        box-shadow: 0 #E60018;
        background: #E60018;
        width: 1em;
        height: 1em;
        top: 17px;
    }

    100% {
        box-shadow: 0 #E60018;
        background: #E60018;
        width: 1em;
        height: 1em;
        top: 17px;
    }

    100% {
        box-shadow: 0 #E60018;
        background: #E60018;
        width: 1em;
        height: 1em;
        top: 17px;
    }
}

@-webkit-keyframes load2 {

    0%, 25%, 64% {
        box-shadow: 0 0 #006729;
        height: 3em;
    }

    5% {
        box-shadow: 0 -2em #006729;
        height: 4em;
    }

    64% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: -1.4em;
        top: 0;
    }

    85% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: -1em;
        top: -1em;
    }

    100% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: -1em;
        top: -1em;
    }
}

@keyframes load2 {

    0%, 25%, 64% {
        box-shadow: 0 0 #006729;
        height: 3em;
    }

    5% {
        box-shadow: 0 -2em #006729;
        height: 4em;
    }

    64% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: -1.4em;
        top: 0;
    }

    85% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: -1em;
        top: -1em;
    }

    100% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: -1em;
        top: -1em;
    }
}

@-webkit-keyframes load3 {

    0%, 19%, 58% {
        box-shadow: 0 0 #006729;
        height: 3em;
    }

    3% {
        box-shadow: 0 -2em #006729;
        height: 4em;
    }

    64% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: 1.5em;
        top: 0;
    }

    85% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: 1em;
        top: -1em;
    }

    100% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: 1em;
        top: -1em;
    }
}

@keyframes load3 {

    0%, 19%, 58% {
        box-shadow: 0 0 #006729;
        height: 3em;
    }

    3% {
        box-shadow: 0 -2em #006729;
        height: 4em;
    }

    64% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: 1.4em;
        top: 0;
    }

    85% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: 1em;
        top: -1em;
    }

    100% {
        box-shadow: 0 0 #006729;
        height: 3em;
        left: 1em;
        top: -1em;
    }
}

.ayuda {
    background-color: #33B05C;
    padding: 3px 9px;
    border-radius: 50%;
    border-color: #006729;
    color: white !important;
    float: right;
}

.celular {
    background: #006729;
    color: white;
    /*width: 40px;*/
    height: 34px;
}


.ayuda2 {
    background-color: #006729;
    width: 32px;
    height: 34px;
    /*padding: 3px 9px;*/
    border-radius: 50%;
    border-color: #006729;
    color: white !important;
    float: right;
}

.fondcal {
    background: #006729;
    color: white;
}

.custab {
    border: 1px solid #ccc;
    padding: 5px;
    margin: 5% 0;
    box-shadow: 3px 3px 2px #ccc;
    transition: 0.5s;
}

    .custab:hover {
        box-shadow: 3px 3px 0px transparent;
        transition: 0.5s;
    }

table.dataTable tbody td:hover {
    background-color: #79B530 !important;
    color: white;
}



.btn.btn-primary-siguiente {
    background: #f2931f;
    background: -moz-linear-gradient(left, #f2931f 0%, #fa6a47 70%, #f85c5f 100%);
    background: -webkit-linear-gradient(left, #f2931f 0%, #fa6a47 70%, #f85c5f 100%);
    background: linear-gradient(to right, #f2931f 0%, #fa6a47 70%, #f85c5f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2931f', endColorstr='#f85c5f',GradientType=1 );
    border-color: transparent;
    border-radius: 1.75rem;
    box-shadow: 0 0.5rem 1rem rgba(248, 92, 95, 0.5);
    /*font-family: 'hdi-gerling_sansbold';*/
    padding: 0.75rem 1.875rem;
    text-transform: uppercase;
    color: white;
}

    .btn.btn-primary-siguiente:hover {
        background: #ef7f00;
        background: -moz-linear-gradient(left, #ef7f00 0%, #f95834 70%, #f74548 100%);
        background: -webkit-linear-gradient(left, #ef7f00 0%, #f95834 70%, #f74548 100%);
        background: linear-gradient(to right, #ef7f00 0%, #f95834 70%, #f74548 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ef7f00', endColorstr='#f74548',GradientType=1 );
        border-color: #f85c5f;
    }

.valor {
    color: #009C33 !important;
    font-weight: bolder !important;
}


/*Color hdi a los panel*/
.panel-heading {
    background: #006729 !important;
}

/*Color hdi a los swipe si/no*/
.btn-primary {
    background-color: #006729 !important;
    border-color: #006729 !important;
}

/*Controles de formulario focus color verde*/
.form-control:focus {
    border-color: #009567;
    outline: 0;
    box-shadow: 0 0 0 0.125rem rgba(0, 149, 103, 0.3);
}
/*Controles de formulario focus color rojo error*/
.custom-select.is-invalid:focus, .form-control.is-invalid:focus, .has-error .form-control:focus, .was-validated .custom-select:invalid:focus, .was-validated .form-control:invalid:focus {
    border-color: #cc4946 !important;
    outline: 0 !important;
    box-shadow: 0 0 0 0.125rem rgba(204,73,70,.3) !important;
}

/*Texto de error en textbox*/
.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #cc4946;
}

/*Color rojo a las x de campo invalido */
.form-check-input.is-invalid ~ .form-check-label, .has-error .checkbox, .has-error .checkbox-inline, .has-error .control-label, .has-error .form-control-feedback, .has-error .help-block, .has-error .radio, .has-error .radio-inline, .has-error.checkbox label, .has-error.checkbox-inline label, .has-error.radio label, .has-error.radio-inline label, .invalid-feedback, .was-validated .form-check-input:invalid ~ .form-check-label {
    color: #cc4946 !important;
}

/*Color verde a los ticket de campo valido */
form-check-input.is-valid ~ .form-check-label, .has-success .checkbox, .has-success .checkbox-inline, .has-success .col-form-label, .has-success .control-label, .has-success .form-control-feedback, .has-success .help-block, .has-success .radio, .has-success .radio-inline, .has-success.checkbox label, .has-success.checkbox-inline label, .has-success.radio label, .has-success.radio-inline label, .valid-feedback, .was-validated .form-check-input:valid ~ .form-check-label {
    color: #008a8a;
}

/*Mueve los ticket y las x a centro del textbox*/
.form-control-feedback {
    line-height: 34px !important;
}

.form-control-feedback {
    position: absolute;
    right: 8px;
    top: 0;
    padding: 25px;
    z-index: 999;
    height: 34px;
    width: 38px;
}

/*Color de fondo a item seleccionado del combo*/
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: #006729 !important;
    color: #FFF !important;
}

/*Color de fondo a item pre-seleccionado del combo*/
.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #ddd !important;
    color: #707478 !important;
}

/*Color a textbox de seleccion en combo*/
.select2-container--default .select2-search--dropdown .select2-search__field:focus, .select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: #006729 !important;
    outline: 0 !important;
    box-shadow: 0 0 0 0.125rem rgba(0, 149, 103, 0.3) !important;
}

/*Ocultar flechas de los combobox*/
.select2-selection__arrow {
    display: none !important;
}

/*Color hdi al navbar de la master*/
.header.navbar-default {
    background: #006729;
}

/*Color a logo hdi del navbar masterpage*/
.navbar-header {
    background: #FFF;
}

/*Ajuste de tamaño dle logo del navbar masterpage*/
.logo-sidenav {
    width: auto;
    height: 50px;
}

/* ajuste de color*/
.page-header-hdi {
    color: #fff;
}

/*Color botones bandejas*/
.btn.btn-inverse {
    color: #fff;
    background: #006729;
    border-color: #006729;
}

/*Texto de label en bandejas*/
.f-w-600, .semi-bold {
    font-weight: 600 !important;
}

/*Separacion de las filas con el panel*/
.row {
    margin-left: -10px;
    margin-right: -10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

/*Espaciado header del panel master page*/
.panel-heading {
    padding: 10px 15px;
    border: none;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
/*Espaciado a paneles de la master page*/
.panel {
    margin: 10px 0;
}

/*Configuracion de las tablas */
.table thead th, .table > thead > tr > th {
    background: #006729;
    color: #fff;
    font-weight: 600;
    border-bottom: 1px solid #b6c2c9 !important;
}

/*Botones bandejas rmaos varios*/
.btn-group-vertical > .btn, .btn-group > .btn {
    position: relative;
    flex: 0 1 auto !important;
}

/*Titulo de colorbox*/
h3 {
    color: #006729;
}

/*icono de listado de menu del sidebar en blanco al ser seleccionado*/
.sidebar .nav > li.active > a i {
    color: #fff !important;
}

/*Color de fondo del menu seleccionado en el sidebar*/
.sidebar .nav > li.expand > a {
    background: #006729 !important;
}

/*Cuando se cierra el menu del sidebar se debe cmabiar el color a transparente*/
.sidebar .nav > li.closed > a {
    background-color: rgba(0, 0, 0, 0.00) !important;
}

/*Color de link*/
a.linkear {
    color: #006729 !important;
}

/*Color hover focus del sidebar*/
.sidebar .nav > li.active > a, .sidebar .nav > li.active > a:focus, .sidebar .nav > li.active > a:hover {
    color: #fff;
    background: #006729;
}

/*Color circulo submenu sidebar*/
.sidebar .sub-menu > li:after {
    background: #006729;
    border: 1px solid #006729;
}

/*Select2 combo box*/
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #006729;
    color: white;
}

.select2.select2-container--focus .select2-selection--single:focus {
    border-color: #006729 !important;
    outline: 0 !important;
    box-shadow: 0 0 0 0.125rem rgba(0, 149, 103, 0.3);
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus, .select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: #006729 !important;
    outline: 0 !important;
    box-shadow: 0 0 0 0.125rem rgba(0, 149, 103, 0.3) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: #006729 !important;
}

.select2-selection__choice {
    white-space: normal;
}

.select2-selection__choice__remove {
    display: none !important;
}

.select2-selection__choice {
    background-color: #fff !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li.select2-selection__choice {
    padding: 2px 5px !important;
    white-space: nowrap;
}

/*----- Ajusta tamano de select -----*/
.select2-selection--multiple {
    font-size: 100%;
    outline: none;
    height: 30px;
    display: table-cell;
    vertical-align: middle;
    border: 1px solid #ccc;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    right: 5px !important;
    height: 32px !important;
    display: none;
}


/*Color datepicker*/
td.day.active {
    background: #006729 !important;
}

body .datepicker .datepicker-centuries table tbody tr td.day.active, body .datepicker .datepicker-days table tbody tr td.day.active, body .datepicker .datepicker-decades table tbody tr td.day.active, body .datepicker .datepicker-months table tbody tr td.day.active, body .datepicker .datepicker-years table tbody tr td.day.active {
    background: #006729 !important;
    color: #fff !important;
    text-shadow: none !important;
}


.datepicker {
    color: #006729 !important;
    min-width: 250px !important;
    border-radius: 6px !important;
}

body .datepicker .datepicker-days table tbody tr td.day {
    color: #006729;
}

.datepicker table tr td.old, .datepicker table tr td.new {
    color: #999999 !important;
}


/*Select2 seleccionado*/

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #006729 !important;
    color: #fff !important;
}


table.dataTable tbody td:hover a.linkear {
    background-color: #009C33 !important;
    color: white !important;
}

/*Cambia padding tabla tarifas en pag 2.5 vehiculo*/
.table-sm th, .table-sm td {
    padding: 0.3rem !important;
}

/*Color link en tablas */
#Main_TblTarifas a {
    color: #006729 !important;
}

#Main_TblTarifas td:hover a {
    color: #fff !important;
}

/*Botones de paginación datatables en linea*/
body div.dataTables_wrapper div.dataTables_paginate ul.pagination {
    margin: 5px 0;
    display: flex;
}


.dataTables_wrapper.dt-bootstrap .dataTables_paginate .pagination .paginate_button a, .dataTables_wrapper.dt-bootstrap4 .dataTables_paginate .pagination .paginate_button a {
    position: relative;
    display: block;
    padding: 8px 12px !important;
    margin-left: 7px !important;
    line-height: 1.25;
    color: #6f8293;
    background-color: #fff;
    border: 1px solid #d5dbe0;
    font-weight: 600;
    text-decoration: none;
    outline: 0;
    -webkit-border-radius: 4px;
    border-radius: 4px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: unset !important;
}


    .dataTables_wrapper .dataTables_paginate .paginate_button:active {
        border: none !important;
        outline: none !important;
        background-color: none !important;
        background: none !important;
        box-shadow: none !important;
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
        border: none !important;
        outline: none !important;
        background-color: none !important;
        background: none !important;
        box-shadow: none !important;
    }

/*Combo de registros por pagina tamano*/
.form-control-sm, .input-group-sm > .form-control, .input-group-sm > .input-group-append > .btn, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, .input-group-sm > .input-group-prepend > .input-group-text, select.form-control-sm:not([size]):not([multiple]) {
    padding: 5px 20px 5px 10px;
}
/*Boton carrito bandeja campañas*/
.btn.btn-success {
    color: #fff;
    background: #006729;
    border-color: #006729;
}

/*Color titulo*/
.page-header {
    color: #006729;
}
