:root {

    

        
            --primary               : #d52d1c;
            --primary-text-hover    : #dd0c0c;
            --primary-bg-hover      : #e10f0f17;
            --primary-gradient      : #d71a1a52;
            --primary-strong        : #cf3939;
        

        
        
        
        
        

    

    --blue                  : #00CFE8;
    --indigo                : #6610F2;
    --purple                : #7367F0;
    --pink                  : #E83E8C;
    --red                   : #EA5455;
    --orange                : #FF9F43;
    --yellow                : #FFC107;
    --green                 : #28C76F;
    --teal                  : #20C997;
    --cyan                  : #17A2B8;
    --white                 : #FFFFFF;
    --gray                  : #B8C2CC;
    --gray-dark             : #1E1E1E;
    --secondary             : #82868B;
    --success               : #28C76F;
    --info                  : #00CFE8;
    --warning               : #FF9F43;
    --danger                : #EA5455;
    --light                 : #F6F6F6;
    --dark                  : #4B4B4B;
    --breakpoint-xs         : 0;
    --breakpoint-sm         : 576px;
    --breakpoint-md         : 768px;
    --breakpoint-lg         : 992px;
    --breakpoint-xl         : 1200px;
    --font-family-sans-serif: 'Montserrat', Helvetica, Arial, serif;
    --font-family-monospace : 'Montserrat', Helvetica, Arial, serif;
}

