i.material-icons {
    user-select: none;
}

.hiddenmobile {
    display: none !important;
}

body {
    background: #f5f5f5;
    font-family: 'PT Sans', 'Open Sans', sans-serif;
}

.back_color {
    width: 100%;
    height: 20%;
    min-height: 120px;
    max-height: 200px;
    position: fixed;
    top: 0;
    left: 0;


background: linear-gradient(151deg, #2f527b 0%,#d98041 100%); right: 0;
}

.sidebar {
    height: 100%;
    width: 270px;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    transition: left 0.3s;
    transition-timing-function: ease-in-out;
    font-family: 'PT Sans';
    display: flex;
    flex-direction: column;
}

.sidebar_body {
    flex: 1;
    overflow: auto;
}

.sidebar_body > :first-child .sidebar_element_wrapper {
    margin-top: 10px;
}

.sidebar_body > :last-child .sidebar_element {
    border-bottom: none;
}

.sidebar_element_wrapper {
    transition: 0.3s;
    background: transparent;
    position: relative;
}

.sidebar_element_wrapper .sidebar_element {
    height: 47px;
    display: flex;
    align-items: center;
    margin-left: 10px;
    position: relative;
    border-bottom: 1px solid #bfbfbf;
    overflow: hidden;
    position: relative;
}

.sidebar_element_wrapper .sidebar_element.--bottom {
    border-top: 1px solid #d9d9d9;
    border-bottom: none;
}

.sidebar_element_wrapper .sidebar_element > :first-child.material-icons {
    position: absolute;
    top: 6px;
    right: 43px;
    font-size: 35px;
    color: #bfbfbf;
}

.sidebar_element_wrapper .sidebar_element:hover > :last-child.material-icons {
    margin-right: 15px;
    opacity: 1;
}

.sidebar_element_wrapper .sidebar_element > :last-child.material-icons {
    margin-right: 10px;
    opacity: 0;
    transition: 0.3s;
}

.sidebar_element_wrapper .sidebar_element span.sidebar_link_text {
    margin-left: 17px;
    flex: 1;
}

.sidebar .closebar {
    position: relative;
    float: right;
    color: white;
    padding: 16px 24px;
    font-size: 22px;
    display: none;
}

.sidebar .sidebar_lang {
    position: absolute;
    left: 20px;
    top: 10px;
    user-select: none;
}

.sidebar .sidebar_lang a {
    color: white;
    font-size: 17px;
    font-weight: 100;
}

.prof_top_001 {
    height: 20%;
    position: relative;
    min-height: 120px;
    max-height: 200px;
}

.prof_top_002 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 250px;
    padding: 0 0 15px 20px;
    color: white;
}

.prof_top_002 img {
    width: 60px;
    height: 60px;
    position: relative;
    float: left;
    margin-right: 18px;
    border-radius: 50%;
    box-shadow: 4px 4px 9px -4px rgba(0, 0, 0, 0.75);
}

.prof_top_002 span#sidebar_name {
    margin: 0;
    font-size: 24px;
    font-weight: normal;
    padding: 0 20px 0 0;
    display: block;
}

.prof_top_002 span#sidebar_rank {
    margin: 0;
    font-size: 16px;
    padding: 0 20px 0 0;
    display: block;
}

.sidebar p {
    padding: 10px 15px 10px 25px;
    margin: 0;
    font-size: 18px;
    color: black;
    font-weight: 100;
}

.sidebar p i {
    float: left;
    margin: 2px 11px 0 0;
    font-size: 20px;
}

.sidebar p span {
    background: red;
    color: white;
    padding: 0 6px;
    float: right;
    border-radius: 5px;
}

.sidebar p.bottom {
    position: absolute;
    bottom: 50px;
}

.sidebar .copyright span {
    font-size: 10px;
    margin: 0;
    color: #989898;
    font-weight: 100;
}

.sidebar .copyright {
    bottom: 15px;
    left: 15px;
    right: 15px;
    font-family: 'PT Sans';
    padding: 5px 0px 5px 10px;
    text-align: left;
}

a {
    text-decoration: none;
    color: inherit;
}

.content {
    top: 42px;
    left: 270px;
    right: 5px;
    bottom: 0;
    position: fixed;
    background: white;
    box-shadow: 0 0 18px 0px rgba(0, 0, 0, 0.25);
    padding: 15px;
    overflow-y: auto;
}

h1 {
    margin: 0;
}

.navbar {
    padding: 6px 10px 10px 10px;
    position: fixed;
    margin: 0;
    top: 0;
    left: 0;
    right: 0;
    z-index: 500;
    max-height: 31px;
    overflow: hidden;
}

ul, li {
    list-style: none;
}

