﻿html {
    position: relative !important;
    min-height: 100%
}

body {
    margin-bottom: 100px;
    /*background-image: url('../Images/Layout/fondo.jpg');*/
    background-size: cover;
    opacity: .98
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-top: 50px;
    padding-bottom: 10px
}

footer {
    width: 100%;
    height: 60px;
    background-color: var(--footer-bg);
    color: var(--footer-color);
    margin: 0px -15px;
    padding: 10px 30px;
    position: absolute;
    bottom: 0
}

footer a, footer a:hover, footer a:visited {
    color: var(--footer-color);
}

    

.container {
    width: 100% !important
}

input,
select,
textarea {
    /*max-width: 280px;*/
}

.login-label-color {
    color: var(--login-label-color);
}

/* Chrome, Firefox, Opera, Safari 10.1+ */
::placeholder {
    color: var(--input-placeholder-color) !important;
    opacity: 1
}

/* Internet Explorer 10-11 */
:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: var(--input-placeholder-color) !important;
}

/* Microsoft Edge */
::-webkit-input-placeholder { /* Edge */
    color: var(--input-placeholder-color) !important;
}

::-webkit-calendar-picker-indicator {
    filter: invert(0%) !important;
    margin-right: -12px !important;
    cursor: pointer
}

/*input[type=text], input[type=password], input[type=date], input[type=number],
input[type=email], input[type=tel], input[type=url],
select {
    background-color: var(--input-bg) !important;
    color: var(--input-color) !important;
    border: var(--input-border) !important;
}*/

input:not(.btn), select {
    background-color: var(--input-bg) !important;
    color: var(--input-color) !important;
    border: var(--input-border) !important;
}

    input:not(.btn):focus, select:focus {
        border: var(--input-border-focus) !important;
        box-shadow: var(--input-border-focus-shadow) !important
    }

    select {
        cursor: pointer;
    }



    .input-group-btn > .btn {
        border: var(--input-border) !important;
    }


.btn-success {
    color: var(--btn-success-color) !important;
    background-color: var(--btn-success-bg) !important
}

.btn-success:hover {
    background-color: var(--btn-success-bg-hover) !important
}




/*.input-group-btn > .btn:focus {
    border: var(--input-border) !important;
}*/



a:hover {
    cursor: pointer
}


/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal
}

table#grv-summary {
    margin-bottom: 0
}

    table#grv-summary > tbody > .bar-summary > td {
        background-color: var(--index-table-row-sumary-bg);
        color: var(--index-table-row-sumary-color);
        font-size: 18px
    }

/* Color de fondo de la tabla de filtrado */
#grv #browser td {
    background-color: var(--index-table-browser-bg)
}

/* Botones e iconos de los Inputs de filtrado */
#grv #browser button {
    background-color: var(--index-table-browser-btn-bg);
    color: var(--index-table-browser-btn-icon-color);
}

    #grv #browser button:hover {
        background-color: var(--index-table-browser-btn-bg-hover);
        color: var(--index-table-browser-btn-icon-color-hover);
    }

.table-header {
    background-color: var(--index-table-header-bg) !important;
    color: var(--index-table-header-color);
}

/* Iconos de ordenación de la fila de cabecera de la tabla */
#grv > tbody > tr > th > a {
    color: var(--index-table-header-color);
    float: right;
}

/* Filas impares */
#grv tbody tr:nth-child(even) td {
    background-color: var(--index-table-body-even-rows-bg);
    color: var(--index-table-body-even-rows-color)
}

/* Filas pares */
#grv tbody tr:nth-child(odd) td {
    background-color: var(--index-table-body-odd-rows-bg);
    color: var(--index-table-body-odd-rows-color)
}

/* Resaltado de color hover */
#grv tr:not(:nth-child(1)):hover td {
    background-color: var(--index-table-body-row-hover-bg) !important;
    color: var(--index-table-body-row-hover-color);
    cursor: pointer
} 

#grv > tbody > tr > th {
    min-width: 60px !important;
}

#grv {
    border: none !important;
}

.panel {
    border: var(--edit-panel-border) !important;
}

.panel-heading {
    background-color: var(--edit-panel-header-bg) !important;
    color: var(--edit-panel-header-color) !important;
    padding-left: 40px;
}

.panel-body {
    background-color: var(--edit-panel-body-bg) !important;
}

.panel-footer {
    background-color: var(--edit-panel-footer-bg) !important
}

.buscador {
    margin-top: 20px
}


.panel {
    margin: 30px 15%;
}
/*
    .panel .panel {
        margin: 20px 5%
    }*/



.navbar-inverse {
    background-color: var(--nav-bg) !important;
    border: none
}

.navbar-nav > li > a {
    height: 53px !important;
    font-size: 18px !important;
    color: var(--nav-color) !important;
}

    .navbar-nav > li > a:hover {
        background-color: var(--nav-item-bg-hover) !important;
        color: var(--nav-item-color-hover) !important;
        border-bottom-color: var(--nav-border-bottom-color-hover) !important;
        border-bottom-width: var(--nav-border-bottom-width-hover) !important;
        border-bottom-style: var(--nav-border-bottom-style) !important
    }

