/*
    MySpa 2017
*/
@import url('https://fonts.googleapis.com/css?family=Quicksand+Condensed:300,400,700|Quicksand:300');
@import url(https://fonts.googleapis.com/css?family=Oswald:400,700,300&subset=vietnamese);
@import url(https://fonts.googleapis.com/css?family=Quicksand:300,400,500,700&subset=vietnamese);

html {
    background-color: #f0f3f4;
}

body {
    font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
    line-height: 1.42857143;
    color: #58666e;
    background-color: transparent;
}

*:focus {
    outline: 0 !important;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    margin: 0;
}

a {
    color: #363f44;
    text-decoration: none;
    cursor: pointer;
}

a:hover,
a:focus {
    color: #141719;
    text-decoration: none;
}

label {
    font-weight: normal;
    margin-bottom: 2px;
}

small,
.small {
    font-size: 13px;
}

.badge,
.label {
    font-weight: bold;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}

.badge.bg-light,
.label.bg-light {
    text-shadow: none;
}

.badge {
    background-color: #cfdadd;
}

.badge.up {
    position: relative;
    top: -10px;
    padding: 3px 6px;
    margin-left: -10px;
}

.badge-sm {
    padding: 2px 5px !important;
    font-size: 85%;
}

.label-sm {
    padding-top: 0;
    padding-bottom: 1px;
}

.badge-white {
    padding: 2px 6px;
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.badge-empty {
    color: inherit;
    background-color: transparent;
    border: 1px solid rgba(0, 0, 0, 0.15);
}

blockquote {
    border-color: #dee5e7;
}

.caret-white {
    border-top-color: #fff;
    border-top-color: rgba(255, 255, 255, 0.65);
}

a:hover .caret-white {
    border-top-color: #fff;
}

.thumbnail {
    border-color: #dee5e7;
}

.progress {
    background-color: #edf1f2;
}

.progress-xxs {
    height: 2px;
}

.progress-xs {
    height: 6px;
}

.progress-sm {
    height: 12px;
}

.progress-sm .progress-bar {
    font-size: 10px;
    line-height: 1em;
}

.progress,
.progress-bar {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.progress-bar-primary,
.label-primary {
    background-color: #7266ba;
}

.progress-bar-info,
.label-info {
    background-color: #23b7e5;
}

.progress-bar-success,
.label-success{
    background-color: #abd373;
}

.progress-bar-warning,
.label-warning{
    background-color: #fad733;
}

.progress-bar-danger,
.label-danger{
    background-color: #f26c4f;
}

.progress-bar-black,
.label-black{
    background-color: #1c2b36;
}

.progress-bar-white {
    background-color: #fff;
}

.accordion-group,
.accordion-inner {
    border-color: #dee5e7;
    border-radius: 2px;
}

.alert {
    font-size: 13px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.alert .close i {
    display: block;
    font-size: 12px;
    font-weight: normal;
}

.form-control {
    border-color: #cfdadd;
    border-radius: 2px;
}

.form-control,
.form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.form-control:focus {
    border-color: #23b7e5;
}

.form-horizontal .control-label.text-left {
    text-align: left;
}

.form-control-spin {
    position: absolute;
    top: 50%;
    right: 10px;
    z-index: 2;
    margin-top: -7px;
}

.input-lg {
    height: 45px;
}

.input-group-addon {
    background-color: #edf1f2;
    border-color: #999;
}

.list-group {
    border-radius: 2px;
}

.list-group.no-radius .list-group-item {
    border-radius: 0 !important;
}

.list-group.no-borders .list-group-item {
    border: none;
}

.list-group.no-border .list-group-item {
    border-width: 1px 0;
}

.list-group.no-bg .list-group-item {
    background-color: transparent;
}

.list-group-item {
    padding-right: 15px;
    border-color: #e7ecee;
}

a.list-group-item:hover,
a.list-group-item:focus,
a.list-group-item.hover {
    background-color: #f6f8f8;
}

.list-group-item.media {
    margin-top: 0;
}

.list-group-item.active {
    color: #fff;
    background-color: #23b7e5 !important;
    border-color: #23b7e5 !important;
}

.list-group-item.active .text-muted {
    color: #ace4f5 !important;
}

.list-group-item.active a {
    color: #fff;
}

.list-group-item.focus {
    background-color: #e4eaec !important;
}

.list-group-item.select {
    position: relative;
    z-index: 1;
    background-color: #dbeef9 !important;
    border-color: #c5e4f5;
}

.list-group-alt .list-group-item:nth-child(2n+2) {
    background-color: rgba(0, 0, 0, 0.02) !important;
}

.list-group-lg .list-group-item {
    padding-top: 15px;
    padding-bottom: 15px;
}

.list-group-sm .list-group-item {
    padding: 6px 10px;
}

.list-group-sp .list-group-item {
    margin-bottom: 5px;
    border-radius: 3px;
}

.list-group-item > .badge {
    margin-right: 0;
}

.list-group-item > .fa-chevron-right {
    float: right;
    margin-top: 4px;
    margin-right: -5px;
}

.list-group-item > .fa-chevron-right + .badge {
    margin-right: 5px;
}

.nav-pills.no-radius > li > a {
    border-radius: 0;
}

.nav-pills > li.active > a {
    color: #fff !important;
    background-color: #23b7e5;
}

.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:active {
    background-color: #19a9d5;
}

.nav > li > a:hover,
.nav > li > a:focus {
    background-color: #f6f8f8;
}

.nav.nav-lg > li > a {
    padding: 20px 20px;
}

.nav.nav-md > li > a {
    padding: 15px 15px;
}

.nav.nav-sm > li > a {
    padding: 6px 12px;
}

.nav.nav-xs > li > a {
    padding: 4px 10px;
}

.nav.nav-xxs > li > a {
    padding: 1px 10px;
}

.nav.nav-rounded > li > a {
    border-radius: 20px;
}

.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
    background-color: #f6f8f8;
}

.nav-tabs {
    border-color: #dee5e7;
}

.nav-tabs > li > a {
    border-bottom-color: #fff;
    border-radius: 2px 2px 0 0;
}

.nav-tabs > li:hover > a,
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover {
    border-color: #dee5e7;
}

.nav-tabs > li.active > a {
    border-bottom-color: #fff !important;
}

.nav-tabs-alt .nav-tabs.nav-justified > li {
    display: table-cell;
    width: 1%;
}

.nav-tabs-alt .nav-tabs > li > a {
    background: transparent !important;
    border-color: transparent !important;
    border-bottom-color: #dee5e7 !important;
    border-radius: 0;
}

.nav-tabs-alt .nav-tabs > li.active > a {
    border-bottom-color: #23b7e5 !important;
}

.tab-container {
    margin-bottom: 15px;
}

.tab-container .tab-content {
    padding: 15px;
    background-color: #fff;
    border: 1px solid #dee5e7;
    border-top-width: 0;
    border-radius: 0 0 2px 2px;
}

.pagination > li > a {
    border-color: #dee5e7;
}

.pagination > li > a:hover,
.pagination > li > a:focus {
    background-color: #edf1f2;
    border-color: #dee5e7;
}

.panel {
    border-radius: 2px;
}

.panel .accordion-toggle {
    display: block;
    font-size: 14px;
    cursor: pointer;
}

.panel .list-group-item {
    border-color: #edf1f2;
}

.panel.no-borders {
    border-width: 0;
}

.panel.no-borders .panel-heading,
.panel.no-borders .panel-footer {
    border-width: 0;
}

.panel-heading {
    border-radius: 2px 2px 0 0;
}

.panel-default .panel-heading {
    background-color: #f6f8f8;
}

.panel-heading.no-border {
    margin: -1px -1px 0 -1px;
    border: none;
}

.panel-heading .nav {
    margin: -10px -15px;
}

.panel-heading .list-group {
    background: transparent;
}

.panel-footer {
    background-color: #ffffff;
    border-color: #edf1f2;
    border-radius: 0 0 2px 2px;
}

.panel-default {
    border-color: #dee5e7;
}

.panel-default > .panel-heading,
.panel-default > .panel-footer {
    border-color: #edf1f2;
}

.panel-group .panel-heading + .panel-collapse .panel-body {
    border-top: 1px solid #eaedef;
}

.table > tbody > tr > td,
.table > tfoot > tr > td {
    padding: 8px 15px;
    border-top: 1px solid #E1E1E1;
}

.table > thead > tr > th {
    padding: 8px 15px;
    border-bottom: 1px solid #E1E1E1;
}

.table-bordered {
    border-color: #E1E1E1;
}

.table-bordered > tbody > tr > td {
    border-color: #E1E1E1;
}

.table-bordered > thead > tr > th {
    border-color: #E1E1E1;
}

.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
    background-color: #FBFBFB;
}

.table-striped > thead > th {
    background-color: #fafbfc;
    border-right: 1px solid #E1E1E1;
}

.table-striped > thead > th:last-child {
    border-right: none;
}

.well,
pre {
    background-color: #edf1f2;
    border-color: #dee5e7;
}

.dropdown-menu {
    border: 1px solid #dee5e7;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 2px;
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.dropdown-menu.pull-left {
    left: 100%;
}

.dropdown-menu > .panel {
    margin: -5px 0;
    border: none;
}

.dropdown-menu > li > a {
    padding: 5px 15px;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    color: #141719;
    background-color: #abd373 !important;
    background-image: none;
    filter: none;
}

.dropdown-header {
    padding: 5px 15px;
}

.navbar-nav-branch .dropdown-menu > li {
    display: inline-block;
    width: 100%;
}
.navbar-nav-branch .dropdown-menu > li > a {
    display: inline-block;
    padding:15px !important;
    width: 100%;
}
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu:hover > a,
.dropdown-submenu:focus > a {
    color: #58666e;
    background-color: #edf1f2 !important;
}

.dropdown-submenu:hover > .dropdown-menu,
.dropdown-submenu:focus > .dropdown-menu {
    display: block;
}

.dropdown-submenu.pull-left {
    float: none !important;
}

.dropdown-submenu.pull-left > .dropdown-menu {
    left: -100%;
    margin-left: 10px;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
}

.dropup .dropdown-submenu > .dropdown-menu {
    top: auto;
    bottom: 0;
}

.btn-group > .btn {
    margin-left: -1px;
}

/*cols*/

.col-lg-2-4 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-0 {
    clear: left;
}

.row.no-gutter {
    margin-right: 0;
    margin-left: 0;
}

.no-gutter [class*="col"] {
    padding: 0;
}

.row-sm {
    margin-right: -10px;
    margin-left: -10px;
}

.row-sm > div {
    padding-right: 10px;
    padding-left: 10px;
}

.modal-backdrop {
    background-color: #3a3f51;
}

.modal-backdrop.in {

}

.modal-over {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.modal-center {
    position: absolute;
    top: 50%;
    left: 50%;
}

/*layout*/

html,
body {
    width: 100%;
    height: 100%;
}

body {
    overflow-x: hidden;
}

.app {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 100%;
}

.app:before {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    display: block;
    width: inherit;
    background-color: #f0f3f4;
    border: inherit;
    content: "";
}

.app-header-fixed {
    padding-top: 50px;
}

.app-header-fixed .app-header {
    position: fixed;
    top: 0;
    width: 100%;
}

.app-header {
    z-index: 1025;
    border-radius: 0;
}

.app-aside {
    float: left;
}

.app-aside:before {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    width: inherit;
    background-color: inherit;
    border: inherit;
    content: "";
}

.app-aside-footer {
    position: absolute;
    bottom: 0;
    z-index: 1000;
    width: 100%;
    max-width: 200px;
}

.app-aside-folded .app-aside-footer {
    max-width: 60px;
}

.app-aside-footer ~ div {
    padding-bottom: 50px;
}

.app-aside-right {
    padding-bottom: 50px;
}

.app-content {
    height: 100%;
}

.app-content:before,
.app-content:after {
    display: table;
    content: " ";
}

.app-content:after {
    clear: both;
}

.app-content-full {
    position: absolute;
    top: 50px;
    bottom: 50px;
    width: auto !important;
    height: auto;
    padding: 0 !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.app-content-full.h-full {
    bottom: 0;
    height: auto;
}

.app-content-body {
    float: left;
    width: 100%;
    padding-bottom: 50px;
}

.app-footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 105;
}

.app-footer.app-footer-fixed {
    position: fixed;
}

.hbox {
    display: table;
    width: 100%;
    height: 100%;
    border-spacing: 0;
    table-layout: fixed;
}

.hbox .col {
    display: table-cell;
    float: none;
    height: 100%;
    vertical-align: top;
}

.v-middle {
    vertical-align: middle !important;
}

.v-top {
    vertical-align: top !important;
}

.v-bottom {
    vertical-align: bottom !important;
}

.vbox {
    position: relative;
    display: table;
    width: 100%;
    height: 100%;
    min-height: 240px;
    border-spacing: 0;
}

.vbox .row-row {
    display: table-row;
    height: 100%;
}

.vbox .row-row .cell {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.ie .vbox .row-row .cell {
    display: table-cell;
}

.vbox .row-row .cell .cell-inner {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.navbar {
    margin: 0;
    border-width: 0;
    border-radius: 0;
}

.navbar .navbar-form-sm {
    margin-top: 10px;
    margin-bottom: 10px;
}

.navbar-md {
    min-height: 60px;
}

.navbar-md .navbar-btn {
    margin-top: 13px;
}

.navbar-md .navbar-form {
    margin-top: 15px;
}

.navbar-md .navbar-nav > li > a {
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

.navbar-md .navbar-brand {
    line-height: 60px;
}

.navbar-header > button {
    padding: 10px 17px;
    font-size: 16px;
    line-height: 30px;
    text-decoration: none;
    background-color: transparent;
    border: none;
}

.navbar-brand {
    display: inline-block;
    float: none;
    height: auto;
    padding: 0 15px;
    font-size: 20px;
    font-weight: 700;
    line-height: 50px;
    text-align: center;
}

.navbar-brand:hover {
    text-decoration: none;
}

.navbar-brand img {
    display: inline;
    max-height: 20px;
    width: auto;
    margin-top: -4px;
    vertical-align: middle;
}

@media (min-width: 768px) {
    .app-aside,
    .navbar-header {
        width: 200px;
    }

    .navbar-collapse,
    .app-content,
    .app-footer {
        margin-left: 200px;
    }

    .app-aside-right {
        position: absolute;
        top: 50px;
        right: 0;
        bottom: 0;
        z-index: 1000;
    }

    .app-aside-right.pos-fix {
        z-index: 1010;
    }

    .visible-folded {
        display: none;
    }

    .app-aside-folded .hidden-folded {
        display: none !important;
    }

    .app-aside-folded .visible-folded {
        display: inherit;
    }

    .app-aside-folded .text-center-folded {
        text-align: center;
    }

    .app-aside-folded .pull-none-folded {
        float: none !important;
    }

    .app-aside-folded .w-auto-folded {
        width: auto;
    }

    .app-aside-folded .app-aside,
    .app-aside-folded .navbar-header {
        width: 60px;
    }

    .app-aside-folded .navbar-collapse,
    .app-aside-folded .app-content,
    .app-aside-folded .app-footer {
        margin-left: 60px;
    }

    .cls-merchant-app .app-aside-folded .navbar-collapse,.cls-merchant-app .app-aside-folded .app-content,.cls-merchant-app .app-aside-folded .app-footer{
        margin-left:0;
    }

    .app-aside-folded .app-header .navbar-brand {
        display: block;
        padding: 0;
        padding-right:15px;
    }

    .app-aside-fixed .app-header .navbar-header {
        position: fixed;
    }

    .app-aside-fixed .aside-wrap {
        position: fixed;
        top: 50px;
        bottom: 0;
        left: 0;
        z-index: 1000;
        width: 199px;
        overflow: hidden;
    }

    .app-aside-fixed .aside-wrap .navi-wrap {
        position: relative;
        width: 217px;
        height: 100%;
        overflow-x: hidden;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
    }

    .app-aside-fixed .aside-wrap .navi-wrap::-webkit-scrollbar {
        -webkit-appearance: none;
    }

    .app-aside-fixed .aside-wrap .navi-wrap::-webkit-scrollbar:vertical {
        width: 17px;
    }

    .app-aside-fixed .aside-wrap .navi-wrap > * {
        width: 200px;
    }

    .smart .app-aside-fixed .aside-wrap .navi-wrap {
        width: 200px;
    }

    .app-aside-fixed.app-aside-folded .app-aside {
        position: fixed;
        top: 0;
        bottom: 0;
        z-index: 1010;
    }

    .app-aside-fixed.app-aside-folded .aside-wrap {
        width: 59px;
    }

    .app-aside-fixed.app-aside-folded .aside-wrap .navi-wrap {
        width: 77px;
    }

    .app-aside-fixed.app-aside-folded .aside-wrap .navi-wrap > * {
        width: 60px;
    }

    .smart .app-aside-fixed.app-aside-folded .aside-wrap .navi-wrap {
        width: 60px;
    }

    .bg-auto:before {
        position: absolute;
        top: 0;
        bottom: 0;
        z-index: -1;
        width: inherit;
        background-color: inherit;
        border: inherit;
        content: "";
    }

    .bg-auto.b-l:before {
        margin-left: -1px;
    }

    .bg-auto.b-r:before {
        margin-right: -1px;
    }

    .col.show {
        display: table-cell !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hbox-auto-sm {
        display: block;
    }

    .hbox-auto-sm > .col {
        display: block;
        width: auto;
        height: auto;
    }

    .hbox-auto-sm > .col.show {
        display: block !important;
    }
}

@media (max-width: 767px) {
    .app-aside {
        float: none;
    }

    .app-content-full {
        width: 100% !important;
    }

    .hbox-auto-xs {
        display: block;
    }

    .hbox-auto-xs > .col {
        display: block;
        width: auto;
        height: auto;
    }

    .navbar-nav {
        margin-top: 0;
        margin-bottom: 0;
    }

    .navbar-nav > li > a {
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
    }

    .navbar-nav > li > a .up {
        top: 0;
    }

    .navbar-nav > li > a .avatar {
        width: 30px;
        margin-top: -5px;
    }

    .navbar-nav .open .dropdown-menu {
        background-color: #fff;
    }

    .navbar-form {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
    }

    .navbar-form .form-group {
        margin-bottom: 0;
    }
}

html {
    background: #FAFAFA;
    background-attachment: fixed;
    background-size: cover;
}

.app.container {
    padding-right: 0;
    padding-left: 0;
}

@media (min-width: 768px) {
    .app.container {
        width: 750px;
        -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.3);
        box-shadow: 0 0 30px rgba(0, 0, 0, 0.3);
    }

    .app.container .app-aside {
        overflow-x: hidden;
    }

    .app.container.app-aside-folded .app-aside {
        overflow-x: visible;
    }

    .app.container.app-aside-fixed .aside-wrap {
        left: inherit;
    }

    .app.container.app-aside-fixed.app-aside-folded .app-aside > ul.nav {
        position: absolute;
    }

    .app.container .app-header,
    .app.container .app-aside {
        max-width: 750px;
    }

    .app.container .app-footer-fixed {
        right: auto;
        left: auto;
        width: 100%;
        max-width: 550px;
    }

    .app.container.app-aside-folded .app-footer-fixed {
        max-width: 690px;
    }

    .app.container.app-aside-dock .app-footer-fixed {
        max-width: 750px;
    }
}

@media (min-width: 992px) {
    .app.container {
        width: 970px;
    }

    .app.container .app-header,
    .app.container .app-aside {
        max-width: 970px;
    }

    .app.container .app-footer-fixed {
        max-width: 770px;
    }

    .app.container.app-aside-folded .app-footer-fixed {
        max-width: 910px;
    }

    .app.container.app-aside-dock .app-footer-fixed {
        max-width: 970px;
    }
}

@media (min-width: 1200px) {
    .app.container {
        width: 1170px;
    }

    .app.container .app-header,
    .app.container .app-aside {
        max-width: 1170px;
    }

    .app.container .app-footer-fixed {
        max-width: 970px;
    }

    .app.container.app-aside-folded .app-footer-fixed {
        max-width: 1110px;
    }

    .app.container.app-aside-dock .app-footer-fixed {
        max-width: 1170px;
    }
}

.nav-sub {
    height: 0;
    margin-left: -20px;
    overflow: hidden;
    opacity: 0;
    -webkit-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s;
}

.active > .nav-sub,
.app-aside-folded li:hover > .nav-sub,
.app-aside-folded li:focus > .nav-sub,
.app-aside-folded li:active > .nav-sub {
    height: auto !important;
    margin-left: 0;
    overflow: auto;
    opacity: 1;
}

.nav-sub-header {
    display: none !important;
}

.nav-sub-header a {
    padding: 15px 20px;
}

.navi ul.nav li {
    position: relative;
    display: block;
}
.navi ul.nav li li a {
    padding-left: 55px;
}

.navi ul.nav li li ul {
    display: none;
}

.navi ul.nav li li.active > ul {
    display: block;
}

.navi ul.nav li a {
    position: relative;
    display: block;
    padding: 10px 20px;
    font-weight: normal;
    text-transform: none;
    -webkit-transition: background-color 0.2s ease-in-out 0s;
    transition: background-color 0.2s ease-in-out 0s;
}

.navi ul.nav li a .badge,
.navi ul.nav li a .label {
    padding: 2px 5px;
    margin-top: 2px;
    font-size: 11px;
}

.navi ul.nav li a > i {
    position: relative;
    float: left;
    width: 40px;
    margin: -10px -10px;
    margin-right: 5px;
    overflow: hidden;
    line-height: 40px;
    text-align: center;
}

.navi ul.nav li a > i:before {
    position: relative;
    z-index: 2;
}

.navi ul.nav li a .badge{
    font-size: 7px;
    padding:1px 3px;
    top:0;
}
.navbar-nav-branch.navbar-nav > li > a > span{
    font-size: 10px;
    display: inline-block;
    max-width: 105px;
    max-height: 14px;
    overflow: hidden;
}
.nav.navbar-right.navbar-nav > li:first-child > a{
    font-size: 10px;
    line-height: 12px;
    max-width: 138px;
    max-height: 50px;
    min-height: 50px;
    overflow: hidden;
    padding-left:5px;
    padding-right:5px;
    padding-top:10px;
}
.nav.navbar-right.navbar-nav > li:first-child > a > span{
    margin-top:-5px;
    margin-left:2px;
}

@media (min-width: 768px) {
    .app-aside-folded .nav-sub-header {
        display: block !important;
    }

    .app-aside-folded .nav-sub-header a {
        padding: 15px 20px !important;
    }

    .app-aside-folded .navi > ul > li > a {
        position: relative;
        height: 50px;
        padding: 0;
        text-align: center;
        border: none;
    }

    .app-aside-folded .navi > ul > li > a span {
        display: none;
    }

    .app-aside-folded .navi > ul > li > a span.pull-right {
        display: none !important;
    }

    .app-aside-folded .navi > ul > li > a i {
        display: block;
        float: none;
        width: auto;
        margin: 0;
        font-size: 16px;
        line-height: 50px;
        border: none !important;
    }

    .app-aside-folded .navi > ul > li > a i b {
        left: 0 !important;
    }

    .app-aside-folded .navi > ul > li > a .badge,
    .app-aside-folded .navi > ul > li > a .label {
        position: absolute;
        top: 8px;
        right: 12px;
        z-index: 3;
    }

    .app-aside-folded .navi > ul > li > ul {
        position: absolute;
        top: 0 !important;
        left: 100%;
        z-index: 1050;
        width: 200px;
        height: 0 !important;
        -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    }

    .app-aside-folded .navi li li a {
        padding-left: 20px !important;
    }

    .app-aside-folded.app-aside-fixed .app-aside > ul.nav {
        position: fixed;
        left: 80px;
        z-index: 1010;
        display: block;
        width: 260px;
        height: auto;
        overflow: visible;
        overflow-y: auto;
        opacity: 1;
        -webkit-overflow-scrolling: touch;
    }

    .app-aside-folded.app-aside-fixed .app-aside > ul.nav:before {
        position: absolute;
        top: 0;
        left: -60px;
        width: 60px;
        height: 50px;
        content: "";
    }

    .app-aside-folded.app-aside-fixed .app-aside > ul.nav a {
        padding-right: 20px !important;
        padding-left: 20px !important;
    }
}

@media (max-width: 767px) {
    .app {
        overflow-x: hidden;
    }

    .app-content {
        -webkit-transition: -webkit-transform 0.2s ease;
        -moz-transition: -moz-transform 0.2s ease;
        -o-transition: -o-transform 0.2s ease;
        transition: transform 0.2s ease;
    }

    .off-screen {
        position: absolute;
        top: 50px;
        bottom: 0;
        z-index: 1010;
        display: block !important;
        width: 75%;
        overflow-x: hidden;
        overflow-y: auto;
        visibility: visible;
        -webkit-overflow-scrolling: touch;
    }

    .off-screen + * {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1015;
        width: 100%;
        padding-top: 50px;
        overflow: hidden;
        background-color: #f0f3f4;
        -webkit-transform: translate3d(75%, 0, 0px);
        transform: translate3d(75%, 0, 0px);
        -webkit-transition: -webkit-transform 0.2s ease;
        -moz-transition: -moz-transform 0.2s ease;
        -o-transition: -o-transform 0.2s ease;
        transition: transform 0.2s ease;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .off-screen + * .off-screen-toggle {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1020;
        display: block !important;
    }

    .off-screen.pull-right {
        right: 0;
    }

    .off-screen.pull-right + * {
        -webkit-transform: translate3d(-75%, 0, 0px);
        transform: translate3d(-75%, 0, 0px);
    }
    .nav.navbar-right.navbar-nav > li:first-child > a{
        max-width: 100%;
    }
}

@media (min-width: 992px) {
    .app-aside-dock .app-content,
    .app-aside-dock .app-footer {
        margin-left: 0;
    }

    .app-aside-dock .app-aside-footer ~ div {
        padding-bottom: 0;
    }

    .app-aside-dock.app-aside-fixed.app-header-fixed {
        padding-top: 115px;
    }

    .app-aside-dock.app-aside-fixed .app-aside {
        position: fixed;
        top: 50px;
        z-index: 1000;
        width: 100%;
    }

    .app-aside-dock .app-aside,
    .app-aside-dock .aside-wrap,
    .app-aside-dock .navi-wrap {
        position: relative;
        top: 0;
        float: none;
        width: 100% !important;
        overflow: visible !important;
    }

    .app-aside-dock .navi-wrap > * {
        width: auto !important;
    }

    .app-aside-dock .app-aside {
        bottom: auto !important;
    }

    .app-aside-dock .app-aside.b-r {
        border-bottom: 1px solid #dee5e7;
        border-right-width: 0;
    }

    .app-aside-dock .app-aside:before {
        display: none;
    }

    .app-aside-dock .app-aside nav > .nav {
        float: left;
    }

    .app-aside-dock .app-aside .hidden-folded,
    .app-aside-dock .app-aside .line,
    .app-aside-dock .app-aside .navi-wrap > div {
        display: none !important;
    }

    .app-aside-dock .app-aside .navi > ul > li {
        position: relative;
        display: inline-block;
        float: left;
    }

    .app-aside-dock .app-aside .navi > ul > li > a {
        height: auto;
        padding: 10px 15px 12px 15px;
        text-align: center;
    }

    .app-aside-dock .app-aside .navi > ul > li > a > .badge,
    .app-aside-dock .app-aside .navi > ul > li > a > .label {
        position: absolute;
        top: 5px;
        right: 8px;
        padding: 1px 4px;
    }

    .app-aside-dock .app-aside .navi > ul > li > a > i {
        display: block;
        float: none;
        width: 40px;
        margin-top: -10px;
        margin-right: auto;
        margin-bottom: -7px;
        margin-left: auto;
        font-size: 14px;
        line-height: 40px;
    }

    .app-aside-dock .app-aside .navi > ul > li > a > span.pull-right {
        position: absolute;
        bottom: 2px;
        left: 50%;
        display: block !important;
        margin-left: -6px;
        line-height: 1;
    }

    .app-aside-dock .app-aside .navi > ul > li > a > span.pull-right i {
        width: 12px;
        font-size: 12px;
        line-height: 12px;
    }

    .app-aside-dock .app-aside .navi > ul > li > a > span.pull-right i.text {
        line-height: 14px;
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
    }

    .app-aside-dock .app-aside .navi > ul > li > a > span {
        display: block;
        font-weight: normal;
    }

    .app-aside-dock .app-aside .navi > ul > li .nav-sub {
        position: absolute;
        top: auto !important;
        left: 0;
        z-index: 1050;
        display: none;
        width: 200px;
        height: auto !important;
        -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    }

    .app-aside-dock .app-aside .navi > ul > li .nav-sub-header {
        display: none !important;
    }

    .app-aside-dock .app-aside .navi li li a {
        padding-left: 15px;
    }

    .app-aside-dock .app-aside .navi li:hover > .nav-sub,
    .app-aside-dock .app-aside .navi li:focus > .nav-sub,
    .app-aside-dock .app-aside .navi li:active > .nav-sub {
        display: block;
        height: auto !important;
        margin-left: 0;
        overflow: auto;
        opacity: 1;
    }
}

.arrow {
    z-index: 10;
    border-width: 9px;
}

.arrow,
.arrow:after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}

.arrow:after {
    border-width: 8px;
    content: "";
}

.arrow.top {
    top: -9px;
    left: 50%;
    margin-left: -9px;
    border-bottom-color: rgba(0, 0, 0, 0.1);
    border-top-width: 0;
}

.arrow.top:after {
    top: 1px;
    margin-left: -8px;
    border-bottom-color: #ffffff;
    border-top-width: 0;
}

.arrow.top.arrow-primary:after {
    border-bottom-color: #7266ba;
}

.arrow.top.arrow-info:after {
    border-bottom-color: #23b7e5;
}

.arrow.top.arrow-success:after {
    border-bottom-color: #abd373;
}

.arrow.top.arrow-danger:after {
    border-bottom-color: #f26c4f;
}

.arrow.top.arrow-warning:after {
    border-bottom-color: #fad733;
}

.arrow.top.arrow-light:after {
    border-bottom-color: #edf1f2;
}

.arrow.top.arrow-dark:after {
    border-bottom-color: #3a3f51;
}

.arrow.top.arrow-black:after {
    border-bottom-color: #1c2b36;
}

.arrow.right {
    top: 50%;
    right: -9px;
    margin-top: -9px;
    border-left-color: rgba(0, 0, 0, 0.1);
    border-right-width: 0;
}

.arrow.right:after {
    right: 1px;
    bottom: -8px;
    border-left-color: #ffffff;
    border-right-width: 0;
}

.arrow.right.arrow-primary:after {
    border-left-color: #7266ba;
}

.arrow.right.arrow-info:after {
    border-left-color: #23b7e5;
}

.arrow.right.arrow-success:after {
    border-left-color: #abd373;
}

.arrow.right.arrow-danger:after {
    border-left-color: #f26c4f;
}

.arrow.right.arrow-warning:after {
    border-left-color: #fad733;
}

.arrow.right.arrow-light:after {
    border-left-color: #edf1f2;
}

.arrow.right.arrow-dark:after {
    border-left-color: #3a3f51;
}

.arrow.right.arrow-black:after {
    border-left-color: #1c2b36;
}

.arrow.bottom {
    bottom: -9px;
    left: 50%;
    margin-left: -9px;
    border-top-color: rgba(0, 0, 0, 0.1);
    border-bottom-width: 0;
}

.arrow.bottom:after {
    bottom: 1px;
    margin-left: -8px;
    border-top-color: #ffffff;
    border-bottom-width: 0;
}

.arrow.bottom.arrow-primary:after {
    border-top-color: #7266ba;
}

.arrow.bottom.arrow-info:after {
    border-top-color: #23b7e5;
}

.arrow.bottom.arrow-success:after {
    border-top-color: #abd373;
}

.arrow.bottom.arrow-danger:after {
    border-top-color: #f26c4f;
}

.arrow.bottom.arrow-warning:after {
    border-top-color: #fad733;
}

.arrow.bottom.arrow-light:after {
    border-top-color: #edf1f2;
}

.arrow.bottom.arrow-dark:after {
    border-top-color: #3a3f51;
}

.arrow.bottom.arrow-black:after {
    border-top-color: #1c2b36;
}

.arrow.left {
    top: 50%;
    left: -9px;
    margin-top: -9px;
    border-right-color: rgba(0, 0, 0, 0.1);
    border-left-width: 0;
}

.arrow.left:after {
    bottom: -8px;
    left: 1px;
    border-right-color: #ffffff;
    border-left-width: 0;
}

.arrow.left.arrow-primary:after {
    border-right-color: #7266ba;
}

.arrow.left.arrow-info:after {
    border-right-color: #23b7e5;
}

.arrow.left.arrow-success:after {
    border-right-color: #abd373;
}

.arrow.left.arrow-danger:after {
    border-right-color: #f26c4f;
}

.arrow.left.arrow-warning:after {
    border-right-color: #fad733;
}

.arrow.left.arrow-light:after {
    border-right-color: #edf1f2;
}

.arrow.left.arrow-dark:after {
    border-right-color: #3a3f51;
}

.arrow.left.arrow-black:after {
    border-right-color: #1c2b36;
}

.arrow.pull-left {
    left: 19px;
}

.arrow.pull-right {
    right: 19px;
    left: auto;
}

.arrow.pull-up {
    top: 19px;
}

.arrow.pull-down {
    top: auto;
    bottom: 19px;
}

.btn {
    font-weight: 500;
    border-radius: 2px;
    outline: 0 !important;
    padding: 5px 12px;
}

.btn-link {
    color: #58666e;
}

.btn-link.active {
    box-shadow: none;
    webkit-box-shadow: none;
}

.btn-default {
    color: #58666e !important;
    background-color: #fcfdfd;
    background-color: #fff;
    border-color: #999;
    border-bottom-color: #999;
    -webkit-box-shadow: 0 1px 1px rgba(90, 90, 90, 0.1);
    box-shadow: 0 1px 1px rgba(90, 90, 90, 0.1);
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
    color: #58666e !important;
    background-color: #edf1f2;
    border-color: #c7d3d6;
}

.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
    background-image: none;
}

.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
    background-color: #fcfdfd;
    border-color: #dee5e7;
}

.btn-default.btn-bg {
    border-color: rgba(0, 0, 0, 0.1);
    background-clip: padding-box;
}

.btn-primary {
    color: #ffffff !important;
    background-color: #7266ba;
    border-color: #7266ba;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    color: #ffffff !important;
    background-color: #6254b2;
    border-color: #5a4daa;
}

.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    background-image: none;
}

.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
    background-color: #7266ba;
    border-color: #7266ba;
}

.btn-success {
    color: #ffffff !important;
    background-color: #abd373;
    border-color: #abd373;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
    color: #ffffff !important;
    background-color: #9ACC51;
    border-color: #20a03f;
}

.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
    background-image: none;
}

.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
    background-color: #D6EAB7;
    border-color: #D6EAB7;
}

.btn-info {
    color: #ffffff !important;
    background-color: #23b7e5;
    border-color: #23b7e5;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
    color: #ffffff !important;
    background-color: #19a9d5;
    border-color: #189ec8;
}

.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
    background-image: none;
}

.btn-info.disabled,
.btn-info[disabled],
fieldset[disabled] .btn-info,
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled:active,
.btn-info[disabled]:active,
fieldset[disabled] .btn-info:active,
.btn-info.disabled.active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active {
    background-color: #23b7e5;
    border-color: #23b7e5;
}

.btn-warning {
    color: #ffffff !important;
    background-color: #fad733;
    border-color: #fad733;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
    color: #ffffff !important;
    background-color: #f9d21a;
    border-color: #f9cf0b;
}

.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
    background-image: none;
}

