@import url('normalize.css');
@import url('bootstrap.min.css');
body,
html {
    height: 100%;
    width: 100%;
    font-size: 16px;
    position: relative;    
}

body {
    background-image: url(../img/Fondo.png);
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    background-position: center;
}

.login {
    background: rgba(255,255,255,0.9);
    border-radius: 10px;
}
.contenedor {
    background-color: white;
    border-radius: 10px;
    padding: 20px;
    width: 100%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Para navegadores WebKit (Chrome, Safari, Edge) */
::-webkit-scrollbar {
    width: 8px; /* Ancho de la barra delgada */
    height: 8px; /* Altura (para scroll horizontal) */
}

::-webkit-scrollbar-track {
    background: white; /* Fondo blanco */
}

::-webkit-scrollbar-thumb {
    background: #085c9f; /* Color azul (puedes cambiarlo) */
    border-radius: 4px; /* Bordes redondeados */
}

/* Para Firefox */
* {
    scrollbar-width: thin; /* Hace la barra delgada */
    scrollbar-color: #085c9f white; /* Azul / Blanco */
}

.informacion {
    max-width: 100%;
    overflow-y: auto;
    padding: 15px;
    box-sizing: border-box;
}

@media (max-width: 900px) {
    .informacion {
        max-height: 650px;
        white-space: normal;
    }
}

/*Botones inferiores*/
.botoninfe {
    float: right;
}


table {
    max-width: none;
    background-color: transparent;
    border-collapse: collapse;
    border-spacing: 0;
}

.table {
    width: auto;
    height: auto;
    margin-bottom: 20px;
}

    .table th, .table td {
        width: auto;
        height: auto;
        padding: 8px;
        line-height: 20px;
        text-align: left;
        vertical-align: top;
        border-top: 1px solid #dddddd;
    }

    .table th {
        width: auto;
        height: auto;
        font-weight: bold;
    }

    .table thead th {
        vertical-align: bottom;
    }

.abs-center {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
}

.form {
    width: 450px;
}

a:hover {
    color: rgb(0, 105, 217);
    cursor: pointer;
}

a.screen-reader-text:hover {
    color: #1717FF
}

.progress-bar {
    position: fixed;
    width: 100%;
    height: 10px;
}

.text-info {
    color: #085c9f !important;
}

/*Modales*/

.modal-dialog {
    top: 20rem;
}

@media (max-width: 768px) {
    .fondoplanillas {
        background: rgba(255,255,255,0.9);
    }

    body {
        background-image: url(../img/Fondopeq.png);
        background-size: cover;
        background-repeat: no-repeat;
        display: flex;
        justify-content: center;
        align-items: center;
        background-position:center;
    }
}