.navbar li {
    float: left;
    color: white;
    padding: 5px 8px;
    float: right;
    font-size: 16px;
}

.navbar li.profile {
    float: left;
    padding: 5px 0;
    display: none;
}

.navbar .profile span {
    padding-left: 5px;
}

.navbar .profile i {
    float: left;
    top: -5px;
    margin-top: -2px;
}

.membersul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center;
}

.membersul li {
    display: inline-flex;
}

.memberskart {
    background-color: white;
    width: 200px;
    height: 300px;
    border-radius: 3px;
    border-top: solid 5px lightgreen;
    box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.2);
    margin-bottom: 20px;
    float: left;
    margin-left: 7px;
    margin-right: 7px;
    text-align: center;
}

.membersul li.mkcont {
    display: inline-flex;
}

.memberskart .pimg {
    width: 120px;
    height: 120px;
    display: block;
    border-radius: 60px;
    border-color: white;
    margin-top: 15px;
    margin-right: auto;
    margin-left: auto;
}

.memberskart span.name {
    margin-top: 12px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 0px;
    font-size: 22px;
    text-align: center;
    display: block;
}

.memberskart span.rank {
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 0px;
    font-size: 18px;
    text-align: center;
    color: gray;
    font-weight: 800;
    display: block;
}

@media screen and (max-width: 750px) {
    .prof_top_001 {
    background: linear-gradient(150deg, #2f527b 0%,#d98041 100%);    }

    .navbar li.profile {
        display: inherit;
    }

    .content {
        left: 0;
        right: 0;
        box-shadow: none;
    }

    .navbar li.titel {
        display: flex;
    }

    .sidebar {
        width: 100%;
        background-color: #f5f5f5;
        box-shadow: none;
        left: -100%;
    }

    .sidebar.out {
        left: 0;
        box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
    }

    .sidebar .closebar {
        display: table;
        padding: 20px 32px;
    }

    .sidebar .closebar i {
        font-size: 24px;
    }

    .sidebar p {

        padding: 10px 15px 15px 35px;

    }

    .sidebar {
        left: -300px;
        width: 300px;
    }

    .sidebar p {
        padding: 10px 15px 10px 25px;
    }

    .sidebar .closebar {
        display: table;
    }
}

body.dark .menu .entry span.beta {
    filter: saturate(0.5) brightness(0.6);
}

body.dark .back_color {
    background-image: linear-gradient(150deg, #26303c 0%, #6b503e 100%);
}

body.dark .prof_top_002 {
    color: #e0e0e0;
}

body.dark .leaflet-tooltip {
    background-color: #2a2a2a;
    color: #e0e0e0;
}

body.dark {
    background-color: #2a2a2a;
}

body.dark .sidebar p {
    color: #e0e0e0;
}

body.dark a#link_premium p {
    background-color: rgba(255, 215, 0, 0.2196) !important;
}

body.dark ul#navbar * {
    color: #e0e0e0;
}

body.dark .content {
    background-color: #343434;
    color: #e0e0e0;
}

body.dark .premiumbutton {
    color: black;
}

body.dark .memberskart {
    background-color: #454545;
    filter: saturate(0.5) brightness(0.6);
}

body.dark .legend {
    background-color: #343434;
    color: white;
}

body.dark .legend th {
    color: white;
    filter: saturate(0.8) brightness(0.8);
}

body.dark .legend table h2 {
    color: white;
}

body.dark .content .legend table td {
    filter: saturate(0.8) brightness(0.8);

}

body.dark .bandpiece {
    filter: saturate(0.8) brightness(0.8);
}

body.dark .bianco {
    background-color: #343434;
}

body.dark tr {
    color: #c3c3c3;
}

body.dark .macroarea {
    color: #acacac;
}

body.dark td.short span {
    color: black;
    filter: saturate(0.5) brightness(0.6);
}

body.dark span.old, body.dark span.veryold, body.dark span.unpassed {
    color: black;
    filter: saturate(0.5) brightness(0.6);
}

body.dark .zone_list {
    background-color: #343434;
}

body.dark table {
    background-color: #343434;
}

body.dark input, body.dark textarea {
    background-color: #343434;
    color: #e0e0e0;
}

body.dark .bottom_list {
    background-color: #343434;
}

body.dark .zone_list span {
    color: white;
    filter: saturate(0.5) brightness(0.9);
    background: #818181;
}

body.dark .bottom_list span {
    color: white;
    filter: saturate(0.5) brightness(0.9);
    background: #818181;
}

body.dark .list_main {

    background: #343434;
}

body.dark .bottom_list span.selected, body.dark .zone_list span.selected {
    color: black;
    background: #90caf9;
}

body.dark .zone_list span.preselected {
    animation-name: breathedark;
    color: black;
}

@keyframes breathedark {
    0% {
        background: #a1dbff;
    }
    50% {
        background: #b7f1ff;
    }
    100% {
        background: #a1dbff;
    }
}

body.dark .marker-cluster {
    filter: saturate(0.7) brightness(0.8);
}

body.dark.darkmap .marker-cluster {
    filter: saturate(0.5) brightness(0.6);
}

::-webkit-scrollbar {
    width: 10px;
    background: white;
    height: 15px;
}

body.dark ::-webkit-scrollbar {
    width: 10px;
    background: #525252;
}

.sidebar_body ::-webkit-scrollbar {
    display: none;
}

body {
    scrollbar-color: gray white;
}

.content > div, .content > div > div {
    scrollbar-width: thin;
}

body.dark {
    scrollbar-color: gray #525252;
}

.sidebar_body {
    scrollbar-width: none;
}

.sidebar ::-webkit-scrollbar {
    display: none;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.3);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.5);
}

