﻿body {
}


.bg-primary {
    background: #12c2e9; /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.hse-login-logo {
    width: 50%;
}

.authentication-bg {
    background-image: url('../images/login-bg2.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%;
    min-height: 100% !important;
    /*overflow: hidden;*/
}

#particles-js {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #b61924;
    background-image: url("");
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}

.hse-login-card {
    border-radius: 30px !important;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
    background-color: rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(3px);
    margin: 30px;
}

    .hse-login-card .card-header {
        border-radius: 30px 30px 0px 0px;
    }

.form-control, .form-select, .input-group-text, .dataTables_filter input {
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s ease-in-out !important;
}

    .form-control:hover, .form-control:focus, .form-select:hover, .form-select:focus, .input-group-text:hover, .input-group-text:focus, .dataTables_filter input:hover, .dataTables_filter input:focus {
        box-shadow: 0 3px 7px 3px rgba(0, 0, 0, 0.15) !important;
        transition: all 0.3s ease-in-out !important;
    }

    .dataTables_filter input:hover, .dataTables_filter input:focus {
        outline: none;
    }

.btn {
    border-radius: 5px;
    border: none !important;
    transition: all 0.3s ease-in-out !important;
}

.btn-primary,
.paginate_button.current {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9) !important;
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9) !important;
    border-radius: 5px !important;
    border: none !important;
    transition: all 0.3s ease-in-out !important;
}

    .btn:hover, .btn:focus,
    .btn.dropdown-toggle:hover,
    .btn.dropdown-toggle:focus,
    .paginate_button.current:hover,
    .paginate_button.current:focus {
        box-shadow: 0 3px 7px 3px rgba(0, 0, 0, 0.15) !important;
        font-weight: bold;
        transition: all 0.3s ease-in-out !important;
    }

.input-group-text {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    color: #fff;
}

.leftside-menu {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
}

.side-nav .side-nav-link {
    color: rgba(255, 255, 255, 0.7) !important;
}

.side-nav-item.menuitem-active .side-nav-link {
    margin-bottom: 5px;
    color: rgba(255, 255, 255, 1) !important;
}

.side-nav .side-nav-link:active, .side-nav .side-nav-link:focus, .side-nav .side-nav-link:hover {
    color: rgba(255, 255, 255, 1) !important;
    text-decoration: none;
    font-weight: bold;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.7);
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}

.side-nav-forth-level .side-nav-item .side-nav-link, .side-nav-forth-level .side-nav-item a, .side-nav-forth-level li .side-nav-link, .side-nav-forth-level li a, .side-nav-second-level .side-nav-item .side-nav-link, .side-nav-second-level .side-nav-item a, .side-nav-second-level li .side-nav-link, .side-nav-second-level li a, .side-nav-third-level .side-nav-item .side-nav-link, .side-nav-third-level .side-nav-item a, .side-nav-third-level li .side-nav-link, .side-nav-third-level li a {
    color: rgba(255, 255, 255, 0.7);
}

    .side-nav-forth-level .side-nav-item .side-nav-link:active, .side-nav-forth-level .side-nav-item .side-nav-link:focus, .side-nav-forth-level .side-nav-item .side-nav-link:hover, .side-nav-forth-level .side-nav-item a:active, .side-nav-forth-level .side-nav-item a:focus, .side-nav-forth-level .side-nav-item a:hover, .side-nav-forth-level li .side-nav-link:active, .side-nav-forth-level li .side-nav-link:focus, .side-nav-forth-level li .side-nav-link:hover, .side-nav-forth-level li a:active, .side-nav-forth-level li a:focus, .side-nav-forth-level li a:hover, .side-nav-second-level .side-nav-item .side-nav-link:active, .side-nav-second-level .side-nav-item .side-nav-link:focus, .side-nav-second-level .side-nav-item .side-nav-link:hover, .side-nav-second-level .side-nav-item a:active, .side-nav-second-level .side-nav-item a:focus, .side-nav-second-level .side-nav-item a:hover, .side-nav-second-level li .side-nav-link:active, .side-nav-second-level li .side-nav-link:focus, .side-nav-second-level li .side-nav-link:hover, .side-nav-second-level li a:active, .side-nav-second-level li a:focus, .side-nav-second-level li a:hover, .side-nav-third-level .side-nav-item .side-nav-link:active, .side-nav-third-level .side-nav-item .side-nav-link:focus, .side-nav-third-level .side-nav-item .side-nav-link:hover, .side-nav-third-level .side-nav-item a:active, .side-nav-third-level .side-nav-item a:focus, .side-nav-third-level .side-nav-item a:hover, .side-nav-third-level li .side-nav-link:active, .side-nav-third-level li .side-nav-link:focus, .side-nav-third-level li .side-nav-link:hover, .side-nav-third-level li a:active, .side-nav-third-level li a:focus, .side-nav-third-level li a:hover {
        color: rgba(255, 255, 255, 1);
        font-weight: bold;
    }