.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
    background-color: #fad733;
    border-color: #fad733;
}

.btn-danger {
    color: #ffffff !important;
    background-color: #f26c4f;
    border-color: #f26c4f;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
    color: #ffffff !important;
    background-color: #ee3939;
    border-color: #ed2a2a;
}

.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
    background-image: none;
}

.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
    background-color: #f26c4f;
    border-color: #f26c4f;
}

.btn-dark {
    color: #ffffff !important;
    background-color: #3a3f51;
    border-color: #3a3f51;
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active,
.btn-dark.active,
.open .dropdown-toggle.btn-dark {
    color: #ffffff !important;
    background-color: #2f3342;
    border-color: #292d39;
}

.btn-dark:active,
.btn-dark.active,
.open .dropdown-toggle.btn-dark {
    background-image: none;
}

.btn-dark.disabled,
.btn-dark[disabled],
fieldset[disabled] .btn-dark,
.btn-dark.disabled:hover,
.btn-dark[disabled]:hover,
fieldset[disabled] .btn-dark:hover,
.btn-dark.disabled:focus,
.btn-dark[disabled]:focus,
fieldset[disabled] .btn-dark:focus,
.btn-dark.disabled:active,
.btn-dark[disabled]:active,
fieldset[disabled] .btn-dark:active,
.btn-dark.disabled.active,
.btn-dark[disabled].active,
fieldset[disabled] .btn-dark.active {
    background-color: #3a3f51;
    border-color: #3a3f51;
}

.btn-black {
    color: #ffffff !important;
    background-color: #1c2b36;
    border-color: #1c2b36;
}

.btn-black:hover,
.btn-black:focus,
.btn-black:active,
.btn-black.active,
.open .dropdown-toggle.btn-black {
    color: #ffffff !important;
    background-color: #131e25;
    border-color: #0e161b;
}

.btn-black:active,
.btn-black.active,
.open .dropdown-toggle.btn-black {
    background-image: none;
}

.btn-black.disabled,
.btn-black[disabled],
fieldset[disabled] .btn-black,
.btn-black.disabled:hover,
.btn-black[disabled]:hover,
fieldset[disabled] .btn-black:hover,
.btn-black.disabled:focus,
.btn-black[disabled]:focus,
fieldset[disabled] .btn-black:focus,
.btn-black.disabled:active,
.btn-black[disabled]:active,
fieldset[disabled] .btn-black:active,
.btn-black.disabled.active,
.btn-black[disabled].active,
fieldset[disabled] .btn-black.active {
    background-color: #1c2b36;
    border-color: #1c2b36;
}

.btn-icon {
    width: 34px;
    height: 34px;
    padding: 0 !important;
    text-align: center;
}

.btn-icon i {
    position: relative;
    top: -1px;
    line-height: 34px;
}

.btn-icon.btn-sm {
    width: 30px;
    height: 30px;
}

.btn-icon.btn-sm i {
    line-height: 30px;
}

.btn-icon.btn-lg {
    width: 45px;
    height: 45px;
}

.btn-icon.btn-lg i {
    line-height: 45px;
}

.btn-rounded {
    padding-right: 15px;
    padding-left: 15px;
    border-radius: 50px;
}

.btn-rounded.btn-lg {
    padding-right: 25px;
    padding-left: 25px;
}

.btn > i.pull-left,
.btn > i.pull-right {
    line-height: 1.42857143;
}

.btn-block {
    padding-right: 12px;
    padding-left: 12px;
}

.btn-group-vertical > .btn:first-child:not(:last-child) {
    border-top-right-radius: 2px;
}

.btn-group-vertical > .btn:last-child:not(:first-child) {
    border-bottom-left-radius: 2px;
}

.btn-addon i {
    position: relative;
    float: left;
    width: 34px;
    height: 34px;
    margin: -7px -12px;
    margin-right: 12px;
    line-height: 34px;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 2px 0 0 2px;
}

.btn-addon i.pull-right {
    margin-right: -12px;
    margin-left: 12px;
    border-radius: 0 2px 2px 0;
}

.btn-addon.btn-sm i {
    width: 30px;
    height: 30px;
    margin: -6px -10px;
    margin-right: 10px;
    line-height: 30px;
}

.btn-addon.btn-sm i.pull-right {
    margin-right: -10px;
    margin-left: 10px;
}

.btn-addon.btn-lg i {
    width: 45px;
    height: 45px;
    margin: -11px -16px;
    margin-right: 16px;
    line-height: 45px;
}

.btn-addon.btn-lg i.pull-right {
    margin-right: -16px;
    margin-left: 16px;
}

.btn-addon.btn-default i {
    background-color: transparent;
    border-right: 1px solid #dee5e7;
}

.btn-groups .btn {
    margin-bottom: 5px;
}

.btn-dashed{
    border: 1px dashed #999;
}

.list-icon i {
    display: inline-block;
    width: 40px;
    margin: 0;
    font-size: 14px;
    text-align: center;
    vertical-align: middle;
    -webkit-transition: font-size 0.2s;
    transition: font-size 0.2s;
}

.list-icon div {
    line-height: 40px;
    white-space: nowrap;
}

.list-icon div:hover i {
    font-size: 26px;
}

.settings {
    position: fixed;
    top: 120px;
    right: -240px;
    z-index: 1050;
    width: 240px;
    -webkit-transition: right 0.2s;
    transition: right 0.2s;
}

.settings.active {
    right: -1px;
}

.settings > .btn {
    position: absolute;
    top: -1px;
    left: -42px;
    padding: 10px 15px;
    background: #f6f8f8 !important;
    border-color: #dee5e7;
    border-right-width: 0;
}

.settings .i-checks span b {
    display: inline-block;
    float: left;
    width: 50%;
    height: 20px;
}

.settings .i-checks span b.header {
    height: 10px;
}

.streamline {
    position: relative;
    border-color: #dee5e7;
}

.streamline .sl-item:after,
.streamline:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 9px;
    height: 9px;
    margin-left: -5px;
    background-color: #fff;
    border-color: inherit;
    border-style: solid;
    border-width: 1px;
    border-radius: 10px;
    content: '';
}

.sl-item {
    position: relative;
    padding-bottom: 1px;
    border-color: #dee5e7;
}

.sl-item:before,
.sl-item:after {
    display: table;
    content: " ";
}

.sl-item:after {
    clear: both;
}

.sl-item:after {
    top: 6px;
    bottom: auto;
}

.sl-item.b-l {
    margin-left: -1px;
}

.timeline {
    padding: 0;
    margin: 0;
}

.tl-item {
    display: block;
}

.tl-item:before,
.tl-item:after {
    display: table;
    content: " ";
}

.tl-item:after {
    clear: both;
}

.visible-left {
    display: none;
}

.tl-wrap {
    display: block;
    padding: 15px 0 15px 20px;
    margin-left: 6em;
    border-color: #dee5e7;
    border-style: solid;
    border-width: 0 0 0 4px;
}

.tl-wrap:before,
.tl-wrap:after {
    display: table;
    content: " ";
}

.tl-wrap:after {
    clear: both;
}

.tl-wrap:before {
    position: relative;
    top: 15px;
    float: left;
    width: 10px;
    height: 10px;
    margin-left: -27px;
    background: #edf1f2;
    border-color: inherit;
    border-style: solid;
    border-width: 3px;
    border-radius: 50%;
    content: "";
    box-shadow: 0 0 0 4px #f0f3f4;
}

.tl-wrap:hover:before {
    background: transparent;
    border-color: #fff;
}

.tl-date {
    position: relative;
    top: 10px;
    display: block;
    float: left;
    width: 4.5em;
    margin-left: -7.5em;
    text-align: right;
}

.tl-content {
    position: relative;
    display: inline-block;
    padding-top: 10px;
    padding-bottom: 10px;
}

.tl-content.block {
    display: block;
    width: 100%;
}

.tl-content.panel {
    margin-bottom: 0;
}

.tl-header {
    display: block;
    width: 12em;
    margin-left: 2px;
    text-align: center;
}

.timeline-center .tl-item {
    margin-left: 50%;
}

.timeline-center .tl-item .tl-wrap {
    margin-left: -2px;
}

.timeline-center .tl-header {
    width: auto;
    margin: 0;
}

.timeline-center .tl-left {
    margin-right: 50%;
    margin-left: 0;
}

.timeline-center .tl-left .hidden-left {
    display: none !important;
}

.timeline-center .tl-left .visible-left {
    display: inherit;
}

.timeline-center .tl-left .tl-wrap {
    float: right;
    padding-right: 20px;
    padding-left: 0;
    margin-right: -2px;
    border-right-width: 4px;
    border-left-width: 0;
}

.timeline-center .tl-left .tl-wrap:before {
    float: right;
    margin-right: -27px;
    margin-left: 0;
}

.timeline-center .tl-left .tl-date {
    float: right;
    margin-right: -8.5em;
    margin-left: 0;
    text-align: left;
}

.i-switch {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 20px;
    margin: 0;
    cursor: pointer;
    background-color: #abd373;
    border-radius: 30px;
}

.i-switch input {
    position: absolute;
    opacity: 0;
    filter: alpha(opacity=0);
}

.i-switch input:checked + i:before {
    top: 50%;
    right: 5px;
    bottom: 50%;
    left: 50%;
    border-width: 0;
    border-radius: 5px;
}

.i-switch input:checked + i:after {
    margin-left: 16px;
}

.i-switch i:before {
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    background-color: #fff;
    border: 1px solid #999;
    border-radius: 30px;
    content: "";
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}

.i-switch i:after {
    position: absolute;
    top: 1px;
    bottom: 1px;
    width: 18px;
    background-color: #fff;
    border-radius: 50%;
    content: "";
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
    -webkit-transition: margin-left 0.3s;
    transition: margin-left 0.3s;
}

.i-switch-md {
    width: 40px;
    height: 24px;
}

.i-switch-md input:checked + i:after {
    margin-left: 17px;
}

.i-switch-md i:after {
    width: 22px;
}

.i-switch-lg {
    width: 50px;
    height: 30px;
}

.i-switch-lg input:checked + i:after {
    margin-left: 21px;
}

.i-switch-lg i:after {
    width: 28px;
}

.i-checks {
    padding-left: 20px;
    cursor: pointer;
}

.i-checks input {
    position: absolute;
    margin-left: -20px;
    opacity: 0;
}

.i-checks input:checked + i {
    border-color: #23b7e5;
}

.i-checks input:checked + i:before {
    top: 4px;
    left: 4px;
    width: 10px;
    height: 10px;
    background-color: #23b7e5;
}

.i-checks input:checked + span .active {
    display: inherit;
}

.i-checks input[type="radio"] + i,
.i-checks input[type="radio"] + i:before {
    border-radius: 50%;
}

.i-checks input[disabled] + i,
fieldset[disabled] .i-checks input + i {
    border-color: #dee5e7;
}

.i-checks input[disabled] + i:before,
fieldset[disabled] .i-checks input + i:before {
    background-color: #dee5e7;
}

.i-checks > i {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-top: -2px;
    margin-right: 4px;
    margin-left: -20px;
    line-height: 1;
    vertical-align: middle;
    background-color: #fff;
    border: 1px solid #999;
}

.i-checks > i:before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background-color: transparent;
    content: "";
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}

.i-checks > span {
    margin-left: -20px;
}

.i-checks > span .active {
    display: none;
}

.i-checks-sm input:checked + i:before {
    top: 3px;
    left: 3px;
    width: 8px;
    height: 8px;
}