.d-none{
    display: none;
}
html .pace .pace-progress {
    background: var(--primary);
}
a {
    color: var(--primary);
    text-decoration: none;
    background-color: transparent;
}
a:hover {
    color: var(--primary-text-hover);
    text-decoration: none;
}
.dark-layout a:hover {
    color: var(--primary-text-hover);
    text-decoration: none;
}
.text-primary {
    color: var(--primary)!important;
}
.text-primary:hover {
    color: var(--primary-text-hover)!important;
}
.main-menu .navbar-header .navbar-brand .brand-text {
    font-size: 1.1rem!important;
}
a.text-primary:hover, a.text-primary:focus {
    color: var(--primary-text-hover)!important;
}
.form-control:disabled, .form-control[readonly] {
    background-color: #EFEFEF!important;
    border-color: #b9b9c3!important;
    opacity: 1;
}
.header-navbar .navbar-container ul.navbar-nav li i.ficon:hover, .header-navbar .navbar-container ul.navbar-nav li svg.ficon:hover {
    color: var(--primary);
}
.dropdown-item:hover, .dropdown-item:focus {
    color: var(--primary-text-hover);
    text-decoration: none;
    background-color: var(--primary-bg-hover);
}
.main-menu.menu-light .navigation>li.active>a {
    background   : -webkit-linear-gradient(332deg, var(--primary), var(--primary-gradient));
    background   : linear-gradient(118deg, var(--primary), var(--primary-gradient));
    box-shadow   : 0 0 10px 1px var(--primary-gradient);
    color        : #FFFFFF;
    font-weight  : 400;
    border-radius: 4px;
}
.main-menu.menu-light .navigation>li .active>a {
    color        : var(--primary);
    margin-bottom: 0;
}
.main-menu.menu-light .navigation>li ul .active {
    color: #FFFFFF!important;
    background   : -webkit-linear-gradient(332deg, var(--primary), var(--primary-gradient));
    background   : linear-gradient(118deg, var(--primary), var(--primary-gradient));
    box-shadow   : 0 0 10px 1px var(--primary-gradient);
    border-radius: 4px;
    z-index      : 1;
}
.main-menu.menu-dark .navigation>li.active>a {
    background   : -webkit-linear-gradient(332deg, var(--primary), var(--primary-gradient));
    background   : linear-gradient(118deg, var(--primary), var(--primary-gradient));
    box-shadow   : 0 0 10px 1px var(--primary-gradient);
    color        : #FFFFFF;
    font-weight  : 400;
    border-radius: 4px;
}
.main-menu.menu-dark .navigation>li .active>a {
    color        : var(--primary);
    margin-bottom: 0;
}
.main-menu.menu-dark .navigation>li ul .active {
    background   : -webkit-linear-gradient(332deg, var(--primary), var(--primary-gradient));
    background   : linear-gradient(118deg, var(--primary), var(--primary-gradient));
    box-shadow   : 0 0 10px 1px var(--primary-gradient);
    border-radius: 4px;
    z-index      : 1;
}
.main-menu .navbar-header .navbar-brand .brand-text {
    color            : var(--primary);
    padding-left     : 1rem;
    margin-bottom    : 0;
    font-weight      : 600;
    letter-spacing   : 0.01rem;
    font-size        : 1.45rem;
    -webkit-animation: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s normal forwards 1 fadein;
    animation        : 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s normal forwards 1 fadein;
}
.navbar-container .bookmark-input input:focus {
    border: 1px solid var(--primary);
}
.customizer .customizer-toggle {
    background               : var(--primary);
    color                    : #FFFFFF !important;
    display                  : block;
    box-shadow               : -3px 0 8px rgba(34, 41, 47, 0.1);
    border-top-left-radius   : 6px;
    border-bottom-left-radius: 6px;
    position                 : absolute;
    top                      : 50%;
    width                    : 38px;
    height                   : 38px;
    left                     : -39px;
    text-align               : center;
    line-height              : 40px;
    cursor                   : pointer;
}
.customizer .color-box.selected:after {
    content      : '';
    border       : 1px solid var(--primary);
    height       : 30px;
    width        : 30px;
    top          : -3px;
    left         : -3px;
    position     : absolute;
    border-radius: 0.5rem;
}
.timeline .timeline-item .timeline-point {
    position               : absolute;
    left                   : -0.85rem;
    top                    : 0;
    z-index                : 2;
    display                : -webkit-box;
    display                : -webkit-flex;
    display                : -ms-flexbox;
    display                : flex;
    -webkit-box-pack       : center;
    -webkit-justify-content: center;
    -ms-flex-pack          : center;
    justify-content        : center;
    -webkit-box-align      : center;
    -webkit-align-items    : center;
    -ms-flex-align         : center;
    align-items            : center;
    height                 : 1.75rem;
    width                  : 1.75rem;
    text-align             : center;
    border-radius          : 50%;
    border                 : 1px solid var(--primary);
    background-color       : #FFFFFF;
}
.timeline .timeline-item .timeline-point.timeline-point-indicator {
    left            : -0.412rem;
    top             : 0.07rem;
    height          : 12px;
    width           : 12px;
    border          : 0;
    background-color: var(--primary);
}
.timeline .timeline-item .timeline-point i,
.timeline .timeline-item .timeline-point svg {
    color         : var(--primary);
    font-size     : 0.85rem;
    vertical-align: baseline;
}
.select2-container--classic .select2-selection--single:focus,
.select2-container--default .select2-selection--single:focus {
    outline     : 0;
    border-color: var(--primary) !important;
    box-shadow  : 0 3px 10px 0 rgba(34, 41, 47, 0.1) !important;
}
.select2-container--classic.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: var(--primary) !important;
    outline     : 0;
}
.select2-container--classic .select2-selection--multiple:focus,
.select2-container--default .select2-selection--multiple:focus {
    outline     : 0;
    border-color: var(--primary) !important;
    box-shadow  : 0 3px 10px 0 rgba(34, 41, 47, 0.1) !important;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice,
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--primary) !important;
    border-color    : var(--primary) !important;
    color           : #FFFFFF;
    padding         : 2px 5px;
}
.select2-container--classic .select2-results__option[aria-selected='true'],
.select2-container--default .select2-results__option[aria-selected='true'] {
    background-color: var(--primary) !important;
    color           : white !important;
}
.select2-container--classic .select2-results__option--highlighted,
.select2-container--default .select2-results__option--highlighted {
    background-color: rgba(115, 103, 240, 0.12) !important;
    color           : var(--primary) !important;
}
.dark-layout .select2-container .select2-selection--multiple .select2-selection__choice {
    background: rgba(115, 103, 240, 0.12) !important;
    color     : var(--primary) !important;
    border    : none;
}
.dark-layout .select2-container .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove {
    color: var(--primary) !important;
}
.form-control:focus {
    color: #6E6B7B;
    background-color: #FFFFFF;
    border-color: var(--primary);
    outline: 0;
    box-shadow: 0 3px 10px 0 rgb(34 41 47 / 10%);
}
.input-group:not(.bootstrap-touchspin):focus-within .form-control, .input-group:not(.bootstrap-touchspin):focus-within .input-group-text {
    border-color: var(--primary);
    box-shadow: none;
}
.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem var(--primary-text-hover);
}
.btn-primary:hover(.disabled){
    box-shadow: 0 8px 25px -8px var(--primary);
}
.btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
    color: #FFFFFF;
    background-color: var(--prymary-strong);
    border-color: var(--prymary-strong);
}
.btn-primary:hover:not(.disabled):not(:disabled) {
    box-shadow: 0 8px 25px -8px var(--primary);
    background-color: var(--primary)!important;
}
.btn-primary:focus, .btn-primary:active, .btn-primary.active {
    color: #FFFFFF;
    background-color:var(--primary-gradient) !important;
}
.btn-primary:focus, .btn-primary.focus {
    color: #FFFFFF;
    background-color: var(--primary)!important;
    border-color: var(--primary)!important;
    box-shadow: 0 0 0 0.2rem var(--primary-bg-hover)!important;
}
.btn-primary {
    border-color: var(--primary) !important;
    background-color: var(--primary) !important;
    color: #FFFFFF !important;
}
.btn-primary:hover {
    color: #FFFFFF;
    background-color: var(--primary-bg-hover)!important;
    border-color: var(--primary-bg-hover)!important;
}
.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
    background-color: var(--primary);
    border-color: var(--primary);
}
.custom-control-input:checked ~ .custom-control-label::before {
    color: #FFFFFF;
    background-color: var(--primary)!important;
    border-color: var(--primary)!important;
}
.btn-outline-primary {
    border: 1px solid var(--primary) !important;
    background-color: transparent;
    color: var(--primary);
}
.waves-effect {
    cursor: inherit;
}
.btn {
    box-shadow: none;
    font-weight: 500;
}
.btn-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
}
.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):focus {
    background-color: var(--primary-bg-hover);
    color: var(--primary);
}
.btn-outline-primary:hover:not(.disabled):not(:disabled) {
    background-color: var(--primary-bg-hover);
    color: var(--primary-text-hover);
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
    color: var(--primary);
    background-color: transparent;
}
.btn-flat-primary:hover:not(.disabled):not(:disabled) {
    background-color: var(--primary-gradient);
    color: white;
}
.btn-flat-primary:active, .btn-flat-primary.active, .btn-flat-primary:focus {
    background-color:var(--primary-bg-hover);
    color: white!important;
}
.btn-outline-primary.waves-effect .waves-ripple, .btn-flat-primary.waves-effect .waves-ripple {
    background : -webkit-radial-gradient(var(--primary-gradient) 0, var(--primary-gradient) 40%, var(--primary) 50%, var(--primary-strong) 60%, rgba(255, 255, 255, 0) 70%);
    background :         radial-gradient(var(--primary-gradient) 0, var(--primary-gradient) 40%, var(--primary) 50%, var(--primary-strong) 60%, rgba(255, 255, 255, 0) 70%);
}
.dark-layout .dataTables_wrapper .dt-buttons [class*='buttons-']:active {
    background-color: var( --primary-bg-hover ) !important;
}
.dropdown-toggle::after {
    color: var(--primary)!important;
}
.page-item.active .page-link {
    z-index: 3;
    border-radius: 5rem;
    background-color: var(--primary);
    color: #FFFFFF !important;
    font-weight: 600;
}
.dark-layout .pagination:not([class*='pagination-']) .page-item.active .page-link {
    background-color: var(--primary);
}
.nav-pills .nav-link.active {
    border-color: var(--primary);
    box-shadow: 0 4px 18px -4px var(--primary-gradient);
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #FFFFFF;
    background-color: var(--primary);
}
.page-item .page-link:hover {
    color: var(--primary);
}
.page-link:hover {
    z-index : 2;
    color : var(--primary);
    text-decoration : none;
    background-color : #F3F2F7;
    border-color : #DAE1E7;
}
.page-link::before {
    color : var(--primary)!important;
}
.list-style-none{
    list-style-type: none;
}


