/******************************************************
                    Basic Page
******************************************************/
@font-face {
    font-family: AvenirNext-Regular;
    src: url("../../fonts/AvenirNextLTPro-Regular.otf") format("opentype");
}

@font-face {
    font-family: AvenirNext-Medium;
    src: url("../../fonts/AvenirNextLTPro-MediumCn.otf") format("opentype");
}

@font-face {
    font-family: AvenirNext-Bold;
    src: url("../../fonts/AvenirNextLTPro-Bold.otf") format("opentype");
}

@font-face {
    font-family: AvenirNext-Demi;
    src: url("../../fonts/AvenirNextLTPro-Demi.otf") format("opentype");
}

@font-face {
    font-family: ProximaNova-Semibold;
    src: url("../../fonts/Proxima Nova Semibold.otf") format("opentype");
}

@font-face {
    font-family: AvenirNext-UltraLight;
    src: url("../../fonts/AvenirNextLTPro-UltLtCn.otf") format("opentype");
}

html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #f6f6f6;
    color: white;
    font-family: AvenirNext-Regular;
    padding-top: 50px;
}

.form-horizontal .form-group {
    margin-left: 0;
    margin-right: 0;
}

input[type=text],
input[type=email],
input[type=url],
input[type=password],
input[type=number],
input[name=iban],
select {
    background-color: #fff;
    border: 1px solid #dfdfdf;
    border-radius: 4px;
    box-shadow: none;
    color: #333;
    height: 34px;
    outline: 0;
    padding: 10px 15px;
    transition: box-shadow 150ms ease;
    -webkit-transition: box-shadow 150ms ease;
}

input[disabled] {
    background-color: #f1f1f1;
    color: #333;
    font-style: italic;
}


textarea {
    background-color: #fff;
    border: 1px solid #dfdfdf;
    border-radius: 4px;
    box-shadow: none;
    color: #333;
    outline: 0;
    padding: 6px;
    transition: box-shadow 150ms ease;
    -webkit-transition: box-shadow 150ms ease;
}

