#left-side-bar ul li a {
    display: initial !important;
}

.app-menu {
    z-index: 4;
}

.swal2-select {
    margin: 0px !important;
    max-width: 90% !important;
    margin-left: 5% !important;
    margin-top: 20px !important;
}
.swal2-styled.swal2-confirm
{
    background-color: #184f90 !important;
}
.swal2-styled.swal2-cancel
{
    background-color: #d8d8d8 !important;
}

.hover-expand:hover > span {
    display: inline;
}

.hover-expand > span {
    display: none;
}

.popup-main {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.popup-fullscreen-button {
    right: 50px;
    position: absolute;
    border: none;
    background: none;
    margin-top: 3px;
}

.popup-fullscreen {
    max-width: 97%;
    height: 92%;
}

    .popup-fullscreen .modal-content {
        height: 97%;
    }

    .popup-fullscreen #hiddenFrame {
        height: calc(100vh - 120px) !important;
    }



.pre-wrap {
    white-space: pre-wrap;
}

.card-top-buttons {
    z-index: 999 !important;
}

.card-top-left {
    z-index: 999 !important;
    padding: 1.3rem;
}

.navbar .search {
    width: 100% !important;
}

.navbar #propertyId {
    width: 60% !important;
}

#SelectedSemesterId {
    width: 100% !important;
}

#SelectedSemesterId {
    padding-left: 15px !important;
    border: none !important;
}

    #SelectedSemesterId:focus {
        border-radius: 20px;
        background: #f8f8f8;
    }

.navbar .search .select2-selection--single {
    border: none !important;
}

.navbar .search .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 22px;
}

.navbar .search .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 34px;
    right: 5px !important;
    top: 1px;
}

.navbar .search .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 20px !important;
}

.navbar .menu-button {
    width: 140px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    /*line-height: 25px !important;*/
}

.select2-container--default .select2-selection--single .select2-selection__clear {
    margin-right: 5px;
    margin-top: 2px;
    border: none;
    background-color: transparent;
}
 
.select2-container--default .select2-selection--single.form-control .select2-selection__rendered {
    line-height: 22px;
}

li.select2-results__option {
    margin-bottom: 0px;
}

.logo {
    background: url(../../img/cycLogo.svg) no-repeat !important;
    background-size: 52px 52px !important;
    height: 52px !important;
    width: 52px !important;
}


.logo-mobile {
    width: 35px !important;
    height: 35px;
    background: url(../../img/cycLogo.svg) no-repeat !important;
    background-size: 35px 35px !important;
    background-position: center center;
}

.dropdown-menu {
    padding: .5rem .5rem !important;
    /*text-align: center !important;*/
}

.validation-summary-errors {
    color: #c43d4b;
    background-color: #eed3d5;
    border-color: rgba(196,61,75,.1);
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
}

dl, ol, ul {
    margin-bottom: 0rem !important;
}

    ol.dd-list:nth-child(1) {
        padding-left: 0px;
    }

.align-right {
    text-align: right;
}

.navbar .header-icon#notificationButton .count {
    top: -4px !important;
    background: red;
    color: white !important;
    border: white !important;
}

/*.datepicker table tbody tr td span {
    padding: 10px;
    float: left;
    width: 62px;
    height: inherit;
    line-height: inherit;
}

    .datepicker table tbody tr td span.active {
        color: white;
    }*/

/*.datepicker .table-condensed {
    width: 200px;
}*/

.datepicker .table-condensed {
    text-align: center;
}