.navbar-li-last {
    margin-right: 30px !important
}

.navbar-brand {
    padding: 6px 10px 5px 30px !important
}

.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
    background-color: var(--nav-item-bg-open);
    border-bottom-color: var(--nav-border-bottom-color-hover) !important;
    border-bottom-width: var(--nav-border-bottom-width-hover) !important;
    border-bottom-style: var(--nav-border-bottom-style) !important;
}

.navbar-inverse .navbar-toggle {
    background-color: var(--nav-btn-mobile-menu-bg)
}

    .navbar-inverse .navbar-toggle:hover {
        background-color: var(--nav-btn-mobile-menu-bg-hover)
    }

.dropdown-menu, option {
    background-color: var(--nav-dropdown-menu-bg);
}

ul.dropdown-menu > li > a {
    font-size: 18px;
    color: var(--nav-dropdown-menu-color);
}

    ul.dropdown-menu > li > a:hover {
        background-color: var(--nav-dropdown-menu-bg-hover);
        color: var(--nav-dropdown-menu-color-hover);
    }

.nav .glyphicon {
    color: var(--nav-glyphicon-color);
}

.navbar-li-last .dropdown-menu .glyphicon {
    color: var(--nav-dropdown-menu-icon-color);
}

.navbar-li-last .dropdown-menu li:hover .glyphicon {
    color: var(--nav-dropdown-menu-icon-color-hover);
}

.titulo-index {
    color: var(--index-title-color);
    text-transform: var(--index-title-transform);
}







/* enable absolute positioning */
.inner-addon {
    position: relative;
}

    /* style icon */
    .inner-addon span  {
        position: absolute;
        padding: 10px;
        pointer-events: none;
    }

/* align icon */
.left-addon .glyphicon {
    left: 0px;
}

.right-addon span  {
    right: 0px;
}

/* add padding  */
.left-addon input {
    padding-left: 30px;
}

.right-addon input {
    padding-right: 30px;
}






.botones-bar {
    padding-top: 8px
}

.btn:active, .btn:focus, .btn:active:focus {
    outline: none
}

.botones-bar .btn {
    background-color: var(--index-btn-bar-bg);
}

    .botones-bar .btn:hover {
        background-color: var(--index-btn-bar-bg-hover);
        outline: none;
    }

    .botones-bar .btn .glyphicon {
        color: var(--index-btn-icon-color);
    }
    
    .botones-bar .btn:hover .glyphicon {
        color: var(--index-btn-icon-color-hover);
    }

div#MvcViewerReportPanel > div.stiJsViewerPage > div {
    display: none !important;
}

.panel-body ul li a:hover {
    background-color: var(--panel-menu-item-bg-hover) !important;
    color: var(--panel-menu-item-color-hover)
}

.modal-close {
    color: white !important;
    margin-top: 10px !important
}

.body-content #myCarousel img {
    max-height: 570px
}

.panel-titulo {
    margin-top: 10px
}

.panel-subtitulo {
    margin-top: -5px
}

.index {
    padding: 25px 8%
}

.img-full {
    width: 100%;
}

.img-login {
    width: var(--login-img-logo-width);
    margin: var(--login-img-logo-margin);
}

.img-innobonos {
    width: 50%;
    margin: 50px auto 0 auto
}


@media (max-width: 767px) {

    .index {
        padding: 0 0
    }

    h1, .h1, h2, .h2, h3, .h3 {
        margin-bottom: 10px;
        margin-top: 10px
    }

    .navbar-brand {
        padding: 6px 10px 5px 10px !important;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
        background-color: var(--nav-item-bg-open);
        color: var(--nav-color)
    }

    .navbar-nav .open .dropdown-menu {
        margin-top: -5px
    }

    .navbar-li-last {
        margin-right: -15px !important
    }

    .col-summary-label {
        width: 60%
    }

    .col-summary-total {
        width: 40%
    }

    .titulo-index {
        text-align: center;
        margin-bottom: 1px
    }

    .botones-bar{
        text-align: center;
        margin-bottom: 8px
    }

    .panel {
        margin: 15px 0
    }

    .panel .panel {
        margin: 10px 5%
    }
}

@media (max-width: 550px) {

    h1 {
        font-size: 26px
    }

    h2 {
        font-size: 20px
    }

    h3 {
        font-size: 16px
    }
    
    table#grv th:not(.nombre):not(.total),
    table#grv td:not(.nombre):not(.total) {
        display: none
    }

    .boton-search {
        display: none
    }

    .modal-close {
        margin-top: 0px !important
    }

    .img-login {
        margin-top: 40px;
    }

    .img-innobonos {
        width: 100%;
    }

    footer {
        text-align: center
    }
}