input[type=text]:focus,
input[type=email]:focus,
input[type=url]:focus,
input[type=password]:focus,
input[type=number]:focus,
input[name=iban]:focus,
textarea:focus,
select:focus {
    box-shadow: none !important;
    border-color: #dfdfdf !important;
    border-bottom: 2px solid var(--app-secondary-color, #342ead) !important;
    outline: 0 !important;
}

textarea {
    width: 100%;
    color: #555;
}

select {
    height: 34px;
    width: 100%;
    padding: 7px;
}


select:focus {
    box-shadow: none;
    outline: none;
}

label {
    color: #555;
    /* font-size: 0.9em; */
    font-weight: 600;
    /* padding-top: 10px; */
    text-align: left !important;
    text-transform: uppercase;
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

a, a:hover, a:focus, a:visited {
    color: var(--app-primary-color, #061e38);
}

.btn-nadvice, .btn-custom {
    background-color: var(--app-secondary-color, #342ead) !important;
    padding: 0 2rem;
    text-transform: uppercase;
    height: 34px;
    line-height: 34px;
    text-decoration: none;
    border: none;
    border-radius: 2px;
    color: #ffffff;
    text-align: center;
    letter-spacing: .5px;
    -webkit-transition: .2s ease-out;
    transition: .2s ease-out;
    cursor: pointer;
    outline: 0;

    -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
}

.btn-nadvice-fill {
    background-color: transparent;
    border: 2px solid var(--app-secondary-color, #342ead);
}

.btn-nadvice:hover, .btn-custom:hover {
    background-color: var(--app-secondary-color, #342ead);
    -webkit-box-shadow: 0 3px 3px 0 rgba(0,0,0,0.14), 0 1px 7px 0 rgba(0,0,0,0.12), 0 3px 1px -1px rgba(0,0,0,0.2);
    box-shadow: 0 3px 3px 0 rgba(0,0,0,0.14), 0 1px 7px 0 rgba(0,0,0,0.12), 0 3px 1px -1px rgba(0,0,0,0.2);
    color: #f7f7f7;
    outline: none;
}

.btn-nadvice:focus, .btn-nadvice:active, .btn-nadvice:visited,
.btn-custom:focus, .btn-custom:active, .btn-custom:visited {
    background-color: var(--app-secondary-color, #342ead);
    color: #f7f7f7;
    outline: none;
}

.waves-effect {
    position: relative;
    cursor: pointer;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    vertical-align: middle;
    z-index: 1;
    -webkit-transition: .3s ease-out;
    transition: .3s ease-out;
}

input.has-error {
    border-bottom-color: red;
}


.navbar {
    background: var(--app-primary-color, #061e38);
    box-shadow: 0px 0px 7px 0px #2e2e2e;
    z-index: 3;
}

.demo .navbar {
    box-shadow: none !important;
}

.navbar.navbar-default {
    border: none;
    border-radius: 0px;
    margin-bottom: 0px;
}

.navbar.navbar-default .navbar-brand {
    padding: 5px 15px 0px 0px;
    margin-left: 0px;
}

.navbar.navbar-default .nav-icon {
    margin-bottom: 0;
}

.collapse.cust-navbar.navbar-collapse {
    position: fixed;
    height: calc(100% - 50px) !important;
    background-color: var(--app-primary-color, #061e38);
    height:100%;
    min-width: 40px;
    padding: 0px;
    box-shadow: 0px 0px 12px 0px #000000;
    z-index: 2;
}
.demo .cust-navbar {
    box-shadow: none !important;
}

#user-account {
    cursor: pointer;
    margin-right: 8px;
}

@media (max-width: 992px) {
    .cust-navbar {
        height: 320px;
    }
}


.text-secondary {
    color: var(--app-secondary-color);
}


/******************************************************
                   Navigation Bar
******************************************************/

#hamburger-menu-icon {
    color: white;
    margin-left: 0;
}

#hamburger-menu-icon:hover {
    cursor: pointer;
}


ul.nav-icon {
    padding:0;
}

ul.nav-icon > li {
    list-style-type: none;
    padding:0;
}
ul.nav-icon > li > a {
    line-height: 40px;
}

ul.nav-icon > li > a > .img-nav,
ul.nav-icon > li > a > .text-nav {
    display: inline-block;
}

.menu-extend {
    width: 150px;
    margin-left: 40px;
}

.navbar-default .navbar-toggle:focus .icon-bar,
.navbar-default .navbar-toggle:hover .icon-bar {
    background-color: #8888d1 !important;
}

#logo {
    -webkit-user-select: none;  /* Chrome all / Safari all */
    -moz-user-select: none;     /* Firefox all */
    -ms-user-select: none;      /* IE 10+ */
    user-select: none;          /* Likely future */
}

@media (max-width: 767px) {
    .menu-extend {
        width: 90%;
        margin-left: 40px !important;
    }

    .collapse.cust-navbar.navbar-collapse {
        height: auto !important;
        position: relative;
    }

    #logo {
        margin-left: 10px;
    }
}

ul.nav-icon > li > a > .img-nav {
    text-align: center;
    width: 40px;
    background-color: var(--app-primary-color, #061e38);
    position: absolute;
}

.nav-selected a .img-nav,
.nav-selected a .text-nav {
    background-color: var(--app-secondary-color, #342ead) !important;
}

.demo .nav-selected a .img-nav,
.nav-selected a .text-nav  {
    /* background-color: #234266 !important; */
    background-color: var(--app-secondary-color) !important;
}

ul.nav-icon > li > a > .text-nav {
    text-align: left;
    padding-left: 10px;
    font-size: 14px;
    line-height: 40px;
    height:40px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    margin-left: -150px;
    -webkit-transition: margin-left 0.3s;
    transition: margin-left 0.3s;
}

ul.nav-icon > li > a {
    color: #c1c1c1;
}

ul.nav-icon > li:hover  {
    color: white;
}

ul.nav-icon > li:hover > a:hover {
    color: white;
    text-decoration: none;
}

ul.nav-icon > li:hover > a > .img-nav,
ul.nav-icon > li:hover > a > .text-nav {
    background-color: var(--app-secondary-color, #342ead);
    text-decoration: none;
}

ul.nav-icon > li:hover > a {
    color: #ffffff;
}



.home-items {
    height: 37px;
    list-style-type: none;
    margin: 20px 0 0 0;
    padding: 0;
}

.home-items li {
    float: left;
}

.home-items li a {
    background-color: #fff;
    border: 1px solid var(--app-secondary-color, #342ead);
    border-radius: 5px;
    color: var(--app-secondary-color, #342ead);
    margin-left: 10px;
    padding: 8px 16px;
    text-decoration: none;
}

.home-items li a.active {
    background-color: var(--app-secondary-color, #342ead);
    color: white;
}

.home-items li:hover a {
    background-color: var(--app-secondary-color, #342ead);
    color: white;
    cursor: pointer;
}

.home-items .dashboard-refresh {
    color: var(--app-secondary-color, #342ead);
}

.home-items .dashboard-refresh:hover {
    cursor: pointer;
}

.nav-pills a {
    background-color: #fff;
    border: 1px solid #dfdfdf;
    color: #afb3bc !important;
    margin-right: .5em;
}
.nav-pills .active > a {
    background-color: var(--app-secondary-color, #342ead) !important;
    color: #ffffff !important;
    border-radius: 4px;
    /* padding: 8px 15px; */
}


.drinks-menus {
    background-color: #f6f6f6;
    height: calc(100vh - 60px);
}

.drinks-menus a {
    color: #7a808e;
    font-weight: bold;
}
.drinks-menus a.active {
    color: var(--app-secondary-color, #342ead);
}

.drinks-menus a.link {
    color: var(--app-secondary-color, #342ead);
    font-size: 10px;
}



/**
 * BUTTONS
 */
.btn-primary {
    border: 1px solid var(--app-secondary-color, #342ead);
    background-color: var(--app-secondary-color, #342ead);
    outline: 0;
}
.btn-primary:hover {
    border: 1px solid var(--app-secondary-color, #342ead);
    background-color: var(--app-secondary-color, #342ead) !important;
}

.btn-secondary {
    border: 1px solid #ffffff;
    background-color: var(--app-secondary-color, #342ead);
    color: #ffffff;
}
.btn-secondary:hover {
    border: 1px solid #dfdfdf;
    background-color: var(--app-secondary-color, #342ead);
    color: var(--app-secondary-color, #342ead);
}

.btn-complementary {
    border: 1px solid purple;
    background-color: purple;
    color: #ffffff;
}
.btn-complementary:hover {
    border: 1px solid purple;
    background-color: purple;
    color: #fff;
}

.btn-complementary2 {
    border: 1px solid hotpink;
    background-color: hotpink;
    color: #ffffff;
}
.btn-complementary2:hover {
    border: 1px solid hotpink;
    background-color: hotpink;
    color: #fff;
}

.btn-complementary3 {
    border: 1px solid #4150bb;
    background-color: #4150bb;
    color: #ffffff;
}
.btn-complementary3:hover {
    border: 1px solid #4150bb;
    background-color: #4150bb;
    color: #fff;
}

.btn-complementary4 {
    border: 1px solid #e0408d;
    background-color: #e0408d;
    color: #ffffff;
}
.btn-complementary4:hover {
    border: 1px solid #e0408d;
    background-color: #e0408d;
    color: #fff;
}

.button-outline {
    background-color: #fff;
    border: solid 2px var(--app-secondary-color, #342ead);
    border-radius: 4px;
    color: var(--app-secondary-color, #342ead);
    padding: 5px 16px 5px 16px;
    text-align: center;
    text-transform: uppercase;
    vertical-align: top;
}

.button-outline:focus {
    outline: none;
}

.button-full-width {
    position: relative;
    text-align: center;
    width: 100%;
}

/**
 * Modal
 */
.modal .modal-content {
    background-color: #f6f6f6;
    color: #555;
}

#modalDemoExplain.modal .modal-content {
    background-color: white;
    border: 0;
    overflow: hidden;
}

.modal .close {
    color: #555;
    font-size: 28px;
    opacity: 1;
    text-shadow: none;
}

.modal .modal-title {
    color: var(--app-primary-color, #061e38);
    text-transform: uppercase;
}

.modal .modal-header {
    background-color: #f6f6f6;
    border-bottom: none;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    padding: 20px;
}

.modal .modal-body {
    margin: 0 10px;
    background-color: white;
    padding: 10px;
}

.modal .modal-footer {
    padding: 0;
    border-top: none;
}

.modal .modal-footer .button-left {
    background-color: #f6f6f6;
    border-bottom-left-radius: 4px;
    color: #555;
    width: 50%;
}

.modal .modal-footer .button-right {
    background-color: var(--app-secondary-color, #342ead);
    border-bottom-right-radius: 4px;
    color: #f6f6f6;
    width: 50%;
}

.modal .modal-footer .button-left,
.modal .modal-footer .button-right {
    float: left;
    border: none;
    padding: 20px 0px;
    text-transform: uppercase;
}

.modal .modal-footer .button-left:focus,
.modal .modal-footer .button-right:focus {
    outline: none;
}

.modal .button-full-width,
.modal .dropdown-menu {
    border-width: 1px;
    text-align: left;
}

.modal .dropdown-menu,
.modal .dropdown-menu li {
    background-color: #f6f6f6;
}

.modal .dropdown-menu li {
    text-align: left;
}


/**
 * INPUT
 */
.input-outline {
    background: #fff;
    border: 1px solid #d7d7f7;
    border-radius: 2px;
    padding: 5px 16px 5px 16px;
    color: #555;
}

.input-outline-delete {
    border: 1px solid #e65d50 !important;
    color: #e65d50 !important;
}

.input-outline:focus {
    border: 1px solid var(--app-secondary-color, #342ead);
    outline: none;
}

.input-full-width {
    width: 100%;
}

.input-large-width {
    width: 90%;
}

.input-label {
    color: #555;
    text-transform: uppercase;
}


/**
 * DROPDOWN
 */
.dropdown-menu {
    background-color: #f6f6f6;
    border-bottom: 2px solid #d7d7d7;
    border-left: 2px solid #d7d7d7;
    border-right: 2px solid #d7d7d7;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-top: none;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 100%;
    top: 80%;
}

.dropdown-menu li {
    background-color: transparent;
    color: #555;
    padding: 10px 17px;
    text-align: center;
    text-transform: uppercase;
}

.dropdown-menu li:hover, .dropdown-menu li.selected {
    background-color: var(--app-secondary-color, #342ead) !important;
    color: white;
}

.dropdown > button.active {
    color: #555;
    border-color: #555;
}

/**
 * POPOVER
 */
.popover {
    background-color: white;
}
.popover-title {
    color: #555;
    background-color: #f6f6f6;
    border-bottom: 1px solid #dfdfdf;
}

.popover.top > .arrow:after {
    border-top-color: #292e36;
}

.popover input, .popover select {
    color: #555;
}


/**
 * NAV TABS
 */
.nav-tabs {
    border: 0;
}
.nav-tabs[role=tablist] {
    background-color: white;
    border-bottom: 1px solid #dfdfdf;
    height: 65px;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
    background-color: #f6f6f6;
    border-top: 4px solid var(--app-secondary-color, #342ead);
    cursor: default;
    font-weight: bold;
}

.nav-tabs > li > a {
    border-top: 4px solid transparent;
    border-radius: 0;
    color: #555;
    line-height: 40px;
    margin-right: 2px;
    padding-left: 15px;
    padding-right: 15px;
    text-transform: uppercase;
}

.nav-tabs > li > a:focus,
.nav-tabs > li > a:hover {
    text-decoration: none;
    border-top: 4px solid var(--app-secondary-color, #342ead);
    color: #555;
}


.select-drink-tva option {
    background-color: #f6f6f6 !important;
    border-bottom: 2px solid #d7d7d7;
    border-left: 2px solid #d7d7d7;
    border-right: 2px solid #d7d7d7;
    color: #555 !important;
}



/**
 * TAB PANE
 */
.tab-pane {
    color: #555;
    /* margin-bottom: 30px; */
}

.tab-pane .block {
    background-color: #fff;
    border: 2px solid #d7d7d7;
    margin-top: 20px;
}

.tab-pane .header-block-pane {
    border-radius: 2px;
    background-color: #d7d7d7;
    padding: 10px 15px;
    font-size: 14px;
    letter-spacing: 1px;
    color: #555;
    font-family: AvenirNext-Demi;
}

.tab-pane .body-block-pane {
    padding: 15px;
}


.tab-pane .body-block-pane select {
    width: 80px;
    height: 30px;
    margin: 0 5px;
    border: 1px solid #454f5b;
}


/**
 * CHECKBOX
 */
.div-custom-checkbox {
    padding-top: 8px;
}
.div-custom-checkbox [type="checkbox"]:not(:checked) + label,
.div-custom-checkbox [type="checkbox"]:checked + label {
    cursor: pointer;
    margin: 0;
    position: relative;
    padding-left: 2.2em;
}

.div-custom-checkbox [type="checkbox"]:not(:checked) + label:before,
.div-custom-checkbox [type="checkbox"]:checked + label:before {
    background: #f6f6f6;
    border: 2px solid #d7d7d7;
    border-radius: 4px;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
    content: '';
    height: 1.45em;
    left: 0;
    position: absolute;
    top: -10px;
    width: 1.45em;
}

.div-custom-checkbox [type="checkbox"]:not(:checked) + label:after,
.div-custom-checkbox [type="checkbox"]:checked + label:after {
    background: var(--app-secondary-color, #342ead);
    border: 2px solid var(--app-secondary-color, #342ead);
    border-radius: 4px;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
    color: white;
    content: '✔';
    left: 0;
    font-size: 1.45em;
    line-height: 0.8;
    position: absolute;
    top: -10px;
    transition: all .2s;
}
.div-custom-checkbox [type="checkbox"]:not(:checked) + label.no_top:before,
.div-custom-checkbox [type="checkbox"]:checked + label.no_top:before,
.div-custom-checkbox [type="checkbox"]:not(:checked) + label.no_top:after,
.div-custom-checkbox [type="checkbox"]:checked + label.no_top:after {
    top: 0;
}

.div-custom-checkbox [type="checkbox"]:not(:checked) + label:after {
    opacity: 0;
    transform: scale(0);
}

.div-custom-checkbox [type="checkbox"]:checked + label:after {
    opacity: 1;
    transform: scale(1);
}

input[type=checkbox] {
    visibility: hidden;
    position: absolute;
}



/**
 * INPUT TYPE=RANGE
 * */
input[type=range] {
    -webkit-appearance: none;
    margin: 10px 0;
    width: 100%;
    background: transparent;
}
input[type=range]:focus {
    outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 12.8px;
    cursor: pointer;
    animate: 0.2s;
    box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
    background: #d7d7d7;
    border-radius: 25px;
    border: 0px solid #000101;
}
input[type=range]::-webkit-slider-thumb {
    box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
    border: 0px solid #000000;
    height: 20px;
    width: 39px;
    border-radius: 7px;
    background: var(--app-secondary-color, #342ead);
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -3.6px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
    background: #d7d7d7;
}
input[type=range]::-moz-range-track {
    width: 100%;
    height: 12.8px;
    cursor: pointer;
    animate: 0.2s;
    box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
    background: #d7d7d7;
    border-radius: 25px;
    border: 0px solid #000101;
}
input[type=range]::-moz-range-thumb {
    box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
    border: 0px solid #000000;
    height: 20px;
    width: 39px;
    border-radius: 7px;
    background: var(--app-secondary-color, #342ead);
    cursor: pointer;
}
input[type=range]::-ms-track {
    width: 100%;
    height: 12.8px;
    cursor: pointer;
    animate: 0.2s;
    background: #f6f6f6;
    border-color: #f6f6f6;
    border-width: 39px 0;
    color: #f6f6f6;
}
input[type=range]::-ms-fill-lower {
    background: #d7d7d7;
    border: 0px solid #000101;
    border-radius: 50px;
    box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
    background: #d7d7d7;
    border: 0px solid #000101;
    border-radius: 50px;
    box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
}
input[type=range]::-ms-thumb {
    box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
    border: 0px solid #000000;
    height: 20px;
    width: 39px;
    border-radius: 7px;
    background: var(--app-secondary-color, #342ead);
    cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
    background: #d7d7d7;
}
input[type=range]:focus::-ms-fill-upper {
    background: #d7d7d7;
}


/**
 * TAB PANE
 */
.panel-body {
    background-color: #fff;
    color: #555;
}
.panel-default > .panel-heading {
    background-color: #dfdfdf;
    color: #555;
    font-family: AvenirNext-Demi;
    font-size: 16px;
    letter-spacing: 1px;
}
.panel-heading .panel-title img {
    width: 20px;
    margin-right: 10px;
}
.panel-heading .panel-title a {
    display: inline-block;
    font-size: 16px;
    width: 100%;
}



/**
 * NOTIFICATONS
 */
.bg-information {
    padding: 8px;
    background-color: var(--app-secondary-color, #342ead);
    border-radius: 4px;
}
.bg-information.orange {
    background-color: #d19433
}

.text-information {
    color: #f6f6f6;
}




/**
 * TABLES
 */
table.table-bordered,
table.table-bordered>tbody>tr>td,
table.table-bordered>tbody>tr>th,
table.table-bordered>tfoot>tr>td,
table.table-bordered>tfoot>tr>th,
table.table-bordered>thead>tr>td,
table.table-bordered>thead>tr>th {
    border: 1px solid #dfdfdf;
}

table.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #f6f6f6;
}

table {
    background-color: #fff;
    font-family: AvenirNext-Demi;
}


table thead tr td {
    background-color: #41454d;
    font-size: 12px;
    color: #555;
    font-family: AvenirNext-Demi;
}


/**
 * STRIPE
 */
.StripeElement {
    background-color: #fff;
    border: 1px solid #dfdfdf;
    color: #555;
    height: 40px;
    padding: 10px 12px;
    border-radius: 4px;
    -webkit-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
}

.StripeElement--focus {
    border-bottom: 2px solid #429fdd;
}

.StripeElement--invalid {
    border-color: #fa755a;
}

.StripeElement--webkit-autofill {
    background-color: #fefde5 !important;
}

















.tab-pane > ul {
    list-style: none;
    padding: 0;
}

.label {
    font-size: 100%;
    padding: .4em .8em .4em;
}

.label a, .label a:hover, .label a:focus, .label a:visited {
    color: white;
}

.label-success {
    background-color: #3c763d;
}

.overlay {
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 2;
    left: 0px;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.5);
    overflow-x: hidden;
}

.overlay-content {
    background: #31353d;
    border-radius: 8px;
    margin: 125px auto;
    min-width: 320px;
    padding: 25px;
    position: relative;
    text-align: center;
    width: 40%;
}

dt, dd {
    line-height: 2em;
}

blockquote {
    border-left-width: 3px;
    border-left-color: #777;
    font-size: 1em;
    line-height: 1.7em;
    margin: 0;
    padding: 5px 10px;
}

::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}

.maincontainer {
    height: 100%;
}

@media (min-width: 768px) {
    .maincontainer {
        margin-left: 40px;
    }
}

.mainrow {
    /* Firefox */
    height: -moz-calc(100% - 50px);
    /* WebKit */
    height: -webkit-calc(100% - 50px);
    /* Opera */
    height: -o-calc(100% - 50px);
    /* Standard */
    height: calc(100% - 50px);
}

.contentCol {
    height: 100%;
    background: #f6f6f6;
}

.row-all {
    height: 100%;
}

.nav-selected > a > div.img-nav,
.nav-selected > a > div.text-nav {
    color: white;
}

.weight-init {
    font-weight: initial;
}


.checkbox-slider {
    position: relative;
}

.checkbox-slider input {
    position: absolute;
}

.checkbox-slider label {
    padding: 0;
}

.checkbox-slider input + span {
    padding-left: 55px;
    cursor: pointer;
}

.checkbox-slider input + span:before {
    position: absolute;
    left: 0px;
    display: inline-block;
    content: "";
    height: 25px;
    width: 50px;
    background: #aaaaaa33;
    border: solid 1px rgba(var(--app-primary-color), 0.35);
    border-radius: 20px;
    transition: background 0.2s ease-out;
}

.checkbox-slider input + span:after {
    width: 20px;
    height: 20px;
    position: absolute;
    left: 4px;
    top: 4px;
    display: block;
    background: #66666633;
    content: "";
    transition: margin-left 0.1s ease-in-out;
}

.checkbox-slider input:checked + span:after {
    margin-left: 20px;
    content: "";
    -webkit-animation: popIn ease-in 0.3s normal;
    animation: popIn ease-in 0.3s normal;
}

.checkbox-slider input:checked + span:before {
    /* background: rgba(66,159,253, 0.32); */
    background: #e7e7e7;
    transition: background 0.2s ease-in;
}

.checkbox-slider input + span:after {
    background: rgba(1, 31, 63, 0.6);
    content: "";
    width: 17px;
    height:17px;
    background-clip: padding-box;
    border-radius: 20px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
    -webkit-animation: popIn ease-in 0.3s normal;
    animation: popIn ease-in 0.3s normal;
}

.checkbox-slider input:not(:checked) + span:after {
    -webkit-animation: popOut ease-in 0.3s normal;
    animation: popOut ease-in 0.3s normal;
}

.checkbox-slider input:checked + span:after {
    content: "";
    margin-left: 25px;
    background: var(--app-secondary-color, #342ead);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
    background-clip: padding-box;
    -webkit-animation: popIn ease-in 0.3s normal;
    animation: popIn ease-in 0.3s normal;
}

.editable-click, a.editable-click, a.editable-click:hover {
    border-bottom: dashed 1px var(--app-secondary-color, #342ead) !important;
    color: var(--app-secondary-color, #342ead);
    white-space: nowrap;
}

a.editable-click.gold-text, a.editable-click.gold-text:hover {
    border-bottom: dashed 1px #dca14f !important;
}

.editable-checklist input[type=checkbox] {
    display: inherit;
    position: relative;
    visibility: visible;
}

/******************************************************
               Header Accueil/Reservation
******************************************************/

.home-body {
    background-color: #44484f;
    border-radius: 0px 0px 5px 5px;
}

.home-body div {
    padding: 10px;
    color: white;
}

#first-div-home-body {
    border-right: 1px solid #23363e;
}

.cust-date {
    color: white;
    padding: 10px;
    margin: 0;
    border-bottom: 1px solid #23363e;
}

.orders {
    max-height: 115px;
    overflow-y: auto;
}

@media (max-width: 992px) {
    .home-body {
        border-radius: 0px;
    }

    #first-div-home-body {
        border-right: 0px;
        border-bottom: 1px solid #23343e;
    }

    .home-body > div > div {
        margin-bottom: 20px;
    }
}

#picture_describ {
    width: 100%;
    position: absolute;
    clip: rect(100px 650px 250px 0px);
    margin-top: -100px;
    -webkit-filter: blur(2px);
    -moz-filter: blur(2px);
    -ms-filter: blur(2px);
    -o-filter: blur(2px);
    filter: blur(2px);
}

@media (max-width: 800px) {
    #picture_describ {
        clip: rect(100px 800px 250px 0px);
    }
}

#info-title {
    margin-top: 10%;
    font-size: 18px;
    font-weight: bold;
}

#nb_person {
    font-size: 18px;
}

#masculin {
    margin-left: 10px;
}

#feminin {
    margin-right: 10px;
}

.progress {
    background-color: #f27189;
}

#info-event {
    background-color: #292c33;
}

#button-setting {
    margin: 20px;
}

#button-setting > button {
    padding: 3px 20px;
}

#button-setting > button:hover {
    color: white;
}

#button-setting > button:first-child {
    background-color: #2f3239;
    border: 1px solid #1b1e23;
}

#button-setting > button:nth-child(2) {
    background-color: #dc5347;
    margin-left: 5px;
}

#button-setting > button:nth-child(2):hover {
    background-color: #8888d1;
}

/******************************************************
                    Carte Css
******************************************************/

#carte {
    padding: 0;
    margin-top: 40px;
}

#carte > div > header > h4 {
    margin-left: 15px;
}

#carte-background-view {
    background-color: #31353d;
    padding: 0px 20px 30px 20px;
    border-radius: 0px 0px 7px 7px;
}

#carte-background-view .nav-tabs {
    border-bottom: 1px solid #262729;
}

#carte-background-view li {
    width: 150px;
    background-color: #8888d1;
}

#carte-background-view li > a {
    color: white;
    font-size: 16px;
    border-color: #262729;
    margin-right: 0px;
}

#carte-background-view li.active > a {
    color: #6b6b99;
    background-color: #8888d1;
}

#carte-background-view li > a:hover {
    color: white;
    background-color: #8888d1;
}

#carte-background-view > ul {
    top: 20px;
    position: relative;
    width: 300px;
    left: 35%;
}

#glasses, #bottles {
    border: 1px solid #262729;
    border-radius: 7px;
}

#glasses .table-drink-elements, #bottles .table-drink-elements {
    border: 1px solid #2a2e35;
    padding: 0px;
    border-radius: 7px;
}

#glasses > div:first-child, #bottles > div:first-child {
    background-color: #373b45;
    margin: 0px;
    padding: 30px 30px 10px 30px;
    border-radius: 7px;
}

#glasses header, #bottles header {
    background-color: #23252b;
    padding : 5px;
    color: white;
    border-radius: 7px 7px 0px 0px;
}

#glasses table, #bottles table {
    margin:0px;
}

#glasses .table-striped > tbody > tr, #bottles .table-striped > tbody > tr {
    background-color: #2b2f36;
}

#glasses .table-striped > tbody > tr > th, #bottles .table-striped > tbody > tr > th {
    border:none;
}

#glasses .table-striped> tbody > tr:nth-of-type(odd), #bottles .table-striped> tbody > tr:nth-of-type(odd) {
    background-color: #2e323a;
}

.first-promo {
    display: inline-block;
    width: 100px;
}

.table-drinks-map {
    overflow-y: auto;
    background-color: #2e323a;
    max-height: 580px;
    min-height: 580px;
    border-radius: 0px 0px 7px 7px;
    border: 1px solid #262626;
}

.table-drinks-map > table > tbody > tr > th:hover {
    background-color: #6b6b99;
}

.table-drinks-map-active {
    background-color: #6b6b99;
}

@media (max-width: 1280px) {
    #carte {
        margin-left: 22%;
        margin-top: 40px;
    }

    .table-drinks-map {
        max-height: 450px;
        min-height: 450px;
    }

    #carte-background-view > ul{
        left: 33%;
    }
}

@media (max-width: 1024px) {
    #carte {
        margin-left: 33.333333333333%;
        margin-top: 20px;
    }

    .table-drinks-map {
        max-height: 450px;
        min-height: 450px;
    }

    #carte-background-view > ul{
        left: 23%;
    }
}

