root {
    /*--burgerbundark: #FFA733;*/
    /*--burgerbunlight: #FFB655;*/
    /*--burgersesame: #FFF5CC;*/
    /*--cheeselight: #FFD422;*/
    /*--cheesedark: #EEBF00;*/
    /*--ketchuplight: #FF5023;*/
    /*--ketchupdark: #FF3501;*/
    /*--saladlight: #7ED63E;*/
    /*--saladdark: #6DC82A;*/
    /*--steaklight: #AA6100;*/
    /*--steakdark: #884D00;*/
}

body {
    background-color: black;
    margin: 0;
    padding: 0;
}

i.icon {
    margin-right: 0px !important;
}

.eventCoreInfo i.icon {
    margin: 0 .25rem 0 0 !important;
}

.notSelectableText {
    /*!!added to whole body!!*/
    moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer */
    -khtml-user-select: none; /* KHTML browsers (e.g. Konqueror) */
    -webkit-user-select: none; /* Chrome, Safari, and Opera */
    -webkit-touch-callout: none; /* Disable Android and iOS callouts*/
}

header {
    text-align: center;
    background-color: #ffb655;
    top: 0;
    width: 100%;
    position: fixed;
    color: #fff;
    height: 5vh;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 4px 8px rgba(0, 0, 0, .28);
    box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 4px 8px rgba(0, 0, 0, .28);
    z-index: 100;
}

nav {
    position: fixed;
    line-height: 5vh;
    height: 5vh;
    width: 100%;
    z-index: 500;
    top: 5vh;
    background-color: black;
    overflow: hidden;
}

main {
    position: fixed;
    height: 85vh;
    border-radius: 10px;
    width: 100%;
    top: 10vh;
}

footer {
    z-index: 2000;
    bottom: 0;
    width: 100%;
    position: fixed;
    color: #fff;
}

#upbun {
    display: inline-block;
    margin-top: 7px;
    width: 70%;
    height: 5vh;
    background: url(../imgs/top_bun_light.svg) repeat;

}

#loading-screen {
    position: absolute;
    text-align: center;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 1);
    z-index: 10001;
}

#loading-screen img {
    max-width: 100%;
    height: auto;
    top: 22%;
    position: relative;
}

#navtext {
    color: wheat;
    float: right;
    margin-right: 10px;
    font-size: 3vh;
}

#eventmapcontainer {
    height: 100%;
}

#mapid {
    height: 100%;
    z-index: 0;
}


#map-navig {
    z-index: 1000;
    bottom: 6vh;
    width: 100%;
    position: fixed;
    margin: 0;
}

#eventview {
    position: relative;
    z-index: 100;
    height: 0%;
    overflow: hidden;
    background-color: #251708;
}

#eventview {
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
}

#eventview::-webkit-scrollbar { /* WebKit */
    width: 0;
    height: 0;
}

#eventview .list i.icon {
    color: #d4d4d48e;
}

#eventview .list i.icon:hover {
    color: #fed422 !important;
}

.ui.list {
    margin: 0;
}


.ui.divided.list > .item {
    border-top: 1px solid #696969;
    margin-bottom: 15px;

}

.menu {
    color: WHEAT;
    font-size: 12px;
    max-width: calc(100% - 40px);

}

.maptype {
    position: absolute;
    z-index: 105;
    padding: 10px;
}

.top {
    color: #261808 !important;
    background-color: #2e6916 !important;
    font-size: 30px;
    border-top: 0px !important;
}

.star {
    margin-top: 10px !important;
    -webkit-text-stroke-width: 1.5px;
    -webkit-text-stroke-color: black;
}

.star :hover {
    color: #fed422;
}

.dish {
    margin-left: 5px;
    padding: 1em 0 !important;
}

.place {
    background-color: rgba(0, 0, 0, 0.8) !important;
    color: #FAA733 !important;
    font-size: 20px !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important;
}

.place:active {
    transform: translateY(3px);
}

.place.back_arrow {
    font-size: 20px !important;
}

.header {
    color: white !important;
}

.header-list {
    color: rgba(255, 255, 255, 0.9);
    /* color: #FFF5CC; */
}

.title {
    font-weight: 100 !important;
    font-size: 20px;
    margin-bottom: 5px !important;
    line-height: 1;
}

.description {
    color: rgba(0, 0, 0, 1) !important;
    border-radius: 5px;
}

.price {
    font-size: 20px;
    margin: 0 !important;
    margin-top: -10px !important;
    margin-right: -20px !important;
    color: WHITE !important;
    line-height: 0.142857em !important;
}

.menu_header {
    height: 50px;
    margin: 0 !important;
    color: #261808 !important;
    background-color: #fed422;
    font-size: 35px !important;
    position: -webkit-sticky;
    position: sticky;
    top: 63px;
    overflow: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

.menu_header_inside {
    margin: 0 !important;
    color: #261808 !important;
    background-color: #fed422;
    font-size: 35px !important;
}

.menu_burger_divider {
    background: url("../imgs/szr.png");
    height: 35px;
    position: -webkit-sticky;
    position: sticky;
    top: 117px;
    margin-top: -1px;

}

.menu_burger_divider1 {
    background: url("../imgs/salpom.png");
    height: 19px;
    top: 63px;
    position: -webkit-sticky;
    position: sticky;
}

.szam_header div.right.floated.content {
    margin: 0 !important;
}

.nav-panel img {
    height: 100%;
}

.nav-panel {
    padding: 1px;
    height: 100%;
    float: left;
}

.real-footer {
    height: 5vh;
    background: url(../imgs/bottom_bun_light.svg) repeat;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 -4px 8px rgba(0, 0, 0, .28);
    box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 -4px 8px rgba(0, 0, 0, .28);
}


.separator {
    color: wheat !important;
    font-size: 3vh !important;
    float: left;
}

.navimg {
    float: left;
    height: 5vh;
    width: 5vh;
    margin-top: 0.5px;
    border: 1px solid wheat;
}

.catName {
    display: inline-block;
    padding: 2px;
    font-size: 25px;
}


/* LEAFLET */

.leaflet-control-attribution a {
    color: #FFA733;

}

#contributors_button {
    margin-top: 5px;
}