.trv-report-viewer .trv-content-wrapper ul.k-menu-horizontal li {
    padding-top: 5px;
}

    .trv-report-viewer .trv-content-wrapper ul.k-menu-horizontal li.k-state-selected {
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .trv-report-viewer .trv-content-wrapper ul.k-menu-horizontal li input {
        padding: 5px;
        width: 50px !important;
    }

.social-header {
    height: 200px !important;
    background-color: white;
}

.baguetteBox-button svg {
    display: block !important;
}

.baguetteBox-button:before {
    content: "" !important;
}

.chart-background-red {
    background-color: rgba(255,0,0, 0.3);
}

.chart-background-orange {
    background-color: rgba(255,153,51, 0.3);
}

.chart-background-green {
    background-color: rgba(0,255,0, 0.3);
}

.chart-background-yellow {
    background-color: rgba(255,255,0, 0.3);
}

.w-10px {
    width: 10px;
}

.w-20px {
    width: 20px;
}

.w-30px {
    width: 30px;
}

.w-40px {
    width: 40px;
}

.w-50px {
    width: 50px;
}

.w-60px {
    width: 60px;
}

.w-70px {
    width: 70px;
}

.w-80px {
    width: 80px;
}

.w-90px {
    width: 90px;
}

.w-100px {
    width: 100px;
}

.w-110px {
    width: 110px;
}

.w-120px {
    width: 120px;
}

.w-130px {
    width: 130px;
}

.w-140px {
    width: 140px;
}

.w-150px {
    width: 150px;
}

.w-160px {
    width: 160px;
}

.w-170px {
    width: 170px;
}

.w-180px {
    width: 180px;
}

.w-190px {
    width: 190px;
}

.w-200px {
    width: 200px;
}

.w-250px {
    width: 250px;
}

.w-300px {
    width: 300px;
}

.number-input {
    text-align: right;
}

.mvc-grid {
    overflow-x: initial !important;
}

    .mvc-grid th,
    .mvc-grid td {
        padding: 0.5em;
    }

        .mvc-grid th.text-right {
            text-align: center !important
        }

.select2-container--default .select2-selection--single {
    height: 38px !important;
}

    .select2-container--default .select2-selection--single.form-control-sm {
        height: 32px !important;
    }

.navbar #propertyId .select2-container--default .select2-selection--single {
    background-color: inherit !important;
}


.select2-sm .select2-container--default .select2-selection--single {
    height: 33px !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    white-space: normal !important;
}

.select2-container .select2-selection--single.form-control .select2-selection__rendered {
    padding-left: 0px;
}

.select2-container--default .select2-selection--single.form-control .select2-selection__arrow {
    top: 4px;
}
.select2-container--default .select2-selection--single.form-control-sm .select2-selection__arrow {
    top: 0px;
}
/******multiple*****/
.select2-container .select2-selection--multiple .select2-selection__rendered {
    display: inline;
    list-style: none;
    padding: 0;
}

.select2-container--bootstrap .select2-selection--multiple .select2-selection__choice__remove {
    background-color: transparent;
    border: none;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    color: #888;
    cursor: pointer;
    font-size: 1em;
    font-weight: 700;
    padding: 0 4px;
}

.select2-container--bootstrap .select2-selection--multiple .select2-search--inline .select2-search__field {
    height: 24px !important;
}

.select2-container .select2-selection--multiple {
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    min-height: 32px;
    user-select: none;
    -webkit-user-select: none;
}

.select2-container .select2-search--inline .select2-search__field {
    box-sizing: border-box;
    border: none;
    font-size: 100%;
    margin-top: 5px;
    margin-left: 5px;
    padding: 0;
    max-width: 100%;
    resize: none;
    height: 18px;
    vertical-align: bottom;
    font-family: sans-serif;
    overflow: hidden;
    word-break: keep-all;
}

.input-validation-error {
    border-color: #c43d4b !important;
}

.side-title {
    width: 100%;
    height: 38.5px;
    padding-top: 7px;
    padding-left: 10px;
    border-radius: 0 10px;
    margin-bottom: 16px;
}

.modal .modal-header {
    padding: 0.75rem !important;
}

.hide, .hidden {
    display: none;
}

.pull-right {
    float: right;
}

.align-center {
    text-align: center;
}

dt, dd {
    float: left;
    border-bottom: 1px solid #d7d7d7;
    line-height: 27px;
    padding-left: 10px;
}

dt {
    width: 25%;
    background-color: #e9e9e9;
    border-radius: 0 10px 0 0;
}

dd {
    width: 75%;
    min-height: 27px;
}

.col-md-6 dt {
    width: 40%;
}

.col-md-6 dd {
    width: 60%;
}

.cyc-progress-bar {
    height: 25px;
    background-color: #18401a;
    text-align: center; /* To center it horizontally (if you want) */
    line-height: 25px; /* To center it vertically */
    color: white;
    border-radius: 5px 0 0 5px;
    width: 0%;
}

