﻿
/*
 * skin02: Blue Theme
 * ------------------------------------------------------------
 */

/*
 *  Component: Main-header 
 *  ----------------------
 */

.main-header {
    background-color: #0082FF !important; /*Xanh Da troi*/
    /*background:linear-gradient(154deg, #008fe2 0, #00b29c 100%);*/
    color: #fff;
}

#siteNavMenuBar {
    background-color: #0082FF;
}

.right-header {
    /*background-color:#46CFB0;*/
    /*background-image:url("/Content/images/bg_header_skin4.png")*/
    background-repeat: no-repeat;
    background-position: 650px 0;
}

.right-header .bar-right > li {
    background-color: #0082FF;
}

.logo {
    background-color: #0082FF; /*Xanh Nhat*/
}

.right-header ul#siteNavMenuBar > li > a:hover,
.right-header ul.bar-right > li > a:hover {
    background-color: #fff; /*Xanh ngoc bich*/
    color: #47a9ff;
}

.menu-sub {
    background-color: #fff; /*Trắng*/
    color: #000; /*Đen Xám */
    border: 1px solid #969696;
}

    .menu-sub > li > a {
        color: #32465C;
    }

        .menu-sub > li > a:hover {
            /*color:#006BB4;
    border-left:5px solid #006BB4;*/
            background-color: #62c6f8; /*Xanh ngoc bich  */
            color: #fff; /*trang*/
        }

ul.menu-noti > li .user_header {
    background-color: #58a5f2;
}


/*
 *  Component : Global Tab
 *  -------------------
 */

.tab-all {
    background-color: #47a9ff;
}

.tab-container {
    background-color: #47a9ff;
}

/*
 *  Component : Global Footer
 *  -------------------
 */

.tab-footer {
    background-color: #E7E9EC;
}

    .tab-footer p {
        color: #535;
    }

/*
 *  Component : Sidebar
 *  -------------------
 */

.main-sidebar {
    background-color: #f1f1f1; /*Xám Nhạt*/ /*Try Firefox 0x424F5A*/
    color: #1b1919;
    border-right: 0px solid #969696;
}

.user-panel {
    color: #41596D;
}

.status-panel .progress-bar {
    background-color: #ddd;
}

.progress-bar > div.SR {
    background-color: #46CFB0;
}

.progress-bar > div.comp {
    background-color: #73c45f;
}

.progress-bar > div.mvoc {
    background-color: #FF8C00;
}

.sidebar-menu {
    color: #2c3b41;
}

    .sidebar-menu > li {
        border-bottom: 1px solid #ddd;
    }

        .sidebar-menu > li.active {
            border-left: 0px solid #fff;
        }

        .sidebar-menu > li:hover {
            border-left: 0px solid #fff;
        }

    .sidebar-menu > li {
        border-left: 0px solid transparent;
    }

        .sidebar-menu > li > a:hover {
            background-color: #47a9ff;
            color: #fff;
        }

        .sidebar-menu > li.active > a {
            background-color: #47a9ff;
            color: #fff;
        }

        .sidebar-menu > li.active .treeview-menu {
            background-color: #fafafa;
        }

    .sidebar-menu .treeview-menu > li > a:hover {
        color: #46CFB0;
    }

.filter label {
    color: #008fe2;
}

.filter input {
    background-color: #fff;
}

.filter select {
    background-color: #fff;
}

.mutli-select-wrapper > li:hover {
    background-color:#6dd5f7;
}


/*
 *  Component : Content Swapper
 *  --------------------------------
 */

.content-header .content-title {
    color: #006BB4;
}

input.filter-input-custom {
    border: 1px solid #2D74B7;
}

.manual-action {
    color: #006BB4;
}

/*
 *  Component : SR Detail
 *  -------------------
 */


.sr-detail-heading,
.sr-create-heading {
    background-color: #47a9ff;
}

.sr-custom-btn-bar {
    background-color: #47a9ff;
}

/*
 *  Component : ui-grid
 *  -------------------
 */

div.ui-grid-header {
    border-bottom: 1px solid #C9DDE9;
}