@media (max-width: 798px) {
    #carte {
        margin-left: 0%;
        margin-top: 0px;
    }

    #carte-background-view > ul {
        left: 30%;
    }

    .table-drinks-map {
        max-height: 450px;
        min-height: 1px;
    }
}

@media (max-width: 600px) {
    #carte-background-view li {
        width: 136px;
    }

    #carte-background-view > ul {
        width: 272px;
    }
}

@media (max-width: 590px) {
    #carte-background-view > ul {
        width: 272px;
        left: 0%;
    }
}

/******************************************************
                    Event Page
******************************************************/

#event-div-search {
    background-color: #2e3239;
    border-bottom: 2px solid #22242a;
}

#event-search, #event-add {
    padding: 25px;
    background-color: #2e3239;
}

#event-add > button {
    font-size: 13px;
    padding: 4px;
    background-color: #292d34;
    border: 2px outset #44474D;
}

.imageAndText {
    position: relative;
}

.imageAndText .col {
    position: absolute;
    z-index: 1;
    top: 40%;
    left: 10px
}

.imageAndText .col p:first-child {
    margin-bottom: 2px;
}

.imageAndText .col p:nth-child(2) {
    font-size: 25px;
}

#first-artist {
    padding: 15px;
    background-color: #3B3E44;
}