.i-checks-sm > i {
    width: 16px;
    height: 16px;
    margin-right: 6px;
    margin-left: -18px;
}

.i-checks-lg input:checked + i:before {
    top: 8px;
    left: 8px;
    width: 12px;
    height: 12px;
}

.i-checks-lg > i {
    width: 30px;
    height: 30px;
}

.datepicker {
    margin: 0;
}

.datepicker .btn-default {
    border-width: 0;
    box-shadow: none;
}

.datepicker .btn[disabled] {
    opacity: 0.4;
}

.datepicker .btn-info .text-info {
    color: #fff !important;
}

/*Charts*/

.jqstooltip {
    padding: 5px 10px !important;
    background-color: rgba(0, 0, 0, 0.8) !important;
    border: solid 1px #000 !important;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.easyPieChart {
    position: relative;
    text-align: center;
}

.easyPieChart > div {
    position: relative;
    z-index: 1;
}

.easyPieChart > div .text {
    position: absolute;
    top: 60%;
    width: 100%;
    line-height: 1;
}

.easyPieChart > div img {
    margin-top: -4px;
}

.easyPieChart canvas {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

#flotTip {
    z-index: 100;
    padding: 4px 10px;
    font-size: 12px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.8);
    border: solid 1px #000 !important;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.legendColorBox > div {
    margin: 5px;
    border: none !important;
}

.legendColorBox > div > div {
    border-radius: 10px;
}

.sortable-placeholder {
    min-height: 50px;
    margin-bottom: 5px;
    list-style: none;
    border: 1px dashed #CCC;
}

.panel .dataTables_wrapper {
    padding-top: 10px;
}

.panel .dataTables_wrapper > .row {
    margin: 0;
}

.panel .dataTables_wrapper > .row > .col-sm-12 {
    padding: 0;
}

.st-sort-ascent:before {
    content: '\25B2';
}

.st-sort-descent:before {
    content: '\25BC';
}

.st-selected td {
    background: #f0f9ec !important;
}

.chosen-choices,
.chosen-single,
.bootstrap-tagsinput {
    border-color: #cfdadd !important;
    border-radius: 2px !important;
}

.bootstrap-tagsinput {
    padding: 5px 12px !important;
}

.item {
    position: relative;
}

.item .top {
    position: absolute;
    top: 0;
    left: 0;
}

.item .bottom {
    position: absolute;
    bottom: 0;
    left: 0;
}

.item .center {
    position: absolute;
    top: 50%;
}

.item-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
}

.item-overlay.active,
.item:hover .item-overlay {
    display: block;
}

.form-validation .form-control.ng-dirty.ng-invalid {
    border-color: #f26c4f;
}

.form-validation .form-control.ng-dirty.ng-valid,
.form-validation .form-control.ng-dirty.ng-valid:focus {
    border-color: #abd373;
}

.form-validation .i-checks .ng-invalid.ng-dirty + i {
    border-color: #f26c4f;
}

.ng-animate .bg-auto:before {
    display: none;
}

[ui-view].ng-leave {
    display: none;
}

[ui-view].ng-leave.smooth {
    display: block;
}

.smooth.ng-animate {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.fade-in-right-big.ng-enter {
    -webkit-animation: fadeInRightBig 0.5s;
    animation: fadeInRightBig 0.5s;
}

.fade-in-right-big.ng-leave {
    -webkit-animation: fadeOutLeftBig 0.5s;
    animation: fadeOutLeftBig 0.5s;
}

.fade-in-left-big.ng-enter {
    -webkit-animation: fadeInLeftBig 0.5s;
    animation: fadeInLeftBig 0.5s;
}

.fade-in-left-big.ng-leave {
    -webkit-animation: fadeOutRightBig 0.5s;
    animation: fadeOutRightBig 0.5s;
}

.fade-in-up-big.ng-enter {
    -webkit-animation: fadeInUpBig 0.5s;
    animation: fadeInUpBig 0.5s;
}

.fade-in-up-big.ng-leave {
    -webkit-animation: fadeOutUpBig 0.5s;
    animation: fadeOutUpBig 0.5s;
}

.fade-in-down-big.ng-enter {
    -webkit-animation: fadeInDownBig 0.5s;
    animation: fadeInDownBig 0.5s;
}

.fade-in-down-big.ng-leave {
    -webkit-animation: fadeOutDownBig 0.5s;
    animation: fadeOutDownBig 0.5s;
}

.fade-in.ng-enter {
    -webkit-animation: fadeIn 0.5s;
    animation: fadeIn 0.5s;
}

.fade-in.ng-leave {
    -webkit-animation: fadeOut 0.5s;
    animation: fadeOut 0.5s;
}

.fade-in-right.ng-enter {
    -webkit-animation: fadeInRight 0.5s;
    animation: fadeInRight 0.5s;
}

.fade-in-right.ng-leave {
    -webkit-animation: fadeOutLeft 0.5s;
    animation: fadeOutLeft 0.5s;
}

.fade-in-left.ng-enter {
    -webkit-animation: fadeInLeft 0.5s;
    animation: fadeInLeft 0.5s;
}

.fade-in-left.ng-leave {
    -webkit-animation: fadeOutRight 0.5s;
    animation: fadeOutRight 0.5s;
}

.fade-in-up.ng-enter {
    -webkit-animation: fadeInUp 0.5s;
    animation: fadeInUp 0.5s;
}

.fade-in-up.ng-leave {
    -webkit-animation: fadeOutUp 0.5s;
    animation: fadeOutUp 0.5s;
}

.fade-in-down.ng-enter {
    -webkit-animation: fadeInDown 0.5s;
    animation: fadeInDown 0.5s;
}

.fade-in-down.ng-leave {
    -webkit-animation: fadeOutDown 0.5s;
    animation: fadeOutDown 0.5s;
}

.bg-gd {
    background-image: -webkit-gradient(linear, left 0, left 100%, from(rgba(40, 50, 60, 0)), to(rgba(40, 50, 60, 0.075)));
    background-image: -webkit-linear-gradient(top, rgba(40, 50, 60, 0), 0, rgba(40, 50, 60, 0.075), 100%);
    background-image: -moz-linear-gradient(top, rgba(40, 50, 60, 0) 0, rgba(40, 50, 60, 0.075) 100%);
    background-image: linear-gradient(to bottom, rgba(40, 50, 60, 0) 0, rgba(40, 50, 60, 0.075) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0028323c', endColorstr='#1328323c', GradientType=0);
    filter: none;
}

.bg-gd-dk {
    background-image: -webkit-gradient(linear, left 10%, left 100%, from(rgba(40, 50, 60, 0)), to(rgba(40, 50, 60, 0.5)));
    background-image: -webkit-linear-gradient(top, rgba(40, 50, 60, 0), 10%, rgba(40, 50, 60, 0.5), 100%);
    background-image: -moz-linear-gradient(top, rgba(40, 50, 60, 0) 10%, rgba(40, 50, 60, 0.5) 100%);
    background-image: linear-gradient(to bottom, rgba(40, 50, 60, 0) 10%, rgba(40, 50, 60, 0.5) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0028323c', endColorstr='#8028323c', GradientType=0);
    filter: none;
}

.bg-light {
    color: #58666e;
    background-color: #edf1f2;
}

.bg-light.lt,
.bg-light .lt {
    background-color: #f3f5f6;
}

.bg-light.lter,
.bg-light .lter {
    background-color: #f6f8f8;
}

.bg-light.dk,
.bg-light .dk {
    background-color: #e4eaec;
}

.bg-light.dker,
.bg-light .dker {
    background-color: #dde6e9;
}

.bg-light.bg,
.bg-light .bg {
    background-color: #edf1f2;
}

.bg-dark {
    color: #a6a8b1;
    background-color: #3a3f51;
}

.bg-dark.lt,
.bg-dark .lt {
    background-color: #474c5e;
}

.bg-dark.lter,
.bg-dark .lter {
    background-color: #54596a;
}

.bg-dark.dk,
.bg-dark .dk {
    background-color: #2e3344;
}

.bg-dark.dker,
.bg-dark .dker {
    background-color: #232735;
}

.bg-dark.bg,
.bg-dark .bg {
    background-color: #3a3f51;
}

.bg-dark a {
    color: #c1c3c9;
}

.bg-dark a:hover {
    color: #ffffff;
}

.bg-dark a.list-group-item:hover,
.bg-dark a.list-group-item:focus {
    background-color: inherit;
}

.bg-dark .nav > li:hover > a,
.bg-dark .nav > li:focus > a,
.bg-dark .nav > li.active > a {
    color: #ffffff;
    background-color: #2e3344;
}

.bg-dark .nav > li > a {
    color: #b4b6bd;
}

.bg-dark .nav > li > a:hover,
.bg-dark .nav > li > a:focus {
    background-color: #32374a;
}

.bg-dark .nav .open > a {
    background-color: #2e3344;
}

.bg-dark .caret {
    border-top-color: #a6a8b1;
    border-bottom-color: #a6a8b1;
}

.bg-dark.navbar .nav > li.active > a {
    color: #ffffff;
    background-color: #2e3344;
}

.bg-dark .open > a,
.bg-dark .open > a:hover,
.bg-dark .open > a:focus {
    color: #ffffff;
}

.bg-dark .text-muted {
    color: #8b8e99 !important;
}

.bg-dark .text-lt {
    color: #eaebed !important;
}

.bg-dark.auto .list-group-item,
.bg-dark .auto .list-group-item {
    background-color: transparent;
    border-color: #2f3342 !important;
}

.bg-dark.auto .list-group-item:hover,
.bg-dark .auto .list-group-item:hover,
.bg-dark.auto .list-group-item:focus,
.bg-dark .auto .list-group-item:focus,
.bg-dark.auto .list-group-item:active,
.bg-dark .auto .list-group-item:active,
.bg-dark.auto .list-group-item.active,
.bg-dark .auto .list-group-item.active {
    background-color: #2e3344 !important;
}

.bg-black {
    color: #7793a7;
    background-color: #1c2b36;
}

.bg-black.lt,
.bg-black .lt {
    background-color: #263845;
}

.bg-black.lter,
.bg-black .lter {
    background-color: #314554;
}

.bg-black.dk,
.bg-black .dk {
    background-color: #131e26;
}

.bg-black.dker,
.bg-black .dker {
    background-color: #0a1015;
}

.bg-black.bg,
.bg-black .bg {
    background-color: #1c2b36;
}

.bg-black a {
    color: #96abbb;
}

.bg-black a:hover {
    color: #ffffff;
}

.bg-black a.list-group-item:hover,
.bg-black a.list-group-item:focus {
    background-color: inherit;
}

.bg-black .nav > li:hover > a,
.bg-black .nav > li:focus > a,
.bg-black .nav > li.active > a {
    color: #ffffff;
    background-color: #131e26;
}

.bg-black .nav > li > a {
    color: #869fb1;
}

.bg-black .nav > li > a:hover,
.bg-black .nav > li > a:focus {
    background-color: #16232d;
}

.bg-black .nav .open > a {
    background-color: #131e26;
}

.bg-black .caret {
    border-top-color: #7793a7;
    border-bottom-color: #7793a7;
}

.bg-black.navbar .nav > li.active > a {
    color: #ffffff;
    background-color: #131e26;
}

.bg-black .open > a,
.bg-black .open > a:hover,
.bg-black .open > a:focus {
    color: #ffffff;
}

.bg-black .text-muted {
    color: #5c798f !important;
}

.bg-black .text-lt {
    color: #c4d0d9 !important;
}

.bg-black.auto .list-group-item,
.bg-black .auto .list-group-item {
    background-color: transparent;
    border-color: #131e25 !important;
}

.bg-black.auto .list-group-item:hover,
.bg-black .auto .list-group-item:hover,
.bg-black.auto .list-group-item:focus,
.bg-black .auto .list-group-item:focus,
.bg-black.auto .list-group-item:active,
.bg-black .auto .list-group-item:active,
.bg-black.auto .list-group-item.active,
.bg-black .auto .list-group-item.active {
    background-color: #131e26 !important;
}

.bg-primary {
    color: #f4f3f9;
    background-color: #7266ba;
}

.bg-primary.lt,
.bg-primary .lt {
    background-color: #847abf;
}

.bg-primary.lter,
.bg-primary .lter {
    background-color: #958dc6;
}

.bg-primary.dk,
.bg-primary .dk {
    background-color: #6051b5;
}

.bg-primary.dker,
.bg-primary .dker {
    background-color: #5244a9;
}

.bg-primary.bg,
.bg-primary .bg {
    background-color: #7266ba;
}

.bg-primary a {
    color: #ffffff;
}

.bg-primary a:hover {
    color: #ffffff;
}

.bg-primary a.list-group-item:hover,
.bg-primary a.list-group-item:focus {
    background-color: inherit;
}

.bg-primary .nav > li:hover > a,
.bg-primary .nav > li:focus > a,
.bg-primary .nav > li.active > a {
    color: #ffffff;
    background-color: #6051b5;
}

.bg-primary .nav > li > a {
    color: #f2f2f2;
}

.bg-primary .nav > li > a:hover,
.bg-primary .nav > li > a:focus {
    background-color: #6658b8;
}

.bg-primary .nav .open > a {
    background-color: #6051b5;
}

.bg-primary .caret {
    border-top-color: #f4f3f9;
    border-bottom-color: #f4f3f9;
}

.bg-primary.navbar .nav > li.active > a {
    color: #ffffff;
    background-color: #6051b5;
}

.bg-primary .open > a,
.bg-primary .open > a:hover,
.bg-primary .open > a:focus {
    color: #ffffff;
}

.bg-primary .text-muted {
    color: #d6d3e6 !important;
}

.bg-primary .text-lt {
    color: #ffffff !important;
}

.bg-primary.auto .list-group-item,
.bg-primary .auto .list-group-item {
    background-color: transparent;
    border-color: #6254b2 !important;
}

.bg-primary.auto .list-group-item:hover,
.bg-primary .auto .list-group-item:hover,
.bg-primary.auto .list-group-item:focus,
.bg-primary .auto .list-group-item:focus,
.bg-primary.auto .list-group-item:active,
.bg-primary .auto .list-group-item:active,
.bg-primary.auto .list-group-item.active,
.bg-primary .auto .list-group-item.active {
    background-color: #6051b5 !important;
}

.bg-success {
    color: #fff;
    background-color: #abd373;
}

.bg-success.lt,
.bg-success .lt {
    background-color: #31d257;
}

.bg-success.lter,
.bg-success .lter {
    background-color: #48d46a;
}

.bg-success.dk,
.bg-success .dk {
    background-color: #20af42;
}

.bg-success.dker,
.bg-success .dker {
    background-color: #1a9c39;
}

.bg-success.bg,
.bg-success .bg {
    background-color: #abd373;
}

.bg-success a {
    color: #eefaf1;
}

.bg-success a:hover {
    color: #ffffff;
}

.bg-success a.list-group-item:hover,
.bg-success a.list-group-item:focus {
    background-color: inherit;
}

.bg-success .nav > li:hover > a,
.bg-success .nav > li:focus > a,
.bg-success .nav > li.active > a {
    color: #ffffff;
    background-color: #20af42;
}

.bg-success .nav > li > a {
    color: #daf5e0;
}

.bg-success .nav > li > a:hover,
.bg-success .nav > li > a:focus {
    background-color: #22b846;
}

.bg-success .nav .open > a {
    background-color: #20af42;
}

.bg-success .caret {
    border-top-color: #c6efd0;
    border-bottom-color: #c6efd0;
}

.bg-success.navbar .nav > li.active > a {
    color: #ffffff;
    background-color: #20af42;
}

.bg-success .open > a,
.bg-success .open > a:hover,
.bg-success .open > a:focus {
    color: #ffffff;
}

.bg-success .text-muted {
    color: #9ee4af !important;
}

.bg-success .text-lt {
    color: #ffffff !important;
}

.bg-success.auto .list-group-item,
.bg-success .auto .list-group-item {
    background-color: transparent;
    border-color: #9ACC51 !important;
}

.bg-success.auto .list-group-item:hover,
.bg-success .auto .list-group-item:hover,
.bg-success.auto .list-group-item:focus,
.bg-success .auto .list-group-item:focus,
.bg-success.auto .list-group-item:active,
.bg-success .auto .list-group-item:active,
.bg-success.auto .list-group-item.active,
.bg-success .auto .list-group-item.active {
    background-color: #20af42 !important;
}

.bg-info {
    color: #dcf2f8;
    background-color: #23b7e5;
}

.bg-info.lt,
.bg-info .lt {
    background-color: #3dbde5;
}

.bg-info.lter,
.bg-info .lter {
    background-color: #55c3e6;
}

.bg-info.dk,
.bg-info .dk {
    background-color: #3DBCF8;
}

.bg-info.dker,
.bg-info .dker {
    background-color: #1199c4;
}

.bg-info.bg,
.bg-info .bg {
    background-color: #23b7e5;
}

.bg-info a {
    color: #ffffff;
}

.bg-info a:hover {
    color: #ffffff;
}

.bg-info a.list-group-item:hover,
.bg-info a.list-group-item:focus {
    background-color: inherit;
}

.bg-info .nav > li:hover > a,
.bg-info .nav > li:focus > a,
.bg-info .nav > li.active > a {
    color: #ffffff;
    background-color: #3DBCF8;
}

.bg-info .nav > li > a {
    color: #f2f2f2;
}

.bg-info .nav > li > a:hover,
.bg-info .nav > li > a:focus {
    background-color: #17b2e2;
}

.bg-info .nav .open > a {
    background-color: #3DBCF8;
}

.bg-info .caret {
    border-top-color: #dcf2f8;
    border-bottom-color: #dcf2f8;
}

.bg-info.navbar .nav > li.active > a {
    color: #ffffff;
    background-color: #3DBCF8;
}

.bg-info .open > a,
.bg-info .open > a:hover,
.bg-info .open > a:focus {
    color: #ffffff;
}

.bg-info .text-muted {
    color: #b0e1f1 !important;
}

.bg-info .text-lt {
    color: #ffffff !important;
}

.bg-info.auto .list-group-item,
.bg-info .auto .list-group-item {
    background-color: transparent;
    border-color: #19a9d5 !important;
}

.bg-info.auto .list-group-item:hover,
.bg-info .auto .list-group-item:hover,
.bg-info.auto .list-group-item:focus,
.bg-info .auto .list-group-item:focus,
.bg-info.auto .list-group-item:active,
.bg-info .auto .list-group-item:active,
.bg-info.auto .list-group-item.active,
.bg-info .auto .list-group-item.active {
    background-color: #3DBCF8 !important;
}

.bg-warning {
    color: #fffefa;
    background-color: #fad733;
}

.bg-warning.lt,
.bg-warning .lt {
    background-color: #f8da4e;
}

.bg-warning.lter,
.bg-warning .lter {
    background-color: #f7de69;
}

.bg-warning.dk,
.bg-warning .dk {
    background-color: #fcd417;
}

.bg-warning.dker,
.bg-warning .dker {
    background-color: #face00;
}

.bg-warning.bg,
.bg-warning .bg {
    background-color: #fad733;
}

.bg-warning a {
    color: #ffffff;
}

.bg-warning a:hover {
    color: #ffffff;
}

.bg-warning a.list-group-item:hover,
.bg-warning a.list-group-item:focus {
    background-color: inherit;
}

.bg-warning .nav > li:hover > a,
.bg-warning .nav > li:focus > a,
.bg-warning .nav > li.active > a {
    color: #ffffff;
    background-color: #fcd417;
}

.bg-warning .nav > li > a {
    color: #f2f2f2;
}

.bg-warning .nav > li > a:hover,
.bg-warning .nav > li > a:focus {
    background-color: #fcd621;
}

.bg-warning .nav .open > a {
    background-color: #fcd417;
}

.bg-warning .caret {
    border-top-color: #fffefa;
    border-bottom-color: #fffefa;
}

.bg-warning.navbar .nav > li.active > a {
    color: #ffffff;
    background-color: #fcd417;
}

.bg-warning .open > a,
.bg-warning .open > a:hover,
.bg-warning .open > a:focus {
    color: #ffffff;
}

.bg-warning .text-muted {
    color: #fbf2cb !important;
}

.bg-warning .text-lt {
    color: #ffffff !important;
}

.bg-warning.auto .list-group-item,
.bg-warning .auto .list-group-item {
    background-color: transparent;
    border-color: #f9d21a !important;
}

.bg-warning.auto .list-group-item:hover,
.bg-warning .auto .list-group-item:hover,
.bg-warning.auto .list-group-item:focus,
.bg-warning .auto .list-group-item:focus,
.bg-warning.auto .list-group-item:active,
.bg-warning .auto .list-group-item:active,
.bg-warning.auto .list-group-item.active,
.bg-warning .auto .list-group-item.active {
    background-color: #fcd417 !important;
}

.bg-danger {
    color: #ffffff;
    background-color: #f26c4f;
}

.bg-danger.lt,
.bg-danger .lt {
    background-color: #f06a6a;
}

.bg-danger.lter,
.bg-danger .lter {
    background-color: #f18282;
}

.bg-danger.dk,
.bg-danger .dk {
    background-color: #f13636;
}

.bg-danger.dker,
.bg-danger .dker {
    background-color: #f21b1b;
}

.bg-danger.bg,
.bg-danger .bg {
    background-color: #f26c4f;
}

.bg-danger a {
    color: #ffffff;
}

.bg-danger a:hover {
    color: #ffffff;
}

.bg-danger a.list-group-item:hover,
.bg-danger a.list-group-item:focus {
    background-color: inherit;
}

.bg-danger .nav > li:hover > a,
.bg-danger .nav > li:focus > a,
.bg-danger .nav > li.active > a {
    color: #ffffff;
    background-color: #f13636;
}

.bg-danger .nav > li > a {
    color: #f2f2f2;
}

.bg-danger .nav > li > a:hover,
.bg-danger .nav > li > a:focus {
    background-color: #f13f3f;
}

.bg-danger .nav .open > a {
    background-color: #f13636;
}

.bg-danger .caret {
    border-top-color: #ffffff;
    border-bottom-color: #ffffff;
}

.bg-danger.navbar .nav > li.active > a {
    color: #ffffff;
    background-color: #f13636;
}

.bg-danger .open > a,
.bg-danger .open > a:hover,
.bg-danger .open > a:focus {
    color: #ffffff;
}

.bg-danger .text-muted {
    color: #e6e6e6 !important;
}

.bg-danger .text-lt {
    color: #ffffff !important;
}

.bg-danger.auto .list-group-item,
.bg-danger .auto .list-group-item {
    background-color: transparent;
    border-color: #ee3939 !important;
}

.bg-danger.auto .list-group-item:hover,
.bg-danger .auto .list-group-item:hover,
.bg-danger.auto .list-group-item:focus,
.bg-danger .auto .list-group-item:focus,
.bg-danger.auto .list-group-item:active,
.bg-danger .auto .list-group-item:active,
.bg-danger.auto .list-group-item.active,
.bg-danger .auto .list-group-item.active {
    background-color: #f13636 !important;
}

.bg-white {
    color: #58666e;
    background-color: #fff;
}

.bg-white a {
    color: #363f44;
}

.bg-white a:hover {
    color: #1f2427;
}

.bg-white .text-muted {
    color: #98a6ad !important;
}

.bg-white .lt,
.bg-white .lter,
.bg-white .dk,
.bg-white .dker {
    background-color: #fff;
}

.bg-white-only {
    background-color: #fff;
}

.bg-white-opacity {
    background-color: rgba(255, 255, 255, 0.5);
}

.bg-black-opacity {
    background-color: rgba(32, 43, 54, 0.5);
}

a.bg-light:hover {
    color: #363f44;
}

a.bg-primary:hover {
    background-color: #6254b2;
}

a.text-primary:hover {
    color: #6254b2;
}

.text-primary {
    color: #7266ba;
}

.text-primary-lt {
    color: #8278c2;
}

.text-primary-lter {
    color: #9289ca;
}

.text-primary-dk {
    color: #6254b2;
}

.text-primary-dker {
    color: #564aa3;
}

a.bg-info:hover {
    background-color: #19a9d5;
}

a.text-info:hover {
    color: #19a9d5;
}

.text-info {
    color: #23b7e5;
}

.text-info-lt {
    color: #3abee8;
}

.text-info-lter {
    color: #51c6ea;
}

.text-info-dk {
    color: #19a9d5;
}

.text-info-dker {
    color: #1797be;
}

a.bg-success:hover {
    background-color: #9ACC51;
}

a.text-success:hover {
    color: #9ACC51;
}

.text-success {
    color: #abd373;
}

.text-success-lt {
    color: #2ed556;
}

.text-success-lter {
    color: #43d967;
}

.text-success-dk {
    color: #9ACC51;
}

.text-success-dker {
    color: #1e983b;
}

a.bg-warning:hover {
    background-color: #f9d21a;
}

a.text-warning:hover {
    color: #f9d21a;
}

.text-warning {
    color: #fad733;
}

.text-warning-lt {
    color: #fbdc4c;
}

.text-warning-lter {
    color: #fbe165;
}

.text-warning-dk {
    color: #f9d21a;
}

.text-warning-dker {
    color: #f4ca06;
}

a.bg-danger:hover {
    background-color: #ee3939;
}

a.text-danger:hover {
    color: #ee3939;
}

.text-danger {
    color: #f26c4f;
}

.text-danger-lt {
    color: #f26767;
}

.text-danger-lter {
    color: #f47f7f;
}

.text-danger-dk {
    color: #ee3939;
}

.text-danger-dker {
    color: #ec2121;
}

a.bg-dark:hover {
    background-color: #2f3342;
}

a.text-dark:hover {
    color: #2f3342;
}

.text-dark {
    color: #3a3f51;
}

.text-dark-lt {
    color: #454b60;
}

.text-dark-lter {
    color: #4f566f;
}

.text-dark-dk {
    color: #2f3342;
}

.text-dark-dker {
    color: #252833;
}

a.bg-#000000:hover {
    background-color: #131e25;
}

a.text-#000000:hover {
    color: #131e25;
}

.text-#000000 {
    color: #1c2b36;
}