.logo-lg img {
    width: 50%;
    height: auto;
}

.leftside-menu .logo {
    background: none !important;
}

.navbar-custom .topbar {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
}

.button-toggle-menu {
    color: rgba(255, 255, 255, 0.7);
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}

    .button-toggle-menu:hover {
        color: rgba(255, 255, 255, 1);
        font-weight: bold;
        -webkit-transition: all .25s ease-in-out;
        transition: all .25s ease-in-out;
    }

.navbar-custom .topbar-menu .nav-link {
    color: rgba(255, 255, 255, 0.7);
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}

    .navbar-custom .topbar-menu .nav-link:hover {
        color: rgba(255, 255, 255, 1);
        font-weight: bold;
        -webkit-transition: all .25s ease-in-out;
        transition: all .25s ease-in-out;
    }

.nav-user {
    border-color: rgba(255, 255, 255, 0.7);
    background-color: rgba(255, 255, 255, 0.5);
}

.profile-dropdown {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    color: rgba(255, 255, 255, 0.7);
    border-radius: 10px;
}

.dropdown-item {
    color: rgba(255, 255, 255, 0.7);
}

.card {
    border-radius: 10px;
}

.card-header {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    color: rgba(255, 255, 255, 0.7);
}

select {
    word-wrap: normal;
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    border-radius: 15px !important;
    padding: 5px 10px !important;
    /*color: #fff;*/
}

thead {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    color: rgba(255, 255, 255, 0.7) !important;
}

th {
    background: none !important;
    color: rgba(255, 255, 255, 0.7) !important;
}

.table-scroll thead tr {
    background: none !important;
}


table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > td.sorting_asc:before, table.dataTable thead > tr > td.sorting_desc:after {
    opacity: .7;
    color: #fff;
}

.page-title {
    color: #f64f59;
}

.footer {
    color: #f64f59;
}

    .footer .footer-links a {
        color: #f64f59;
    }

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    opacity: 0.7;
    color: #f64f59 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #f64f59 !important;
}

.dropdown-menu {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9);
    color: rgba(255, 255, 255, 0.7) !important;
}

.card-header {
    padding: 10px;
}

.side-nav-second-level {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9) !important;
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}

    .side-nav-second-level .menuitem-active {
        background: rgba(255, 255, 255, 0.3);
        border-radius: 30px 0px 0px 30px;
        color: rgba(255, 255, 255, 1) !important;
        font-weight: bold;
    }

.hse-register {
    position: relative;
}

.hse-login-card .card-body {
    padding: 15px 1.5rem !important;
}

.hse-register a {
    text-decoration: underline;
}

.modal-header {
    background: -webkit-linear-gradient(to right, #f64f59, #c471ed, #12c2e9) !important;
    background: linear-gradient(to right, #f64f59, #c471ed, #12c2e9) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}