.cyc-progress {
    background-color: #4e4f4f;
    border-radius: 5px;
}

.cyc-progress-text {
    float: left;
    line-height: 25px;
    margin-left: 5px;
}

.cyc-progress-btn {
    float: right;
    line-height: 25px;
    margin-right: 5px;
}

.mess-count {
    font-size: 9px;
    color: white;
    border: 1px solid red;
    border-radius: 10px;
    position: relative;
    width: 18px;
    height: 15px;
    text-align: center;
    font-weight: 700;
    top: -14px;
    line-height: 14px;
    background-color: red;
    padding: 2px;
    right: 10px;
}

.navbar .user img {
    height: 40px;
}

.waitMe_container {
    background-image: url(/Content/Backend/Dore/img/loading-image.gif);
    background-repeat: no-repeat;
    background-position: center center;
    min-height: 200px;
}

iframe {
    background-image: url(/Content/Backend/Dore/img/loading-image.gif);
    background-repeat: no-repeat;
    background-position: center center;
}

.file-input {
    text-align: center;
}

.theme-button {
    display: none;
}


.bootstrap-touchspin .btn-default {
    border-radius: 0;
    border: 1.5px solid #d7d7d7;
    font-weight: bold;
}

.fixed-background {
    background: #2a93d5 !important;
}

.profile-photo {
    max-height: 150px;
    border: solid 1px lightgray;
}

.treeview {
    margin-left: -20px;
}

.modal .modal-body {
    padding: 0rem !important;
}

.modal-body {
    padding: 0rem !important;
}

/*********************** detail-view *********************/
.detail-view .control-group {
    margin-bottom: 5px;
}

.detail-view .control-value input[type=checkbox] {
    opacity: inherit;
}

.detail-view .control-value {
    background: #fff;
    line-height: 27px;
    border-bottom: 1px solid #d7d7d7;
}

.detail-view .control-label {
    background: #e9e9e9;
    margin-bottom: 0px;
    line-height: 27px;
    text-align: left;
    font-weight: 700;
    border-radius: 0 10px 0 0;
    border-bottom: 1px solid #d7d7d7;
}
    .detail-view .control-label label {
        font-size: inherit;
        font-weight: normal;
    }
.detail-view .form-row .control-label {
    margin-left: 5px ;
}
.detail-view .form-row .control-value {
    padding-right: 0px;
    margin-right: -5px;
}
.detail-view .row .control-label {
    margin-left: 15px;
}

.detail-view .row .control-value {
    padding-right: 0px;
    margin-right: -15px;
}
 

.edit-view .detail-view, .edit-view .detail-view .row .control-group:first-child {
    border-left: none;
}
/**end detail-view*/

.form-control-sm {
    padding: 0.2rem;
    font-size: 0.8rem;
    height: 32px !important;
}

select.form-control-sm {
    padding: 0.1rem;
}

    select.form-control-sm .select2-selection {
        font-size: 0.8rem;
        height: 32px !important;
    }

.form-control-xs {
    padding: 0.1rem;
    font-size: 0.8rem;
    height: 22px !important;
}

.select2-container--default .select2-selection--single.form-control-xs {
    height: 22px !important;
}

    .select2-container--default .select2-selection--single.form-control-xs .select2-selection__rendered {
        line-height: 16px !important;
    }

.file-drop-zone {
    margin: 0px !important;
}

.icon-hoa-hong {
    background: url(../../img/hoa-hong.png) no-repeat !important;
    background-size: 52px 52px !important;
    height: 52px !important;
    width: 52px !important;
    display: inline-block;
}

    .icon-hoa-hong.icon-big {
        background-size: 80px 80px !important;
        height: 80px !important;
        width: 80px !important;
    }

.icon-hoa-sen {
    background: url(../../img/hoa-sen.png) no-repeat !important;
    background-size: 52px 52px !important;
    height: 52px !important;
    width: 52px !important;
    display: inline-block;
}

    .icon-hoa-sen.icon-big {
        background-size: 120px 120px !important;
        height: 120px !important;
        width: 120px !important;
    }