.text-#000000-lt {
    color: #253847;
}

.text-#000000-lter {
    color: #2d4658;
}

.text-#000000-dk {
    color: #131e25;
}

.text-#000000-dker {
    color: #0b1014;
}

.text-white {
    color: #fff;
}

.text-black {
    color: #000;
}

.text-muted {
    color: #98a6ad;
}

.pos-rlt {
    position: relative;
}

.pos-stc {
    position: static !important;
}

.pos-abt {
    position: absolute;
}

.pos-fix {
    position: fixed;
}

.show {
    visibility: visible;
}

.line {
    width: 100%;
    height: 2px;
    margin: 10px 0;
    overflow: hidden;
    font-size: 0;
}

.line-xs {
    margin: 0;
}

.line-lg {
    margin-top: 15px;
    margin-bottom: 15px;
}

.line-dashed {
    background-color: transparent;
    border-style: dashed !important;
    border-width: 0;
}

.no-line {
    border-width: 0;
}

.no-border,
.no-borders {
    border-color: transparent;
    border-width: 0;
}

.no-radius {
    border-radius: 0;
}

.block {
    display: block;
}

.block.hide {
    display: none;
}

.inline {
    display: inline-block !important;
}

.none {
    display: none;
}

.pull-none {
    float: none;
}

.rounded {
    border-radius: 500px;
}

.clear {
    display: block;
    overflow: hidden;
}

.no-bg {
    color: inherit;
    background-color: transparent;
}

