.container > header {
    max-width: 1140px;
    margin: 0 auto;
    min-height: 10vh;
    padding: 3vh 0vh;
}

    .container > header h1 {
        font-size: 2.125em;
        line-height: 1.3;
        margin: 0 0 0.6em 0;
        float: left;
        font-weight: 400;
    }

    .container > header > span {
        display: block;
        position: relative;
        z-index: 9999;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5em;
        padding: 0 0 0.6em 0.1em;
    }

        .container > header > span span:after {
            width: 30px;
            height: 30px;
            left: -12px;
            font-size: 50%;
            top: -8px;
            font-size: 75%;
            position: relative;
            display: none;
        }

        .container > header > span span:hover:before {
            content: attr(data-content);
            text-transform: none;
            text-indent: 0;
            letter-spacing: 0;
            font-weight: 300;
            font-size: 110%;
            padding: 0.8em 1em;
            line-height: 1.2;
            text-align: left;
            left: auto;
            margin-left: 4px;
            position: absolute;
            color: #fff;
            background: #47a3da;
        }

    .container > header nav {
        display: flex;
        justify-content: space-between;
    }

        .container > header nav .bp-icon:after {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            line-height: 2;
            text-indent: 0;
        }

        .container > header nav a:hover:after {
            color: #fff;
        }

.BotonLogin {
    border-style: none;
    border-color: inherit;
    border-width: medium;
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Boton_88.png');
    height: 22px;
    width: 72px;
    color: #FFFFFF;
    font-weight: normal;
    font-family: "TREbuchet MS";
    font-size: 11px;
    background-repeat: no-repeat;
    cursor: pointer;
}

.BotonLogin:hover {
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Boton_88.png') no-repeat 0 -22px;
    cursor: pointer;
}

.DivAcciones {
    width: 100%;
    text-align: center;
    padding-top: 10px;
}

.BotonAzulx88 {
    border-style: none;
    border-color: inherit;
    border-width: medium;
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Boton_88.png') no-repeat;
    color: #FFFFFF;
    font-weight: normal;
    font-family: "TREbuchet MS";
    font-size: 11px;
    cursor: pointer;
}

.BotonAzulx88:hover {
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Boton_88.png') 0 -27px no-repeat;
    cursor: pointer;
}

.BotonAzulx100 {
    border-style: none;
    border-color: inherit;
    border-width: medium;
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Boton_100.png') no-repeat 0 3px;
    height: 30px;
    width: 100px;
    color: #FFFFFF;
    font-weight: normal;
    font-family: "TREbuchet MS";
    font-size: x-small;
    cursor: pointer;
}

.BotonAzulx100:hover {
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Boton_100.png') 0 -26px no-repeat;
    cursor: pointer;
}

.BotonAzulx120 {
    border-style: none;
    border-color: inherit;
    border-width: medium;
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Boton_120.png') no-repeat 0 3px;
    height: 28px;
    width: 120px;
    color: #FFFFFF;
    font-weight: normal;
    font-family: "TREbuchet MS";
    color: White;
    font-size: 10px;
    cursor: pointer;
}

.BotonAzulx120:hover {
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Boton_120.png') 0 -27px no-repeat;
    cursor: pointer;
}

.btnAzul {
    border-style: none;
    border-color: inherit;
    border-width: medium;
    background: #001e3b;
    color: #FFFFFF;
    font-weight: normal;
    font-family: "TREbuchet MS";
    font-size: 11px;
    cursor: pointer;
    border-radius: 20px;
    padding: 9px;
}

.btnAzul:hover{
    background: #47A3DA;
}

.btnAzul:disabled {
    background: darkgrey;
    cursor: not-allowed;
}

.InputText {
    border: 1px solid darkgray;
    border-radius:5px;
    padding: 2px 6px;
}

select {
    padding: 3px;
    border: 1px solid darkgray;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 6px;
}

.SummaryValidator {
    color: #FF0000;
    font-size: 10px;
    text-align: left;
}

.LinkButtonStyle {
    font-family: 'Trebuchet MS';
    font-size: 11px;
    font-weight: bold;
    color: #47A3DA;
}

