﻿

/* Pronabec Estilos por Defecto */

/*
    Variables globales 
*/
:root {
    /* Paleta oficial de colores */
    --main-default-color: #575756;
    --main-primary-color: #004A92;
    --main-secondary-color: #E71D73;
    --main-info-color: #0A8CB3;
    --main-danger-color: #E30613;
    --main-warning-color: #F59D24;
    --main-success-color: #318F3D;
    /* Paleta de colores claros*/
    --light-default-color: #969696;
    --light-primary-color: #1B81DD;
    --light-secondary-color: #F94199;
    --light-2-secondary-color: #feecf5;
    --light-info-color: #28AECE;
    --light-danger-color: #CE605F;
    --light-warning-color: #FFB26C;
    --light-success-color: #70B273;
    --light-2-success-color: #e2f5e3;
    /* Paleta de colores oscuros*/
    --dark-default-color: #565553;
    --dark-primary-color: #083E6B;
    --dark-secondary-color: #7f0d41;
    --dark-info-color: #076777;
    --dark-danger-color: #841834;
    --dark-warning-color: #a55b0a;
    --dark-success-color: #0a5628;
    /*Tamaños*/
    --size-default: 16px;
    --size-button: 14px;
}
/* Body */
body {
    padding-bottom: 20px;
    font-family: 'Open Sans', sans-serif !important;
    font-size: var( --size-default);
    color: var(--main-default-color);
}

h1, h2, h4 {
    font-family: 'Quicksand', sans-serif;
}

h3, h5 {
    font-family: 'Open Sans', sans-serif;
}
h1{
    font-weight:bolder;
    font-size:30px;
}
h2 {
    font-weight: bolder;
    font-size: 25px;
}
h3{
    font-weight:bold;
    font-style:italic;
    font-size:22px;
}
h4{
    font-weight:normal;
    font-size:22px;
}
h5{
    font-size:18px;
}
p{
    font-size:var(--size-default);
    color:var(--main-default-color);
}
/* Colores Inicio Oficial */

.pro-primary-color {
    color: var(--main-primary-color) !important;
}
.pro-info-color {
    color: var(--main-info-color);
}
.pro-danger-color {
    color: var(--main-danger-color);
}
.pro-warning-color {
    color: var(--main-warning-color);
}
.pro-secondary-color {
    color: var(--main-secondary-color);
}
.pro-success-color {
    color: var(--main-success-color);
}
.pro-default-color {
    color: var(--main-default-color);
}
/* Colores Inicio Claros */
.pro-primary-light-color {
    color: var(--light-primary-color);
}
.pro-info-light-color {
    color: var(--light-info-color);
}
.pro-danger-light-color {
    color: var(--light-danger-color);
}
.pro-warning-light-color {
    color: var(--light-warning-color);
}
.pro-secondary-light-color {
    color: var(--light-secondary-color);
}
.pro-success-light-color {
    color: var(--light-success-color);
}
.pro-default-light-color {
    color: var(--light-default-color);
}
/* Colores Inicio Oscuros */
.pro-primary-dark-color {
    color: var(--dark-primary-color);
}
.pro-info-dark-color {
    color: var(--dark-info-color);
}
.pro-danger-dark-color {
    color: var(--dark-danger-color);
}
.pro-warning-dark-color {
    color: var(--dark-warning-color);
}
.pro-secondary-dark-color {
    color: var(--dark-secondary-color);
}
.pro-success-dark-color {
    color: var(--dark-success-color);
}

/* Colores Fin*/

/* Fondos Inicio */

.bg-primary {
    background-color: #004A92!important;
}
.bg-info {
    background-color: #0A8CB3;
}
.bg-danger {
    background-color: #E30613;
}
.bg-warning {
    background-color: #F59D24;
}
.bg-secondary {
    background-color: #E71D73;
}
.bg-success {
    background-color: #318F3D;
}
.bg-default {
    background-color: #525454;
}

.bg-primary-light {
    background-color: #1b81dd !important;
}
.bg-info-light {
    background-color: #28AECE;
}
.bg-danger-light {
    background-color: #FF5A6A;
}
.bg-warning-light {
    background-color: #FFB26C;
}
.bg-secondary-light {
    background-color: #f94199;
}
.bg-secondary-light-2 {
    background-color: var(--light-2-secondary-color);
}
.bg-success-light {
    background-color: #70B273;
}
.bg-success-light-2 {
    background-color: var(--light-2-success-color);
}
.bg-default-light {
    background-color: #808080;
}

.bg-primary-dark {
    background-color: #083E6B !important;
}
.bg-info-dark {
    background-color: #076777;
}
.bg-danger-dark {
    background-color: #841834;
}
.bg-warning-dark {
    background-color: #a55b0a;
}
.bg-secondary-dark {
    background-color: #7f0d41;
}
.bg-success-dark {
    background-color: #0a5628;
}