.no-select {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

.l-h {
    line-height: 1.42857143;
}

.l-h-0x {
    line-height: 0;
}

.l-h-1x {
    line-height: 1.2;
}

.l-h-2x {
    line-height: 2em;
}

.l-s-1x {
    letter-spacing: 1;
}

.l-s-2x {
    letter-spacing: 2;
}

.l-s-3x {
    letter-spacing: 3;
}

.font-normal {
    font-weight: normal;
}

.font-thin {
    font-weight: 300;
}

.font-bold {
    font-weight: 700;
}

.text-3x {
    font-size: 3em;
    line-height: 1.4;
}

.text-2x {
    font-size: 2em;
}

.text-lg {
    font-size: 18px;
}

.text-md {
    font-size: 16px;
}

.text-base {
    font-size: 14px;
}

.text-sm {
    font-size: 13px;
}

.text-xs {
    font-size: 12px;
}

.text-xxs {
    text-indent: -9999px;
}

.text-ellipsis {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text-u-c {
    text-transform: uppercase;
}

.text-l-t {
    text-decoration: line-through;
}

.text-u-l {
    text-decoration: underline;
}

.text-active,
.active > .text,
.active > .auto .text {
    display: none !important;
}

.active > .text-active,
.active > .auto .text-active {
    display: inline-block !important;
}

.box-shadow {
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(0, 0, 0, 0.05);
}

.box-shadow-lg {
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.05);
}

.text-shadow {
    font-size: 170px;
    text-shadow: 0 1px 0 #dee5e7, 0 2px 0 #fcfdfd, 0 5px 10px rgba(0, 0, 0, 0.125), 0 10px 20px rgba(0, 0, 0, 0.2);
}

.no-shadow {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.wrapper-xs {
    padding: 5px;
}

.wrapper-sm {
    padding: 10px;
}

.wrapper {
    padding: 15px;
}

.wrapper-md {
    padding: 20px;
}

.wrapper-lg {
    padding: 30px;
}

.wrapper-xl {
    padding: 50px;
}

.padder-lg {
    padding-right: 30px;
    padding-left: 30px;
}

.padder-md {
    padding-right: 20px;
    padding-left: 20px;
}

.padder {
    padding-right: 15px;
    padding-left: 15px;
}

.padder-v {
    padding-top: 15px;
    padding-bottom: 15px;
}

.no-padder {
    padding: 0 !important;
}

.pull-in {
    margin-right: -15px;
    margin-left: -15px;
}

.pull-out {
    margin: -10px -15px;
}

.b {
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.b-a {
    border: 1px solid #dee5e7;
}

.b-t {
    border-top: 1px solid #dee5e7;
}

.b-r {
    border-right: 1px solid #dee5e7;
}

.b-b {
    border-bottom: 1px solid #dee5e7;
}

.b-l {
    border-left: 1px solid #dee5e7;
}

.b-light {
    border-color: #edf1f2;
}

.b-dark {
    border-color: #3a3f51;
}

.b-black {
    border-color: #3a3f51;
}

.b-primary {
    border-color: #7266ba;
}

.b-success {
    border-color: #abd373;
}

.b-info {
    border-color: #23b7e5;
}

.b-warning {
    border-color: #fad733;
}

.b-danger {
    border-color: #f26c4f;
}

.b-white {
    border-color: #ffffff;
}

.b-pink {
    border-color: #fa91c8;
}

.b-dashed {
    border-style: dashed !important;
}

.b-l-light {
    border-left-color: #edf1f2;
}

.b-l-dark {
    border-left-color: #3a3f51;
}

.b-l-black {
    border-left-color: #3a3f51;
}

.b-l-primary {
    border-left-color: #7266ba;
}

.b-l-success {
    border-left-color: #abd373;
}

.b-l-info {
    border-left-color: #23b7e5;
}

.b-l-warning {
    border-left-color: #fad733;
}

.b-l-danger {
    border-left-color: #f26c4f;
}

.b-l-white {
    border-left-color: #ffffff;
}

.b-l-2x {
    border-left-width: 2px;
}

.b-l-3x {
    border-left-width: 3px;
}

.b-l-4x {
    border-left-width: 4px;
}

.b-l-5x {
    border-left-width: 5px;
}

.b-2x {
    border-width: 2px;
}

.b-3x {
    border-width: 3px;
}

.b-4x {
    border-width: 4px;
}

.b-5x {
    border-width: 5px;
}

.r {
    border-radius: 2px 2px 2px 2px;
}

.r-2x {
    border-radius: 4px;
}

.r-3x {
    border-radius: 6px;
}

.r-l {
    border-radius: 2px 0 0 2px;
}

.r-r {
    border-radius: 0 2px 2px 0;
}

.r-t {
    border-radius: 2px 2px 0 0;
}

.r-b {
    border-radius: 0 0 2px 2px;
}

.p-xs{
    padding: 3px;
}
.m-xxs {
    margin: 2px 4px;
}

.m-xs {
    margin: 5px;
}

.m-sm {
    margin: 10px;
}

.m {
    margin: 15px;
}

.m-md {
    margin: 20px;
}

.m-lg {
    margin: 30px;
}

.m-xl {
    margin: 50px;
}

.m-n {
    margin: 0 !important;
}

.m-l-none {
    margin-left: 0 !important;
}

.m-l-xs {
    margin-left: 5px;
}

.m-l-sm {
    margin-left: 10px;
}

.m-l {
    margin-left: 15px;
}

.m-l-md {
    margin-left: 20px;
}

.m-l-lg {
    margin-left: 30px;
}

.m-l-xl {
    margin-left: 40px;
}

.m-l-xxl {
    margin-left: 50px;
}

.m-l-n-xxs {
    margin-left: -1px;
}

.m-l-n-xs {
    margin-left: -5px;
}

.m-l-n-sm {
    margin-left: -10px;
}

.m-l-n {
    margin-left: -15px;
}

.m-l-n-md {
    margin-left: -20px;
}

.m-l-n-lg {
    margin-left: -30px;
}

.m-l-n-xl {
    margin-left: -40px;
}

.m-l-n-xxl {
    margin-left: -50px;
}

.m-t-none {
    margin-top: 0 !important;
}

.m-t-xxs {
    margin-top: 1px;
}

.m-t-xs {
    margin-top: 5px;
}

.m-t-sm {
    margin-top: 10px;
}

.m-t {
    margin-top: 15px;
}

.m-t-md {
    margin-top: 20px;
}

.m-t-lg {
    margin-top: 30px;
}

.m-t-xl {
    margin-top: 40px;
}

.m-t-xxl {
    margin-top: 50px;
}

.m-t-n-xxs {
    margin-top: -1px;
}

.m-t-n-xs {
    margin-top: -5px;
}

.m-t-n-sm {
    margin-top: -10px;
}

.m-t-n {
    margin-top: -15px;
}

.m-t-n-md {
    margin-top: -20px;
}

.m-t-n-lg {
    margin-top: -30px;
}

.m-t-n-xl {
    margin-top: -40px;
}

.m-t-n-xxl {
    margin-top: -50px;
}

.m-r-none {
    margin-right: 0 !important;
}

.m-r-xxs {
    margin-right: 1px;
}

.m-r-xs {
    margin-right: 5px;
}

.m-r-sm {
    margin-right: 10px;
}

.m-r {
    margin-right: 15px;
}

.m-r-md {
    margin-right: 20px;
}

.m-r-lg {
    margin-right: 30px;
}

.m-r-xl {
    margin-right: 40px;
}

.m-r-xxl {
    margin-right: 50px;
}

.m-r-n-xxs {
    margin-right: -1px;
}

.m-r-n-xs {
    margin-right: -5px;
}

.m-r-n-sm {
    margin-right: -10px;
}

.m-r-n {
    margin-right: -15px;
}

.m-r-n-md {
    margin-right: -20px;
}

.m-r-n-lg {
    margin-right: -30px;
}

.m-r-n-xl {
    margin-right: -40px;
}

.m-r-n-xxl {
    margin-right: -50px;
}

.m-b-none {
    margin-bottom: 0 !important;
}

.m-b-xxs {
    margin-bottom: 1px;
}

.m-b-xs {
    margin-bottom: 5px;
}

.m-b-sm {
    margin-bottom: 10px;
}

.m-b {
    margin-bottom: 15px;
}

.m-b-md {
    margin-bottom: 20px;
}

.m-b-lg {
    margin-bottom: 30px;
}

.m-b-xl {
    margin-bottom: 40px;
}

.m-b-xxl {
    margin-bottom: 50px;
}

.m-b-n-xxs {
    margin-bottom: -1px;
}

.m-b-n-xs {
    margin-bottom: -5px;
}

.m-b-n-sm {
    margin-bottom: -10px;
}

.m-b-n {
    margin-bottom: -15px;
}

.m-b-n-md {
    margin-bottom: -20px;
}

.m-b-n-lg {
    margin-bottom: -30px;
}

.m-b-n-xl {
    margin-bottom: -40px;
}

.m-b-n-xxl {
    margin-bottom: -50px;
}
.p-n{
    padding:0 !important;
}
.avatar {
    position: relative;
    display: block;
    white-space: nowrap;
    border-radius: 500px;
}

.avatar img {
    width: 100%;
    border-radius: 500px;
}

.avatar i {
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    margin: 2px;
    border-style: solid;
    border-width: 2px;
    border-radius: 100%;
}

.avatar i.right {
    right: 0;
    left: auto;
}

.avatar i.bottom {
    top: auto;
    right: 0;
    bottom: 0;
    left: auto;
}

.avatar i.left {
    top: auto;
    bottom: 0;
}

.avatar i.on {
    background-color: #abd373;
}

.avatar i.off {
    background-color: #98a6ad;
}

.avatar i.busy {
    background-color: #f26c4f;
}

.avatar i.away {
    background-color: #fad733;
}

.avatar.thumb-md i {
    width: 12px;
    height: 12px;
    margin: 3px;
}

.avatar.thumb-sm i {
    margin: 1px;
}

.avatar.thumb-xs i {
    margin: 0;
}

.w-1x {
    width: 1em;
}

.w-2x {
    width: 2em;
}

.w-3x {
    width: 3em;
}

.w-xxs {
    width: 60px;
}

.w-xs {
    width: 90px;
}

.w-sm {
    width: 150px;
}

.w {
    width: 200px;
}

.w-md {
    width: 240px;
}

.w-lg {
    width: 280px;
}

.w-xl {
    width: 320px;
}

.w-xxl {
    width: 360px;
}

.w-full {
    width: 100%;
}

.w-auto {
    width: auto;
}

.h-auto {
    height: auto;
}

.h-full {
    height: 100%;
}

.thumb-xl {
    display: inline-block;
    width: 128px;
}

.thumb-lg {
    display: inline-block;
    width: 96px;
}

.thumb-md {
    display: inline-block;
    width: 64px;
    max-width: 100%;
}

.thumb {
    display: inline-block;
    width: 50px;
}

.thumb-sm {
    display: inline-block;
    width: 40px;
}

.thumb-xs {
    display: inline-block;
    width: 34px;
}

.thumb-xxs {
    display: inline-block;
    width: 30px;
}

.thumb-wrapper {
    padding: 2px;
    border: 1px solid #dee5e7;
}

.thumb img,
.thumb-xs img,
.thumb-sm img,
.thumb-md img,
.thumb-lg img,
.thumb-btn img {
    height: auto;
    max-width: 100%;
    vertical-align: middle;
}

.img-full {
    width: 100%;
}

.img-full img {
    width: 100%;
}

.scrollable {
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.scrollable.hover {
    overflow-y: hidden !important;
}

.scrollable.hover:hover {
    overflow: visible !important;
    overflow-y: auto !important;
}

.smart .scrollable {
    overflow-y: auto !important;
}

.scroll-x,
.scroll-y {
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
}

.scroll-y {
    overflow-y: auto;
}

.scroll-x {
    overflow-x: auto;
}

.hover-action {
    display: none;
}

.hover-rotate {
    -webkit-transition: all 0.2s ease-in-out 0.1s;
    transition: all 0.2s ease-in-out 0.1s;
}

.hover-anchor:hover > .hover-action,
.hover-anchor:focus > .hover-action,
.hover-anchor:active > .hover-action {
    display: inherit;
}

.hover-anchor:hover > .hover-rotate,
.hover-anchor:focus > .hover-rotate,
.hover-anchor:active > .hover-rotate {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.backdrop {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
}

.backdrop.fade {
    opacity: 0;
    filter: alpha(opacity=0);
}

.backdrop.in {
    opacity: 0.8;
    filter: alpha(opacity=80);
}

/*desktop*/

@media screen and (min-width: 992px) {
    .col-lg-2-4 {
        float: left;
        width: 20.000%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hidden-sm.show {
        display: inherit !important;
    }

    .no-m-sm {
        margin: 0 !important;
    }
}

/*phone*/

@media (max-width: 767px) {
    .w-auto-xs {
        width: auto;
    }

    .shift {
        display: none !important;
    }

    .shift.in {
        display: block !important;
    }

    .row-2 [class*="col"] {
        float: left;
        width: 50%;
    }

    .row-2 .col-0 {
        clear: none;
    }

    .row-2 li:nth-child(odd) {
        margin-left: 0;
        clear: left;
    }

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

    .text-left-xs {
        text-align: left;
    }

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

    .no-border-xs {
        border-width: 0;
    }

    .pull-none-xs {
        float: none !important;
    }

    .pull-right-xs {
        float: right !important;
    }

    .pull-left-xs {
        float: left !important;
    }

    .dropdown-menu.pull-none-xs {
        left: 0;
    }

    .hidden-xs.show {
        display: inherit !important;
    }

    .wrapper-lg,
    .wrapper-md {
        padding: 15px;
    }

    .padder-lg,
    .padder-md {
        padding-right: 15px;
        padding-left: 15px;
    }

    .no-m-xs {
        margin: 0 !important;
    }
}

.butterbar {
    position: relative;
    height: 3px;
    margin-bottom: -3px;
}

.butterbar .bar {
    position: absolute;
    width: 100%;
    height: 0;
    text-indent: -9999px;
    background-color: #23b7e5;
}

.butterbar .bar:before {
    position: absolute;
    right: 50%;
    left: 50%;
    height: 3px;
    background-color: inherit;
    content: "";
}

.butterbar.active {
    -webkit-animation: changebar 2.25s infinite 0.75s;
    -moz-animation: changebar 2.25s infinite 0.75s;
    animation: changebar 2.25s infinite 0.75s;
}

.butterbar.active .bar {
    -webkit-animation: changebar 2.25s infinite;
    -moz-animation: changebar 2.25s infinite;
    animation: changebar 2.25s infinite;
}

.butterbar.active .bar:before {
    -webkit-animation: movingbar 0.75s infinite;
    -moz-animation: movingbar 0.75s infinite;
    animation: movingbar 0.75s infinite;
}
.time_opening_div input{
    border-bottom:none;
}
.time_opening_div .input-group-addon{
    border:none;
    border-top:1px solid #999;
}
.time_opening_div > div:last-child input,
.ip-b-b input,
.ip-b-b .input-group-addon{
    border-bottom:1px solid #999;
}
/* Moving bar */

@-webkit-keyframes movingbar {
    0% {
        right: 50%;
        left: 50%;
    }
    99.9% {
        right: 0;
        left: 0;
    }
    100% {
        right: 50%;
        left: 50%;
    }
}

@-moz-keyframes movingbar {
    0% {
        right: 50%;
        left: 50%;
    }
    99.9% {
        right: 0;
        left: 0;
    }
    100% {
        right: 50%;
        left: 50%;
    }
}

@keyframes movingbar {
    0% {
        right: 50%;
        left: 50%;
    }
    99.9% {
        right: 0;
        left: 0;
    }
    100% {
        right: 50%;
        left: 50%;
    }
}

/* change bar */

@-webkit-keyframes changebar {
    0% {
        background-color: #23b7e5;
    }
    33.3% {
        background-color: #23b7e5;
    }
    33.33% {
        background-color: #fad733;
    }
    66.6% {
        background-color: #fad733;
    }
    66.66% {
        background-color: #7266ba;
    }
    99.9% {
        background-color: #7266ba;
    }
}

@-moz-keyframes changebar {
    0% {
        background-color: #23b7e5;
    }
    33.3% {
        background-color: #23b7e5;
    }
    33.33% {
        background-color: #fad733;
    }
    66.6% {
        background-color: #fad733;
    }
    66.66% {
        background-color: #7266ba;
    }
    99.9% {
        background-color: #7266ba;
    }
}

@keyframes changebar {
    0% {
        background-color: #23b7e5;
    }
    33.3% {
        background-color: #23b7e5;
    }
    33.33% {
        background-color: #fad733;
    }
    66.6% {
        background-color: #fad733;
    }
    66.66% {
        background-color: #7266ba;
    }
    99.9% {
        background-color: #7266ba;
    }
}

/*------------------------ CUSTOM -------------------*/
body {
    font-family: 'Quicksand', sans-serif;
    font-size: 13px;
    color: #252525;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
}

h1, .h1 {
    font-size: 24px;
}

h2, .h2 {
    font-size: 18px;
}

.app::before {
    background-color: #fafafa;
}

.text-dark {
    color: #898989;
}

.bg-dark {
    background-color: #252525;
}

.bg-dark-1 {
    background-color: #363636;
}

.bg-dark .nav > li:hover > a, .bg-dark .nav > li:focus > a, .bg-dark .nav > li.active > a,
.bg-dark .nav > li > a:hover, .bg-dark .nav > li > a:focus {
    background-color: #363636;
}

.bg-dark.dk, .bg-dark .dk {
    background-color: #141414;
}

.navbar-brand img {
    max-height: 35px;
}

.navbar-brand {
    padding-left: 0px;
}

.navbar-nav > li > a {
    background: #abd373;
    color: #FFF;
    padding-left: 10px;
    padding-right: 10px;
}

.navbar-nav > li > a:hover,
.nav .open > a, .nav .open > a:hover, .nav .open > a:focus,
.nav > li > a:focus {
    background: #9ACC51;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    background: #abd373 !important;
}

.bg-dark .nav > li > a {
    color: #CCC;
}

.dropdown-menu {
    border: none;
    border-radius: 0;
}

.panel > .list-group:first-child .list-group-item:first-child, .panel > .panel-collapse > .list-group:first-child .list-group-item:first-child {
    border-radius: 0;
}

.panel-footer {
    border-radius: 0;
}

.panel-footer a {
    color: #FFF;
}

.navbar-nav .list-group-item {
    background-color: #99CB50;
    color: #FFF;
}

.navbar-nav .panel-footer {
    background-color: #89b650;
    color: #FFF;
}

.nav .panel-footer:hover {
    background-color: #89c050;
}

a.list-group-item {
    color: #FFF;
}

.navbar-nav .text-muted {
    color: #F1F1F1;
}

a.list-group-item:hover, a.list-group-item:focus, a.list-group-item.hover {
    background-color: #ABD373;
    color: #FFF;
}

.panel {
    border-radius: 0;
}

.navi ul.nav li a {
    font-size: 13px;
}

.btn-xs, .btn-group-xs > .btn {
    padding: 3px 6px;
    font-size: 11px;
}

.btn-success {
    background-color: #ABD373;
    border-color: #ABD373;
}

.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .open .dropdown-toggle.btn-success {
    background-color: #9acc51;
    border-color: #9acc51;
}

.btn-info {
    background-color: #69CAF7;
    border-color: #69CAF7;
}

.btn-info:hover {
    background-color: #3dbcf8;
    border-color: #3dbcf8;
}

.bg-info {
    background-color: #69CAF7;
}

.panel {
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.04);
}

.panel-body {
    padding: 0 15px 15px;
}

.carousel-control.left,
.carousel-control.right {
    background: none;
}

.box-booking-list .carousel-control.left,
.box-booking-list .carousel-control.right {
    height: 40px;
    top: 25px;
    color: #69CAF7;
    text-shadow: none;
}

.box-booking-list .carousel-control.left {
    left: 30px;
}

.box-booking-list .carousel-control.right {
    right: 30px;
}

.table > tbody > tr > td, .table > tfoot > tr > td {
    padding: 13px 10px;
}

.table > tfoot > tr > td {
    border-top: none;
}

.pagination > li > a, .pagination > li > span {
    height: 24px;
    width: 24px;
    border-radius: 24px;
    padding: 1px 0 0 0;
    text-align: center;
    margin: 0 2px;
    border: 2px solid #abd373;
    color: #abd373;
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background: #abd373;
    border-color: #abd373;
}

.pagination > li:last-child > a, .pagination > li:last-child > span,
.pagination > li:first-child > a, .pagination > li:first-child > span {
    border-radius: 24px;
}

.form-group {
    margin-bottom: 10px;
}

.form-control {
    height: 32px;
    font-family: 'Quicksand', sans-serif;
    font-size: 13px;
    /*box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.08) inset;*/
    border-color: #999;
    padding: 0 10px;
}

.form-control:focus {
    border-color: #abd373;
}

/*---------Write-------*/
.navbar-form .form-control {
    height: 30px;
    text-align: left;
    padding: 0 10px;
    box-shadow: none;
}

.navbar-nav .open .dropdown-menu,
.navbar-nav .dropdown-menu {
    background: #9acc51;
}

.navbar-nav .dropdown-menu > li > a {
    color: #FFF;
}

.box-center {
    width: 100%;
    text-align: center;
}

.navi {
    padding-top: 30px;
    border-top: 1px solid #464646;
}

.navi ul.nav li {
    border-bottom: 1px solid #464646;
}

.navi ul.nav li:last-child {
    border-bottom: none;
}

.page-content {
    padding-top: 30px;;
}

.easyPieChart .h1 {
    line-height: inherit;
}

.text-red {
    color: #f26c4f;
}

.text-orange {
    color: #f68e56;
}

.text-blue {
    color: #69caf7;
}

.text-green {
    color: #ABD373;
}

a.text-blue:hover {
    color: #3dbcf8;
}

.mg-bt-10 {
    margin-bottom: 10px;
}

.mg-bt-12 {
    margin-bottom: 12px;
}

.mg-t-b-10 {
    margin: 10px 0;
}

.box-promotion {
    min-height: 260px;
}

.box-promotion .btn {
    border: none;
    color: #6ACAF7 !important;
}

.box-promotion .btn-xs, .box-promotion .btn-group-xs > .btn {
    padding-left: 5px;
    padding-right: 5px;
}

.app-content .btn-sm, .app-content .btn-group-sm > .btn,
.app-content .btn-xs, .app-content .btn-group-xs > .btn {
    line-height: 1;
}

.box-promotion h2 {
    margin-top: 27px;
}

.box-promotion .text-muted {
    color: #FFF !important;
}

.box-booking-list .text-sm {
    font-size: 11px;
}

.slimScrollBar {
    background-color: #ABD373 !important;
}

.box-booking-list .pull-in {
    margin: 0px;
}

.bk-l-t {
    display: block;
    padding-bottom: 10px;
}

.table th {
    font-weight: normal;
    font-size: 13px;
}

.box-popular-sv .col-xs-6 {
    padding-left: 0;
}

.box-popular-sv .badge {
    margin-top: 15px;
    width: 20px;
    height: 20px;
    padding: 2px 0 0 0;
    text-shadow: none;
}

.p-sv-i {
    margin-bottom: 15px;
}

/*--------------- Box Chart -------------*/
.box-chart .nav-tabs {
    display: inline-table;
    width: 100%;
    margin: 0;
    padding: 0;
    border: none;
}

.box-chart .nav-tabs > li {
    display: inline-block;
    width: 50%;
    margin-bottom: 0;
}

.box-chart.apt-tracking .nav-tabs > li:first-child {
    width: 40%
}

.box-chart.apt-tracking .nav-tabs > li:last-child {
    width: 60%
}

.box-chart .nav-tabs > li a {
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    color: #898989;
    border: none;
    padding: 30px 15px 20px;
}

.box-chart .nav-tabs > li:first-child {
    text-align: right;
}

.box-chart .nav-tabs > li:last-child {
    text-align: left;
}

.box-chart .nav-tabs > li.active a {
    color: #6ACAF7;
    text-decoration: underline;
}

.box-chart .nav-tabs > li.active > a, .box-chart .nav-tabs > li.active > a:hover, .box-chart .nav-tabs > li.active > a:focus {
    border: none;
}

.box-chart .nav > li > a:hover, .box-chart .nav > li > a:focus {
    border: none;
    background: none;
}

.box-chart .tab-container .tab-content {
    border: none;
}

.box-chart .tab-content {
    padding-top: 0;
}

.box-chart .tab-content .line-summary h1 {
    margin-bottom: 0;
}

.line-summary > div {
    text-align: center;
}

.line-summary > div:first-child {
    padding: 32px 0;
    border-right: 1px solid #FFF;
}

.dropdown-menu > li > a.text-blue {
    color: #69caf7;
}

.dropdown-menu > li > a.text-blue:hover {
    color: #FFF;
}

.btn-default.text-blue {
    color: #69caf7 !important;
}

.line-summary .dropdown .btn-default {
    border: none;
    width: 100px;
}

.text-xs-ex {
    font-size: 11px;
    line-height: 13px;
    padding-top: 2px;
    display: block;
}

.app-aside-folded .navi > ul > li > ul {
    z-index: 1003;
}

.cls-relative {
    position: relative;
}

.explain {
    width: 14px;
    height: 14px;
    border-radius: 12px;
    position: absolute;
    bottom: -7px;
    left: 50%;
    margin-left: -7px;
    z-index: 10;
    background: #FFF;
    box-shadow: 0 0px 2px #FFF;
}

.bd-blue {
    border: 3px solid #6ACAF7;
}

.bd-pink {
    border: 3px solid #fa91c8;
}

.bd-orange {
    border: 3px solid #fbaf5d;
}

.bd-danger {
    border: 3px solid #F26C4F;
}

.summary-box {
    position: relative;
    height: 86px;
}

.box-notification {
    padding: 30px 50px;
}

.text-bold {
    font-weight: bold;
}

.text-normal {
    font-weight: 400;
}

.tbl-notification > tbody > tr:first-child > td {
    border-top: none;
}

.tbl-notification > tbody > tr > td:first-child {
    width: 70px;
    padding: 13px 0;
}

.bg-gold {
    background-color: #FEE267;
}

.bg-pink {
    background-color: #fa91c8;
    color: #FFF;
}

.bg-silver {
    background-color: #E1E3E4;
}

.bg-bronze {
    background-color: #F8C394;
}

.tbl-notification .footable-odd {
    background: none;
}

.no-pd {
    padding: 0;
}
.no-mg {
    margin:0;
}

.tbl-notification .btn {
    margin: 5px 0;
}

.mr-t-5 {
    margin-top: 5px;
}

.mt-15 {
    margin-top: 15px;
}

/*-------------- Tab Setting ------------*/
.tab-setting {
    margin-top: 5px;
    position: relative;
}

.tab-setting .nav-tabs h1 {
    margin-top: 0;
    margin-bottom: 3px;
}

.tab-setting ul.nav-tabs {
    border-bottom: 1px solid #6ACAF7;
}

.tab-setting ul.nav-tabs li {
    float: right;
}

.tab-setting ul.nav-tabs .btn {
    margin: 0 5px 10px 0;
}

.tab-setting .btn-none {
    background: #FFF;
    color: #6ACAF7 !important;
}

.tab-setting .btn-none:hover,
.tab-setting .btn-none:focus {
    background: #3dbcf8;
    color: #FFF !important;
}

.tab-setting .tab-container .tab-content {
    border: none;
}

.tab-setting .nav-tabs > li > a.tab-icon {
    display: block;
    width: 70px;
    margin-top: 4px;
    padding: 38px 0 0 0;
    text-align: center;
    color: #6ACAF7;
    border: none;
    height: 70px;
    margin-right: 0;
    margin-left: 1px;
}

.tab-setting .nav-tabs > li > a.ti-medical {
    background-image: url(../img/ms-6.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-gallery {
    background-image: url(../img/ms-5.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-op-hour {
    background-image: url(../img/ms-4.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-description {
    background-image: url(../img/ms-3.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-info {
    background-image: url(../img/ms-2.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-account {
    background-image: url(../img/ms-1.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-merchant {
    background-image: url(../img/bs-1.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-branch {
    background-image: url(../img/bs-2.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-staff {
    background-image: url(../img/bs-3.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-customer {
    background-image: url(../img/bs-4.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-service {
    background-image: url(../img/bs-5.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-package {
    background-image: url(../img/pk-1.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-retail {
    background-image: url(../img/pk-2.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-appointment {
    background-image: url(../img/ap-1.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-redemption {
    background-image: url(../img/pm-3.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-1st-deal {
    background-image: url(../img/pm-2.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-time-deal {
    background-image: url(../img/pm-1.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-calendar {
    background-image: url(../img/cl-1.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-message {
    background-image: url(../img/cl-4.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav-tabs > li > a.ti-list {
    background-image: url(../img/cl-2.png);
    background-position: center top;
    background-repeat: no-repeat;
}

.tab-setting .nav > li > a:hover,
.tab-setting .nav > li > a:focus,
.tab-setting .nav-tabs > li.active > a {
    background-color: unset;
    border-bottom: 4px solid #6ACAF7 !important;
}

.tab-setting .logo {
    width: 150px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    margin-bottom: 12px;
}

.tab-setting .logo img {
    max-width: 100%;
}

.tab-setting .tab-content {
    padding: 50px 0 80px;
}

.separate {
    position: relative;
    top: 6px;
    display: inline-block;
    width: 1px;
    height: 28px;
    background: #6ACAF7;
    margin-right: 5px;
}

.text-1-5x {
    font-size: 1.5em;
}

.text-1-25x {
    font-size: 1.25em;
}

.form-control.text-left,
.btn.text-left {
    text-align: left;
}

.btn-country {
    margin-bottom: 10px;
}

.no-pd-right {
    padding-right: 0;
}

.no-pd-left {
    padding-left: 0;
}

.no-mr {
    margin: 0;
}

.form-control-1-5x {
    height: 34px;
    font-size: 16px;
}

.i-sw-vertical-md {
    vertical-align: text-bottom;
}

.form-control.col-xs-10 {
    width: 82%;
}

.box-social {
    margin-top: 10px;
}

.box-social .fa {
    padding: 6px 0px;
    border-radius: 50px;
    background: #6ACAF7;
    color: #FFF;
    font-size: 14px;
    width: 26px;
    float: left;
    margin-right: 6px;
    text-align: center;
}

.box-social .form-group {
    float: left;
    margin-bottom: 13px;
}

.btn-editor .btn-default.text-blue.btn-info {
    color: #FFF !important;
}

.box-gallery > .col-md-2 {
    padding: 4px 0.5%;
}

.box-gallery img {
    max-width: 100%;
}

.btn-remove {
    float: right;
    margin: 8px;
    padding: 0;
    width: 20px;
    height: 20px;
    text-align: center;
    padding-top: 2px;
}

.effect-1 {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    z-index: 1;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    -webkit-transition: opacity 0.2s ease;
    -moz-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    -ms-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}

.effect-1:hover {
    opacity: 1;
}

/*---- Time Slot ----*/
.date {
    width: 50px;
    height: 50px;
    color: #FFF;
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    background: #6ACAF7;
    border-radius: 100px;
    text-align: center;
    padding-top: 12px;
    display: inline-block;
    vertical-align: bottom;
}

.timeslots {
    margin-bottom: 12px;
}

.elessar-label {
    font-size: 11px;
    border-left: none;
    text-indent: -20px;
    color: #999;
    top: 14px;
}

.elessar-rangebar {
    height: 10px;
    border-radius: 20px;
    background: #E3F7FF;
    margin-top: 20px;
    line-height: 10px;
}

.elessar-range {
    background: #6ACAF7;
    overflow: visible;
    border-radius: 20px;
    height: 10px;
}

.elessar-handle {
    width: 20px;
    height: 20px;
    top: -5px;
    border-radius: 20px;
    background: #6ACAF7;
}

.elessar-handle:first-child {
    left: -10px;
}

.elessar-handle:last-child {
    right: -10px;
}

.elessar-barlabel {
    float: left;
    margin-top: -23px;
    color: #6ACAF7;
}

.elessar-phantom .elessar-barlabel {
    margin-top: 0;
    color: #FFF;
    padding-left: 3px;
    margin-left: 0;
    min-width: 20px;
}

.elessar-barlabel-1 {
    margin-left: -18px;
}

.elessar-barlabel-2 {
    float: right;
    margin-right: -18px;
}

.elessar-deal {
    width: 150px;
    height: auto;
    position: absolute;
    bottom: 6px;
    left: 50%;
    margin-left: -75px;
    z-index: 9999;
}

.de-wrap {
    display: none;
    width: 100%;
    background: #FFF;
    padding: 10px 10px 20px;
    box-shadow: 0 0 5px rgba(180, 180, 180, 0.5);
    border-radius: 5px;
    margin-bottom: 40px;
}

.elessar-deal h4 {
    margin: 5px;
    font-size: 16px;
    color: #69caf7;
}

.elessar-deal input {
    font-family: 'Oswald', sans-serif;
    color: #69caf7;
}

.elessar-range:hover .elessar-deal .de-wrap,
.elessar-range:focus .elessar-deal .de-wrap,
.elessar-range:active .elessar-deal .de-wrap {
    display: block;
}

.elessar-range:hover .elessar-deal .discount-val,
.elessar-range:focus .elessar-deal .discount-val,
.elessar-range:active .elessar-deal .discount-val {

}

.discount-val {
    font-family: 'Oswald', sans-serif;
    color: #f26c4f;
    width: 100%;
    position: absolute;
    bottom: 10px;
}

.input-discount {
    width: 100px;
    margin: 0 auto;
    text-align: center;
}

.input-discount .input-dis {
    text-align: center;
}

.input-discount .input-group-addon {
    border-radius: 0 50px 50px 0;
    padding: 0 8px;
}

.am12 {
    position: absolute;
    right: 5px;
    font-size: 11px;
    color: #999;
}

.btn-circle {
    width: 20px;
    height: 20px;
    border-radius: 20px;
    padding: 4px 0 0 0;
    text-align: center;
}

.reset-time {
    margin-top: 16px;
    display: inline-block;
    color: #6ACAF7;
    font-size: 18px;
    cursor: pointer;
    width: 18px;
    /*-ms-transform: rotate(0); *//* IE 9 */
    /*-webkit-transform: rotate(0); *//* Chrome, Safari, Opera */
    /*transform: rotate(0);*/
    /*-webkit-transition: transform 0.2s ease;*/
    /*-moz-transition: transform 0.2s ease;*/
    /*-o-transition: transform 0.2s ease;*/
    /*-ms-transition: transform 0.2s ease;*/
    /*transition: transform 0.2s ease;*/
}

.reset-time:hover {
    /*-ms-transform: rotate(-180deg); *//* IE 9 */
    /*-webkit-transform: rotate(-180deg); *//* Chrome, Safari, Opera */
    /*transform: rotate(-180deg);*/
}

.opening-hour {
    display: none;
    width: 90%;
    margin: 0 auto;
}

.setting-advance > div {
    margin-top: 40px;
}

.setting-advance .form-control {
    width: 60px;
    font-family: 'Oswald', sans-serif;
    color: #6ACAF7;
    font-size: 20px;
    height: 34px;
}

.setting-advance > div .form-group:first-child .form-control {
    border-radius: 50px 0 0 50px;
    padding-right: 0;
}

.setting-advance > div .form-group:nth-child(2) .form-control {
    border-radius: 0 50px 50px 0;
    margin-left: -4px;
}

.setting-advance .form-group {
    display: inline-block;
}

.setting-advance > div:first-child {
    border-right: 1px solid #EEE;
}

.categories .chosen-container,
.categories .chosen-container-multi .chosen-choices {
    width: 100% !important;
}

.categories input[type='text'],
.categories .chosen-container-multi .chosen-choices {
    height: 26px;
    font-family: 'Quicksand', sans-serif;
    font-size: 13px;
    box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.08) inset;
    text-align: center;
    border-color: #ebebeb;
    padding: 0 10px;
    border-radius: 50px !important;
}

.categories .chosen-choices input[type='text'] {
    height: 26px !important;
    padding: 4px 0 !important;
    text-align: left;
}

.categories input[type='text']:focus,
.categories .chosen-container-multi .chosen-choices:focus {
    border-color: #6ACAF7;
}

.categories .chosen-container-multi .chosen-choices .search-choice {
    margin-top: 2px;
    margin-left: 0;
    margin-right: 2px;
}

.chosen-container .chosen-results li {
    font-size: 13px;
    color: #6ACAF7;
}

.active-result.highlighted,
.chosen-container .chosen-results li:hover {
    color: #FFF;
    background: #6ACAF7 !important;
}

#tab_info .dropdown-menu {
    width: 100%;
}

/*------------- Add Customer ----------*/
.avatar-150 {
    border: 4px solid #ddd;
    margin-bottom: 12px;
    width: 150px;
    height: 150px;
    border-radius: 500px;
}

.avatar-view img.avatar-150 {
    width: 150px;
    height: 150px;
}

.no-sd {
    box-shadow: none;
}

.country-list .btn-sm {
    padding-top: 6px;
    padding-bottom: 6px;
}

.country-list .open > .dropdown-menu {
    width: 100%;
}

.gender .radio + .radio, .gender .checkbox + .checkbox,
.gender .radio, .gender .checkbox {
    margin: 3px 0;
}

.bg-light {
    background: #fbfbfb;
}

/*---------- Add Service ----------*/
.i-checks-sm > i,
.i-checks-sm input:checked + i::before,
.i-checks input:checked + i {

}

.avatar-150.no-radius {
    border-radius: 0;
}

.setting-advance > div.small-space {
    margin-top: 20px;
}

.setting-advance .small-space .form-control {
    width: 50px;
    margin-left: -3px;
    text-align: right;
}

.setting-advance > div.small-space:first-child {
    border-right: none;
}

.rounded-left {
    border-radius: 500px 0 0 500px;
}

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

.setting-advance .small-space .form-control.price-dollar {
    width: 80px;
}

.setting-advance .small-space .form-control.price-dollar.price-vnd {
    width: 120px;
}

.setting-advance .small-space .form-control.price-cent {
    width: 40px;
}

.assign-staff {
    clear: both;
    list-style: none;
    margin: 0;
    padding: 0;
    display: inline-table;
}

.assign-staff li {
    display: inline-block;
    margin-right: 10px;
    width: 50px;
    height: 50px;
    vertical-align: middle;
}

.assign-staff li img {
    max-width: 50px;
    max-height: 50px;
    border-radius: 100px;
}

.avatar-name-50 {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    font-family: 'Oswald', sans-serif;
    font-size: 20px;
    color: #6ACAF7;
    text-transform: uppercase;
    background: #E3F7FE;
    text-align: center;
    padding-top: 10px;
    display: inline-block;
    font-weight: 400;
}

.btn-xs.btn-icon {
    padding: 5px;
    width: 24px;
    height: 24px;
}

.btn-xs.btn-icon.text-2x {
    font-size: 2em;
    line-height: 24px;
}

.btn-plus {
    margin-top: 13px;
}

.btn-remove-xs {
    position: absolute;
    width: 16px;
    height: 16px;
    padding: 0;
    text-align: center;
    font-size: 10px;
    line-height: 16px;
    right: 0px;
    top: 0px;
    display: none;
}

.assign-staff > li:hover .btn-remove-xs {
    display: block;
}

.assign-staff-list {
    width: 190px;
}

.assign-staff-list li {
    width: 100%;
    margin-right: 0;
    height: auto;
}

.assign-staff .popover-content,
.assign-staff .popover-content .panel-body {
    padding: 0;
}

.assign-staff-list li a {
    display: block;
    width: 100%;
    color: #6ACAF7;
    text-decoration: none;
    padding: 5px;
}

.assign-staff-list li:first-child a {
    border-radius: 4px 4px 0 0;
}

.assign-staff-list li:last-child a {
    border-radius: 0 0 4px 4px;
}

.assign-staff-list li a:hover {
    background: #6ACAF7;
    color: #FFF;
}

.popover {
    font-family: 'Quicksand', sans-serif;
    font-size: 13px;
}

.chosen-choices, .chosen-single, .bootstrap-tagsinput {
    border-radius: 500px !important;
}

.chosen-container-single .chosen-single {
    height: 26px !important;
    font-family: 'Quicksand', sans-serif;
    font-size: 13px;
    line-height: 26px !important;
}

.chosen-container-single .chosen-single div {
    top: -3px !important;
    box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.08) inset;
}

.chosen-container-active .chosen-single,
.chosen-container-active.chosen-with-drop .chosen-choices {
    box-shadow: none !important;
    border-color: #6ACAF7 !important;
}

.categories input[type="text"], .categories .chosen-container-multi .chosen-choices {
    height: 26px !important;
}

.pu-right {
    float: right;
}

.pu-left {
    float: left;
}

.page-url .input-group-addon:first-child {
    border-radius: 40px 0 0 40px;
}

.page-url .input-group .form-control {
    height: 28px;
    border-radius: 0 40px 40px 0;
}

.input-money .input-group-addon:first-child {
    border-radius: 40px 0 0 40px;
}

.input-money .input-group .form-control {
    height: 28px;
    border-radius: 0 40px 40px 0;
    width: 60px;
}

.input-money .input-group-addon {
    padding: 6px 10px;
}

/*------------- Management --------*/
.tab-setting .tab-content-1 {
    padding: 30px 0 0;
    min-height: 400px;
}

.search-bar {
    width: 0px;
    display: inline-block;
    vertical-align: middle;
    -webkit-transition: width 0.2s ease;
    -moz-transition: width 0.2s ease;
    -o-transition: width 0.2s ease;
    -ms-transition: width 0.2s ease;
    transition: width 0.2s ease;
}

.search-bar.hien {
    width: 350px;
}
.search-bar.hien.w-xxl{
    width: 460px;
}
.search-bar .btn-sm {
    padding: 6px 10px;
    height: 32px;
}

.btn-xs.btn-icon i {
    top: -6px;
}

.table > thead > tr > th:last-child,
.table > tbody > tr > td:last-child {
    padding: 13px 5px;
    text-align: right;
    min-width: 70px;
}

.notes-list .table > thead > tr > th:last-child,
.notes-list .table > tbody > tr > td:last-child {
    text-align: left;
}

.table > thead > tr > th {
    vertical-align: top;
}

.page-content-thin-gap {
    padding-top: 0px;
    padding-bottom: 17px;
}

.page-content-thin-gap .panel {
    margin-bottom: 0;
}

.text-italic {
    font-style: italic;
}

.breadcrumb {
    background: none;
    margin-bottom: 0;
}

.navbar-form .input-group-btn .btn:hover {
    color: #333;
}

.i-checks.i-check-danger input:checked + i::before {
    background-color: #F26C4F;
}

.i-checks.i-check-danger input:checked + i {
    border-color: #F26C4F;
}

.radio label > label, .checkbox label > label {
    padding-left: 0;
}

/*------------ Table ------------*/
table .filters {
    /*display: none;*/
}

table .filters td input {
    max-width: 180px;
}

table .filters.hien {
    display: table-row;
}

table thead tr th a {
    color: #AAA;
}

.table > thead > tr > th {
    padding: 13px 10px;
    color: #333;
    font-weight: 900;
}

/*------------ loading -------------*/
.loading {
    width: 100%;
    height: 300px;
    min-height: 300px;
    background-image: url(../img/loading.gif);
    background-position: center 100px;
    background-repeat: no-repeat;
    background-size: 100px auto;
    background-color: rgba(255, 255, 255, 0.75);
}

.loading.height-100p {
    background-position: center 200px;
    height: 100%;
}

.tab-pane .loading {
    height: 600px;
    min-height: 600px;
}

.loading-abs {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FFF;
    background-image: url(../img/loading.gif);
    background-position: center;
    background-size: 100px auto;
    background-repeat: no-repeat;
    z-index: 9;
}

.loading-t-100 {
    background-position: center 100px;
}

.grid-view-loading {

}

/*-------------*/
.pk-sv-item {
    clear: both;
    margin-bottom: 5px;
    float: left;
    width: 100%;
}

.assign-service {
    float: right;
    width: 95%;
}

.pk-sv-item .i-checks-sm > i {
    margin-top: 17px;
}

.pk-sv-item .form-group {
    margin-bottom: 0;
}

.pk-sv-item .checkbox {
    margin: 0;
}

.setting-advance .stock-input .form-control {
    width: 80px;
}

select {
    height: 26px;
    font-family: 'Quicksand', sans-serif;
    font-size: 13px;
    box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.08) inset;
    border: 1px solid #ebebeb;
    padding: 0;
    background-color: #fff;
    background-image: none;
    color: #555;
    display: block;
    line-height: 1.42857;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}

select:focus {
    border-color: #6ACAF7;
}

textarea.form-control {
    border-radius: 10px;
}

textarea.form-control.embeb-code {
    height: 230px;
}

.table.no-border-top > tbody > tr:first-child > td {
    border-top: none;
}

.opening-hour.w-full {
    width: 100%;
}

.work-hour {
    padding-top: 12px;
    text-align: center;
}

/*------------- REVIEW ------------*/
.positioner {
    position: relative;
    display: inline-block;
    line-height: 0;
}

.starbox .colorbar,
.starbox .ghost {
    z-index: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
}

.starbox .stars {
    display: inline-block;
}

.starbox .stars .star_holder {
    position: relative;
    z-index: 1;
}

.starbox .stars .star_holder .star {
    display: inline-block;
    vertical-align: baseline;
    background-repeat: no-repeat;
}

/* Override with your own image and size… */
.starbox .stars .star_holder .star {
    background-image: url('../img/5-large.png');
    background-size: 26px;
    width: 26px;
    height: 26px;
}

/* Override with your own colours… */
.starbox .stars {
    background: #cccccc;
}

.starbox .rated .stars {
    background: #dcdcdc;
}

.starbox .rated.hover .stars {
    background: #cccccc;
}

.starbox .colorbar {
    background: #3DBCF8;
}

.starbox .hover .colorbar {
    background: #3DBCF8;
}

.starbox .rated .colorbar {
    background: #69CAF7;
}

.starbox .rated.hover .colorbar {
    background: #69CAF7;
}

.starbox .ghost {
    background: #a1a1a1;
}

/*----------- / REVIEW ------------*/
.label-horizontal {
    padding-top: 3px;
}

textarea.comment-area {
    height: 100px;
}

/*------------- Modal Crop Image ------------*/
#avatar-modal.modal.fade.in {
    /*left:50%;*/
    /*overflow: visible !important;*/
    /*position: absolute;*/
}

/*------------------------------*/
.btn-re-schedule i {
    color: #FFF;
    margin-top: 0;
    margin-left: 1px;
    font-size: 13px;
}

.form-group h4,
.form-group h5 {
    margin-top: 0;
}

.border-blue {
    border-color: #6ACAF7;
}

/*------------- Modal -------------*/
.modal-header,
.modal-footer {
    /*border-color:#69caf7;*/
}

.modal-content {
    border-radius: 10px;
}

.modal-backdrop {
    position: fixed;
    height: 100% !important;
}

.mg-top-10 {
    margin-top: 8px;
}

.pd-t-10 {
    padding-top: 10px;
}
.pd-t-15 {
    padding-top: 15px;
}
.pd-t-30 {
    padding-top: 30px;
}
.pd-t-40 {
    padding-top: 40px;
}
.pd-t-45 {
    padding-top: 45px;
}
.pd-t-50 {
    padding-top: 50px;
}
/*------------ / Modal ----------*/
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    background-color: #f1f1f1 !important;
}

.datepicker.form-control[disabled], .datepicker.form-control[readonly], fieldset[disabled] .datepicker.form-control,
#date_start, #date_end,
#date_start_2, #date_end_2 {
    background-color: #fff !important;
}

.form-control.col-sm-2 {
    width: 16%;
}

.label-info {
    background-color: #69CAF7;
}

.modal-alert {
    position: fixed;
    width: 300px;
    top: 50%;
    left: 50%;
    margin-left: -150px;
    margin-top: -120px;
    background: #FFF;
    border: 1px solid #999;
    z-index: 9999;
    display: none;
    box-shadow: 0 0 10px rgba(180, 180, 180, 0.8);
}

.md-header, .md-body, .md-footer {
    padding: 10px;
}

.md-body {
    padding: 20px 10px;
}

.md-body, .md-footer {
    border-top: 1px solid #e5e5e5;
}

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

.modal-alert h2 {
    margin: 0;
    color: #69caf7;
}

/*------/ Modal ---------*/
.btn-sw.active {
    background-color: #69caf7;
    border-color: #69caf7;
    color: #FFF !important;
    box-shadow: none;
}

.navbar-btn:focus i {
    color: #FFF;
}

.symbol-list {
    list-style: none;
    margin: 0px 0 0;
    padding: 0;
    display: inline-table;
}

.symbol-list li {
    width: 100%;
    display: inline-block;
    text-align: left;
    margin-bottom: 5px;
}

.symbol-list li span.symbol {
    display: inline-block;
    width: 15px;
    height: 15px;
    border-radius: 30px;
    margin-right: 10px;
}

.symbol-appt {
    background: #3DBCF8;
}

.symbol-appt-online {
    background: #FF68B6;
}

.symbol-request {
    background: #11B1A9;
}

.symbol-time-deal {
    background: #FE9A3A;
}

.symbol-1st-time-deal {
    background: #FE9A3A;
}

.symbol-redeemed {
    background: #FE9A3A;
}

.symbol-class {
    background: #9ACC51;
}

.symbol-block {
    background: #E63A3A;
}

.symbol-noshow {
    background: #CCC;
}

.symbol-list hr {
    margin: 0;
}

.pd-r-5 {
    padding-right: 5px;
}

.pd-l-5 {
    padding-left: 5px;
}

.bg-30 {
    min-height: 30px !important;
    height: 30px;
}

.label-success {
    background-color: #ABD373;
}

.label-warning {
    background-color: #f68e56;
}

.avatar-50 {
    width: 50px;
    height: 50px;
    border-radius: 50px;
}
.avatar-40 {
    width: 40px;
    height: 40px;
    border-radius: 40px;
}
.avatar-30 {
    width: 30px;
    height: 30px;
    border-radius: 30px;
}

.avatar-25 {
    width: 25px;
    height: 25px;
    border-radius: 25px;
}

.avatar-20 {
    width: 20px;
    height: 20px;
    border-radius: 20px;
}

.avatar-15 {
    width: 15px;
    height: 15px;
    border-radius: 15px;
}

.avatar-10 {
    width: 10px;
    height: 10px;
    border-radius: 10px;
}

.chosen-container-single .chosen-search input[type="text"] {
    height: 26px !important;
    border-radius: 100px !important;
}

/*============== Re-style ============*/
.thumb_on_list {
    width: 80px;
    height: 80px;
}

#service-grid table td ul {
    margin: 0;
    padding: 0;
    display: inline-table;
    list-style: none;
}

#service-grid table td ul li {
    display: inline-block;
}

#service-grid table td ul li img {
    width: 30px;
    height: 30px;
    border-radius: 60px;
    margin-bottom: 3px;
}

#service-grid .avatar-name-50,
.avatar-name-30 {
    width: 30px;
    height: 30px;
    border-radius: 50px;
    background: #e3f7fe;
    color: #6acaf7;
    display: inline-block;
    font-family: "Oswald", sans-serif;
    font-size: 15px;
    font-weight: 400;
    padding-top: 5px;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 3px;
}

#service-grid .table > tbody > tr > td,
#service-grid .table > tfoot > tr > td,
#service-grid .table > thead > tr > th {
    width: 5%;
    padding-left: 5px;
    padding-right: 5px;
}

#service-grid .table tr > td:nth-child(2), #service-grid .table tr > td:nth-child(3), #service-grid .table tr > td:nth-child(4) {
    width: 20%;
}

#service-grid .table tr > td:nth-child(9), #service-grid .table tr > td:nth-child(5), #service-grid .table tr > td:nth-child(6), #service-grid .table tr > td:nth-child(7),
#service-grid .table tr > th:nth-child(9), #service-grid .table tr > th:nth-child(5), #service-grid .table tr > th:nth-child(6), #service-grid .table tr > th:nth-child(7) {
    text-align: center;
}

.dropdown-menu {
    font-size: 13px;
}

#staff-grid table tr td:first-child img,
#customers-grid table tr td:first-child img {
    width: 50px;
    height: 50px;
    border-radius: 50px;
}

/*------ Editor ------*/
.mce-panel {
    background: #FFF !important;
    border: none !important;
}

.mce-edit-area {
    margin-top: 10px !important;
    border: 1px solid #ebebeb !important;
    box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.08) inset !important;
}

.mce-btn button {
    color: #69caf7 !important;
    padding: 6px 10px !important;
}

.mce-toolbar-grp .mce-flow-layout-item {
    margin: 0 2px 0 0 !important;
}

.mce-ico {
    color: #69caf7 !important;
}

.mce-btn {
    background: #FFF !important;
}

#mce_55, #mce_54, #mce_49, #mce_50 {
    display: none !important;
}

.mce-btn-group .mce-first,
.mce-btn button,
.mce-btn-group .mce-last,
.mce-btn {
    border-color: #dee5e7 #dee5e7 #d8e1e3 !important;
}

.mce-btn i {
    text-shadow: none !important;
}

.mce-btn.mce-active {
    background: #69caf7 !important;
    border-color: #69caf7 !important;
}

.mce-btn.mce-active .mce-ico {
    color: #FFF !important;
}

.mce-btn {
    border-left: 1px solid #999 !important;
}

.mce-splitbtn .mce-open {
    border-right: none !important;
}

.mce-caret {
    border-top: 4px solid #69caf7 !important;
}

.mce-btn.mce-active .mce-caret {
    border-top: 4px solid #FFF !important;
}

.mce-primary button, .mce-primary button i {
    text-shadow: none !important;
}

/*-----------------*/
.avatar-view {
    margin: 10px auto;
    box-shadow: none;
    border: none;
    height: auto;
}

.timeslots .col-sm-1:last-child {
    padding: 0;
}

.timeslots .col-sm-1 .btn-icon {
    padding: 0;
    display: inline-block;
    vertical-align: bottom;
}

.thumb-sm.avatar {
    height: 40px;
}

#customer_note_list {
    clear: both;
}

.cropper-view-box,
.cropper-face {
    border-radius: 50%;
}

.avatar-preview {
    border-radius: 50%;
}

/*=========== DATEPICKER ============*/
.ui-widget-content {
    border: 1px solid #999 !important;
    border-radius: 0 !important;
}

.ui-widget-header {
    background: none !important;
    border: none !important;
}

.ui-widget {
    font-family: 'Oswald', sans-serif !important;
    font-weight: 400 !important;
}

.ui-datepicker td span, .ui-datepicker td a {
    font-family: 'Quicksand', sans-serif !important;
    font-weight: 400 !important;
    height: 30px !important;
    width: 30px !important;
    text-align: center !important;
    padding-top: 5px !important;
}

.ui-datepicker th {
    color: #6ACAF7 !important;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    background: none !important;
    border: none !important;
    text-align: center !important;
    font-weight: 400 !important;
    color: #555 !important;
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
    background: #6ACAF7 !important;
    border: none !important;
    color: #FFF !important;
    border-radius: 50px !important;
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    background: #A1DEFA !important;
    border-radius: 50px !important;
    color: #FFF !important;
}

.ui-widget-header .ui-state-hover {
    background: none !important;
    color: #FFF !important;
}

.ui-widget-header .ui-icon.ui-icon-circle-triangle-w {
    background: url("images/ms-nr-left.png") no-repeat;
    background-size: 100% auto;
}

.ui-widget-header .ui-icon.ui-icon-circle-triangle-e {
    background: url("images/ms-nr-right.png") no-repeat;
    background-size: 100% auto;
}

.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    float: left;
    width: 48%;
    margin-right: 1%;
    margin-left: 1%;
    border-radius: 100px;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
    background: #fa91c8 !important;
    border-radius: 100px;
    color: #FFF;
}

.ui-datepicker .ui-datepicker-title select {
    font-size: 13px;
    font-weight: 400;
}

.btn-icon {
    margin: 1px;
}

.suggest-list-search {
    position: absolute;
    display: block;
    top: 40px;
    right: -15px;
    z-index: 9;
    list-style: none;
    width: 300px;
    margin: 0;
    padding: 0;
    background: #FFF;
    box-shadow: 0 0 5px rgba(200, 200, 200, 0.6);
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}

.suggest-list-search li {
    width: 100%;
    padding: 5px;
}

.suggest-list-search li:hover {
    background-color: #F1F1F1;
}

.suggest-list-search li:last-child {
    padding: 15px 0;
}

.suggest-list-search li:last-child:hover {
    background: none;
}

.suggest-list-search li img {
    max-width: 100%;
}

.daterangepicker select.yearselect,
.daterangepicker select.monthselect {
    display: inline-block;
    width: 40%;
}

.errorMessage {
    font-size: 12px;
    color: #f26c4f;
}

.errorSummary {
    padding-top: 30px;
}

.errorSummary ul {
    color: #f26c4f;
}

.btn-info.disabled, .btn-info[disabled], fieldset[disabled] .btn-info, .btn-info.disabled:hover, .btn-info[disabled]:hover, fieldset[disabled] .btn-info:hover, .btn-info.disabled:focus, .btn-info[disabled]:focus, fieldset[disabled] .btn-info:focus, .btn-info.disabled:active, .btn-info[disabled]:active, fieldset[disabled] .btn-info:active, .btn-info.disabled.active, .btn-info.active[disabled], fieldset[disabled] .btn-info.active {
    background: #ddd;
    border-color: #ddd;
    color: #666 !important;
}

.tab-setting .nav-tabs .badge.up {
    top: -45px;
    margin-left: -20px;
}

.select2-container .select2-choice {
    padding-left:0;
    background: none;
    border: none;
}

.select2-container .select2-choice .select2-arrow {
    background: none;
    border: none;
}

.select2-search input {
    border-radius: 500px;
    background: none !important;
}

.select2-drop-active,
.chosen-container-single .chosen-drop {
    border-color: #CCC;
    border-top: 1px solid #CCC;
    border-radius: 4px;
}

.select2-drop-active {
    padding-top: 3px;
}

.select2-container-active .select2-choice, .select2-container-active .select2-choices {
    box-shadow: none;
}

.panel-1 {
    min-height: 295px;
}

.panel-2 {
    min-height: 465px;
}

.panel-3 {
    min-height: 432px;
}

.mc-list {
    max-width: 200px;
}

#links {
    text-align: center;
}

#form_add .modal-body {
    position: relative;
}

#form_add .modal-body .loading {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #FFF;
    background-image: url('../img/loading.gif');
    background-position: center 200px;
    z-index: 999;
}

.panel {
    margin-bottom: 28px;
}

.modal-body {
    clear: both;
}

.label {
    text-shadow: none;
}

.text-gray-light {
    color: #999;
}

.chartnum-2 {
    line-height: 18px;
    padding-top: 30px;
}

.text-pink {
    color: #fa91c8;
}

.mg-bt-25 {
    margin-bottom: 25px;
}

.box-desc {
    text-align: left;
    width: 85px;
    margin: 10px auto 0;
}

.mg-t-10 {
    margin-top: 10px;
}

.table-responsive.grid-view-loading {
    background-image: url(../img/loading-1.gif);
    background-repeat: no-repeat;
    background-position: right top 15px;
}

.disc-list {
    list-style: none;
    padding: 0;
    margin-top: 10px;
    display: inline-table;
}

.disc-list li {
    display: inline-block;
    float: left;
    width: 160px;
}

.disc-list li.dis-sp {
    width: 100%;
    height: 8px;
}

.disc-list li.dis-day {
    text-align: center;
    clear: both;
    width: 20px;
    height: 20px;
    border-radius: 30px;
    background: #69CAF7;
    color: #FFF;
    padding-top: 2px;
    font-size: 11px;
    font-family: 'Oswald', sans-serif;
}

.disc-list li .text-red {
    font-family: 'Oswald', sans-serif;
}

.disc-list li .text-info {
    font-family: 'Oswald', sans-serif;
}

.disc-list ul {
    padding-left: 0px;
    list-style: none;
    line-height: 16px;
}

.disc-list ul li {
    padding-left: 1em;
    text-indent: -.7em;
}

.disc-list ul li:before {
    content: "• ";
    display: inline;
    vertical-align: middle;
    font-size: 20px;
    color: #333;
}

#edit_s_t_deal_c3,
#service_1st_deal_c3 {
    width: 250px;
}

#edit_s_t_deal_c4,
#service_1st_deal_c4 {
    width: 130px;
}

#edit_s_t_deal_c5,
#service_1st_deal_c5,
#class_time_deal_c6,
#class_1st_deal_c6 {
    width: 90px;
}

a.search-item {
    margin-left: 15px;
}
.navi{
    padding-top:0;
}
.navi-wrap {
    padding-bottom: 180px;
}

.navi ul.nav li:first-child {
    border-top: 1px solid #464646;
}

h5.solo-name {
    margin: 2px 0;
}

.panel-footer a {
    width: 85%;
}

.col-lg-2-5 {
    width: 20%;
    margin: 0;
    padding: 0;
}

.row-sm .col-lg-2-5 {
    padding: 0;
}

.col-lg-2-5 .b-a {
    border-right: none;
}

.row-sm .col-lg-2-5:last-child .b-a {
    border-right: 1px solid #dee5e7;
}

.order-content table {
    width: 100%;
}

.cus-note-list {
    margin: 20px 0;
    padding: 0;
    list-style: none;
}

.cus-note-list li {
    margin-bottom: 10px;
}

.mg-bt-5 {
    margin-bottom: 5px;
}

.md-wrap {
    width: 100%;
    text-align: center;
}

.m-dashboard {
    list-style: none;
    display: inline-table;
    margin: 30px auto;
    padding: 0;
    width: 100%;
    max-width: 800px;
    text-align: center;
}

.m-dashboard li {
    display: inline-block;
    padding: 10px 20px 20px;
    width: 45%;
    margin: 5px;
    text-align: left;
    vertical-align: top;
}

.bg-light-1 {
    background-color: #F1F1F1;
}

.bg-light-2 {
    background-color: #F9F9F9;
}

.upgrade-pl {
    position: relative;
    overflow: hidden;
    color: #888;
}

.upgrade-pl .upgrade-ly {
    position: absolute;
    top: 0%;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(240, 240, 240, 1); /*rgba(105,202,247,1);*/
    z-index: 1;
    opacity: 0;
    text-align: center;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.upgrade-pl:hover .upgrade-ly {
    opacity: 1;
}

ul.list-group-1-4x > li {
    border: none;
    display: inline-flex;
    width: 48%;
}

ul.list-group-1-4x > li > i {
    margin-top: 3px;
}

.select2-container .select2-choice .select2-arrow b {
    background: none;
}

.text-unlimted {
    font-size: 2em;
    line-height: 20px;
}

.s-tooltip {
    cursor: pointer;
}

.plan-detail-wrap {
    padding-bottom: 0;
    clear: both;
}

.plan-detail-wrap .panel {
    margin-bottom: 10px;
}

.plan-detail-wrap .list-group-item i {
    font-weight: 900;
}

.icon-unlimited {
    display: inline-block;
    vertical-align: bottom;
    padding-bottom: 2px;
    font-size: 2em;
}

.wrap-rd {
    width: 180px;
}

.wrap-rd input {
    width: 100px;
    display: inline-block;
}

.wrap-rd .btn {
    width: 92px;
    display: inline-block;
}

.wrap-rd .bg-loading,
.wrap-rd-dt .bg-loading {
    width: 100%;
    height: 14px;
    background-image: url(../img/loading-1.gif);
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
}

.wrap-rd-dt .bg-loading {
    width: 40px;
}

.wrap-rd .btn {
    height: 26px;
}

.wrap-rd-dt {
    display: none;
    width: 320px;
    color: #252525;
}

.wrap-rd-dt .group-control > span {
    display: inline-block;
}

.wrap-rd-dt .group-control > span.rd-title {
    width: 150px;
}

.wrap-rd-dt .group-control:last-child {
    margin-top: 5px;
}

.db-rd .popover,
.box-promotion .popover {
    max-width: 350px;
}

.noti-des .popover {
    max-width: none;
}

i[data-toggle="popover"] {
    cursor: pointer;
}

.tab-content.no-pd {
    padding: 0;
}

.panel-hd-ct h4 {
    margin-top: 21px;
}

.panel-hd-ct h2 {
    margin-bottom: 20px;
}

.mc-pricing .list-group i {
    font-weight: 900;
}

.mc-pricing .btn {
    margin-top: 5px;
    margin-bottom: 10px;
}

.mc-pricing .btn:hover {
    color: #FFF;
}

.plan-unavailable .panel-heading {
    background-color: #F1F1F1;
    color: #888;
}

.plan-unavailable .bg-info .text-lt {
    color: #888 !important;
}

.plan-unavailable .list-group,
.plan-unavailable .list-group i {
    color: #888;
}

.plan-unavailable .btn,
.plan-unavailable .btn:hover {
    background-color: #F1F1F1;
    color: #888;
}

.plan-unavailable h5 {
    color: #888;
}

.mc-pricing .panel-footer h5 {
    margin: 0;
}

.sm-qt {
    margin: 0 auto;
}

.md-btn-upgrade {
    display: none;
}

.box-promotion .btn#btn_checkcode,
.box-promotion .btn#btn_redeem {
    color: #FFF !important;
}

.s-dashboard {
    list-style: none;
    margin: 20px auto;
    padding: 0;
    display: inline-table;
    text-align: center;
    width: 100%;
}

.s-dashboard li {
    display: inline-block;
    width: 49%;
}

.sort-link.desc {
    display: inline-block;
    padding-right: 10px;
    background-image: url("images/srt-u.png");
    background-position: top 8px right;
    background-repeat: no-repeat;
}

.sort-link.asc {
    display: inline-block;
    padding-right: 10px;
    background-image: url("images/srt-d.png");
    background-position: top 6px right;
    background-repeat: no-repeat;
}

.clock-list table tr th:last-child,
.clock-list table tr td:last-child {
    padding-right: 15px !important;
}

.box-clock h1 {
    margin-top: 5px;
}

.box-clock hr {
    margin: 8px 0 3px;
}

.box-clock .table > thead > tr > th {
    padding: 4px 10px;
}

.table > thead > tr > th:last-child, .table > tbody > tr > td:last-child {
    min-width: 100px;
    text-align: right;
}

.box-calendar .calendar .table tbody td {
    height: 45px;
}

.box-calendar .calendar .table td span {
    bottom: 18px;
}

#changePassModal {
    margin-top: 120px;
}

.mg-l-5 {
    margin-left: 5px;
}

.loading-200 {
    height: 200px !important;
    min-height: 200px !important;
    background-position: center 80px !important;
}

.sp-week-picker {
    position: absolute;
    z-index: 1;
}

.schedules-edit-table {
    border: 1px solid #e1e1e1 !important;
}

.schedules-table tr td {
    background: none !important;
}

.bd-right-i {
    border-right: 1px solid #e1e1e1 !important;
}

.sp-week-hide {
    display: none;
}

.firsttime-icon {
    position: relative;
}

.firsttime-icon img {
    position: absolute;
    right: 5px;
    top: -25px;
}

/*------------- Remind ------------*/
.date-loop {
    color: #6acaf7;
    font-family: "Oswald", sans-serif;
    font-size: 16px;
    width: 80px;
    max-width: 80px;
    height: 28px;
    text-align: right;
}

.date-loop-group {
    width: 100px;
    max-width: 100px;
}

.date-loop-group .input-group-addon {
    padding-left: 5px;
    padding-right: 8px;
    font-size: 13px;
}

textarea.form-control.reminder-msg {
    height: 160px;
}

table .name-item {
    padding: 0px 5px 5px;
}

/*------------- Sales Report -----------*/
.date-filter {
    float: left;
    width: 310px;
    max-width: 100%;
}

#tab_sales_report #filter_form select.form-control, #tab_sales_report .date-filter .form-control {
    display: inline-block;
}

.datetime {
    max-width: 120px;
    display: inline-block;
}

#tab_sales_report #filter_form {
    min-height: 30px;
    width: auto;
    margin-right: 5px;
}

#filter_form select,
#tab_sales_report .date-filter {
    max-width: 140px;
    text-align: left;
}

.pd-t-80 {
    padding-top: 80px;
}

.mc-login {
    height: 32px;
}

.footer-col ul.language-selector a {
    font-size: 14px;
}

#login-form .errorMessage {
    padding-top: 2px;
}

.app-aside-folded .btn-cus-checkin span {
    display: none;
}

#ui-datepicker-div {
    z-index: 4;
}

/*----------- MySpa 12/12/2016 ----------*/
.no-shadow {
    box-shadow: none;
}

.dropdown button {
    height: 32px;
}

.select2-container .select2-choice {
    line-height: 32px;
}

.list-tudo > div {
    margin-top: 10px;
    margin-bottom: 10px;
}

.list-tudo .popover {
    width: 200px;
}

.list-tudo .text-3x {
    font-size: 24px;
    line-height: 50px;
}

.popover-title .btn-xs {
    margin-top: -5px;
    margin-right: -3px;
}

.select2-dropdown-open.select2-drop-above .select2-choice, .select2-dropdown-open.select2-drop-above .select2-choices {
    background: none;
    border: none;
}

#input_redeem {
    height: 26px;
}

.bc-sumary h1 {
    margin: 5px 0;
}

.bc-sumary {
    padding: 10px 0;
}

.sale-chart {
    margin: 5px;
}

table#checkin_list > thead > tr > th:last-child, table#checkin_list > tbody > tr > td:last-child {
    min-width: 45px;
}

.tr-highlight td {
    background: #FFF0C9 !important;
}

.mbs-check {
    margin-top: 1px;
}

.text-10 {
    font-size: 10px;
}

.select2-hidden-accessible {
    display: none;
}

.no-m-t {
    margin-top: 0;
}

.w-100 {
    width: 100%;
}

.identified-upload .glyphicon {
    display: none;
}

.identified-upload input.form-control {
    padding: 2px;
    border-left: none;
    border-radius: 0;
}

.identified-upload .group-span-filestyle label {
    padding-left: 2px;
    padding-right: 4px;
    border-radius: 0 500px 500px 0;
}

.no-pd-l {
    padding-left: 0;
}

.no-pd-r {
    padding-right: 0;
}

.table.member-note > thead > tr > th:last-child, .table.member-note > tbody > tr > td:last-child {
    text-align: left;
}

#header .list-group {
    max-height: 420px;
    overflow: auto;
}

.modal .tab-container .tab-content {
    border-left: none;
    border-right: none;
    border-bottom: none;
}

.select2-container.select2-container-disabled .select2-choice,
.select2-container-multi.select2-container-disabled .select2-choices{
    background: none;
    border: none;
}

.modal .tab-setting .nav-tabs > li > a.tab-icon {
    background-size: 20px;
}

.modal .tab-setting .nav-tabs > li > a.tab-icon {
    height: 60px;
    padding-top: 30px;
    width: 70px;
}

.modal .tab-setting .tab-content-1 {
    min-height: auto;
}

.modal .table > tbody > tr > td, .modal .table > tfoot > tr > td {
    padding: 6px;
}

.lost-towel {
    height: 0;
    overflow: hidden;
}

.mbs-info {
    display: none;
}

.btn-bar {
    width: 80%;
    margin: 0 auto;
}

.chart-revenue-header {
    padding-top: 1px;
}

.chart-revenue-header h1 {
    margin-bottom: 0;
}

.box-popular-sv {
    min-height: 432px;
}

.search-by-date {
    width: 140px;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 10px;
}

.identified-upload .bootstrap-filestyle input {
    border-radius: 50px 0 0 50px;
}

/*-- View Page --*/
.view-page .form-control {
    border: none;
    box-shadow: none;
}

.view-page .select2-container {
    background: #e1f1f1;
}

.view-page .datepicker.form-control[disabled], .view-page .datepicker.form-control[readonly], .view-page fieldset[disabled] .datepicker.form-control,
.view-page #date_start, .view-page #date_end,
.view-page #date_start_2, .view-page #date_end_2 {
    background-color: #f1f1f1 !important;
}

.view-page .input-group-addon {
    border: none;
    background: #e1f1f1;
}

.view-page .form-control[disabled], .view-page .form-control[readonly], .view-page fieldset[disabled] .form-control,
.view-page .select2-container .select2-choice .select2-arrow b,
.view-page .i-checks input[disabled] + i::before, .view-page fieldset[disabled] .i-checks input + i::before {
    background: #e1f1f1 !important;
}

.view-page .i-checks input[disabled] + i::before, .view-page fieldset[disabled] .i-checks input + i::before {
    background: #555 !important;
}

.view-page .i-checks input[disabled] + i, .view-page fieldset[disabled] .i-checks input + i {
    border-color: #555 !important;
}

.access-title {
    text-align: left;
    text-transform: uppercase;
    background: #e1f1f1 !important;
}

.h-200 {
    height: 200px;
}

textarea.h-150 {
    height: 150px;
}

thead {
    background: #FFF;
}

/* List services */
ul.list-services,
ul.list-products {
    margin: 10px 0;
    padding: 0;
    list-style: none;
    width: 100%;
    display: inline-table;
}

ul.list-services li,
ul.list-products li {
    display: inline-block;
    width: 138px;
    margin: 5px 0%;
    border: 1px solid #999;
    padding: 3px;
}

.n-b {
    border: none;
}

.tab-setting ul.nav-tabs.n-b {
    border: none;
}

.tab-setting .nav.order-cate > li > a:hover, .tab-setting .nav.order-cate > li > a:focus, .tab-setting .nav-tabs.order-cate > li.active > a {
    border-color: #abd373;
    border-bottom: 1px solid #abd373 !important;
}

.tab-setting ul.nav-tabs.order-cate li {
    float: left;
}

.pre-order-box {
    position: fixed;
    top: 50px;
    right: 0;
    height: 100%;
    max-height: 100%;
    overflow: auto;
    z-index: 1000;
}

.pre-order-btns {
    position: fixed;
    bottom: 0px;
    right: 0px;
    padding: 10px;
    z-index: 1000;
}

.pre-order-box .table-order {
    margin-bottom: 10px;
}

.select-staff-wrap {
    display: none;
}

.table.table-order > tbody > tr > td, .table.table-order > tfoot > tr > td {
    padding: 3px;
}

.table-order thead {
    background: none;
}

.table-order td {
    border-top: 1px dotted #eee;
}

.table-order.table > thead > tr > td {
    padding: 8px 3px;
}

.table-order.table > tbody > tr > td, .table-order.table > tfoot > tr > td {
    border-top: 1px dotted #000;
}

ul.list-services > li,
ul.list-products > li {
    cursor: pointer;
    min-height: 115px;
    vertical-align: bottom;
}
tr.staff-assign td{
    border-top:none !important;
}
.text-logo {
    letter-spacing: 10px;
    font-weight: 400;
}

.text-logo-h2 {
    letter-spacing: 8px;
    font-weight: 400;
}

.cursor {
    cursor: pointer;
}

#drift-widget-container {
    display: none;
}

.v-b {
    display: inline-block;
    vertical-align: bottom;
}

.i-checks input:checked + i::before {
    background-color: #7266ba;
}

.i-checks input:checked + i {
    border-color: #7266ba;
}

.i-checks input.bg-info:checked + i::before {
    background-color: #23b7e5;
}

.i-checks input.bg-info:checked + i {
    border-color: #23b7e5;
}

.i-checks input.bg-success:checked + i::before {
    background-color: #abd373;
}

.i-checks input.bg-success:checked + i {
    border-color: #abd373;
}

.i-checks input.bg-warning:checked + i::before {
    background-color: #fad733;
}

.i-checks input.bg-warning:checked + i {
    border-color: #fad733;
}

.i-checks input.bg-danger:checked + i::before {
    background-color: #f26c4f;
}

.i-checks input.bg-danger:checked + i {
    border-color: #f26c4f;
}

.i-checks input.bg-pink:checked + i::before {
    background-color: #fa91c8;
}

.i-checks input.bg-pink:checked + i {
    border-color: #fa91c8;
}

#appointmentModal textarea {
    height: 150px;
}

.max-height-50 {
    max-height: 50px;
}

.pre-order-box input {
    background: #FFF;
    border: none;
    border-bottom: 1px solid #999;
}

.pre-order-btns .select2-choices {
    background: none;
    box-shadow: none;
}

.ord-detail tr {
    border-bottom: 1px dotted #CCC;
}

.ord-detail tr:last-child {
    border: none;
}

.order-history tbody tr {
    border-bottom: none;
}

.floatThead-container {
    z-index: 99 !important;
}

#links > a {
    margin-right: 5px;
    border: 1px solid #e1f1f1;
}

a.photo-thumb {
    width: 100px;
    height: 100px;
    background-size: cover !important;
    background-position: center !important;
    display: inline-block;
}

.select2-container-multi {
    height: auto;
    min-height: 32px;
}

.select2-container-multi .select2-choices,
.select2-container-multi.select2-container-active .select2-choices {
    border: none;
    background: none;
    box-shadow: none;
}
.select2-container-multi .select2-choices .select2-search-choice{
    background: #eee;
    border:none;
    border-radius:50px;
    box-shadow: none;
}
/* TOGGLE BUTTON */
.material-button-anim {
    position: fixed;
    padding: 0px 15px 0px;
    text-align: center;
    max-width: 320px;
    margin: 0 auto 20px;
    bottom: 0px;
    left: -5px;
    z-index: 9999;
}

.material-button {
    position: relative;
    top: 0;
    z-index: 1;
    width: 50px;
    height: 50px;
    font-size: 1.5em;
    color: #fff;
    background: #7266ba;
    border: none;
    border-radius: 50%;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .275);
    outline: none;
}

.material-button-toggle {
    z-index: 3;
    width: 50px;
    height: 50px;
    margin: 0 auto;
}

.material-button-toggle span {
    -webkit-transform: none;
    transform: none;
    -webkit-transition: -webkit-transform .175s cubic-bazier(.175, .67, .83, .67);
    transition: transform .175s cubic-bazier(.175, .67, .83, .67);
}

.material-button-toggle.open {
    -webkit-transform: scale(1.3, 1.3);
    transform: scale(1.3, 1.3);
    -webkit-animation: toggleBtnAnim .175s;
    animation: toggleBtnAnim .175s;
}

.material-button-toggle.open span {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: -webkit-transform .175s cubic-bazier(.175, .67, .83, .67);
    transition: transform .175s cubic-bazier(.175, .67, .83, .67);
}

#options {
    height: 50px;
}

.option {
    position: relative;
}

.option .option1,
.option .option2,
.option .option3 {
    filter: blur(5px);
    -webkit-filter: blur(5px);
    -webkit-transition: all .175s;
    transition: all .175s;
}

.option .option1 {
    -webkit-transform: translate3d(60px, 60px, 0) scale(.8, .8);
    transform: translate3d(60px, 60px, 0) scale(.8, .8);
}

.option .option2 {
    -webkit-transform: translate3d(0, 60px, 0) scale(.8, .8);
    transform: translate3d(0, 60px, 0) scale(.8, .8);
}

.option .option3 {
    -webkit-transform: translate3d(-60px, 60px, 0) scale(.8, .8);
    transform: translate3d(-60px, 60px, 0) scale(.8, .8);
}

.option.scale-on .option1,
.option.scale-on .option2,
.option.scale-on .option3 {
    filter: blur(0);
    -webkit-filter: blur(0);
    -webkit-transform: none;
    transform: none;
    -webkit-transition: all .175s;
    transition: all .175s;
}

.option.scale-on .option2 {
    -webkit-transform: translateY(-28px) translateZ(0);
    transform: translateY(-28px) translateZ(0);
    -webkit-transition: all .175s;
    transition: all .175s;
}

a.material-button {
    display: inline-block;
    padding-top: 12px;
}

a.material-button:hover {
    background: #abd373;
    color: #FFF;
}

.panel-default .panel-heading {
    background: #7266ba;
    color: #f4f3f9;
}
.panel-default .panel-heading.bg-light{
    background: #F1F1F1;
    color: #333;
}
.panel-default .panel-heading .form-group{
    color: #333;
}
.bed-in-out {
    position: absolute;
    bottom: 3px;
    right: 3px;
}

/* Login Background */
.app-header-fixed.bg-2019{
    padding-top:0;
    background-image: url('../img/login-background.jpg');
    background-size: cover;
    background-position: center;
    width: 100%;
    height: auto; 
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.box-login {
    border-radius: 20px;
    background: white;
    align-items: center;
    display: flex;
    flex-direction: column;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    width: 300px;
}

.form-login {
    width: 100%;
    padding: 15px;
}

.logo-be {
    position: absolute;
    top: 20px;
    left: 20px;
}

.btn-login {
    color: white;
    background-color: #009DFF;
    border-radius: 8px;
}

.copy-right-text{
    margin-top: 30px;
}

.text-welcome-be {
    color: #FF0707;
    display: flex;
    text-transform: capitalize;
    margin-bottom: 85px;
}

.text-welcome-be h1:nth-child(1) {
    margin-right: 10px;
}

@media only screen and (max-width: 366px) {
    .footer-contact {
        font-size: 14px !important;
        flex-direction: column; 
        align-items: center;
    }
    .logo-be {
        width: 150px;
    } 
}

@media only screen and (max-width: 767px) {
    .text-welcome-be h1 {
        font-size: 25px;
    }
    .footer-contact {
        font-size: 14px !important;
    }
    .logo-be {
        width: 100px;
    } 
}


.background-behappy { 
    display: flex;
    flex-direction: column;
    align-items: center;
}

.footer-contact {
    width: 100%;
    background-color: #009DFF;
    position: absolute;
    bottom: 0;
    padding: 10px;
    display: flex;
    justify-content: space-between;
    color: white;
    font-weight: bold;
    font-size: 15px;
    text-transform: uppercase;
}
.footer-contact a {
    color: white;
}
.welcome-clock{
    font-size:120px;
}

.text-forgot a{
    color: #009DFF ;
    font-weight: bold;
}

.login-wrap{
    position: absolute;
    width: 35%;
    height:100%;
    overflow: auto;
    right:0;
    top:0;
    z-index: 2;
    background: #FFF;
}
.bg-2019 .login-wrap .container {
    padding:100px 50px 0;
    width: 100%;
    max-width: 100%;
}
.bg-2019 .login-wrap .container img{
    width: 150px;
    height: auto;
}

.support-contact{
    position: fixed;
    color:#fff;
    z-index: 2;
    bottom:20px;
    left:80px;
}

/* End Background 2018 */

.text-xxs{
    font-size: 10px;
}
ul.bed-list {
    margin: 0;
    padding: 0;
    display: table;
}

ul.bed-list > li {
    position: relative;
    display: inline-table;
    vertical-align: bottom;
    padding: 3px;
    width: 160px;
    height: 115px;
    margin-right: 10px;
    margin-bottom: 10px;
    border: 1px solid #58666e;
}

ul.bed-list > li.active {
    background-color:#e1f1f1;
}

ul.bed-list h5 {
    margin-top: 0;
}

/* -- Service card -- */
ul.service-card-list{
    display: table-cell;
    margin:0;
    padding:0;
}
ul.service-card-list li{
    position: relative;
    width: 250px;
    height:140px;
    border-radius:5px;
    padding:5px;
    display: inline-table;
    margin-right: 2px;
    margin-bottom:20px;
    padding-bottom:35px;
}
ul.service-card-list li.service-card-active{
    background:#7266ba;
    color:#FFF;
}
ul.service-card-list li.service-card-disable{
    background:#AAA;
    color:#FFF;
}
ul.service-card-list li .card-times{
    position: absolute;
    left:5px;
    bottom:5px;
}
ul.service-card-list li .card-btn{
    position: absolute;
    right:5px;
    bottom:5px;
}
.table-order.table > tbody > tr > td.no-bd{
    border:none;
}
.table-order.table > tbody > tr > td.b-t{
    border-top:1px solid #000;
}

/*------ Search on top ------*/
.navbar-form #s2id_customer_info .select2-arrow{
    display: none;
}

.navbar-form #s2id_customer_info{
    background-image: url('select2x2.png') !important;
    background-repeat: no-repeat !important;
    background-size: 60px 40px !important;
    background-position: 100% -19px !important;
    width: 180px;
}

.navbar-form #s2id_customer_info.select2-dropdown-open{
    width: 260px;
}
.select2-drop-active{
    border:none;
}
#select2-drop-mask{
    background:rgba(0,0,0,0.5);
    opacity: 1;
}
.select2-results .select2-highlighted{
    background: #7266BA;
}

.card-selected{
    background: #abd373 !important;
}
.prepay-card li{
    position: relative;
    cursor: pointer;
}
.prepay-card .exp{
    position: absolute;
    bottom: 5px;
    right: 10px;
}
.prepay-card .price{
    position: absolute;
    bottom: 5px;
    left: 10px;
}
.dropdown-menu li.disabled a{
    color: #999;
}
.wrap-note-table{
    max-height: 1000px;
    overflow: auto;
}
/*--- User photo list ---*/
.photo-list{
    list-style: none;
    width: 100%;
    margin:0;
    padding:0;
}
.photo-list li{
    width: 100%;
    border-bottom:1px solid #999;
    padding-top:10px;
}
.photo-list li h2{
    text-align: left;
}
.photo-list li:last-child{
    border-bottom: none;
}
.delete-photo{
    position: relative;
    top:3px;
    right:3px;
    display: block;
    background:#f26c4f;
    color:#FFF;
    width: 15px;
    height:15px;
    text-align: center;
    border-radius:500px;
    z-index: 5;
    line-height: 15px;
    float:right;
}

/*----- Edit member note -----*/
.member-note-area{
    border:none;
    border-bottom: 1px solid #999;
    overflow: visible;
}
.no-show{
    display: none;
    width: 100%;
    min-height: 150px;
}
/*----- CHECKIN -----*/
.checkedin-info,
.checkedout-info {
    display: none;
}
.textarea-st{
    border:none;
    border-bottom:1px solid #ddd;
    font-style: italic;
}
.table-striped > tbody > tr:nth-child(2n+1) > td textarea{
    background:#FBFBFB;
}
.advance-search{
    display: none;
}

.row-commission{
    padding-top:3px !important;
    padding-bottom:3px !important;
}

.text-xs-1{
    font-size:10px;
}
.table-responsive{
    border:none;
}
.n-pd-r{
    padding-right:0;
}
.repeat{
    display:none;
}
.panel-today{
    max-height: 384px;
}
.chart-label{
    position: absolute;
    bottom:40px;
    left: 30px;
    z-index:9;
    font-size: 11px;
    color:#AAA;
}
.p-l-xs{
    padding-left: 5px;
}
.p-r-xs{
    padding-right: 5px;
}
.p-wrap{
    padding:10px 30px;
}
.dropdown button.btn-readed{
    height: 22px;
    margin-top: -2px;
}
/* -- Rating -- */

.rating {
    border: none;
    float: left;
}

.rating > input { display: none; }
.rating > label:before {
    margin: 5px;
    font-size: 1.25em;
    font-family: FontAwesome;
    display: inline-block;
    content: "\f005";
}

.rating > .half:before {
    content: "\f089";
    position: absolute;
}

.rating > label {
    color: #ddd;
    float: right;
}

/***** CSS Magic to Highlight Stars on Hover *****/

.rating > input:checked ~ label, /* show gold star when clicked */
.rating:not(:checked) > label:hover, /* hover current star */
.rating:not(:checked) > label:hover ~ label { color: #FFD700;  } /* hover previous stars in list */

.rating > input:checked + label:hover, /* hover current star when changing rating */
.rating > input:checked ~ label:hover,
.rating > label:hover ~ input:checked ~ label, /* lighten current selection */
.rating > input:checked ~ label:hover ~ label { color: #FFED85;  }
.rating-tbl td{
    padding:5px !important;
}
.rating-tbl td:first-child {
    padding:0px !important;
}
.rating-tbl input{
    max-width: 90px;
}
/*----- Stars -----*/
div.stars {
    width: 100%;
    display: inline-block;
}

input.star { display: none; }

label.star {
    float: right;
    padding: 10px;
    font-size: 36px;
    color: #444;
    transition: all .2s;
}

input.star:checked ~ label.star:before {
    content: '\f005';
    color: #FD4;
    transition: all .25s;
}

input.star-5:checked ~ label.star:before {
    color: #FE7;
    text-shadow: 0 0 20px #952;
}

input.star-1:checked ~ label.star:before { color: #F62; }

label.star:hover { transform: rotate(-15deg) scale(1.3); }

label.star:before {
    content: '\f006';
    font-family: FontAwesome;
}

/*----- End stars -----*/
.break-br{
    width:100%;
    height:16px;
}
.item-photo .avatar-preview{
    border-radius: 0;
}
.item-photo .preview-lg,
.item-photo .preview-md,
.item-photo .preview-sm{
    height:auto
}
.product-units{
    padding:0 !important;
    margin:0 !important;
    margin-top: -5px !important;
    border:none !important;
    border-bottom: 1px solid #999 !important;
    border-radius: 0 !important;
    width:80px;
    background: none !important;
}
.service_list_choose ul {
    padding-left: 0;
}
.service_list_choose ul li {
    height: auto;
    margin-bottom: 0;
    padding:0;
}
@keyframes up-right {
    0% {
        transform: scale(1);
        opacity: .25
    }
    50% {
        transform: scale (1, 5);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: .25;
    }
}

.red-blink {
    position: absolute;
    right: 5px;
    top: 5px;
    -webkit-animation: up-right 1s infinite;
    -moz-animation: up-right 1s infinite;
    -o-animation: up-right 1s infinite;
    animation: up-right 1s infinite;
}
.pinkBg {
    background-color: #f26c4f!important;
    background-image: linear-gradient(90deg, #fd5581, #fd8b55);
}
.intro-banner-vdo-play-btn{
    height:10px;
    width:10px;
    position:absolute;
    right:10px;
    top: 15px;
    text-align:center;
    margin:-5px 0 0 -5px;
    border-radius:100px;
    z-index:1
}
.intro-banner-vdo-play-btn i{
    line-height:56px;
    font-size:30px
}
.intro-banner-vdo-play-btn .ripple{
    position:absolute;
    width:30px;
    height:30px;
    z-index:-1;
    left:50%;
    top:50%;
    opacity:0;
    margin:-15px 0 0 -15px;
    border-radius:100px;
    -webkit-animation:ripple 1.8s infinite;
    animation:ripple 1.8s infinite
}
.navi .intro-banner-vdo-play-btn{
    left:30px;
}
.app-aside-folded a span.navi-text,
.app-aside-folded .a-version{
    visibility: hidden;
}
.apt-label{
    display: none;
}
.btn-hide{
    display: none;
}
#wrap_order input.n-b{
    border: none;
}
#wrap_order input.b-b{
    border-bottom: 1px solid #999;
}
.fc-list-item-time > span.pull-right{
    float:left !important;
}
.appointment-staff-wrap{
    width: 100%;
    overflow-x: auto;
}
.cls-appointment-staff{
    cursor: pointer;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}
.cls-opacity-50{
    opacity:0.5;
}
.cls-opacity-30{
    opacity:0.3;
}
.app-aside-folded a span.navi-text,
.app-aside-folded .a-version,
.app-aside-folded .a-language{
    visibility: hidden;
}
.order-detail{
    position:fixed; top:50px; right:0px; z-index: 1000; height: 100%; overflow: scroll;
}

/*---- Signature -----*/
.signature-area {
    width:100px;
    height:100px;
    text-align: center;
    border: 2px dashed #999;
    font-size: 30px;
    color: #999;
    padding-top:30px;
    cursor: pointer;
    line-height: 20px;
    float:left;
}
.signature-img{
    width:100px;
    height:100px;
    text-align: center;
    margin-left: 10px;
    float:left;
}
.signature-customer{
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: #FFF;
    top:0;
    left:0;
}

.itemform {
    margin-bottom: 10px;
    overflow: hidden;
}
.item_combo_choose {
    padding-bottom: 20px;
}

.item_combo_choose .noactive {
    color: #afafaf;
}
ul.service-card-list.list-sm > li{
    height:120px;
    margin-bottom:10px;
}
ul.service-card-list.list-sm li{
    width: 180px;
    font-size: 11px;
    padding:2px;
}
ul.service-card-list.list-sm ul li{

}
ul.service-card-list.list-sm li .card-btn{
    right:0;
    bottom:0px;
}
ul.service-card-list.list-sm .btn-xs.btn-icon{
    width:18px;
    height:18px;
}
ul.service-card-list.list-sm .btn-icon i{
    line-height: 30px;
}

.dp-btn-group {
    padding: 6px 0;
    font-size:12px;
    font-weight:500;
}
@-webkit-keyframes ripple{
    0%{
        opacity:1;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    100%{
        opacity:0;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
@keyframes ripple{
    0%{
        opacity:1;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    100%{
        opacity:0;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
.intro-banner-vdo-play-btn .ripple:nth-child(2){
    animation-delay:.3s;
    -webkit-animation-delay:.3s
}
.intro-banner-vdo-play-btn .ripple:nth-child(3){
    animation-delay:.6s;
    -webkit-animation-delay:.6s
}

@keyframes toggleBtnAnim {
    0% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(1.4, 1.4);
        transform: scale(1.4, 1.4);
    }
    75% {
        -webkit-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);
    }
    100% {
        -webkit-transform: scale(1.3, 1.3);
        transform: scale(1.3, 1.3);
    }
}

@-webkit-keyframes toggleBtnAnim {
    0% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(1.4, 1.4);
        transform: scale(1.4, 1.4);
    }
    75% {
        -webkit-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);
    }
    100% {
        -webkit-transform: scale(1.3, 1.3);
        transform: scale(1.3, 1.3);
    }
}

.avatar-noborder-radius {
    border-radius: 0;
}

.check_custom {
    margin-top: 7px;
}

/*============= Responsive ============*/
/* CSS Document */
@media only screen and (min-width: 980px) and (max-width: 1199px) {
    .m-dashboard li {
        width: 48%;
    }
    .bg-login {
        background-size: auto 110%;
    }
    .noselect {
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
    }
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 979px) {
    /* Tab Setting */
    .tab-setting .nav-tabs > li > a.tab-icon {
        font-size: 12px;
        width: 64px;
    }

    .tab-setting .nav-tabs > li:first-child h1 + button + button {
        display: none;
    }

    .country-list .btn-sm {
        width: 100%;
    }

    .tab-setting .nav-tabs > li > a.tab-icon {
        width: 48px;
        text-indent: -9999px;
    }

    .opening-hour {
        width: 100%;
    }

    .date {
        width: 40px;
        height: 40px;
        font-size: 14px;
        padding-top: 9px;
    }

    /*---------------*/
    .m-dashboard li {
        width: 100%;
        margin: 5px 0;
    }

    .m-dashboard > li > div > div:last-child > .btn {
        display: inline-block;
        float: none;
        vertical-align: top;
    }

    .m-dashboard {
        max-width: 380px;
    }

    .bg-login {
        background-size: 150% auto;
    }

    .bg-2019{
        background-position: -300px 0;
    }
    .bg-2019 .left-side{
        width: 50%;
        padding-top:180px;
        padding-right:40px;
    }
    .bg-2019 .login-wrap{
        width: 400px;
    }
    .bg-2019 .login-wrap .container {
        padding:100px 30px 0;
    }
    .welcome-text{
        font-size:30px;
    }
    .welcome-clock{
        font-size:90px;
    }
    .shortcut-btn{
        display: none;
    }

    .noselect {
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
    }
}

/* All Mobile Sizes (devices and browser) */

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .line-summary > div:first-child {
        padding: 25px 0 5px;
        border-right: none;
    }

    .line-summary > div:last-child {
        padding-bottom: 20px;
    }

    .box-chart .nav-tabs > li a {
        font-size: 15px;
    }

    .p-sv-i {
        float: left;
        clear: none;
    }

    .setting-advance > div:first-child {
        border: none;
    }

    .country-list .btn-sm {
        width: 100%;
    }

    .pu-right, .pu-left {
        float: none;
    }

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

    /* Tab Setting */
    .tab-setting .nav-tabs > li {
        width: 16%;
    }

    .tab-setting .nav-tabs > li:first-child {
        width: 100%;
        text-align: center;
    }

    .tab-setting .nav-tabs > li:first-child h1 {
        margin-bottom: 20px;
    }

    .tab-setting .nav-tabs > li > a.tab-icon {
        width: 100%;
    }

    .opening-hour .timeslots {
        position: relative;
        margin-bottom: 50px;
    }

    .opening-hour .timeslots .col-sm-1:last-child {
        position: absolute;
        right: 0;
        top: 10px;
    }

    /*---------------*/
    .m-dashboard li {
        width: 100%;
        margin: 5px 0;
    }

    .m-dashboard > li > div > div:last-child.col-lg-4 {
        text-align: center;
    }

    .m-dashboard > li > div > div:last-child > .btn {
        display: inline-block;
        float: none;
        vertical-align: top;
    }

    .m-dashboard .upgrade-pl .upgrade-ly {
        padding: 0 10px;
    }

    .wrap-rd .btn {
        height: 30px;
    }

    ul.list-group-1-4x > li {
        width: 100%;
    }

    .plan-detail-wrap > p > a {
        width: 100%;
        margin-bottom: 10px;
    }

    #modal_plan,
    #modal_cancel_plan {
        padding-right: 0 !important;
    }

    .col-lg-2-5 {
        width: 100%;
    }

    .col-lg-2-5 > div,
    .col-lg-2-5 .b-a {
        border: 1px solid #dee5e7;
    }

    .m-dashboard {
        max-width: 380px;
    }

    .bg-login {
        background-size: auto 110%;
    }

    .no-pd-l {
        padding-left: 15px;
    }

    .no-pd-r {
        padding-right: 15px;
    }

    .tet-2018 > .container {
        background: none;
    }
}

@media only screen and (max-width: 767px) {
    .calendar-note {
        float: left;
        clear: both;
        width: 100% !important;
        text-align: right;
        margin-bottom: 15px !important;
    }
    #search_form {
        float:left !important;
        width: 60%;
    }
    .bg-2019{
        background-position: -300px 0;
    }
    .bg-2019 .left-side{
        width: 50%;
        padding-top:80px;
        padding-right:40px;
    }
    .bg-2019 .login-wrap{
        width: 400px;
        max-width: 100%;
    }
    .bg-2019 .login-wrap .container {
        padding:30px 30px 0;
    }
    .welcome-text{
        font-size:30px;
    }
    .welcome-clock{
        font-size:60px;
    }
    .search-bar.hien.w-xxl{
        max-width: 85%;
    }
    .member-list #search_form .w-sm{
        max-width: 48%;
    }
    .member-list #search_form .pull-right{
        float:left !important;
        margin:0;
        margin-right: 3px;
        padding:0;
        max-width: 40%;
    }
    .break-br{
        height:0;
    }
    .order-list #search_form .w-xs{
        max-width: 28%;
    }
    .sale-report-all #search_form .w-xs{
        max-width: 28%;
    }
    .sale-report-all #search_form .w-sm{
        max-width: 48%;
    }
    .sale-report-all #search_form .m-l-xs{
        margin-left: auto;
    }
    .sale-report-all #search_form .select2-container{
        margin-right:2px;
    }
    .sale-report-all #search_form .date-filter{
        text-align: left;
    }
    .sale-chart .form-control{
        height:30px;
    }
    .app-footer span.pull-right{
        float:none !important;
    }
    .app-footer .footer-hotline{
        float:left !important;
    }
    .app-footer .text-xxs.text-muted{
        clear:both;
        display: inline-block;
        text-indent: 0;
    }
    .appointment-staff-wrap .badge.up{
        top:0;
    }

    .date-filter.pull-right,
    .select2-container.pull-right{
        float:left !important;
    }
    .search-bar.hien,
    .select2-container.pull-right,
    .select2-container.w-sm,
    .select_service_card.pull-right,
    .select_prepay_card.pull-right{
        width:100% !important;
    }
    .date-filter.text-right{
        text-align: left;
    }

    .noselect {
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
    }

    .order-page .tab-setting .nav-tabs > li:first-child {
        width: auto;
    }
    .order-page .tab-setting .nav-tabs > li{
        width: auto;
    }
    .order-detail{
        position:relative; top:0px; right:0px; overflow: scroll;
    }
    .no-pd-sm{
        padding:0 !important;
    }
    .no-mg-sm{
        margin:0 !important;
    }
}
@media only screen and (max-width: 650px) {
    .bg-2019 {
        background: #FFF;
    }

    .bg-2019 .left-side,
    .blur-layout {
        display: none;
    }
    .bg-2019 .login-wrap{
        width: 100%;
        max-width: 100%;
    }
    .bg-2019 .container {
        position: relative;
        padding: 50px 30px 0;
        width: 100%;
    }
}
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

