html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

.footerM {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 20px;
    background: #FAFAFA;
    border-top: solid 1px #FAFAFA;
    color: black;
    font-size: 12px;
}

.footer p {
    margin-top: 0px;
}

.navbar-custom {
    margin-top: 0px;
    background-color: #CD071E;
    color: white;
    height: 50px;
    font-size: 12px;
}

#tablaDatos tbody tr.selected {
    color: white;
    background-color: #626262;
}

body {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
}

div.dataTables_wrapper {
    margin: 0 auto;
    width: 98%;
}

.pagination > li > a, .pagination > li > span {
    background-color: white;
    color: #626262;
    height: 30px;
    font-size: 12px;
}

.dataTables_info {
    color: #626262;
    font-size: 12px;
}

div.container {
    width: 80%;
}

.dt-buttons button.dt-button.buttons-excel {
    border: solid #CD071E 1px;
    text-align: left;
    color: #CD071E;
    background-color: rgba(205, 7, 30, 0.05);
    font-size: 12px;
    width: 80px;
    height: 25px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    display: flex;
}

.dt-buttons button.dt-button.buttons-copy {
    visibility: hidden;
    height: 2px;
}

.dt-buttons button.dt-button.buttons-csv {
    visibility: hidden;
    height: 2px;
}

.dt-buttons button.dt-button.buttons-pdf {
    visibility: hidden;
    height: 2px;
}

.dt-search {
    border: solid #CD071E 1px;
    background-color: rgba(205, 7, 30, 0.05);
}

    .dt-search input.dt-input {
        height: 25px;
        font-size: 12px;
        border: solid #CD071E 1px;
        background-color: rgba(205, 7, 30, 0.05);
    }

    .dt-search label {
        font-size: 12px;
    }

.dt-paging {
    font-size: 12px;
    justify-content: center;
    align-items: center;
    display: flex;
    height: 35px;
}

    .dt-paging .dt-paging-button.current {
        font-size: 12px;
        border: solid #CD071E 1px;
        background-color: rgba(205, 7, 30, 0.05);
        justify-content: center;
        align-items: center;
        display: flex;
        height: 35px;
    }

.botton-opcion {
    font-size: 12px;
    color: #CD071E;
    border: solid #CD071E 1px;
    background-color: rgba(205, 7, 30, 0.05);
    width: 150px;
    height: 25px;
}


.wrapper {
    color: black;
    display: flex;
    height: 60px;
    width: auto;
    padding: 0px;
}
.gradiente1 {
    background: rgba(245,245,245,1);
    background: -moz-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(245,245,245,1)), color-stop(50%, rgba(245,245,245,1)), color-stop(75%, rgba(236,236,236,1)), color-stop(100%, rgba(227,227,227,1)));
    background: -webkit-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -o-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -ms-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: linear-gradient(to right, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e3e3e3', GradientType=1 );
    position: relative;
    width: 100%;
}
    .gradiente1::before {
        position: absolute;
        font-family: 'Font Awesome 5 Free' !important;
        font-style: normal;
        font-weight: 900;
        top: -5px;
        color: red;
        right: 10px;
        content: "\f48b";
        font-size: 35px;
    }
.gradiente2 {
    background: rgba(245,245,245,1);
    background: -moz-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(245,245,245,1)), color-stop(50%, rgba(245,245,245,1)), color-stop(75%, rgba(236,236,236,1)), color-stop(100%, rgba(227,227,227,1)));
    background: -webkit-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -o-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -ms-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: linear-gradient(to right, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e3e3e3', GradientType=1 );
    position: relative;
    width: 100%;
}

    .gradiente2::before {
        position: absolute;
        font-family: 'Font Awesome 5 Free' !important;
        font-style: normal;
        font-weight: 900;
        top: -5px;
        color: black;
        right: 10px;
        content: "\f0c0";
        font-size: 35px;
    }
.gradiente3 {
    background: rgba(245,245,245,1);
    background: -moz-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(245,245,245,1)), color-stop(50%, rgba(245,245,245,1)), color-stop(75%, rgba(236,236,236,1)), color-stop(100%, rgba(227,227,227,1)));
    background: -webkit-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -o-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -ms-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: linear-gradient(to right, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e3e3e3', GradientType=1 );
    position: relative;
    width: 100%;
}

    .gradiente3::before {
        position: absolute;
        font-family: 'Font Awesome 5 Free' !important;
        font-style: normal;
        font-weight: 900;
        top: -5px;
        color: lightgray;
        right: 10px;
        content: "\f254";
        font-size: 35px;
    }
.gradiente4 {
    background: rgba(245,245,245,1);
    background: -moz-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(245,245,245,1)), color-stop(50%, rgba(245,245,245,1)), color-stop(75%, rgba(236,236,236,1)), color-stop(100%, rgba(227,227,227,1)));
    background: -webkit-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -o-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -ms-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: linear-gradient(to right, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e3e3e3', GradientType=1 );
    position: relative;
    width: 100%;
}

    .gradiente4::before {
        position: absolute;
        font-family: 'Font Awesome 5 Free' !important;
        font-style: normal;
        font-weight: 900;
        top: -5px;
        color: lightblue;
        right: 10px;
        content: "\f4d7";
        font-size: 35px;
    }
.gradiente5 {
    background: rgba(245,245,245,1);
    background: -moz-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(245,245,245,1)), color-stop(50%, rgba(245,245,245,1)), color-stop(75%, rgba(236,236,236,1)), color-stop(100%, rgba(227,227,227,1)));
    background: -webkit-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -o-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -ms-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: linear-gradient(to right, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e3e3e3', GradientType=1 );
    position: relative;
    width: 100%;
}

    .gradiente5::before {
        position: absolute;
        font-family: 'Font Awesome 5 Free' !important;
        font-style: normal;
        font-weight: 900;
        top: -5px;
        color: white;
        right: 10px;
        content: "\f164";
        font-size: 35px;
    }
.gradiente6 {
    background: rgba(245,245,245,1);
    background: -moz-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(245,245,245,1)), color-stop(50%, rgba(245,245,245,1)), color-stop(75%, rgba(236,236,236,1)), color-stop(100%, rgba(227,227,227,1)));
    background: -webkit-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -o-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: -ms-linear-gradient(left, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    background: linear-gradient(to right, rgba(245,245,245,1) 0%, rgba(245,245,245,1) 50%, rgba(236,236,236,1) 75%, rgba(227,227,227,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e3e3e3', GradientType=1 );
    position: relative;
    width: 100%;
}

    .gradiente6::before {
        position: absolute;
        font-family: 'Font Awesome 5 Free' !important;
        font-style: normal;
        font-weight: 900;
        top: -5px;
        color: white;
        right: 10px;
        content: "\f164";
        font-size: 35px;
    }

.collapse {
    &:not(.show)

{
    display: none;
}

}

.collapsing {
    height: 0;
    overflow: hidden;
    @include transition($transition-collapse);
    &.collapse-horizontal

{
    width: 0;
    height: auto;
    @include transition($transition-collapse-width);
}
}