#loading{
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;
    height: 100%!important;
    text-align: center;
    background: #ffffff;
    z-index: 3;
    color: var(--primary);
}
#loading .spinner-border {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    vertical-align: text-bottom;
    border: 0.25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border 0.75s linear infinite;
    animation: spinner-border 0.75s linear infinite;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}
body.dark-layout #loading {
    background: #283046;
}


#overlay{
    position: absolute;
    width: 100%;
    height: 100%!important;
    text-align: center;
    background: #0000001c;
    z-index: 3;
    color: var(--primary);
    top: 0;
}
#overlay .spinner-border {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    vertical-align: text-bottom;
    border: 0.25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border 0.75s linear infinite;
    animation: spinner-border 0.75s linear infinite;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.dark-layout .dropdown-menu .dropdown-item:hover, .dark-layout .dropdown-menu .dropdown-item:focus {
    background: var(--primary-bg-hover);
    color: var(--primary);
}

.dark-layout .nav-pills .nav-item .nav-link.active {
    color: #FFFFFF;
    background-color: var(--primary);
}
#cke_id_description{
    width: auto!important;
}
.dropzone .dz-message {
    color: var(--primary)!important;
}
.dropzone .dz-message:before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f382";
    background-image : none!important;
}
.dropzone {
    border: 2px dashed var(--primary)!important;
}
input[type='radio'], input[type='checkbox'] {
    width: 18px;
}