.LinkButtonStyle:hover {
    text-decoration: none;
}

.LinkButton {
    background-position: left;
    font-size: 16px;
    font-weight: bold;
    color: #47A3DA;
    padding-left: 25px;
    background-image: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Regresar.png');
    background-repeat: no-repeat;
}

.LinkButton:hover {
    text-decoration: underline;
}

.GridHeader {
    border: 1px solid #001E3B;
}

.GridHeader tbody td {
    border: 1px solid #001E3B;
    color: #001E3B;
    padding: 8px;
    font-family: "Trebuchet MS";
    font-weight: normal;
    font-size: 11px;
    background-color: #FFFFFF;
}

a {
    color: #47A3DA;
    text-decoration: none;
}

a:hover {
    color: #000;
}

.thead {
    background-color: #47A3DA;
    color: #FFFFFF;
    border: 1px solid #001E3B;
    height: 30px;
    padding: 8px;
    font-size: 12px;
}

.thead a {
    text-decoration: none;
    color: #FFFFFF;
    font-family: "trebuchet MS";
}

.thead a:hover {
    text-decoration: underline;
}

.ActionHeader {
    text-decoration: none;
    color: #FFFFFF;
    font-family: "trebuchet MS";
    font-size: 12px;
}

.odd {
    background-color: #FFFFFF;
    color: #001E3B;
}

.StyleNavigation {
    width: 100%;
}

.StyleNavigation td {
    text-align: center;
}

.StyleNavigation .StyleRow td {
    padding-top: 40px;
    text-align: center;
}

/*Loading */
.updateProgress {
    background-color: ghostwhite;
    filter: alpha(opacity=70);
    mozopacity: 0.7;
    opacity: 0.7;
    padding-top: 20%;
    padding-left: 45%;
}

    .updateProgress div {
        background-color: GhostWhite;
        padding: 4px;
        position: absolute;
        top: 5%;
        left: 45%;
    }

.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

.panelacciones {
    margin: 2px;
    padding: 15px;
    background-color: #ffffff;
    border: 2px solid #001E3B;
    border-radius:15px;
}

.panelencabezado {
    border: 2px solid #FFFFFF;
    background-color: #D5EAFF;
}

.ContenidoModal {
    padding: 5px;
    width: 668px;
}

.BuscarInfo {
    background: url('../../Styles/HorizontalSlideOutMenu/HorizontalSlideOutMenu/images/Buscar.png');
    background-repeat: no-repeat;
    border: none;
    height: 23px;
    width: 23px;
    vertical-align: middle;
    cursor: pointer;
}

.WaterMarkStyle {
    background-color: #DEEEF8;
    font-size: 10px;
    border: 1px solid #001E3B;
    text-align: center;
    height: 16px;
    color: #999999;
}

/*#region Reportes */

.reportes {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    margin-bottom: 300px;
}

.report {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    position: relative;
    transition: 1s all;
    /*cursor: pointer;*/
    padding: 1rem;
}

.report__image {
    width: 41px;
    height: 48px;
    margin-right: 10px;
}

.report__image-popup {
    position: absolute;
    visibility: hidden;
    width: 600px;
    top: 60px;
    left: -100px;
    z-index: 100000;
}

.report__image-popup-first {
    left: 0;
    right: auto;
}

.report__image-popup-latest {
    left: auto;
    right: 0;
}
.report__image-popup-top {
    top: auto;
    bottom: 60px;
}

/*#endregion */

/*#region Animaciones */

@keyframes show-and-scale {
    from {
        opacity: 0;
        visibility: hidden;
        transform: scale(0);
    }
    to {
        opacity: 1;
        visibility: visible;
        transform: scale(1);
    }
}

@keyframes hide-and-de-scale {
    to {
        opacity: 1;
        visibility: visible;
        transform: scale(1);
    }
    to {
        opacity: 0;
        visibility: hidden;
        transform: scale(0);
    }
}

/*#endregion */

/*#region Searchable DropDownList */

    .searchableDropDown {
        background-color: white;
        border: 1px solid darkgray;
        font-weight: bold;
        padding: 3px;
        color: #001E3B;
    }

    .nomatches {
        color: Red;
        font-weight: bold;
    }