#first-artist img {
    opacity: 0.4;
}

#first-artist .description p:first-child {
    font-size: 20px;
}

#first-artist .description p:nth-child(2) {
    color: #50b4e6;
}

#events > div > div:nth-child(3) {
    background-color: #31353d;
}

#list-artists {
    list-style: none;
    padding: 0px;
    margin-bottom: 0px;
}

#list-artists img {
    opacity: 0.6;
}

#list-artists > li {
    padding: 15px;
}

#list-artists > li:hover {
    background-color: #292c33;
}

#list-artists > li .description {
    font-size: 13px;
}

#list-artists > li .description p:first-child {
    margin:0;
}

#list-artists > li .description p:nth-child(3) {
    color: #50b4e6;
}

#others-artist {
    overflow-y: auto;
    max-height: 580px;
}

@media (min-width: 1281px) {
    #list-artists img {
        margin-left: 35px;
    }
}

@media (max-width: 1280px) {
    #others-artist {
        max-height: 440px;
    }

    #first-artist img {
        width: 90px;
        margin-left: -10px;
        margin-top: -10px;
        margin-bottom: 10px;
    }

    .imageAndText .col {
        width: 150px;
        top: 95%;
        left: -20px;
    }

    #list-artists img {
        width: 90px;
    }
}

@media (max-width: 1024px) {
    #others-artist {
        max-height: 400px;
    }
}

@media (min-width: 992px) {
    #events, #info-event {
        margin-top: 40px;
    }

    #info-event {
        margin-left: 40px;
    }
}

@media (max-width: 800px) {
    #first-artist img {
        margin-left: 380px;
    }

    #list-artists img {
        margin-left: 320px;
    }

    .imageAndText .col {
        left: 230px;
        width: 140px;
        top: 12%;
    }
}

@media (max-width: 768px) {
    #first-artist img {
        margin-left: 380px;
    }

    #list-artists img {
        margin-left: 320px;
    }

    #first-artist .description p:first-child {
        text-align: center;
    }

    #list-artists .description p:first-child {
        text-align: center;
    }

    .imageAndText .col {
        left: 230px;
        width: 140px;
        top: 25%;
    }
}

@media (max-width: 600px) {
    #first-artist img {
        margin-left: 270px;
    }

    .imageAndText .col {
        left: 130px;
    }

    #list-artists img {
        margin-left: 260px;
    }
}

@media (max-width: 320px) {
    #first-artist img {
        margin-left: 150px;
    }

    .imageAndText .col {
        left: 20px;
    }

    #list-artists img {
        margin-left: 100px;
    }
}


/******************************************************
                    Header Div
******************************************************/

.drinks-home > div > header,
.vip-home > div > header,
#carte > div > header,
#events > div > header {
    background-color: #23252c;
    padding : 5px;
    color: white;
    border-radius: 7px 7px 0px 0px;
}

@media (max-width: 992px) {
    #header-carte > header {
        border-radius: 0px;
    }
}

/******************************************************
                    Accueil CSS
******************************************************/

.drinks-home{
    background-color: #31353d;
}

.vip-home {
    background-color: #2e3239;
}

.drinks-home, .vip-home {
    height: 800px;
}

@media (max-width: 1920px) {
    .drinks-home, .vip-home {
        height: 700px;
    }
}

@media (max-width: 1280px) {
    .drinks-home, .vip-home {
        height: 540px;
    }
}

@media (max-width: 1024px) {
    .drinks-home, .vip-home {
        height: 490px;
    }
}


@media (min-width: 992px) {
    .drinks-home, .vip-home {
        margin-top: 20px;
        position: absolute;
        bottom: 0;
        border-radius: 5px 5px 0px 0px;
    }
}

.drinks-home > div > header > h4,
.vip-home > div > header > h4,
#events > div > header > h4 {
    margin-left: 10px;
}

#drink-search {
    padding: 25px;
    border-bottom: 1px solid #44474B;
    background-color: #2e3239;
}

#drink-search > input,
#event-search > input {
    height: 30px;
    background-color: #292d34;
    color: white;
    border-color: #44474D;
    border-top-color: #9A9A9A;
    border-left-color: #9A9A9A;
}

#drink-search > input:focus,
#event-search > input:focus {
    outline-color: #CCC;
}

.drink-select {
    padding: 15px;
    border-bottom: 1px solid #44474B;
    background-color: #2e3239;
}

.drink-select .nav-tabs {
    border: none;
}

.drink-select .nav-tabs > li > a {
    margin-right: 20px;
    color: #87999c;
    font-size: 20px;
    background-color: transparent;
    border: none;
}

.drink-select .nav-tabs > li.active > a, {
    margin-right: 20px;
    color: white;
    font-size: 20px;
    background-color: transparent;
    border: none;
}

.drink-select .nav-tabs > li > a:hover {
    cursor: pointer;
    text-decoration: none;
    color: white;
    font-weight: bold;
    border: none;
}

