﻿:root {
    --color-main: #ee2524;
    --color-secondary: #a61a19;
}

#showcase {
    -webkit-box-shadow: 0px -15px 14px 0 rgba(0, 0, 0, 0.25), 2px -13px 5px 0 rgba(0, 0, 0, 0.22);
    box-shadow: 0px -15px 14px 0 rgba(0, 0, 0, 0.25), 2px -13px 5px 0 rgba(0, 0, 0, 0.22);
}


.form-control {
    font-family: SCG-Reg !important;
}
#screenshots {
    background: #27212b;
    color: #fff;
}

#statistics {
    display: none;
}

#contactInfo {
    background: #fff;
}

.form-control.year-picker {
    height: inherit !important;
}

    .form-control[readonly], .form-control {
    border-color: #c2cad8;
    color: #575962;
}

.list-employee {
    cursor: pointer;
}

    .list-employee:hover {
        background: #f2f3f8;
    }


.evnt-box-shadow {
    -webkit-box-shadow: 0px 1px 15px 1px rgba(69, 65, 78, 0.08);
    -moz-box-shadow: 0px 1px 15px 1px rgba(69, 65, 78, 0.08);
    box-shadow: 0px 1px 15px 1px rgba(69, 65, 78, 0.08);
    background-color: #ffffff;
}

.custom-text-style {
    color: var(--color-main);
    background-image: var(--color-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.center-vertical-custom {
    margin: auto 0;
}

#image-modal .modal-dialog .modal-content .close {
    right: 4px;
    top: -3px;
}

.width-50 {
    max-width: 100%;
}

.display-1 {
    margin-top: -50px;
}

.input-group .select2-container--bootstrap {
    width: 81% !important;
}

#s_comp_name_container.input-group .select2-container--bootstrap {
    width: 100% !important;
}

#m_add_noti .m-portlet .m-portlet__head {
    height: 3.5rem;
}

#m_add_noti .m-portlet .m-portlet__body {
    padding: 1.2rem 1.2rem;
}


.load-more {
    height: 250px;
    overflow: auto;
    border: 1px dashed #d0d0d0;
}
.load-more .mt-action {
    padding: 6px 0;
    padding-left: 10px;
}
    .load-more::-webkit-scrollbar {
        width: 8px;
        background-color: #f7f6f666;
    }

    .load-more::-webkit-scrollbar-thumb {
        background-color: #ccc;
        border-radius: 10px;
    }

    .load-more::-moz-scrollbar {
        width: 8px;
        background-color: transparent;
    }

    .load-more::-moz-scrollbar-thumb {
        background-color: #ccc;
        border-radius: 10px;
    }

    .load-more::-ms-scrollbar {
        width: 8px;
        background-color: transparent;
    }

    .load-more::-ms-scrollbar-thumb {
        background-color: #ccc;
        border-radius: 10px;
    }


    

.m-aside-left--minimize .m-aside-menu.m-aside-menu--submenu-skin-dark .m-menu__nav.m-menu__nav--dropdown-submenu-arrow .m-menu__item.m-menu__item--hover > .m-menu__submenu > .m-menu__arrow,
.m-aside-menu.m-aside-menu--dropdown.m-aside-menu--submenu-skin-dark .m-menu__nav.m-menu__nav--dropdown-submenu-arrow .m-menu__item.m-menu__item--hover > .m-menu__submenu > .m-menu__arrow {
    color: #eee;
}

.m-aside-left--minimize .m-aside-menu.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav,
.m-aside-menu.m-aside-menu--dropdown.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav {
    background-color: #ebedf2;
}

    .m-aside-left--minimize .m-aside-menu.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav .m-menu__item.m-menu__item--active > .m-menu__heading .m-menu__link-text,
    .m-aside-left--minimize .m-aside-menu.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-text,
    .m-aside-menu.m-aside-menu--dropdown.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav .m-menu__item.m-menu__item--active > .m-menu__heading .m-menu__link-text,
    .m-aside-menu.m-aside-menu--dropdown.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-text {
        color: #717594;
    }

    .m-aside-left--minimize .m-aside-menu.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav .m-menu__item.m-menu__item--active > .m-menu__heading .m-menu__link-icon,
    .m-aside-left--minimize .m-aside-menu.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-icon,
    .m-aside-menu.m-aside-menu--dropdown.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav .m-menu__item.m-menu__item--active > .m-menu__heading .m-menu__link-icon,
    .m-aside-menu.m-aside-menu--dropdown.m-aside-menu--submenu-skin-dark .m-menu__nav .m-menu__item:not([data-menu-submenu-mode='accordion']).m-menu__item--hover > .m-menu__submenu .m-menu__subnav .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-icon {
        color: #717594;
    }

.nav-tabs > .nav-item.nav-link.active {
  font-weight: 700;
}

@media (min-width: 576px) {
    .modal-sm {
        max-width: 350px;
    }
}

@media (max-width: 576px) {
    .btn-sm-block {
        width:100%;
        margin-bottom: 4px;
    }
}

@media (max-width: 767.98px) {
    #intro .fixed-section .jumbotron .imgPanel {
        margin: 0px auto;
    }

    .section-title .display-4 {
        font-size: 2.0rem;
    }
}

@media (max-width: 991.98px) {
    #intro .fixed-section .jumbotron p {
        margin: 15px auto;
    }
}

@media (max-width: 767.98px) and (orientation: landscape) {
    #intro .fixed-section .jumbotron .imgPanel {
        width: 65%;
    }
}

@media (max-width: 990px) and (orientation: landscape) {
    #showcase .showcase-list .row .imgPanel {
        width: 45%;
    }
}

@media (max-width: 991.98px) and (orientation: landscape) {
    .width-50 {
        max-width: 50%;
        margin-top: 25px;
    }

    #intro .fixed-section .jumbotron .imgPanel {
        display: block;
    }

    .container {
        max-width: 540px;
    }

    .display-1 {
        margin-top: 0;
    }
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 50%;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 8px;
    padding-right: 20px;
    padding-bottom: 0;
    padding-top: 0;
}

.text-xxlarge {
    font-size: xx-large;
}

.toast-top-right {
    top: 80px;
    right: 30px;
}

.form-group.error {
    color: red;
}


.datepicker.dropdown-menu {
    z-index: 12051 !important;
}

.btn {
    font-family :SCG-Reg;
}
.btn-danger {
    background-color: #FF0000 !important
}

select.form-control:not([size]):not([multiple]) {
    height: calc(2.55rem + 10px);
}


@font-face {
    font-family: 'SCG-Reg';
    src: url('../fonts/SCG-Reg.otf') format('opentype');
}

body {
    font-family: SCG-Reg !important;
    height: 100%;
    margin: 0;
}

.bg-green {
    background-color: #0ABB87
}
.bg-yellow {
    background-color: #FFB822
}
.bg-pink {
    background-color: #FD397A
}

#loading {
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 3px solid rgba(255,255,255,.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: spin 1s ease-in-out infinite;
    -webkit-animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}