.btn-outline-primary.dropdown-toggle::after {
    font-family: "Font Awesome 5 Pro";
    content: "\f078";
    background-image: none;
}
.dropdown-toggle:hover:after{
    color: var(--primary-text-hove)!important;
}
.header-navbar .navbar-container ul.navbar-nav li.dropdown-user .dropdown-menu {
    width: 14rem!important;
}
.dark-layout .dataTables_wrapper .dt-buttons .buttons-copy, .dark-layout .dataTables_wrapper .dt-buttons .buttons-excel, .dark-layout .dataTables_wrapper .dt-buttons .buttons-pdf, .dark-layout .dataTables_wrapper .dt-buttons .buttons-print, .dark-layout .dataTables_wrapper .dt-buttons .btn-secondary, .dark-layout .dataTables_wrapper .dt-buttons [class*='buttons-'] {
    background-color: #161D31 !important;
}
div.dt-button-collection .dt-button {
    border-radius: 0;
}
div.dt-button-collection>:last-child>* {
    -webkit-column-break-inside: avoid;
    break-inside: avoid;
}

.lockscreen{
    position: absolute!important;
    z-index: 99!important;
    width: 100%;
    margin-left: 0px!important;
    z-index: 9999!important;
    background: #ffffff;
}
body.dark-layout .lockscreen {
    background: #161D31!important;
}
html .content.app-content.lockscreen {
    padding: 0px;
}
.lockscreen img.avatar{
    margin-top: -55px;
    margin-bottom: 0px;
}

.custom-file-input:focus ~ .custom-file-label {
    border-color: var(--primary)!important;
}
.django-ckeditor-widget{
    display: flex!important;
    width: 100%;
}
.cke_browser_webkit{
    width: 100%!important;
}

.card-congratulations {
    background: -webkit-linear-gradient(332deg, var(--primary), var(--primary-gradient));
    background: linear-gradient(118deg , var(--primary), var(--primary-gradient));
    color: #FFFFFF;
}

.bg-primary {
    background-color: var(--primary) !important;
}

.modal-slide-in .modal-dialog.sidebar-full {
    width: 100%!important;
}

.x-large{
    font-size: x-large
}

.vw-10{
    width: 10vw;
}

.errorlist{
    color: #EA5455;
}

.select2-primary .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background : var(--primary) !important;
    border-color : var(--primary) !important;
}

@media (max-width: 576px) {
    .modal-slide-in .modal-dialog.sidebar-xl {
        width : 100%!important;
    }
}

@media (min-width: 576px) {
    .modal-slide-in .modal-dialog.sidebar-lg {
        width : 30rem;
    }
    .modal-slide-in .modal-dialog.sidebar-xl {
        width : 50rem;
    }
}





    
        .main-menu.menu-light .navigation>li.active>a {
            background: -webkit-linear-gradient(118deg, var(--primary), var(--primary-text-hover));
            background: linear-gradient(118deg, var(--primary), var(--primary-text-hover));
            box-shadow: 0 0 10px 1px var(--primary-gradient);
        }
        .card-congratulations {
            background: -webkit-linear-gradient(118deg, var(--primary), var(--primary-text-hover));
            background: linear-gradient(118deg, var(--primary), var(--primary-text-hover));
        }