.drink-select > .isChoose {
    color: white;
    font-weight: bold;
}

@media (min-height: 900px) {
    .drink-list, .vips-list {
        max-height: 567px;
    }

    #table-drinks {
        max-height: 720px;
    }
}

@media (max-height: 800px) {
    .drink-list, .vips-list {
        max-height: 407px;
    }

    #table-drinks {
        max-height: 540px;
    }
}

@media (max-height: 768px) {
    .drink-list, .vips-list {
        max-height: 357px;
    }
}

.vips-list, .drink-list {
    background-color: #31353d;
    overflow-y: auto;
    min-height: 200px;
}

.vips-list, .drink-list > table {
    margin-bottom: 0px;
}

.drink-list > table > tbody > tr > th,
.vips-list > table > tbody > tr > th {
    border: none;
    padding: 15px 10px;
    font-size: 14px;
}

#vip-schema {
    background-color: #2e3239;
    border-bottom: 1px solid #292c33;
}

#vip-schema .nav-tabs, #vip-menu .nav-tabs {
    border:none;
}

#vip-schema .nav-tabs {
    margin-top: 10px;
}

#vip-menu .tab-content {
    border-top: 1px solid #292c33;
    margin-top: 5px;
}

#vip-schema .tab-pane {
    padding: 10px;
}

#vip-schema > div {
    background-color: #e7e8ea;
    height: 300px;
    margin-bottom: 15px;
    border-radius: 0px 5px 5px 5px;
}

#vip-schema > ul > .active > a {
    background-color: #e7e8ea;
    color: black;
}

#vip-schema > ul > li > a {
    background-color: #d6d6d6;
    color: #a0a0aa;
    padding: 2px 15px;
}

#vip-menu {
    padding: 10px;
}

#vip-menu .nav-tabs > li > a {
    background-color: transparent;
    border:none;
    font-size: 18px;
}

#vip-menu .nav-tabs > li.active > a {
    font-weight: bold;
}

#vip-menu .nav-tabs > li:first-child > a {
    color:white;
}

#vip-menu .nav-tabs > li:nth-child(2) > a {
    color:#3f7388;
}

#vip-menu .nav-tabs > li:nth-child(3) > a {
    color:#5f7c48;
}


.add-del:first-child {
    margin-right: -4px;
}

.add-del {
    margin-top: 10px;
    padding: 2px 12px;
}

.change {
    padding: 15px 24px;
}

.change:first-child {
    margin-top: 270px;
}

.change:nth-child(2) {
    margin-top: 20px;
}

.change > i:nth-child(2) {
    margin-left: -10px;
}

.datepicker {
    background-color: #fff ;
    color: #333 ;
}

#modal-drinks .modal-content {
    background-color: #373b45;
}

#modal-drinks .modal-header {
    background-color: #23252b;
    color: white;
}

#modal-drinks .modal-header > button > span {
    color: white;
}

#modal-drinks .modal-body .glasses-groupe-promo .input-group,
#modal-drinks .modal-body .bottle-groupe-promo .input-group {
    padding-right: 15px;
    padding-left: 15px;
}

.modal-delete .modal-content .modal-footer > button {
    padding: 7px 20px;
}

/******************************************************
                    Stats CSS
******************************************************/

#stats .div-stats {
    margin-top: 15px;
}

#stats .div-stats > div {
    border-radius: 10px;
    background-color: #31353d;
    color: white;
    padding: 20px;
}

#stats .div-stats > div > p > i {
    font-size: 45px;
    margin-left: -10px;
}

#stats .div-stats > div > h2 {
    margin-top: 45px;
    font-weight: 600;
}

#stats .div-stats:nth-child(3) > div > h2,
#stats .div-stats:nth-child(4) > div > h2 {
    margin-top: 45px;
    font-weight: 600;
    margin-bottom: 0px;
}

#stats .div-stats .progress {
    height: 4px;
    background-color:#31353d;
    margin-bottom: 2px;
}

#stats .div-stats > div > p {
    font-size: 20px;
}

#stats-details {
    border-radius: 10px;
    background-color: #23252c;
    margin-left: 70px;
    margin-top: 15px;
    padding: 50px 15px 0px 15px;
}

.wallet-stop {
    top: 5px;
}

.img-circular {
    display: inline-block;
    position: relative;
    width: 32px;
    height: 32px;
    overflow: hidden;
    border-radius: 50%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    line-height: 32px;
}
.img-circular.medium {
    width: 43px;
    height: 43px;
    line-height: 43px;
}
.img-circular.normal {
    width: 78px;
    height: 78px;
    line-height: 78px;
}
.img-circular.large {
    width: 96px;
    height: 96px;
    line-height: 96px;
}
.img-circular.xlarge {
    width: 140px;
    height: 140px;
    line-height: 140px;
}


/******************************************************
                    Loader CSS
******************************************************/


.loader {
    position: absolute;
    top: 40%;
    width: 10%;
    left: 40%;
}

.loader:before {
    content: '';
    display: block;
    padding-top: 100%;
}

.circular {
    animation: rotate 2s linear infinite;
    height: 100%;
    transform-origin: center center;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.path {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
    animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
    stroke-linecap: round;
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }
    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35px;
    }
    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124px;
    }
}

@keyframes color {
    100%,
    0% {
        stroke: #8888D1;
    }
}


.text-primary, .text-primary:hover, .text-primary:active, .text-primary:visited {
    color: var(--app-primary-color, #8888d1) !important;
}



#attendees-list ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#attendees-list li,
#attendees-list li a {
    /* color: white; */
    padding: 8px;
    /* background: #1f2227; */
    font-size: 14px;
}

#attendees-list li:not(:last-child) {
    border-bottom: 2px solid #31353d;
}

/*
    Global
 */

.row-margin-top {
    margin-top: 15px;
}

.row-margin-bottom {
    margin-bottom: 15px;
}

.big-glyphicon {
    font-size: 1.3em;
    color: #555;
}

.glyphicon-clickable:hover,
.glyphicon-clickable:focus {
    cursor: pointer;
    color: #b3bfd8;
}

.glyphicon-draggable:hover,
.glyphicon-draggable:focus {
    cursor: move;
    color: #b3bfd8;
}

.table > tbody > tr > td.center-center,
.table > tbody > tr > th.center-center,
.table > tfoot > tr > td.center-center,
.table > tfoot > tr > th.center-center,
.table > thead > tr > td.center-center,
.table > thead > tr > th.center-center {
    vertical-align: middle;
    text-align: center;
}

.table > tbody > tr > td.center-right,
.table > tbody > tr > th.center-right,
.table > tfoot > tr > td.center-right,
.table > tfoot > tr > th.center-right,
.table > thead > tr > td.center-right,
.table > thead > tr > th.center-right {
    vertical-align: middle;
    text-align: right;
}

.table > tbody > tr > td.center-left,
.table > tbody > tr > th.center-left,
.table > tfoot > tr > td.center-left,
.table > tfoot > tr > th.center-left,
.table > thead > tr > td.center-left,
.table > thead > tr > th.center-left {
    vertical-align: middle;
    text-align: left;
}