.ui-grid-header-cell-wrapper {
    background-color: #60b7ff!important;
    color: #fff;
}

.ui-grid-header-cell-row .ui-grid-header-cell {
    color: #fff;
}

.ui-grid-header-cell * {
    color: #000;
}

.ui-grid-header-cell .ui-grid-cell-contents span {
    color: #fff;
}


/*
 *  Component : ui-grid - service desk list custom 
 *  -------------------
 */


div.sr-list-table-custom .ui-grid-header-cell-wrapper {
    background-color: #F8F8F8;
}

div.sr-list-table-custom .ui-grid-header-cell .ui-grid-cell-contents span {
    color: #006BB4;
}

    div.sr-list-table-custom .ui-grid-header-cell .ui-grid-cell-contents span i {
        color: #006BB4;
    }

div.sr-list-table-custom.ui-grid {
    border-top: 2px solid #2D74B7;
}

.mes-button-bar > button {
    border: 1px solid #43A0F2;
    background-color:#43A0F2;
    /*background: linear-gradient( #3498db, #2980b9);*/
    color: #fff;
}


/*
 *  Component : ui-grid - service desk detail custom 
 *  -------------------
 */


div.sr-custom-btn-bar > button {
    background: linear-gradient( #fff 0%, #dddddd 100%);
    color: #4c4c4c;
}

    div.sr-custom-btn-bar > button:hover {
        color: #fff;
        background: linear-gradient( #8DC22C 0%, #8DC22C 100%);
        background-color: #8DC22C;
        border: 1px solid #6C9B26;
    }


/*
*   Table Color: vanlam.vu
*   ---------------------
*/
.table-theme tr th {
    background-color: #39babf;
    color: #fff;
    font-size: 12px;
    font-size: 12px;
}


/*New article*/

div.article-table-custom .ui-grid-header-cell-wrapper {
    background-color: #47a9ff;
}

.article-title-custom {
    color: #006BB4;
}

    .article-title-custom:hover {
        color: #f3592f;
    }

.article-author-wrap {
    background-color: #d8ebf2 !important;
}

div.article-table-custom div.ui-grid-row:nth-child(2n) .ui-grid-cell {
    background-color: #fff;
}

div.article-table-custom div.ui-grid-row:nth-child(2n+1) .ui-grid-cell {
    background-color: #fff;
}

div.article-table-custom div.ui-grid-row:nth-child(odd):hover .ui-grid-cell,
div.article-table-custom div.ui-grid-row:nth-child(even):hover .ui-grid-cell {
    /*background-color:#eff0f1;*/
}

div.article-table-custom div.ui-grid-row .ui-grid-cell {
    border-bottom: 1px solid #e4e4e4;
    border-right: 1px solid #e4e4e4;
}

div.article-table-custom .ui-grid-header-cell-row .ui-grid-header-cell {
    border-right: 1px solid #fff;
}



/*
 *   Component download image 
 *   ---------------------
 */

.img-download-title {
    color: #47a9ff;
}


.search-icon {
    color: #47a9ff;
}

.show-search-button {
    background-color: #47a9ff;
}

.image-thumnail:hover .image-title > p > span {
    color: #446abe;
}

.image-button-bar div > a {
    /*background-color:#446abe;
    border: 1px solid #446abe;*/
    color: #446abe;
}

    .image-button-bar div > a:hover {
        background-color: #fff;
        border-color: #446abe;
        color: #444;
    }

.isImageChecked .image-thumnail {
    border-color: #60cbfa;
    background-color: #60cbfa;
}

.image-content:hover .image-mask {
    cursor: zoom-in;
    background-color: rgba(24,107,255,0.3);
}

.isImageChecked .image-title {
    border-color: #60cbfa;
    background-color: #60cbfa;
}

.small-res-bnt > a,
.image-menu-small li a {
    background-color: #446abe;
}

    .small-res-bnt > a:hover,
    .image-menu-small li a:hover {
        background-color: #2f9dfa;
    }

.close:hover,
.close:focus {
    color: #3498db;
    text-decoration: none;
    cursor: pointer;
}

.confirm {
    border: 1px solid #47a9ff;
}

.confirm-header {
    color: #47a9ff;
}

.confirm-button-active {
    background-color: #47a9ff;
}

.confirm-button {
    color: #47a9ff;
    border: 1px solid #47a9ff;
}

.confirm-button-active:hover {
    background-color: #006BB4;
    border: 1px solid #006BB4;
}
.page-navi {
    color: #446abe;
    background-color: #fff;
}

    .page-navi:hover {
        background-color: #446abe;
        color: #fff;
    }


/*
 *   Component Notice on Homepage
 *   -----------------------------------------
 */

.notice-firstwrap {
    background-color: #446abe;
    border: 3px solid #446abe;
}

.notice-body {
    color: #444;
}

.notice-title p i {
    color: #408efa;
}

.guide-header-title {
    color: #2065f3;
}

.guide-fisrt-graph,
.guide-second-graph {
    background-color: #51a2fa;
}

.guide-button {
    background-color: #446abe;
}

    .guide-button:hover {
        background-color: #fff;
        border: 1px solid #446abe;
        color: #446abe;
    }


.guide-footer .introjs-hint-pulse {
    background-color: #3acef6;
    border-color: #0c99ea;
}

.guide-footer .introjs-hint-dot {
    border-color: #68cbf7;
}

.notice-button {
    border: 1px solid #446abe;
    background-color: #fff;
    color: #444;
}

    .notice-button:hover {
        background-color: #446abe;
        color: #fff;
    }


/*
 * Component: Technical Shedule
 * -----------------------------------------------
 */


.tech-title span {
    color:#0d6dbe;
}

.tech-title i {
    color:#0a52d4;
}


.tech-time {
    background-color:#79bce9;
}

.tech-time span {
    color:#fff;
}

.tech-main-info:hover {
    background-color:#eeeeee;
}

.tech-img:hover {
    border:1px solid #5a9ee8;
}

.tech-name span {
    color:#0d6dbe;
}

.tech-email *,
.tech-phone * {
    color:#444;
}

.tech-hover-img {
    background-color:#fff;
    border:1px solid #ddd;
}

.tech-img-hover {
    border:1px solid #ddd;
}

/*
 * Component: Download File Component
 * -----------------------------------------------
 */

.table-download-button {
    border: 1px solid #2f76e7;
    background-color:#3498db;
    color: #FFFFFF;
}

.table-download-button:hover {
    border: 1px solid #2f2f2f;
    background-color:#f3f7f8;
    color: #444;
}


/*
 * Component: Program Shotcut (Home Page )
 * -----------------------------------------------
 */

.home-app-intro-column li.home-app-header {
    background-color:#3599e4;
    color:#fff;
}

.home-app-intro-column ul > li:not(.home-app-header):hover {
    background-color:#dddddd;
}



/*
 * Component: Home Page
 * -----------------------------------------------
 */


.hero-text {
    background-color:#42aae6;
    color:#fff;
}

.second-paralax-img-text {
    background-color:#47a9ff;
    color:#fff;
}

.sr-register-button {
    background-color:#3bb3f8;
}


/*
 * Component: Mobile Menu
 * -----------------------------------------------
 */

.menu-mobile {
    background-color:rgba(66,154,203,0.9);
} 

#mobileMenu .li-mobile-menu.active > a {
    background-color:#47acee;
    color:#fff;
}

#mobileMenu .li-mobile-menu:not(.active) > a:hover {
    background-color:#fff;
    color:#446abe;
}