i.inverted.circular.icon {
    margin-top: unset;
    margin-left: 15px;
    color: #FFA733 !important;
}

a, a:hover {
    color: #FFA733;
}

.leaflet-control-attribution, .leaflet-control-scale-line {
    padding: 0 5px;
    color: #fff;
}

.leaflet-bar a, .leaflet-bar a:hover {
    background-color: rgba(0, 0, 0, 0.8);
    border-bottom: 1px solid #FF980070;
    color: #FFA733;
}

.leaflet-bar a.leaflet-disabled {
    background-color: black;
    color: #FF980070;
}

.leaflet-marker-icon {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border: 5px solid #FFA733;
    background-color: black;
    border-radius: 10px;
}

.leaflet-popup-content-wrapper, .leaflet-popup-tip /*, .leaflet-popup-tip */
{
    background: rgba(0, 0, 0, 0.8);
    color: #FFA733;
    font-size: 2em;
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
}

.leaflet-control-attribution {
    display: none;
}

.leaflet-left {
    margin-right: 10px;
    left: auto;
    right: 0;
}


#map-navig .left-arrow {
    left: -20px;
}

#map-navig .right-arrow {
    right: -20px;
}

#map-navig .arrow {
    position: absolute;
    top: calc(50% - 4em);
}


.tagList {
    background-color: floralwhite;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    z-index: 300;
    padding-left: 5px;
}

[data-tooltip]::after {
    text-shadow: none !important;
}

.tagList .ui.labels .label {
    margin: 4px 4px 4px 0;
    padding: 5px;
    font-size: 2.85714286rem;
    font-weight: normal;
    color: #FFFFFF;
    /*text-shadow: 0 1px 0 #CCCCCC, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);*/
    text-shadow: 0 1px 0 #000000, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, .1), 0 0 5px rgba(0, 0, 0, .1), 0 1px 3px rgba(0, 0, 0, .3), 0 3px 5px rgba(0, 0, 0, .2), 0 5px 10px rgba(0, 0, 0, .25), 0 10px 10px rgba(0, 0, 0, .2), 0 20px 20px rgba(0, 0, 0, .15);
    /*text-shadow: 0 1px 0 #000000, 0 2px 0 #000000, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);*/
}

.notSelectedTags .ui.label, .notSelectedTags .ui.label:hover {
    background-color: transparent;
}

.tagList .selectedTags.ui.labels .label {
    border-radius: 13px !important;
}

.ui.label:not(.icon) > .close.icon, .ui.label:not(.icon) > .delete.icon {
    margin: 0 0 0 0.2em;
}

.selectedTags, .notSelectedTags {
    display: inline-block;
}

.szam_list {
    padding-bottom: 56px !important;
    min-height: calc(100% - 56px);
}

.szam_header {
    top: 0px;
}

.ui.avatar.image {
    border-radius: 0;
}

/*.orange_tag {*/
.ui.orange_tag.labels .label, .ui.ui.ui.orange_tag.label {
    /*background-color: #ffb655 !important;*/
    /*border-color: #ffb655 !important;*/
    background-color: #d0dcae !important;
    border-color: #ffb655 !important;
    color: #fff;
}


.top_menu_burger_divider {
    height: 63px;
    background: #2e661c url("../imgs/hamburger-.png") repeat-x;
    white-space: nowrap;
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    z-index: 300;
    position: -webkit-sticky;
    position: sticky;
}

.badge .leaflet-popup-content {
    position: absolute;
    top: -54px;
    left: 19px;
    z-index: 10;
    height: 20px;
    min-width: 20px;
    width: auto !important;
    line-height: 20px;
    border-radius: 10px;
}

.badge.badge_open .leaflet-popup-content {
    background: rgb(49, 187, 81);
}

.badge.badge_closed .leaflet-popup-content {
    background: transparent;
}

.badge .leaflet-popup-content-wrapper {
    background-color: transparent;
}

.badge .leaflet-popup-tip-container {
    visibility: hidden
}

.szam_header .item.top {
    margin-bottom: 0px !important;
}

#orders_sidebar {
    z-index: 102;
    width: 200px;
    background-color: rgba(0, 0, 0, 0.8) !important;
    position: absolute;
    height: 100%;
    top: 0;
    right: -200px;
    transition: right 0.5s ease;
}


#orders_sidebar .title .header.szama_name {
    width: 200px;
    margin-top: 4px;
    clear: both;
    text-align: center !important;
}

#orders_sidebar .title .header.order {
    width: 150px;
    float: right;
    margin-top: 4px;
    text-align: center !important;
}

#orders_sidebar .notready_orders_h {
    padding: 6px;
    background-color: grey;
}

#orders_sidebar .ready_orders_h {
    padding: 6px;
    background-color: #21ba45;
}

#orders_sidebar.visible {
    right: 0px;
    transition: right 0.7s ease;
}

#orders_sidebar .ready_order {
    color: #21ba45 !important;
}

#orders_sidebar .orders {
    text-align: center;
}