.table > tbody > tr > td,
.table > thead > tr > th {
    max-width: 250px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.no-border {
    border: none !important;
}

tr.table-border:not(:last-child) {
    border-bottom: 1px solid #4d525d;
}

tr.table-hide {
    display: none;
}

.sindu_dragger table{
    background-color: #4d525d !important;
}

.nadvice-link {
    color: #ffffff;
}

.nadvice-link:focus,
.nadvice-link:hover {
    color: #8888D1;
}


.group-small {
    width: 50%;
}

.group {
    position:relative;
    margin-bottom:30px;
}

.group.no-margin {
    margin-bottom: 0px;
}

.group input,
.group textarea {
    /* border: none !important;
    box-shadow: none !important;
    background: transparent;
    font-size:18px;
    padding:10px 10px 10px 5px;
    display:block; */
    width:100%;
    /* border-bottom:1px solid #757575 !important; */
}

.group.no-margin input {
    padding:7px 5px 0px 5px;
    font-size:14px;
}
/*
.group input:focus,
.group textarea:focus {
    outline:none;
} */

.group label {
    color:white;
    font-size:16px;
    font-weight:normal;
    position:absolute;
    pointer-events:none;
    left:4px;
    top:16px;
    transition:0.2s ease all;
    -moz-transition:0.2s ease all;
    -webkit-transition:0.2s ease all;
}

.group.no-margin label {
    top: 0;
    font-size:14px;
}

.group input:focus ~ label,
.group input:valid ~ label,
.group textarea:focus ~ label,
.group textarea:valid ~ label {
    top:-20px;
    font-size:14px;
    color:#555 !important;
}

.group.no-margin input:focus ~ label,
.group.no-margin input:valid ~ label {
    top:-12px;
}

.error {
    color: red;
}

.generic-subtitle {
    border-bottom: 1px solid #555;
    color: #555;
    display: inline-block;
    font-size: 1.2em;
}

.link, .link:focus, .link:active, .link:hover {
    color: var(--app-primary-color, #061e38);
    cursor: pointer;
    text-decoration: underline;
}

.link.light, .link.light:hover, .link.light:focus {
    color: white;
    text-decoration: underline;
}

.link-delete {
    color: #8e96aa;
    font-size: 1em;
    text-decoration: underline
}
.link-delete:hover, .link-delete:focus, .link-delete:active {
    color: #9da2b1;
}

.nav.navbar-nav.navbar-right li {
    align-items: center;
    display: flex;
    height: 50px;
    margin-left: 18px;
}


/******** CSS POPUP EVENT ********/

.event-popup {
    color: #333;
}

.event-popup .close {
    color: #686e7e;
    opacity: 1;
    font-size: 2.6em;
    text-shadow: none;
    margin-left: 24px;
    margin-right: 8px;
}

.event-popup .event-header {
    padding: 16px;
}

.event-popup .event-header .cancel-link {
    margin-right: 10px;
    line-height: 2.4em;
}

.event-popup .event-title h3,
.event-popup .event-artists h6 {
    margin: 0px;
}

.event-popup .event-artists {
    color: #b5b8c1;
}

.event-popup .edit-icon {
    margin-left: 8px;
    margin-right: 8px;
}

.event-popup .event-actionbar {
    padding: 0;
}

.event-popup .event-actionbar .nav-tabs li {
    width: 33.33%;
    border-bottom: none;
}

.event-popup .event-actionbar .nav-tabs li a {
    text-align: center;
}

.event-popup .event-tab-content {
    padding: 24px;
}

.event-popup textarea,
.event-popup input[type=text],
.event-popup input[type=number],
.event-popup input[type=url],
.event-popup select,
.event-popup .select-picker-custom {
    width: 100%;
    background-color: #f7f7f7;
    border-radius: 4px;
    border: 1px solid var(--app-secondary-color);
    padding: 8px;
}

.event-popup .input-group input {
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
}

.event-popup .input-group .input-group-btn {
    border: 1px solid var(--app-secondary-color);
    border-bottom-right-radius: 4px;
    border-left: none;
    border-top-right-radius: 4px;
}

.event-popup .input-group .input-group-btn a {
    background-color: transparent;
    color: #333;
    border: none;
}

.event-popup .input-group .input-group-btn a > .glyphicon {
    margin: 0;
}

.event-popup .input-group .input-group-btn:hover {
    background-color: #f1f1f1;
}

.event-popup input.medium {
    margin-bottom: 8px;
}

.event-popup textarea:focus,
.event-popup input:focus,
.event-popup input[type=text]:focus,
.event-popup input[type=number]:focus,
.event-popup input[type=url]:focus,
.event-popup select:focus,
.event-popup button:focus,
.event-popup .select-picker-custom:focus {
    outline: none !important;
    border-color: #8888d1;
}

.event-popup label {
    color: #737989;
    text-transform: uppercase;
    font-weight: bold;
}

.bootstrap-select .dropdown-menu {
    background-color: white;
    border: 1px solid var(--app-secondary-color);
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-top: none;
    top: 80%;
}

.bootstrap-select .dropdown-menu > li > a,
.bootstrap-select .dropdown-menu > li > a {
    color: #333;
}

.bootstrap-select .dropdown-menu > li > a:focus,
.bootstrap-select .dropdown-menu > li > a:hover {
    /* background-color: #757b91; */
    outline: none;
}

.event-popup .event-img {
    background-size: cover;
    border: 1px solid var(--app-secondary-color);
    height: 205px;
    font-size: 1.7em;
    line-height: 0.6;
}

.event-popup .event-img p:first-child {
    padding-top: 75px;
}

.event-popup .event-img:hover {
    opacity: 0.5;
    background-color: black;
    cursor: pointer;
}

.full-width {
    width: 100%;
}

.nadvice-ol,
.nadvice-ol > li {
    padding-left: 16px;
}

.event-popup .event-datetime > * {
    margin-right: 8px;
}

.event-popup .ticket-background {
    background-color: #fafafa;
    padding: 8px;
    border-radius: 4px;
}

.event-popup .ticket-stats,
.event-popup .ticket-background {
    padding: 8px;
}

.event-popup .ticket-stats .ticket-stats-title {
    color: #76798a;
}

.event-popup .ticket-stats .ticket-stats-number {
    color: #777;
}

.event-popup .ticket-stats .ticket-stats-delete {
    color: #8888D1;
}

.event-popup .ticket-stats .ticket-stats-delete:hover {
    cursor: pointer;
}

.event-popup .ticket-stats .ticket-stats-title,
.event-popup .ticket-stats .ticket-stats-number,
.event-popup .ticket-stats .ticket-stats-delete {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 0.9em;
}

.event-popup .ticket-background > div {
    float: left;
    padding-right: 8px;
    width: 26%;
}

.event-popup .ticket-background > div.large-width {
    width: 32.5%;
}

.event-popup .ticket-background > div.small-width {
    width: 13%;
}

.event-popup .ticket-background > div.extra-small-width {
    width: 8%;
}

.event-popup .ticket {
    margin-bottom: 16px;
}

.padding-large {
    padding: 16px;
}

.event-popup .categorie-title {
    font-size: 1.1em;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 12px;
    margin-top: 40px;
    display: flex;
    align-items: center;
}

.event-popup .categorie-title-img {
    margin-right: 16px;
}

.event-popup .nav-tabs[role=tablist] {
    border: none;
}

.event-popup .categorie-add {
    font-size: 1em;
    margin-bottom: 16px;
    font-weight: bolder;
}

.event-popup .categorie-add:focus,
.event-popup .categorie-add:hover {
    text-decoration: none;
    cursor: pointer;
}

.event-popup-general {
    background-color: #fff;
    width: 0px;
    z-index: 1000;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    overflow: auto;
    -webkit-transition: width 1s;
    transition: width 1s;

    -moz-box-shadow: -2px 5px 30px 0px #000000;
    -webkit-box-shadow: -2px 5px 30px 0px #000000;
    -o-box-shadow: -2px 5px 30px 0px #000000;
    box-shadow: -2px 5px 30px 0px #000000;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#000000, Direction=180, Strength=10);
}

.event-popup-general > div {
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
    opacity: 0;
}


.event-popup-general.active {
    width: 1000px;
}

.event-popup-general.active > div {
    opacity: 1;
}

.event-popup-general .event-nav-pills {
    width: fit-content;
    float: right;
}

.event-popup-general .event-nav-pills > li:not(:last-child) {
    margin-right: 8px;
}

.event-popup-general .event-nav-pills > li {
    background-color: #f1f1f1;
    color: #444b55;
    border: none;
    border-radius: 4px;
    margin-right: 0px;
    margin-top: 8px;
    font-size: 0.7em;
}

.event-popup-general .event-nav-pills > li.active {
    border-bottom: 2px solid var(--app-secondary-color);
}

.event-popup-general .event-nav-pills > li a,
.event-popup-general .event-nav-pills > li.active a {
    border: none;
}

.has-error,
.has-error {
    border-bottom-color: red !important;
    border-bottom-width: 1px !important;
}

.popup-inline {
    background-color: #fff;
    border: 1px solid #dfdfdf;
    color: #555;
    padding: 20px;
    width: 70%;
}

.popup-inline.small {
    max-width: 300px;
}

.popup-inline.large {
    min-width: 90%;
}

.popup-inline .title {
    color: #eaeaea;
    font-size: 2em;
    text-align: center;
    padding-bottom: 16px;
}

.popup-inline .subtitle {
    color: #eaeaea;
    font-size: 1.1em;
}



.italic-title {
    line-height: 2.4em;
    margin-left: 10px;
    font-size: 1.2em;
    color: #555;
    font-style: italic;
}

.notif-li {
    position: absolute;
    right: -4px;
    top: -4px;
    color: white;
    background-color: #d19433;
    padding: 1px 5px;
    border-radius: 100%;
    font-size: 0.9em;
    z-index: 1;
}


/* presentation register */

/* prensetation public */
.section-presentation-public h2 {
    text-transform: uppercase;
    color: white;
    font-size: 25px;
    line-height: 1.6em;
}

.section-presentation-public .presentation, .section-presentation-public.presentation {
    background: #25282e;
    padding-bottom: 30px;
}

.section-presentation-public .philosophie {
    background: #3a3e45;
    padding-bottom: 30px;
}

.section-presentation-public .bloc {
    min-height: 270px;
    background-repeat: no-repeat;
    position: relative;
    padding: 0;
}

.section-presentation-public .title {
    color: white;
    font-size: 22px;
    line-height: 2.5em;
    position: absolute;
    text-align: center;
    text-transform: capitalize;
    top: 210px;
    width: 100%;
}

.section-presentation-public .bloc .content {
    position: absolute;
    bottom: 0;
    font-size: 1.1em;
    padding: 10px;
}

.section-presentation-public .philosophie .bloc.localiser {
    background-image: url(../img/landing/localiser_bg.jpg);
}
.section-presentation-public .philosophie .bloc.reserver {
    background-image: url(../img/landing/reserver_bg.jpg);
}
.section-presentation-public .philosophie .bloc.profiter {
    background-image: url(../img/landing/profiter_bg.jpg);
}

.section-presentation-public .communaute {
    background: #3a3e45;
    padding: 20px 20px;
    color: white;
    min-height: 230px;
}

.section-presentation-public .communaute .img-reseaux span {
    margin-left: 7px;
    margin-right: 7px;
    padding-bottom: 15px;
    display: inline-block;
}

.section-presentation-public .iphone {
    float: right;
    top: -215px;
    position: absolute;
    right: -2%;
}

.section-presentation-public iframe {
    max-width: 100%;
    width: 560px;
    height: 315px;
}


/*
 * presentation pro
 * */
#signup-form ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.section-presentation-public.pro .bloc {
    background-position: center 100px;
    background-repeat: no-repeat;
    padding: 10px;
    background-color: #3a3e45;
    color: white;
    font-size: 14px;
    box-sizing: border-box;
}

.section-presentation-public.pro .title {
    position: relative;
    font-size: 22px;
    text-align:center;
    color: white;
    width: 100%;
    text-align: center;
    line-height: 2.5em;
    text-transform: capitalize;
    padding-bottom: 0;
    top: 0;
}

.section-presentation-public.pro .bloc .content {
    color: #c1c1c1;
    position: relative;
}

.section-presentation-public.pro .avantages {
    background: #3a3e45;
    padding-bottom: 30px;
}

.section-presentation-public.pro .avantages .bloc {
    text-align: center;
    padding: 30px;
    margin: 0;
}

.section-presentation-public.pro .avantages .bloc.odd {
    background: #41454d;
}
.section-presentation-public.pro .avantages .bloc.even {
    background: #3a3e45;
}

.section-presentation-public.pro .avantages .bloc img {
    padding-bottom: 10px;
}

.section-presentation-public.pro .tarifs {
    margin-bottom: 30px;
}

.section-presentation-public.pro .tarifs strong {
    font-size: 130%;
}

.section-presentation-public.pro .tarifs .tarif {
    border-bottom: 4px solid #816ea8;
    padding-bottom: 5px;
}

.section-presentation-public.pro button.offre-pro {
    background-color: #3a3e45;
    margin: 0;
    margin-bottom: 1em;
    padding: 6px 15px;
    border: 2px solid #41454d;
    border-radius: 5px;
    font-weight: bold;
    width: 100%;
}
.section-presentation-public.pro button.offre-pro:focus {
    outline: 0;
}

.section-presentation-public.pro .pro-abo {
    background-color: #41454d;
    border: 1px solid #3a3e45;
    border-radius: 5px;
    box-shadow: 1px 1px 3px #222;
    margin: 1em;
    padding: 1em;
    position: relative;
}

.section-presentation-public.pro div.abonnement * {
    font-family: "nunito sans";
}

.bloc a {
    color: white;
}

.pro-type {
    background: #3a3e45;
    border: 1px solid transparent;
    font-size: 1.4em;
    margin-bottom: 15px;
    opacity: 0.7;
    padding: 50px 5px;
}

.pro-type:hover, .pro-type.active {
    border-color: #8888d1;
    cursor: pointer;
    opacity: 1;
}

.no-padding {
    padding: 0;
    margin: 0;
}

/* .row > div.no-padding:not(:last-child) {
    padding-right: 10px;
} */


/* page drinks */
.drinks-section .general-menu {
    overflow:auto;
    max-height: calc(100vh - 70px);
}
.drinks-section .general-menu h3 {
    color: var(--app-primary-color, #061e38);
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 10px;
}

.drinks-section .general-menu ul {
    padding: 0;
    margin-bottom: 30px;
}

.drinks-section .general-menu li {
    color: #555;
    font-size: 16px;
    font-weight: 600;
    list-style-type: none;
    margin-bottom: 10px;
    padding: 10px 0px 10px 0px;
}

.drinks-section .general-pane {
    background-color: #fff;
    height: calc(100vh - 60px);
    overflow: auto;
}

.drinks-section .button-large-width {
    padding: 10px 28px 8px 28px;
}

.drinks-section .menu-header {
    padding: 1em 1.8em;
}

.drinks-section .menu-header h1 {
    color: #061C36;
    font-family: AvenirNext-Demi;
}

.drinks-section .menu-header h2 {
    color: #848383;
    font-size: 22px;
    margin-top: 12px;
}

.drinks-section .menu-type-element ul > li i.glyphicon {
    line-height: 38px;
}
.drinks-section .menu-type-element ul > li {
    border: 1px solid var(--app-secondary-color, #342ead);
    color: var(--app-secondary-color, #342ead);
    height: 72px;
    margin-left: 5px;
    padding: 15px 30px 15px 30px;
    text-transform: uppercase;
}
.drinks-section .menu-type-element ul > li:focus {
    outline: none;
}

.drinks-section .menu-type-element ul > li a {
    background: transparent;
    border: none;
    color: var(--app-secondary-color, #342ead);
    padding: 0;
    margin: 0;
}

.drinks-section .menu-type-element ul > li a:focus,
.drinks-section .menu-type-element ul > li a:active,
.drinks-section .menu-type-element ul > li.active a:hover {
    background: transparent;
    border: none;
    color: white;
    padding: 0;
    margin: 0;
}

.drinks-section .menu-type-element ul > li:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.drinks-section .menu-type-element ul > li:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.drinks-section .menu-category .tab-content,
.drinks-section .menu-category > ul,
.drinks-section .menu-category > button {
    display: inline-block;
    overflow: visible;
}

.drinks-section .menu-category .tab-content.error,
.drinks-section .menu-category .tab-content.error .label {
    color: #e05151;
}

.drinks-section .menu-category .tab-content:not(.error) .hidden-error {
    display: none;
}

.drinks-section .menu-category .tab-content.error button {
    border-color: #e05151;
}

.drinks-section .menu-header div {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.drinks-section .menu-header div > div.title {
    display: flex;
    flex-direction: column;
    margin: 1rem;
}

.drinks-section .menu-header div > div.title * {
    margin: 0;
}

.drinks-section .menu-category .tab-pane {
    margin: 10px 0 0 0;
}

.drinks-section .menu-category .tab-content .label {
    color: #a5a5a5;
    width: 100%;
    text-transform: uppercase;
    padding: 0;
    font-size: 1.55rem;
    font-family: AvenirNext-Demi;
}

.drinks-section .menu-category .dropdown button > span {
    font-size: 1.80rem;
}

.drinks-section .menu-header .menu-number-elements {
    margin-left: 30px;
    font-size: 18px;
    vertical-align: 1em;
}

.drinks-section .menu-header .menu-number-elements .number {
    color: #eaeaea;
}

.drinks-section .menu-header .menu-number-elements .element-word {
    color: #555;
}

.drinks-section .menu-action-element {
    /*margin-top: 5px;*/
    margin-left: auto;
}

.drinks-section .menu-action-element.pull-right {
    align-self: flex-end;
}

.menu-manage-push {
    border-color: #31a45c;
    color: #31a45c;
    font-weight: bold;
}

.menu-manage-push > .glyphicon {
    margin-right: 10px;
}

.drinks-section .menu-action-element h2 {
    color: var(--app-primary-color, #061e38);
    margin-bottom: 20px;
    margin-top: 0;
}

.drinks-section .menu-category {
    align-items: flex-start;
    background-color: #f6f6f6;
    padding: 20px 20px 30px 20px;
    display: flex;
}

.drinks-section .menu-category ul
.drinks-section .modal .nav-tabs ul {
    margin: 0;
    padding: 0;
}

.drinks-section .menu-category li,
.drinks-section .modal .nav-tabs li {
    background-color: white;
    border: 1px solid #dfdfdf;
    color: var(--app-secondary-color, #342ead);
    font-weight: 600;
    list-style-type: none;
    padding: 8px 14px 8px 14px;
    text-align: left;
    text-transform: inherit;
}

.drinks-section .menu-category li.bold,
.drinks-section .modal .nav-tabs li.bold{
    font-weight: bold;
    font-family: AvenirNext-Demi;
}

.drinks-section .menu-category li.gray,
.drinks-section .modal .nav-tabs li.gray{
    color: #7a808e;
}

.drinks-section .menu-category li button {
    border: none;
    width: 100%;
    padding: 0;
    background: #fff;
    text-align: left;
}

.drinks-section .menu-category li:hover button, .drinks-section .menu-category li button:hover {
    color: #fff;
    background: var(--app-secondary-color, #342ead);
}

.drinks-section .menu-category li:hover,
.drinks-section .modal .nav-tabs li:hover {
    color: #fff;
}

.dropdown > button.active.menuSelectBtn {
    color: var(--app-secondary-color, #342ead);
    border: 2px solid #e2e2e2;
}

.menuSelectBtn {
    color: var(--app-secondary-color, #342ead);
    padding: 10px 18px 6px;
    background: #fff;
    border: 2px solid #e2e2e2;
    border-radius: 4px;
    font-size: 1.65rem;
    width: 100%;
    text-align: left;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menuSelectBtn .caret-menu {
    position: relative;
    margin-top: -6px;
    margin-right: 12px;
}

.menuSelectBtn .caret-menu:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-top: 8px solid #afafaf;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
}

.menuSelectBtn .caret-menu:after {
    content: '';
    position: absolute;
    left: 3px;
    top: 0;
    border-top: 5px solid #fff;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

#modalEditElement .group-form,
#modalAddElement .group-form {
    margin-bottom: 10px;
}

.drinks-section #drinks-list .dropdown-menu{
    padding: 0;
}

.drinks-section .menu-category li.active,
.drinks-section .menu-type-element .active ,
.drinks-section .modal .nav-tabs li.active {
    /*background-color: var(--app-secondary-color, #342ead);*/
    /*border-color: var(--app-secondary-color, #342ead);*/
    color: var(--app-secondary-color, #342ead);
}

.drinks-section .menu-category li.active a,
.drinks-section .menu-type-element .active a,
.drinks-section .modal .nav-tabs li.active a {
    background-color: transparent;
    color: var(--app-secondary-color, #342ead);
}

.drinks-section .menu-category .is_menu > a {
    padding: 0;
}

.drinks-section .menu-category .is_menu > a i {
    margin-right: 4px;
}

.drinks-section .menu-category li.active:hover,
.drinks-section .menu-type-element .active:hover,
.drinks-section .modal .nav-tabs li.active:hover {
    color: white;
}

.drink-section .menu-category div.dropdown {
    width: 100%;
}

.drinks-section .menu-category .dropdown-menu li.active:hover > a {
    color: #fff;
}

.drinks-section .modal .nav-tabs li {
    border-bottom: 0;
}

.drinks-section .modal .nav-tabs {
    margin: 0 auto;
    /*width: 300px;*/
}

.drinks-section .menu-data table {
    color: #555;
    margin: 0;
}

.drinks-section .menu-data table thead tr th,
.drinks-section .menu-data table tbody tr td {
    border-bottom: 2px solid #f6f6f6;
    font-size: 13px;
    padding: 15px;
    vertical-align: middle;
}

.drinks-section .menu-data table thead tr th {
    color: #555;
}

.drinks-section .menu-data table thead tr th:not(:first-child),
.drinks-section .menu-data table tbody tr td:not(:first-child) {
    border-left: 2px solid #f6f6f6;
}

.drinks-section .menu-table-first-column i,
.drinks-section .menu-table-first-column div {
    display: inline-block;
}

.drinks-section .menu-table-first-column i {
    color: #555;
    font-size: 20px;
}

.drinks-section .menu-data .table .type-size,
.drinks-section .menu-data .table .type-size + div {
    color: #555;
    font-size: 11px;
    text-transform: uppercase;
}

.drinks-section .menu-data .glyphicon-star {
    color: var(--app-secondary-color, #342ead);
}



.drinks-section .menu-stat {
    background-color: #f6f6f6;
    bottom: 0;
    padding: 20px 40px 20px 40px;
    position: absolute;
    width: 100%;
}

.drinks-section .menu-stat .NumberBest {
    color: #8881D8;
}

.drinks-section .menu-stat .title {
    color: #555;
}

.drinks-section .gold-text {
    color: #dca14f;
}

.drinks-section .category-group,
.drinks-section .section-group {
    flex-direction: row;
    display: flex;
    align-items: center;
}

.drinks-section .category-group > input,
.drinks-section .category-group > button,
.drinks-section .section-group > input,
.drinks-section .section-group > button {
    margin: 0 6px;
}

.drinks-section .category-group:not(:last-child),
.drinks-section .section-group:not(:last-child) {
    margin-bottom: 15px;
}

.drinks-section .category-group .glyphicon,
.drinks-section .section-group .glyphicon {
    font-size: 1.5em;
    /* margin-left: 15px;*/
    vertical-align: middle;
}

.drinks-section .category-group .glyphicon:hover,
.drinks-section .section-group .glyphicon:hover {
    cursor: pointer;
}

.drinks-section .category-group .glyphicon-trash,
.drinks-section .section-group .glyphicon-trash {
    color: #555;
}

.drinks-section .category-group .glyphicon-transfer,
.drinks-section .section-group .glyphicon-transfer {
    color: #e65d50;
}

.drinks-section .off-text {
    color: #555;
}

.drinks-section .informative-div {
    font-size: 1.2em;
    margin-top: 20px;
    margin-bottom: 20px;
}

.drinks-section .button-full-width .caret {
    position: absolute;
    right: 18px;
    top: 43%;
}

.drinks-section .group-form {
    margin-top: 15px;
}

.drinks-section .menu-header .card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.drinks-section .card-header a {
    color: var(--app-secondary-color, #342ead);
    font-size: 1.65rem;
}

li[role=presentation] {
    border-bottom: none;
}

.drinks-section .general-menu li:hover,
.drinks-section .menu-type-element li:hover,
.drinks-section .menu-category li:hover,
.drinks-section .dropdown-menu li:hover {
    cursor: pointer;
}

.drinks-section .selection-controllers {
    background: #f6f6f6;
    bottom: 0;
    color: #555;
    padding: 1em;
    position: sticky;
}

.drinks-section .onsite {
    background-color: #e5f0fb;
}
.drinks-section .takeaway {
    background-color: #e3eee0;
}
.drinks-section .delivery {
    background-color: #ffd1eb;
}
.drinks-section .happyhour {
    background-color: #ffe974;
}

.modal .tab-pane {
    margin: 0;
}

.modal .items {
    margin-bottom: .7em;
}
.modal .items li {
    margin-bottom: 4px;
}

/* page drinks */


.stats .giant {
    color: var(--app-secondary-color, #342ead);
    display: inline-block;
    font-size: 4em;
    font-weight: bold;
    position: relative;
    width: 100%;
}

.stats .giant .detail {
    cursor: pointer;
    font-size: 12px;
    position: absolute;
    right: 12px;
    text-decoration: underline;
    top: 12px;
}

.stats.with-repartition > .giant {
    min-height: 120px;
}

.stats .small {
    color: #555;
    font-size: 12px;
    font-weight: bold;
    position: relative;
    width: 100%;
}

.stats .small span {
    color: var(--app-secondary-color, #342ead);
}

.stats .underlined-separator {
    border-bottom: 5px solid #dfdfdf;
    display: block;
    margin: 0px 0 10px;
    width: 50px;
}
.stats .legend {
    text-transform: uppercase;
    font-size: .9em;
}

#modal-add-image > .modal-dialog {
    width: 780px;
}
#modal-menu > .modal-dialog {
    width: 1200px;
}

.menus li {
    border-bottom: 1px solid #aaa;
}

.hours {
    margin-bottom: 16px;
}

.hours li {
    margin-bottom: 4px;
}

.hours li .delete {
    cursor: pointer;
    font-size: 25px;
}

.select2-dropdown {
    color: #333;
    z-index: 10000 !important;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: #333;
}

.select2 {
    min-width: 300px;
}

.product-picture img:hover {
    cursor: pointer;
}
.product-picture .close {
    background-color: red;
    color: white;
    opacity: 0.8;
    padding: 6px 8px;;
    text-shadow: none;
}

ul.with-list {
    list-style: initial;
    margin-left: 2em;
}

#abonnement .tohide {
    display: none;
}

.panel-shopgroups > .panel-heading {
    background-color: #b4e7ff;
}

.pictos {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 4px;
    height: 200px;
    overflow: auto;
}

.pictos .picto {
    margin: 6px;
}

.cursor {
    cursor: pointer;
}

.modal {
    overflow: auto !important;
}

.delete-optionset, .delete-tagset {
    background: #f9b3b3;
    border-radius: 10px;
    cursor: pointer;
    padding: 8px 16px;
}

.import-page {
    color: #777;
}

.import-page h1 {
    font-weight: bold;
    font-size: 2.4em;
    margin-bottom: 1.2em;
}

.import-page p {
    margin: 1.4em;
}

.dropdown-menu>li:hover a {
    color: white;
}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
    color: white;
    background-color: inherit;
}

.addMeasureContainer {
    text-align: center;
    padding: 10px;
}

#modalHandleCollectionPicture .content {
    margin-top: 20px;
}

#modalHandleCollections #draggable-collections {
    margin: 1rem 0;
}

#addCollectionContainer {
    text-align: center;
    margin: 2rem;
}

.glyphicon.glyphicon-log-in {
    color: #31a45c;
}

.mb-button {
    position: absolute;
    right: 10px;
    top: 15px;
}

.mb-button a {
    background: var(--app-secondary-color);
    border: none !important;
    color: white;
}

.mb-button a:hover, .mb-button a:visited {
    color: white;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    width: auto !important;
    padding: 8px;
}

input[type=text].datepicker:focus {
    border-color: transparent !important;
    border: none !important;
}

.toggle {
    background: #f1f1f1;
    border: 1px solid #333;
    border-radius: 4px;
    cursor: pointer;
    margin: 0px 8px;
    padding: 0px 8px;
}

.toggle .glyphicon {
    font-size: 14px;
}

.button-edit-product {
    border-bottom: dashed 1px var(--app-secondary-color, #342ead) !important;
    color: var(--app-secondary-color, #342ead);
    cursor: pointer;
}

#domains {
    text-align: left;
    margin: 1em 0;
}

#domains > .domain {
    background: #f1f1f1;
    border: 1px solid #d1d1d1;
    border-radius: 8px;
    color: #333;
    font-size: .9em;
    margin: 4px;
    padding: 8px 16px;
}

#domains > .domain.new {
    background: white;
    border: 1px solid #d1d1d1;
    border-radius: 8px;
    color: #333;
    display: block;
    font-size: .9em;
    margin: 4px;
    padding: 8px 16px;
    width: 100%;
}

.editable-input input[type=text] {
    width: 100px !important;
}

.editable-input textarea {
    width: 200px !important;
}

.editable-container.popover {
    width: max-content !important;
}

.note-editor {
    white-space: normal;
}

.note-editor .note-editable{
    min-height: 150px;
}

.editable-container.popover {
    left: 40px !important;
}

.editableform {
    width: calc(100% - 75px);
}

.editable-container.editable-popup {
    width: 60% !important;
}