.map-container
{
    display: flex;
    align-items: center;
}

.map
{
    width: 100%;
}

.map-container > .map + .map-slider
{
    max-width: 100%;
    position: relative;
    padding-left: 10px;
}

.map-container > .map-slider .range
{
    margin: 0 -20px;
    margin-top: 90%;
}

.map-container > .map-slider > .range-value
{
    top: 0;
    left: 0;
    position: static;
}

.map-container > .map-slider > .field-label
{
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 7px;
}

.map-container > .map-slider > .range-value span
{
    width: 90px;
    height: 40px;
    line-height: 40px;
    font-size: 18px;
    position: static;
    transform: none;
}

.map-container > .map-slider > .range-value span:before
{
    display: none;
}

.map-container > .map-slider > input[type="range"],
.map-container > .map-slider > .range > input[type="range"]
{
    -webkit-transform:rotate(270deg);
       -moz-transform:rotate(270deg);
         -o-transform:rotate(270deg);
            transform:rotate(270deg);
}

.map-icon-cross {
    display: inline-block;
    width: 40px;
    height: 40px;
    position: relative;
    cursor: pointer;
}
.map-icon-cross span::before,
.map-icon-cross span::after {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 84%;
    height: 16%;
    margin: -8% 0 0 -42%;
    background: #E91E63;
}
.map-icon-cross-mini {
    width: 18px;
    height: 10px; 
}

.map-icon-cross span::before {
    transform: rotate(-45deg);
}
.map-icon-cross span::after {
    transform: rotate(45deg);
}

.map-icon-cross-100 span::before,
.map-icon-cross-100 span::after {
    background: #E91E63;
}

.map-icon-cross-200 span::before,
.map-icon-cross-200 span::after {
    background: rgb(233, 185, 30);
}

.map-icon-cross-300 span::before,
.map-icon-cross-300 span::after {
    background: rgb(30, 169, 233);
}

.map-icon-cross-400 span::before,
.map-icon-cross-400 span::after {
    background: rgb(135, 30, 233);
}

.map-icon-cross-500 span::before,
.map-icon-cross-500 span::after {
    background: rgb(189, 233, 30);
}

.map-icon-cross-600 span::before,
.map-icon-cross-600 span::after {
    background: rgb(184, 176, 165);
}


.map-icon-circle {
    display: inline-block;
    width: 40px;
    height: 40px;
    font-size: 40px;
    position: relative;
    cursor: pointer;
}
.map-icon-circle-mini {
    width: 18px;
    height: 10px; 
}
.map-icon-circle span {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    width: 84%;
    height: 84%;
    margin: -42% 0 0 -42%;
    border-radius: 50%;
    background: rgb(137, 186, 0);
    border: .16em solid rgb(137, 186, 0);
}

.map-icon-circle-1 span {
    background: rgb(137, 186, 0);
    border: .16em solid rgb(137, 186, 0);
}
.map-icon-circle-0 span {
    background: rgb(229, 143, 5);
    border: .16em solid rgb(229, 143, 5);
}


.map-icon-v {
    display: inline-block;
    width: 40px;
    height: 40px;
    font-size: 40px;
    position: relative;
    cursor: pointer;
}
.map-icon-v-mini {
    width: 18px;
    height: 18px;  
}
.map-icon-v span {
    position: absolute;
    display: block;
    top: 0;
    left: 12.5%;
    width: 80%;
    height: 80%;
    border-right: 0.1em solid #E91E63;
    border-bottom: 0.1em solid #E91E63;
    transform: rotate(-315deg);
}
.map-icon-v-3 span,
.map-icon-v-blue span {
    border-right-color: #1E63E9;
    border-bottom-color: #1E63E9;
}
.map-icon-v-12 span {
    border-right-color: #4EE963;
    border-bottom-color: #4EE963;
}
.map-icon-v-60 span {
    border-right-color: #859943;
    border-bottom-color: #859943; 
}
.map-icon-v-0 span {
    border-right-color: #1E2903;
    border-bottom-color: #1E2903;
}

.map-icon-trace {
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 15px 0 15px; 
    border-color: #5796d9 transparent transparent transparent;
}
.map-icon-trace-mini {
    border-width: 10px 8px 0 8px; 
}

.map-icon-trace-95 {
    border-color: #5796d9 transparent transparent transparent;
}
.map-icon-trace-90 {
    border-color: #9bd154 transparent transparent transparent;
}
.map-icon-trace-80 {
    border-color: #cdd154 transparent transparent transparent;
}
.map-icon-trace-70 {
    border-color: #d18e54 transparent transparent transparent;
}
.map-icon-trace-40 {
    border-color: #f5f598 transparent transparent transparent;
}

.map-icon-trace span {
    position: absolute;
    display: block;
    top: -22px;
    font-size: 11px;
    left: -15px;
    text-align: center;
    width: 30px; 
}


.leaflet-popup form
{
    min-width: 280px; 
    max-width: 100%;
}

.leaflet-popup .btn
{
    color: #fff;
}