.icon-hoa-hong-none {
    background-size: 52px 52px !important;
    height: 52px !important;
    width: 52px !important;
    display: inline-block;
}

    .icon-hoa-hong-none.icon-big {
        background-size: 80px 80px !important;
        height: 80px !important;
        width: 80px !important;
    }

.icon-hoa-sen-none {
    background-size: 52px 52px !important;
    height: 52px !important;
    width: 52px !important;
    display: inline-block;
}

    .icon-hoa-sen-none.icon-big {
        background-size: 120px 120px !important;
        height: 120px !important;
        width: 120px !important;
    }

.loading-spinner {
    background: url(../../img/spinner.gif);
    background-size: 28px 28px !important;
    height: 28px !important;
    width: 28px !important;
    display: inline-block;
    margin: auto;
}

.spinner {
    text-align: center;
}

.spinner-vertical {
    text-align: right;
}

#slider-slow.noUi-state-tap .noUi-connect,
#slider-slow.noUi-state-tap .noUi-origin {
    -webkit-transition: transform 1600ms;
    transition: transform 1600ms;
}
/************************* Style checkbox*************************************************/
.checkbox-lg .custom-control-label {
    padding-top: 13px;
    padding-left: 6px;
}

    .checkbox-lg .custom-control-label::before, .checkbox-lg .custom-control-label::after {
        top: .8rem;
        width: 1.55rem;
        height: 1.55rem;
    }

.checkbox-xl .custom-control-label {
    padding-top: 23px;
    padding-left: 10px;
}

    .checkbox-xl .custom-control-label::before, .checkbox-xl .custom-control-label::after {
        top: 1.2rem;
        width: 1.85rem;
        height: 1.85rem;
    }


/************************* End Style checkbox*************************************************/

/************************* full-height  *************************************************/
.popup-main .full-height-detail {
    min-height: calc(100vh - 56px);
}

.full-height-detail {
    min-height: calc(100vh - 240px);
}

/************************* End full-height *************************************************/

.ms-options {
    left: auto !important;
}

/*.ms-options-wrap > button {
 
}*/

.ms-options-wrap > button:focus, .ms-options-wrap > button {
    height: calc(2em + .8rem);
    margin-top: 0px;
}

.ms-options > ul > li {
    margin-bottom: 0px;
}

/*********** Start Enjoyhint  **************/

.prevButtonEnjoyHint {
    color: #fff !important;
    background-color: #00ebe7 !important;
    border-color: #00ebe7 !important;
}

    .prevButtonEnjoyHint:hover {
        color: #fff !important;
        background-color: #138496 !important;
        border-color: #117a8b !important;
    }

.nextButtonEnjoyHint {
    color: #fff !important;
    border-color: #00a6eb !important;
    background-color: #00a6eb !important;
}

    .nextButtonEnjoyHint:hover {
        color: #fff !important;
        background-color: #123c6d !important;
        border-color: #123c6d !important;
    }

.skipButtonEnjoyHint {
    color: #ececec !important;
    border-color: #ececec !important;
}

    .skipButtonEnjoyHint:hover {
        color: #212529 !important;
        background-color: #f8f9fa !important;
        border-color: #f8f9fa !important;
    }

/*********** End Enjoyhint  **************/

@media (max-width: 767px) {

    /*.full-content-height {
        height: 100% !important;
    }*/

    body.rounded {
        border-radius: 0px !important;
    }

    .rounded .card {
        border-radius: 0px !important;
    }

    dt {
        width: 35%;
        background-color: #e9e9e9;
        border-radius: 0 10px 0 0;
    }

    dd {
        width: 65%;
        min-height: 27px;
    }

    .slick-slide img {
        height: 200px;
    }

    .detail-view .control-label {
        text-align: left;
        padding-left: 5px;
    }

    .detail-view .control-group {
        border-left: 1px solid #d7d7d7;
        margin-bottom: 1px;
    }
}


.scrollbar {
    margin-right: -15px;
    padding-right: 15px;
    position: relative;
}

.mvc-grid td a:not(.btn):not(.badge):not(.dropdown-toggle) {
    color: #2a93d5;
    font-weight: bold;
}

