:root {
    --main-color: hsl(204, 86%, 53%);
    --main-color-dark: hsl(217, 71%, 53%);
    --grey-color: #443e3e;
    --light-color: #f8f8f8;
    --grey-color-light: #ddd;
    --grey-color-dark: #999;
    --red-color: #f04438;
    --text: #646469;
    --white: #fff;
    --gradient: linear-gradient(90deg,hsl(217, 71%, 53%),hsl(204, 86%, 53%));
    --gradient-inverted: linear-gradient(90deg,hsl(204, 86%, 53%),hsl(217, 71%, 53%));
}
html,
body {
    height: 100%;
}

#load-bar-wrap {
    position: fixed;
    width: 100%;
    height: 0px;
    top: 0;
    z-index: 0;
    overflow: hidden;
}
.load-bar {
    position: relative;
    width: 100%;
    height: 4px;
    background-color: rgb(62, 142, 208);
}
.bar {
    content: "";
    display: inline;
    position: absolute;
    width: 0;
    height: 100%;
    left: 50%;
    text-align: center;
}
.bar:nth-child(1) {
    background-color: hsl(141, 53%, 53%);
    animation: loading 3s linear infinite;
}
.bar:nth-child(2) {
    background-color: rgb(62, 142, 208);
    animation: loading 3s linear 1s infinite;
}
.bar:nth-child(3) {
    background-color: hsl(141, 53%, 53%);
    animation: loading 3s linear 2s infinite;
}
@keyframes loading {
    from {left: 0; width: 0;z-index:100;}
    33.3333% {left: 0; width: 100%;z-index: 10;}
    to {left: 0; width: 100%;}
}

#footer {
    margin-top: auto;
}
#footer a {
    color: #f5f5f5;;
}
.footer {
    height: 60px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}

.jumbotron {
    text-align: center;
    background-color: transparent;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.not-set {
    color: #c55;
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    padding-left: 5px;
}

a.asc:after {
    content: /*"\e113"*/ "\e151";
}

a.desc:after {
    content: /*"\e114"*/ "\e152";
}
a:focus, a:hover, a:active {
    text-decoration: none;
}
.sort-numerical a.asc:after {
    content: "\e153";
}

.sort-numerical a.desc:after {
    content: "\e154";
}

.sort-ordinal a.asc:after {
    content: "\e155";
}

.sort-ordinal a.desc:after {
    content: "\e156";
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;
}

.error-summary {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

/* align the logout "link" (button in form) of the navbar */
.nav li > form > button.logout {
    padding: 15px;
    border: none;
}

@media(max-width:767px) {
    .nav li > form > button.logout {
        display:block;
        text-align: left;
        width: 100%;
        padding: 10px 15px;
    }
}

.nav > li > form > button.logout:focus,
.nav > li > form > button.logout:hover {
    text-decoration: none;
}

.nav > li > form > button.logout:focus {
    outline: none;
}

.required label:after {
    content: "*";
}

.list-view .summary {
    text-align: right;
}
.list-view .item {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	margin-bottom: 10px;
	padding: 5px 10px;
}
.list-view .item-mdl {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	margin-bottom: 10px;
}
.list-view p {
    margin: 0 0 4px;
}
.store-data {
    border-bottom: 1px solid #ddd;
}

.user-view table tr > th:first-child {
    width: 180px;
}

.button-group .btn {
    margin-left: 5px;
}

label.btn {
    display: flex;
    align-items: center;
}
label.btn input {
    margin: 0 1rem 0 0;
}
.border-bottom {
    border-bottom: 1px solid #999;
    margin-bottom: 0.2rem;
}

#menu-checked, #menu-download {
	position: fixed;
	left: 2px;
    top: 25%;
    z-index: 100;
}
a.checked-item-order:hover {
    text-decoration: none;
}
.mb-1 {
    margin-bottom: 0.2rem;
}
table.table--100 {
    width: 100%;
}
.group-buttons {
    margin: 0.5rem 0;
}

.report-amount {
    width: 100%;
    min-width: 260px;
    height: 1rem;
}
.report-part {
    height: 1rem;
}
.buttons-group-right {
    display: flex;
    flex-direction: row;
    justify-content: end;
    position: relative;
    padding-bottom: 1rem;
}
.buttons-group-right .btn {
    margin: 0 0 0.5rem 0.5rem;
}
.buttons-group-right > button {
    margin-left: auto;
}
.report-index p {
    margin-bottom: 0.2rem;
}
.not-print.work-print {
    display: none;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
}
.print-area.work-print {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 2000;
}
.print-area.print-min-margin.work-print p, .print-area.print-min-margin.work-print div {
    margin-bottom: 2px;
    padding-bottom: 0;
}
.build-chart {
    cursor: pointer;
}
.container > .alert {
    display: none;
}
.groups-products .list-result, #salons-edit-clerks .list-result {
    max-height: 600px;
    overflow-y: auto;
}
[v-cloak] {
    display: none;
}