/*
 *   Component Room Reservation
 *   ---------------------
 */

.filter__item--action > button {
    background-color: #47a9ff;
}

.room-booking-area {
    border: 1px solid #47a9ff;
}

.room-filter__item > input {
    border: none;
    border-bottom: 1px solid #47a9ff;
}

.combobox__button {
    border: none;
    border-bottom: 1px solid #47a9ff;
}

.combobox-list > li:hover {
    background-color: #47a9ff;
}

.group-time-type {
    background-color: #47a9ff;
}

    .group-time-type > button {
        background-color: #47a9ff;
    }

        .group-time-type > button:hover {
            background-color: #0082FF;
        }

.time-button--active {
    background-color: #0082FF !important;
}

.action-loading__button {
    background-color: #47a9ff;
    color: #FFFFFF;
}

.action-new-button {
    background-color: rgba(1, 183, 228, 0.95);
    color: #FFFFFF;
}

.action-loading__button:hover {
    /*box-shadow: 1px 3px 12px 0px #23B16C;*/
    color: #47a9ff;
    background-color: #ffffff;
}

.action-loading__button:focus {
    background-color: #0082FF !important;
    color: #FFFFFF;
}

.datetime-navi--btn {
    background-color: #47a9ff;
}

    .datetime-navi--btn:focus {
        background-color: #0082FF !important;
    }