.bootstrap-touchspin .input-group-btn-vertical > .btn {
    padding: 0px !important;
}

table.dataTable tbody th, table.dataTable tbody td {
    padding: .5rem !important;
}

table.dataTable.no-footer, table.dataTable thead th, table.dataTable thead td, .dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: none !important;
}

/****************** Content - menu************************************/
@media (max-width: 1439px) {
    .menu {
        top: -30px;
    }

    #app-container.menu-hidden main, #app-container.menu-sub-hidden main, #app-container.sub-hidden main {
        margin-left: 110px;
    }

    
        .navbar .navbar-right .user {
        margin-right: 10px !important;
    }

}

@media (max-width: 1919px) {
     .navbar .navbar-right .user {
        margin-right: 10px !important;
    }

    .card-top-buttons {
        padding: 0.5rem !important;
    }

    .card-top-left {
        padding: 0.5rem !important;
    }

    .navbar .menu-button {
        width: 100px !important;
    }

    .treeview {
        margin-left: -10px;
    }

    .menu .main-menu ul li a {
        height: 85px !important;
    }

    h1 {
        padding-bottom: 0px;
    }

    main {
        margin-top: 75px;
        margin-right: 20px;
        margin-bottom: 20px;
        margin-left: 310px;
    }


    .logo {
        background: url(../../img/cyclogo.svg) no-repeat !important;
        background-size: 42px 42px !important;
        height: 42px !important;
        width: 42px !important;
    }

    .logo-single {
        background-size: 42px 42px !important;
    }

    .navbar {
        height: 60px;
        padding: 0;
    }

    .menu {
        top: -40px;
    }

        .menu .main-menu {
            width: 80px;
            height: calc(100% - 50px);
        }

        .menu .sub-menu {
            left: 80px;
            width: 200px;
            height: calc(100% - 50px);
        }

            .menu .sub-menu ul li {
                margin-left: 10px;
            }

                .menu .sub-menu ul li a {
                    margin: 2px;
                }

            .menu .sub-menu ul.inner-level-menu li.active:after {
                left: -10px;
            }



    #app-container.main-hidden main {
        margin-left: 20px !important;
    }

    .card .card-body {
        padding: 0.8rem;
    }

    .card .card-footer {
        padding: 0.8rem;
    }

    .app-menu {
        top: 60px !important;
        height: calc(100% - 150px);
    }

    .chat-app .scroll {
        height: calc(100vh - 60px - 270px);
    }

    .icon-hoa-hong {
        background: url(../../img/hoa-hong.png) no-repeat !important;
        background-size: 40px 40px !important;
        height: 40px !important;
        width: 40px !important;
        display: inline-block;
    }

    .icon-hoa-hong-none {
        background-size: 40px 40px !important;
        height: 40px !important;
        width: 40px !important;
        display: inline-block;
    }

    .full-height-detail {
        height: calc(100vh - 160px);
    }

    #app-container.menu-hidden main, #app-container.menu-sub-hidden main, #app-container.sub-hidden main {
        margin-left: 90px;
        margin-top: 70px;
        margin-right: 10px;
    }
  
}
.form-group {
    margin-bottom: 0.75rem;
}
.cyc-avatar {
    background-size: cover;
    border-radius: 50%;
    margin: 0 auto;
    background-color: #f8f8f8;
    background-repeat: no-repeat;
    background-position: center;
}
.cyc-image {
    background-size: cover;
    margin: 0 auto;
    background-color: #f8f8f8;
    background-repeat: no-repeat;
    background-position: center; 
}
.rotate-arrow-icon {
    background: #145388d6;
    padding-left: 10px !important;
    margin-left: -10px;
    color: white;
    font-weight: bold;
}

    .rotate-arrow-icon:hover {
        color: white !important;
        /*border-left: 3px solid black;*/
    }

    .rotate-arrow-icon i {
        color: white !important;
        font-weight: bold;
    }

.sub-menu > div > ul > li > div > ul {
    border-left: 1px solid lightgrey;
    margin-left: 2px;
}
.cyc-image {
    border-radius: 10%;
}

.form-control-color {
    padding: .3rem;
}
    .form-control-color:not(:disabled):not([readonly]) {
        cursor: pointer;
    }