@media only screen and (max-width: 479px) {
    .line-summary > div:first-child {
        padding: 25px 0 5px;
        border-right: none;
    }

    .line-summary > div:last-child {
        padding-bottom: 20px;
    }

    .box-chart .nav-tabs > li a {
        font-size: 15px;
    }

    .p-sv-i {
        float: left;
        clear: both;
    }

    .box-notification {
        padding: 20px;
    }

    /* Notification */
    .table > tbody > tr > td, .table > tfoot > tr > td {
        padding: 13px 0;
    }

    .tbl-notification > tbody > tr > td:first-child {
        width: 50px;
    }

    .tbl-notification > tbody > tr > td:last-child {
        width: 50px;
    }

    .tbl-notification > tbody > tr > td:first-child img {
        max-width: 90%
    }

    .setting-advance > div:first-child {
        border: none;
    }

    .country-list .btn-sm {
        width: 100%;
    }

    .pu-right, .pu-left {
        float: none;
    }

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

    /* Tab Setting */
    .tab-setting .nav-tabs > li {
        width: 16%;
    }

    .tab-setting .nav-tabs > li:first-child {
        width: 100%;
        text-align: center;
    }

    .tab-setting .nav-tabs > li:first-child h1 {
        margin-bottom: 20px;
    }

    .tab-setting .nav-tabs > li:first-child h1 + button + button {
        display: none;
    }

    .tab-setting .nav-tabs > li:first-child .btn {
        padding: 6px 10px;
    }

    .tab-setting .nav-tabs > li > a.tab-icon {
        width: 100%;
    }

    .tab-setting .nav-tabs > li.text-indent > a.tab-icon {
        width: 100%;
        text-indent: -9999px;
        height: 50px;
    }

    .box-social .form-control.col-xs-10 {
        width: 75%;
        float: right;
    }

    .pd-sm-sc {
        padding-left: 15px;
        padding-right: 15px;
    }

    .input-group-addon:first-child {
        font-size: 9px;
        padding: 0 3px;
    }

    .opening-hour .timeslots {
        position: relative;
        margin-bottom: 50px;
    }

    .opening-hour .timeslots .col-sm-1:last-child {
        position: absolute;
        right: 0;
        top: 10px;
    }

    .opening-hour .elessar-labels > div {
        display: none;
    }

    .opening-hour .elessar-labels > div:first-child {
        display: block;
    }

    .tab-pane .loading {
        height: 300px;
        min-height: 300px;
    }

    .modal-alert {
        width: 240px;
        margin-left: -120px;
    }

    .form-control {
        height: 30px;
    }

    /*---------------*/
    .page-content {
        padding: 0;
    }

    .page-content > .col-md-12 {
        padding: 0;
    }

    .app-content-body {
        padding-bottom: 0;
    }

    .chosen-container-single .chosen-single {
        height: 30px !important;
    }

    /*---------------*/
    .m-dashboard li {
        width: 100%;
        margin: 5px 0;
    }

    .m-dashboard > li > div > div:last-child.col-lg-4 {
        text-align: center;
    }

    .m-dashboard > li > div > div:last-child > .btn {
        display: inline-block;
        float: none;
        vertical-align: top;
    }

    .m-dashboard .upgrade-pl .upgrade-ly {
        padding: 0 10px;
    }

    .wrap-rd .btn {
        height: 30px;
    }

    ul.list-group-1-4x > li {
        width: 100%;
    }

    .plan-detail-wrap > p > a {
        width: 100%;
        margin-bottom: 10px;
    }

    #modal_plan,
    #modal_cancel_plan {
        padding-right: 0 !important;
    }

    .col-lg-2-5 {
        width: 100%;
    }

    .col-lg-2-5 > div,
    .col-lg-2-5 .b-a {
        border: 1px solid #dee5e7;
    }

    .m-dashboard {
        max-width: 380px;
    }

    .bg-login {
        background-size: auto 110%;
    }

    .chart-revenue-header {
    }

    .form-control,
    .search-bar .btn-sm {
        height: 32px;
    }

    .no-pd-l {
        padding-left: 15px;
    }

    .no-pd-r {
        padding-right: 15px;
    }

    .tet-2018 > .container {
        background: none;
    }
    .bg-2019{
        background: #FFF;
    }
    .bg-2019 .left-side,
    .blur-layout{
        display: none;
    }
    .bg-2019 > .container {
        position: relative;
        padding:50px 30px 0;
        width: 100%;
    }

    .p-wrap{
        padding:10px 10px;
    }
    .app-footer{
        position: relative;
    }
    .panel{
        margin-bottom:10px;
    }
    .no-pd-left-on-mobile{
        padding-left:0;
    }
    .mg-l-xs{
        margin-left:5px !important;
    }
    .mg-r-xs{
        margin-right:5px !important;
    }
}