.datetime-navi--span {
    background-color: rgba(1, 183, 228, 0.85);
}

.booking-container th, .booking-container td {
    border: 1px solid rgba(1, 183, 228, 0.3);
}

.component-input > input, .component-input > textarea {
    border: none;
    border-bottom: 1px solid #47a9ff;
}

.edit-box__header {
    background-color: #47a9ff;
}

.edit-box__close {
    background-color: #47a9ff;
}

.component-action > button {
    background-color: #47a9ff;
}

    .component-action > button:focus {
        background-color: #0082FF !important;
    }

.room-detail--info {
    border: 1px solid #47a9ff;
}

input:checked + .slider {
    background-color: #47a9ff;
}

.room-detail-device {
    color: #47a9ff;
}

.videocall {
    color: #47a9ff;
}

.time-selecting, .time-selecting-week {
    background-color: rgba(1, 183, 228, 0.5);
}

#loader {
    border: 6px solid rgba(1, 183, 228, 0.1);
    border-top: 6px solid rgba(1, 183, 228, 1);
}

.block-button {
    background-color: #0082FF;
}

.my-block-button {
    background-color: #0082FF;
}

.context-menu {
    color: #47a9ff;
}

    .context-menu li:hover {
        background-color: #47a9ff;
    }

.filter-group-info {
    background-color: #47a9ff;
}

    .filter-group-info > button {
        background-color: #0082FF;
    }

.booking-note {
    background-color: #0082FF;
    border: 1px solid #0082FF;
}
.comfirm > span {
    background-color: #0082FF;
}
.modal-close{
    color:#0082FF;
}
.modal-close:hover{
    background-color:#0082FF;
    color:#FFFFFF;
}
.booking-container th, .booking-container > tbody > tr > td:first-child {
    background-color: rgba(1, 183, 228, 0.1);
}
.room-filter__item > input,.combobox__button,.component-input > input, .component-input > textarea {
    background-color: rgba(1, 183, 228, 0.1);
}
.booking-container tr:hover {
  background-color:rgba(4, 148, 209, 0.30);
}
.component-input--notice{
    background-color:#0082FF;
}
.start-modal{
    background-color:#47a9ff !important;
}
.start-modal__go{
    color:#47a9ff;
}
/*-------------LEN AI CSS------------------*/
.table thead {
    background-color: #43A0F2;
    border-color: #43A0F2;
}

.component-table {
    border: 1px solid #43A0F2;
}

.component-option {
    background-color: #ecf3fa;
}

.combobox input {
    border-bottom: 2px solid #43A0F2;
}

.combobox button {
    border: none;
    border-bottom: 2px solid #43A0F2;
}

    .combobox button i, .icon-input {
        background-color: #43A0F2;
    }

.icon-input {
    border-bottom: 2px solid #43A0F2;
}

.component-combobox-item ul li:hover {
    background-color: #43A0F2;
}
input:checked + .slider, input:checked + .slider-sm {
    background-color: #43A0F2;
}
.total-count {
    background-color: #6eb5f5;
}
.switch-withlabel {
    background-color: #6eb5f5;
}

/*
 *  Popup : Themes
 *  -------------------
 */
.popup-header{
    background-color: #0082FF !important; /*Xanh Da troi*/ 
    color: #fff;
}

.popup-footer{
    color:#000!important;
    background-color:#f1f1f1!important;
}