.list-group-item.active a {
    color: #fff;
}
.list-group-item a, .panel-title a.collapsed {
    color: #242424;
    display: block;
}
.panel-title {
    position: relative;
}
.panel-title a.link-group {
    position: absolute;
    right: -10px;
    top: -5px;
}
label.switch-checked {
    display: flex;
    align-items: center;
    color: #242424;
    cursor: pointer;
    margin-left: 1rem;
}
label.switch-checked span {
    padding: .6rem 1rem 0;
}
.list-group-item a:hover {
    text-decoration: none;
}
#list-products {
    position: relative;
}
#order-create-link {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
}

.order-contract p {
    margin-bottom: .2rem;
}
.print-area textarea, .print-area input[type=text] {
    border: none !important;
}
.print-area textarea:hover, .print-area input[type=text]:hover {
    border-bottom: solid 1px #ccc !important;
    margin-bottom: -1px;
}
.w-100 {
    width: 100%;
}
label.flex-checkbox {
    display: flex;
    align-items: center;
}
label.flex-checkbox input {
    margin: 0 0.5rem;
}

#delivery-list-cities > div {
    margin-right: 1rem;
}
#delivery-list-cities > div label > span {
    padding-left: 0.5rem;
}

.pl-2 { padding-left: 1rem;}

.trip-view .order-delivery {
    padding-top: .5rem;
}

.order-contract.work-print .h3, .order-contract.work-print .h4 {
    font-size: 12px;
    margin: 2px 0;
}
.swal2-html-container .close {
    display: none;
}

/** bulma fix */
.navbar-brand, .navbar-tabs {
    align-items: stretch;
    display: flex;
    flex-shrink: 0;
    min-height: 3.25rem;
}
.navbar-item {
    flex-grow: 0;
    flex-shrink: 0;
}
.navbar-burger {
    cursor: pointer;
    display: block;
    height: 3.25rem;
    position: relative;
    width: 3.25rem;
    margin-left: auto;
}
#navbar-burger-bulma {
    position:absolute;
    right: 0;
    top: 0;
}
.menu-open {
    width: 100%;
}
.navbar.is-info .menu-open .has-dropdown > a.navbar-item {
	background-color: var(--grey-color-dark);
}
.navbar.is-fixed-top {
    border-radius: 0;
}
.navbar.is-fixed-top .navbar-item:hover, .navbar.is-fixed-top .navbar-item:focus {
    text-decoration: none;
}
.navbar.is-fixed-top .navbar-brand .navbar-item {
    background-color: transparent !important;
}
.navbar.is-info .has-dropdown > a.navbar-item {
    color: #fff;
}
.navbar.is-info .has-dropdown > a.navbar-item:hover,
.navbar.is-info .has-dropdown > a.navbar-item:focus,
.navbar.is-info .has-dropdown > a.navbar-item.is-active {
    background-color: rgb(48, 130, 197);
}
body > section.section {
    min-height: 82vh;
}
.breadcrumb li.is-active > span {
    padding-left:.75em;
}
.list-view .pagination, .grid-view .pagination {
    justify-content: center;
}
#notification-js {
    display: none;
}

.table.is-bordered > thead:first-child > tr:first-child > th {
    border-top: solid 1px #ddd;
}

.form-group {
    margin-bottom: .75rem;
}
.form-group label {
    font-weight: bold;
}
label.checkbox > span {
    margin-left: .4rem;
}
.columns .column .form-group:last-child {
    margin-bottom: 0;
}
.columns .column .radio, .columns .column .checkbox {
	margin-top: 5px;
	margin-bottom: 10px;
}
a.button:hover, a.button:focus, a.button:active {
    text-decoration: none;
}
#dropdown-menu-selected {
    min-width: 16rem;
    top:95%
}
.is-hoverable .dropdown-menu  {
    min-width: 15rem;
    top:95%
}
.is-hoverable a.dropdown-item, button.dropdown-item {
	padding-right: 2rem;
}

.section-list-opt .panel a.panel-block {
    display: none;
}
.section-list-opt .panel.is-active a.panel-block {
    display: flex;
}
.tabs-content .tab-content {
    display: none;
}
.tabs-content .tab-content.is-active {
    display: block;
}
.active.datepicker {
    z-index: 100;
}
.best-sales {
    border-radius: 50%;
    position: absolute;
    right: 0;
    top: 0;
    padding: .4rem;
}
.icon.is-small > i, .icon.is-small > span {
    font-size: 1rem;
}
a.icon-text {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
.has-error .help-block {
    color:#cc0f35;
}
a.asc::after, a.desc::after {
    font-family: "Material Icons";
}
a.desc::after {
    content: "north";
}
a.asc::after {
    content: "south";
}
ul.pagination-list {
    justify-content: center;
}