/*#endregion */

/*#Region boton menu resaltado*/

.btn-highlighted {
    border: 1px solid #001e3b !important;
    background: #001e3b !important; /* #d40000; rojo*/
    color: white !important;
}
/*#endRegion*/

/* Sirve para quitar ese espacio de la izquierda que suele tener los checkbox al implementarlo en un formulario.*/
.Chk-ml-0 input[type=checkbox]{
    margin-left: 0px;
}

/* Se usa en cualquier contenedor para colocarle borde gris*/
.border-gray{
    border-color: lightgray !important;
}

.pd-5 {padding: 5px !important;}
.pd-10 {padding: 10px !important;}
.pd-15 {padding: 15px !important;}
.pd-20 {padding: 20px !important;}
.pd-25 {padding: 25px !important;}
.pd-30 {padding: 30px !important;}

/* CLASES PARA INPUTS DE CONTRASEÑA CON BOTON DE VISUALIZAR */
.Password-toggle-Container {
    position: relative;
}

.eye {
    position: absolute;
    background-color: white !important;
    right: 3px;
    top: 0px;
    cursor: pointer;
    width: 25px;
    height: 17px;
    margin: 4px 0px;
    border-radius: 0px 5px 5px 0px;
}

.eye-open {
    background: url('../../Styles/icons/eye-open.svg');
    background-repeat: no-repeat;
    background-position-x: center;
    background-clip: inherit;
}

.eye-close {
    background: url('../../Styles/icons/eye-close.svg');
    background-repeat: no-repeat;
    background-position-x: center;
    background-clip: inherit;
}

/* Estilos para el nuevo popup de visualizacion de recibos */
.panelPopup {
    width: 580px; 
    height: 80vh;
}

.divPrint {
    display: flex; 
    width: 100%; 
    height: 93%; 
    position: absolute; 
    justify-content: center;
    overflow-y: auto;
    align-items: start;
    align-content: flex-start;
}

.withShadow {
    box-shadow: 1px 1px 3px #272727 !important;
}

.divPrintAcciones {
    display: flex; 
    width: 100%; 
    height: 40px; 
    position: absolute; 
    bottom: 0px; 
    align-content: flex-end; 
    justify-content: center; 
    align-items: center;
}

/*Corregir proporción de dimensiones de ésta página sobre la masterpage */
body {
    min-height: 0px !important;
}

#cuerpo {
    min-height: 70vh;
    margin: 0 auto;
    max-width: 1140px;
}

#pie {
    min-height: 10vh;
    color: #001E3B;
    display: flex;
    justify-content: center;
    align-items: center;
}

#pie a {
    color: #001E3B;
    text-decoration: none;
}

#pie a:hover {
    color: #47a3da;
    text-decoration: underline;
    cursor: pointer;
}

#InfoUsuario {
    background-repeat: no-repeat;
    background-position: right;
    margin-top: 8px;
    text-align: right;
    background-color: #FFFFFF;
    font-weight: bold;
    color: #001E3B;
    width: 100%;
}

    #InfoUsuario a {
        font-size: 12px;
        color: #47a3da;
        text-decoration: none;
        font-weight: lighter;
        cursor: pointer;
    }

        #InfoUsuario a:hover {
            font-size: 12px;
            color: #001E3B;
            text-decoration: underline;
            font-weight: lighter;
            cursor: pointer;
        }

#Login {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    flex-flow: column;
}

input[type="text"], input[type="tel"] {
    border-color: darkgray;
    padding: 3px 3px 3px 3px;
}

input[type="checkbox"]:disabled {
    cursor: not-allowed;
}

.btn-modificacion-venta {
    background: white;
    padding: 2px 4px;
    display: inline-block;
    border: 1px solid black;
    border-radius: 10px;
}

.btn-modificacion-venta > img {
    width: 33px;
}

/* Quitar marco azul a botones que sean representados como imagenes o inputs o enlaces */
a, button, img, input[type="submit"], input[type="button"], input[type="image"] {
    outline: none !important;
}

.container-buttons {
    float: right;
    padding-top: 5px;
    padding-bottom: 5px;
}