#menu {
    position: fixed;
    right: calc(50% + 2em);
    z-index: 2;
    cursor: pointer;
}

@media screen and (max-width: 768px) {
    #menu {
        right: 2em;
    }
}

#menu > div {
    display: none;
}

#menu > .fa-bars {
    display: block;
}

#menu:hover > div {
    display: inherit;
}

#menu:hover > .fa-bars {
    display: none;
}

.item-field {
    display: inline-flex;
    width: 100%;
}

.toggle-box {
    float: left;
    cursor: pointer;
}

.section-box {
    background-color: #f5f5f5;
}

.section-box label::after {
    content: attr(data-name);
}

.section-box.minified {
    display: flex;
    justify-content: space-between;
}

.section-box.minified > :first-child {
    flex-grow: 10;
}

.section-box.minified > :last-child {
    flex-grow: 1;
}

.section-box.minified .section-move-wrapper {
    display: flex;
}

.section-box.minified .name-input-wrapper,
.section-box.minified .items-list,
.section-box.minified .dropdown {
    display: none;
}

#drop_modal .box {
    background-color: transparent;
}

#sections .box.first-section .move-up,
#sections .box.last-section .move-down,
#sections
    .box
    .field[id^='section_'][id$='_items']
    .item-field.first-item
    .move-element-up,
#sections
    .box
    .field[id^='section_'][id$='_items']
    .item-field.last-item
    .move-element-down {
    display: none;
}

#load_modal,
#load_modal * {
    overflow: hidden;
    cursor: wait;
}

#contextmenu {
    position: absolute;
}