@media only screen and (max-width: 1024px) {
    .elessar-rangebar {
        height: 20px;
        line-height: 20px;
        margin-top: 10px;
    }

    .elessar-range {
        height: 20px;
    }

    .elessar-handle {
        height: 30px;
        width: 30px;
    }

    .modal-footer {
        padding-bottom: 50px;
    }
}

/*=============== FOR RETINA DISPLAY ================*/
@media only screen and ( -webkit-min-device-pixel-ratio: 1.3 ), only screen and (    min--moz-device-pixel-ratio: 1.3 ), only screen and (      -o-min-device-pixel-ratio: 2.6/2 ), /* returns 1.3, see Dev.Opera */
only screen and (         min-device-pixel-ratio: 1.3 ), only screen and ( min-resolution: 124.8dpi ), only screen and ( min-resolution: 1.3dppx ) {

    .tab-setting .nav-tabs > li > a.ti-medical {
        background-image: url(../img/ms-6@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-gallery {
        background-image: url(../img/ms-5@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-op-hour {
        background-image: url(../img/ms-4@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-description {
        background-image: url(../img/ms-3@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-info {
        background-image: url(../img/ms-2@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-account {
        background-image: url(../img/ms-1@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-merchant {
        background-image: url(../img/bs-1@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-branch {
        background-image: url(../img/bs-2@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-staff {
        background-image: url(../img/bs-3@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-customer {
        background-image: url(../img/bs-4@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-service {
        background-image: url(../img/bs-5@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-package {
        background-image: url(../img/pk-1@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-retail {
        background-image: url(../img/pk-2@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-appointment {
        background-image: url(../img/ap-1@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-redemption {
        background-image: url(../img/pm-3@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-1st-deal {
        background-image: url(../img/pm-2@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-time-deal {
        background-image: url(../img/pm-1@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-calendar {
        background-image: url(../img/cl-1@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-message {
        background-image: url(../img/cl-4@2x.png);
        background-size: 35px;
    }

    .tab-setting .nav-tabs > li > a.ti-list {
        background-image: url(../img/cl-2@2x.png);
        background-size: 32px;
    }

    .loading {
        background-image: url(../img/loading@2x.gif);
        background-size: 100px auto;
        background-position: center 40px;
    }

    .loading-abs {
        background-image: url(../img/loading@2x.gif);
        background-size: 100px auto;
    }
}
.medical_tab_list_details{
    display: none;
}
.medical_tab_list_details.active{
    display: block;
}
#notifications {
    cursor: pointer;
    position: fixed;
    right: 0px;
    z-index: 9999;
    top: 0px;
    margin-top: 55px;
    margin-right: 15px;
    max-width: 300px;   
}
.alert-notification{
    margin-bottom: 10px;
}
.payment-value{
    width: calc(100% - 12px);
    text-align: right !important;
    background-color: transparent !important;
    border: none !important;
}
.payment-value:disabled{
    cursor: not-allowed;
}
.payment-btn{
    cursor: pointer;
}
.invisibile {
    visibility: hidden;
}

.visibile {
    visibility: visible;
}

.super_visible{
    visibility: visible!important;
}

.text-line-through{
    text-decoration-line: line-through;
}

.icon-blink{
    -webkit-animation: up-right 2s infinite;
    -moz-animation: up-right 2s infinite;
    -o-animation: up-right 2s infinite;
    animation: up-right 2s infinite;
}

.progress-button
{
    position: relative;
    display: inline-block;
    text-align: center;
    margin-bottom: 15px;
}

.progress-button button {
    display: block;
    margin: 0 auto;
    padding: 0;
    width: 40px;
    height: 40px;
    border: 3px solid #ddd;
    border-radius: 40px;
    background: transparent;
    color: #abd373;
    font-size: 18px;
    -webkit-tap-highlight-color: transparent;
    -webkit-transition: background-color 0.3s, color 0.3s, width 0.3s, border-width 0.3s, border-color 0.3s;
    transition: background-color 0.3s, color 0.3s, width 0.3s, border-width 0.3s, border-color 0.3s;
}

.progress-button i {
    line-height: 1.42857143 !important;
}

.progress-button svg.progress-circle path {
    stroke: #abd373;
    stroke-width: 3;
    opacity: 0;
    fill: none;
}

.progress-button svg {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    pointer-events: none;
}

.text-overflow-el {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}


.spinner {
    height: 60px;
    width: 60px;
    margin: auto;
    display: flex;
    position: absolute;
    -webkit-animation: rotation .6s infinite linear;
    -moz-animation: rotation .6s infinite linear;
    -o-animation: rotation .6s infinite linear;
    animation: rotation .6s infinite linear;
    border-left: 6px solid rgba(0, 174, 239, .15);
    border-right: 6px solid rgba(0, 174, 239, .15);
    border-bottom: 6px solid rgba(0, 174, 239, .15);
    border-top: 6px solid rgba(0, 174, 239, .8);
    border-radius: 100%;
}

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(359deg);
    }
}

@-moz-keyframes rotation {
    from {
        -moz-transform: rotate(0deg);
    }
    to {
        -moz-transform: rotate(359deg);
    }
}

@-o-keyframes rotation {
    from {
        -o-transform: rotate(0deg);
    }
    to {
        -o-transform: rotate(359deg);
    }
}

@keyframes rotation {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(359deg);
    }
}

#overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 2000;
    cursor: pointer;
}
.box-booking-wrap{
    width: 100%;
    overflow: auto;
}
.box-booking{
    min-width: 960px;
}
.box-booking-col{
    min-width: 300px;
}
.m-r-md{
    margin-right:15px;
}
#popup_notify_brand_app .modal-backdrop.in{
    opacity: 0.9;
}
.modal {
    overflow-y: auto !important;
}
.custom .nav.nav-tabs{
    background: #7161BA;
    color: white;
    text-align: center;
    padding: 20px 0px;
}
.custom .form-group{
    display: flex;
    align-items :center;
}
.custom .form-group input{
    border: none;
    border-bottom: 1px solid #EEEDF2;
    border-radius: 0;
    background: none;
    box-shadow: unset;
}
.custom .form-group label i{
    color:#7161BA;
}
.custom p{
    text-align: center;
    font-family: 'Quicksand';
    font-size: 13px;
    font-weight: 600;
    color: #7161BA;
}
.custom p > span{
    color:#EA6B1E;
}
.custom .modal-footer{
    text-align: center;
    border: none;
    padding: 0;
    padding-bottom: 15px;
}
.custom .modal-footer .btn{
    background: #7161BA;
    border: none;
    width: 100%;
    padding: 10px 0;
    font-size: 18px;
    color: white;
    margin-bottom: 10px;
}
.custom .modal-footer p > a{
    color: #7161BA;
}
.custom .tab-container{
    border-radius: 20px;
    overflow: hidden;
}
.img_moba_mobile{
    width: 100%;
    display: none;
}
.box_over_popup_moba{
    position: absolute;
    /* background: #756bb2; */
    bottom: 5%;
    right: 15px;
    /* height: 2.5%; */
    width: 37%;
    white-space: normal;
    text-align: center;
    font-size: 1.3vw;
    font-weight: 700;
    font-style: italic;
}
.box_over_popup_moba button{
    background: #ea6715;
    border: none;
    padding: 4% 11%;
    box-shadow: -3px 6px 5px #0000004f;
    border-radius: 40px;
}
.box_over_popup_moba p{
    color: #f0945d;
    padding-right: 10%;
    text-align: center;
}

#btn-reset-filter {
    width: fit-content;
}

.left-input {
    padding-left: 0;
}

.filter-btn {
    margin-top: 20px !important;
}

@media (max-width: 800px){
    .img_moba_mobile{
        display: block !important;
    }
    .modal-body{
        width: auto !important;
    }
}
.pointer_event_none{
    pointer-events: none;
}
.multi-select2-input .select2-choices .select2-search-field input {
    padding-left: 0;
    padding-right: 0;
    font-family: 'Quicksand', sans-serif;
    color: #363f44 !important;
}
@media (max-width: 540px) {
    .left-input {
        padding-left: 15px;
    }
}