/* Fondos Fin */

/* Botones Inicio */
button:disabled {
    cursor: not-allowed;
    pointer-events: all !important;
}
.btn-pro {
    border-radius: 4px;
    font-size: var(--size-button);
    border: none;
    color: white;
    border: 0;
    outline: none;
    height: 30px;
    /*max-width: 120px;*/
    /*width: 100%;*/
    width: auto;
    font-weight: normal;
    padding: .25rem .5rem;
    line-height: 1.5;
    transition: all 300ms;
}
.btn-link {
    font-size: 12px;
    color: #969696;
}
.btn-link:hover{
    text-decoration:none;
}

    .btn-pro i {
        margin-right: 5px;
    }

.btn:active {
    color: #FFFFFF;
    font-weight: bold;
    opacity: 0.7;
    filter: alpha(opacity = 70); /* for IE 8 and earlier */
}

.btn-primary {
    background: var(--main-primary-color);
}
    .btn-primary:hover {
        background: var(--main-primary-color);
        font-weight: bold;
    }
    .btn-primary:disabled {
        background: var(--light-primary-color);
    }
.btn-info {
    background: var(--main-info-color);
}
  

    .btn-info:disabled {
        background: var(--light-info-color);
    }

.btn-danger {
    background: var(--main-danger-color);
}
    .btn-danger:hover {
        background: var(--main-danger-color);
        font-weight: bold;
    }

    .btn-danger:disabled {
        background: var(--light-danger-color);
    }
.btn-warning {
    background: var(--main-warning-color);
}
    .btn-warning:hover {
        background: var(--main-warning-color);
        font-weight: bold;
        color: white !important;
    }

    .btn-warning:disabled {
        background: var(--light-warning-color);
    }

.btn-secondary {
    background: var(--main-secondary-color);
}
    .btn-secondary:hover {
        background: var(--main-secondary-color);
        font-weight: bold;
    }

    .btn-secondary:disabled {
        background: var(--light-secondary-color);
    }
.btn-success {
    background: var(--main-success-color);
}
    .btn-success:hover {
        background: var(--main-success-color);
        font-weight: bold;
    }

    .btn-success:disabled {
        background: var(--light-success-color);
    }
.btn-default {
    background: var(--main-default-color);
}
    .btn-default:hover {
        background: var(--main-default-color);
        font-weight: bold;
    }

    .btn-default:disabled {
        background: var(--light-default-color);
    }

.btn-primary-light {
    background: #1b81dd;
    border: 0px solid #1b81dd;
}
.btn-info-light {
    background: #28AECE !important;
    border: 0px solid #28AECE;
}
.btn-danger-light {
    background: #E30613;
    border: 0px solid #E30613;
}
.btn-warning-light {
    background: #FFB26C;
    border: 0px solid #FFB26C;
}
.btn-secondary-light {
    background: #f94199;
    border: 0px solid #f94199;
}
.btn-success-light {
    background: #70B273;
    border: 0px solid #70B273;
}
.btn-default-light {
    background: #808080;
    border: 0px solid #808080;
}



/* Botones Fin*/
/* Botones outline */
.btn-outline-default {
    color: var(--light-info-color);
    border: 1px solid var(--light-info-color);
}
    .btn-outline-default:hover {
        color: white;
        font-weight: bold;
        background-color: var(--light-default-color);
    }
.btn-outline-primary {
    color: var(--main-primary-color);
    border: 1px solid var(--main-primary-color);
}
    .btn-outline-primary:hover {
        color: white;
        font-weight: bold;
        background-color: var(--main-primary-color);
        border: 1px solid var(--main-primary-color);
    }
.btn-outline-secondary {
    color: var(--main-secondary-color);
    border: 1px solid var(--main-secondary-color);
}
    .btn-outline-secondary:hover {
        color: white;
        font-weight: bold;
        background-color: var(--main-secondary-color);
        border: 1px solid var(--main-secondary-color);
    }
.btn-outline-info {
    color: var(--main-info-color);
    border: 1px solid var(--main-info-color);
}
    .btn-outline-info:hover {
        color: white;
        font-weight: bold;
        background-color: var(--main-info-color);
        border: 1px solid var(--main-info-color);
    }
.btn-outline-warning {
    color: var(--main-warning-color);
    border: 1px solid var(--main-warning-color);
}
    .btn-outline-warning:hover {
        color: white;
        font-weight: bold;
        background-color: var(--main-warning-color);
        border: 1px solid var(--main-warning-color);
    }