::-webkit-scrollbar-track {
    background: none;
}

body.dark ::-webkit-scrollbar-track {
    background: none;
}

body.dark .leaflet-popup.leaflet-zoom-animated {
    background-color: darkred;
}

body.dark .leaflet-popup-content-wrapper {
    background-color: #2a2a2a;
}

body.dark .leaflet-popup-tip {
    background-color: #2a2a2a;
}

a.darkmodetoggle i {
    cursor: pointer;
    transition: 0.5s;
    font-size: 20px;
}

body.dark a.darkmodetoggle {
    background-color: #2a2a2a;
}

.leaflet-touch .leaflet-bar a.darkmodetoggle {
    padding: 5px;
    height: 20px;
    width: 20px;
}

body.dark .nav .currentprovider {
    background-color: #202020;
}

body.dark .nav .currentprovider span.sp002 {
    background-color: #202020;
}

body.dark .nav .currentprovider span.sp004 {
    background-color: #202020;
}

body.dark .details {
    background-color: #202020;
}

body.dark a.darkmodetoggle i {
    color: yellow;
}

body.dark .memberhead {
    background-color: #2a2a2a;
}

body.dark .memberhead a {
    border-bottom: 2px solid #1c1c1c;
}

body.dark listdiagram line * {
    border-color: #494949;
}

body.dark body.dark .content {
    border-color: #494949;
}

body.dark listdiagram {
    border-color: #494949;
}

body.dark listdiagram line block {
    background-color: #4d4d4d;
}

body.dark .moderationpanel a {
    background-color: #2a2a2a;
}

body.dark div#userchange {
    background-color: #2a2a2a;
}

body.dark .moderationpanel {
    background-color: #574542;
}

body.dark .basestation_content {
    background-color: #2a2a2a;
    color: #e0e0e0;
}

body.dark .back {
    background-color: #2a2a2a;
    color: #f5f5f5;
}

body.dark .paragraph {
    border-bottom: 2px solid #224b60;
}

body.dark .logcont {
    color: #e0e0e0;
    background-color: #222222;
}

body.dark .logcont span.info {
    color: #8d8d8d;
}

body.dark .details .header {
    background-color: #2a2a2a;
}

body.dark .container {
    background-color: #343434;
}

body.dark #responses .message {
    background-color: #3b3b3b;
    color: #e0e0e0;
}

body.dark .message.administrator h4 {
    color: #ff0000;
}

body.dark .footer {
    background-color: #2a2a2a;
}

body.dark .response textarea {
    border-bottom: 1px solid #848484;
    color: #e0e0e0;
}

body.dark footer a {
    filter: saturate(0.5) brightness(0.6);
}

body.dark select#ticket_lang {
    background-color: #343434;
    color: #e0e0e0;
    border-bottom: 1px solid #5a5a5a;
}

body.dark .step a {
    filter: saturate(0.5) brightness(0.6);
}

body.dark .step select, body.dark .step input, body.dark .step textarea {
    background-color: #343434;
    color: #e0e0e0;
}

body.dark .column .annot.prov .landmenu {
    background-color: #2a2a2a;
    color: #c1c1c1;
}

body.dark .newpar {
    background-color: #2a2a2a;
}

body.dark div.logcont p {
    border-color: #3d3d3d;
}

body.dark .sidebar_element_wrapper .sidebar_element span.sidebar_link_text {
    color: #d5d5d5;
}

body.dark .sidebar_element_wrapper .sidebar_element {
    color: #d5d5d5;
}

@media screen and (max-width: 750px) {

    body.dark .sidebar {
        background-color: #2a2a2a;
    }

    body.dark .prof_top_001 {
        background-image: linear-gradient(150deg, #26303c 0%, #6b503e 100%);
    }
}