.btn-outline-danger {
    color: var(--light-danger-color);
    border: 1px solid var(--light-danger-color);
}
    .btn-outline-danger:hover {
        color: white;
        font-weight: bold;
        background-color: var(--main-danger-color);
        border: 1px solid var(--main-danger-color);
    }
.btn-outline-success {
    color: var(--main-success-color);
    border: 1px solid var(--main-success-color);
}
    .btn-outline-success:hover {
        color: white;
        font-weight: bold;
        background-color: var(--main-success-color);
        border: 1px solid var(--main-success-color);
    }


/* Badges Inicio */
.badge-info {
    background: #0A8CB3;
}
.badge-warning {
    background: #F59C24;    
}
/* Badges Fin*/


/* Border Inicio */
.border-info {
    border-color: #0A8CB3;
}
.border-secondary {
    border-color: var(--main-secondary-color)!important;
}
.border-success {
    border-color: var(--main-success-color);
}
/* Border Fin*/


/* Popups Inicio */
.pro-popup .modal-content {
    border-radius: 20px;
}
.pro-popup .modal-header {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.pro-popup .modal-header {
    font-family: Panton-ExtraBold;
}


.pro-popup-header-icon {
    height: 100px;
    width: 100px;
    margin-top: -67px;
}

/* Tabla gg*/

.pro-table {
    border-collapse: collapse;
    border-spacing: 0;
    font-size:14px;
}

.pro-table-rounded thead th {
    background-color: #fff;
    border: none;
}

    .pro-table-rounded thead th:first-child {
        border-radius: 5px 0 0 5px;
    }

    .pro-table-rounded thead th:last-child {
        border-radius: 0 5px 5px 0;
    }

.pro-table-rounded tbody td {
    border: 0;
    border-bottom: 1px solid #dfdfdf;
}

.table {
    border-collapse: initial;
}

    .table .thead-border tr th {
        font-family: 'Open sans', sans-serif;
        font-weight: 400;
        color: #F59D24;
        font-size: 16px;
        border-bottom: 1px solid #F59D24;
        border-top: 1px solid #F59D24;
    }

        .table .thead-border tr th:first-child, .table .thead-border tr th:last-child {
            border: 1px solid #F59D24;
        }

        .table .thead-border tr th:first-child {
            border-right: 0;
        }

        .table .thead-border tr th:last-child {
            border-left: 0;
        }

    .table > tbody > tr > td {
        vertical-align: middle;
    }

        .loading-bg{
            background:red;
        }
.modal-backdrop.show {
    opacity: 1;
    background-color: rgba(87,87,86,0.5);
}

.scrollTop {
    opacity: 0;
    z-index: 1050;
}

.contenedor_scroll_up {
    position: relative;
    -webkit-transition: all .5s;
    transition: all .5s;
}

    .contenedor_scroll_up a {
        position: fixed;
        z-index: 100;
        right: 20px;
        bottom: 20px;
        background: var(--main-primary-color);
        color: #fff;
        padding: 10px 15px;
        border-radius: 5px;
        -webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.1);
        box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.1);
    }

.modal-pro {
    padding-right: 0 !important;
}

    .modal-pro .modal-content .modal-header {
        padding: 50px 20px 10px 20px;
        margin: 0 20px;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        .modal-pro .modal-content .modal-header h5 {
            color: #0a8cb3;
            font-size: 30px;
            font-weight:bold;
            text-align:center;
            font-family: "Quicksand", sans-serif !important;
        }

    .modal-pro .modal-content .modal-body {
        text-align: left;       
        font-family: 'Open sans', sans-serif;
    }

    .modal-pro .modal-content .modal-footer {
        padding: 0 20px 50px 20px;
        border-top: 0;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

@media (max-width: 480px) {
    .modal-pro .modal-content .modal-footer {
        padding: 0 0 30px 0;
    }
}

.modal-pro .modal-content .modal-footer h4 {
    font-family: 'Open sans', sans-serif;
    font-weight: bold;
    width: 100%;
    font-size: 16px;
    color: #575756;
    text-align: center;
    margin: 0 0 30px 0;
}

.modal-pro .modal-content .modal-footer .buttons {
    width: 100%;
    text-align: center;
}

    .modal-pro .modal-content .modal-footer .buttons .btn-primary {
        /*background: #E71D73;*/
    }

    .modal-pro .modal-content .modal-footer .buttons .btn-secondary {
        /*background: #318F3D;*/
        margin-left: 20px;
    }
    .modal-pro .modal-content .modal-footer .buttons .btn-default-light {
        /*background: #318F3D;*/
        margin-left: 20px;
    }
 /*.btn:hover {
    opacity: 0.8;
    transform: scale(1.2,1.2);
    -webkit-transform: scale(1.2,1.2);
    -moz-transform: scale(1.2,1.2);
}*/
.buttons a{
    color : white !important;
    max-width:200px;
}