body {
    overflow: hidden;
}

.card {
    z-index: 999;
}

.card-shadow {
    box-shadow: 0 2px 4px rgb(0 0 0 / 20%), 0 -1px 0px rgb(0 0 0 / 2%);
}

.br-8 {
    border-radius: 8px;
}

#sidebar-container {
    top: 10px;
    left: 10px;
    min-width: 252px;
}

#details-container {
    right: -10%;
    bottom: -1000px;
    width: 25%;
    height: 50vh;
    z-index: 9999;
    transform: translateX(-50%);
    /* border:none !important;
    background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.47) 9%, rgba(255,255,255,1) 25%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.47) 9%,rgba(255,255,255,1) 25%,rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.47) 9%,rgba(255,255,255,1) 25%,rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ) !important; */

}

/*
#card-title {
    top: 10px;
    left: 10px;
    min-width: 252px;
}
*/

#title-project {
    border-bottom: 1px solid #DADCE0;
    color: #0000008a;
}

#title-project h4 {
    font-size: 1.1em;
}

#project-credits {
    color: #0000008a;
    position: absolute;
    left: 10px;
    bottom: 10px;
    z-index: 9999999999999999999999999999;
}

#project-credits h6 {
    font-size: 0.9em;
}

#btn-details-visibility {
    height: 30px;
    width: 60px;
    background-color: #ffffffb3;
    box-shadow: 0 1px 6px rgb(60 64 67 / 28%);
    position: absolute;
    left: 50%;
    top: -30px;
    transform: translateX(-50%);
    border: 1px solid #DADCE0;
    outline: none;
    z-index: 2;
}

#btn-details-visibility:hover {
    background-color: #DADCE0;
}

#layer-chooser {
    font-size: 0.8em;
}


#more_legend {
    height: 0px;
    transition: height 1s ease;
    overflow: hidden;
}

#lsz-status-indicator {
    height: 15vh;
}

#lsz_status_text {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#toast-container {
    position: fixed;
    bottom: 10px;
    left: 40%;
    transform: translate(0%, -50%);
    z-index: 99999;
}

.toast {
    visibility: hidden;
    max-width: 30px;
    height: 50px;
    /*margin-left: -125px;*/
    /*    margin: auto;*/
    background-color: #333;
    color: #fff;
    text-align: center;
    border-radius: 2px;
    position: fixed;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 30px;
    font-size: 17px;
    white-space: nowrap;
    overflow: hidden;
}

.toast .toast-img {
    width: 50px;
    height: 50px;
    float: left;
    padding-top: 16px;
    padding-bottom: 16px;
    box-sizing: border-box;
    background-color: #111;
    color: #fff;
}

.toast .desc {
    color: #fff;
    padding: 16px;
    font-size: 0.8em;
    overflow: hidden;
    white-space: nowrap;
}

.toast.show {
    visibility: visible;
    -webkit-animation: fadein 0.5s, expand 0.5s 0.5s, stay 3s 1s, shrink 0.5s 2s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, expand 0.5s 0.5s, stay 3s 1s, shrink 0.5s 4s, fadeout 0.5s 4.5s;
}

@-webkit-keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 30px;
        opacity: 1;
    }
}

@keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 30px;
        opacity: 1;
    }
}

@-webkit-keyframes expand {
    from {
        min-width: 50px
    }

    to {
        min-width: 500px
    }
}

@keyframes expand {
    from {
        min-width: 50px
    }

    to {
        min-width: 500px
    }
}

@-webkit-keyframes stay {
    from {
        min-width: 500px
    }

    to {
        min-width: 500px
    }
}

@keyframes stay {
    from {
        min-width: 500px
    }

    to {
        min-width: 500px
    }
}

@-webkit-keyframes shrink {
    from {
        min-width: 500px;
    }

    to {
        min-width: 50px;
    }
}

@keyframes shrink {
    from {
        min-width: 500px;
    }

    to {
        min-width: 50px;
    }
}

@-webkit-keyframes fadeout {
    from {
        bottom: 30px;
        opacity: 1;
    }

    to {
        bottom: 60px;
        opacity: 0;
    }
}

@keyframes fadeout {
    from {
        bottom: 30px;
        opacity: 1;
    }

    to {
        bottom: 60px;
        opacity: 0;
    }
}

#details table {
    width: 100%;
}

#details table td {
    color: #000;
    font-size: 0.8em;
    width: 25%;
}

#details-txt-district {
    font-size: 1.2em !important;
    font-weight: bold;
}

#details-txt-taluk,
#details-txt-block,
#details-txt-corporation,
#details-txt-municipality,
#details-txt-panchayath,
#details-txt-latitutde,
#details-txt-longitude {
    font-size: 1.1em !important;
    font-weight: bold;
}

#btn-show-recommendation {
    display: inline-block;
    width: fit-content;
    border-radius: 12px;
    background-color: #ffffffb3;
    box-shadow: 0 1px 6px rgb(60 64 67 / 28%);
    border: 1px solid #DADCE0;
    outline: none;
    z-index: 2;
    font-size: 0.9em;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

#btn-show-recommendation:hover {
    background-color: #DADCE0;
}

.checkbox_label:hover,
.checkbox_layers:hover,
.radio_label:hover,
.radio_layers:hover {
    cursor: pointer;
}

.radio_container {
    padding-top: 15px;
    padding-bottom: 15px;
}



.legendColorContainer {
    position: absolute;
    right: 3px;
    top: 5px;
}

.legendColor {
    width: 15px;
    height: 15px;
    border: 2px solid #a0a0a08a;
    /*            opacity: 0.5;*/
    margin: 2px;
}

.bg-red-o {
    background-color: #ff00003b !important;
}

.bg-green-o {
    background-color: #1b5e203b !important;
}

.bg-yellow-o {
    background-color: #ffff003b !important;
}

#chartdiv {
    width: 100%;
    height: 200px;
}

#soil_moisture_legend_bg {
    height: 20px;
    width: 75%;
    margin: 0 auto;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d7191c+10,e85b3a+20,f99e59+30,fec980+40,c7e9ad+50,9dd3a7+60,64abb0+70,2b83ba+80,207cca+90 */
    background: rgb(215, 25, 28);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(215, 25, 28, 1) 10%, rgba(232, 91, 58, 1) 20%, rgba(249, 158, 89, 1) 30%, rgba(254, 201, 128, 1) 40%, rgba(199, 233, 173, 1) 50%, rgba(157, 211, 167, 1) 60%, rgba(100, 171, 176, 1) 70%, rgba(43, 131, 186, 1) 80%, rgba(32, 124, 202, 1) 90%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(215, 25, 28, 1) 10%, rgba(232, 91, 58, 1) 20%, rgba(249, 158, 89, 1) 30%, rgba(254, 201, 128, 1) 40%, rgba(199, 233, 173, 1) 50%, rgba(157, 211, 167, 1) 60%, rgba(100, 171, 176, 1) 70%, rgba(43, 131, 186, 1) 80%, rgba(32, 124, 202, 1) 90%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(215, 25, 28, 1) 10%, rgba(232, 91, 58, 1) 20%, rgba(249, 158, 89, 1) 30%, rgba(254, 201, 128, 1) 40%, rgba(199, 233, 173, 1) 50%, rgba(157, 211, 167, 1) 60%, rgba(100, 171, 176, 1) 70%, rgba(43, 131, 186, 1) 80%, rgba(32, 124, 202, 1) 90%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d7191c', endColorstr='#207cca', GradientType=1);
    /* IE6-9 */

}

#dem_legend_bg {
    height: 20px;
    width: 75%;
    margin: 0 auto;
    border: 1px solid #ccc;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1a9641+0,1a9641+5,37a449+10,55b252+15,72c15b+20,90cf63+25,abdb6e+30,bee381+35,d0eb93+40,e3f3a5+45,f6fbb7+50,fff7b6+55,ffe6a2+60,fed58e+65,fec47a+70,feb266+75,f79756+80,ef7747+85,e75839+90,df382a+95,d7191c+100 */
    background: rgb(26, 150, 65);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(26, 150, 65, 1) 0%, rgba(26, 150, 65, 1) 5%, rgba(55, 164, 73, 1) 10%, rgba(85, 178, 82, 1) 15%, rgba(114, 193, 91, 1) 20%, rgba(144, 207, 99, 1) 25%, rgba(171, 219, 110, 1) 30%, rgba(190, 227, 129, 1) 35%, rgba(208, 235, 147, 1) 40%, rgba(227, 243, 165, 1) 45%, rgba(246, 251, 183, 1) 50%, rgba(255, 247, 182, 1) 55%, rgba(255, 230, 162, 1) 60%, rgba(254, 213, 142, 1) 65%, rgba(254, 196, 122, 1) 70%, rgba(254, 178, 102, 1) 75%, rgba(247, 151, 86, 1) 80%, rgba(239, 119, 71, 1) 85%, rgba(231, 88, 57, 1) 90%, rgba(223, 56, 42, 1) 95%, rgba(215, 25, 28, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(26, 150, 65, 1) 0%, rgba(26, 150, 65, 1) 5%, rgba(55, 164, 73, 1) 10%, rgba(85, 178, 82, 1) 15%, rgba(114, 193, 91, 1) 20%, rgba(144, 207, 99, 1) 25%, rgba(171, 219, 110, 1) 30%, rgba(190, 227, 129, 1) 35%, rgba(208, 235, 147, 1) 40%, rgba(227, 243, 165, 1) 45%, rgba(246, 251, 183, 1) 50%, rgba(255, 247, 182, 1) 55%, rgba(255, 230, 162, 1) 60%, rgba(254, 213, 142, 1) 65%, rgba(254, 196, 122, 1) 70%, rgba(254, 178, 102, 1) 75%, rgba(247, 151, 86, 1) 80%, rgba(239, 119, 71, 1) 85%, rgba(231, 88, 57, 1) 90%, rgba(223, 56, 42, 1) 95%, rgba(215, 25, 28, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(26, 150, 65, 1) 0%, rgba(26, 150, 65, 1) 5%, rgba(55, 164, 73, 1) 10%, rgba(85, 178, 82, 1) 15%, rgba(114, 193, 91, 1) 20%, rgba(144, 207, 99, 1) 25%, rgba(171, 219, 110, 1) 30%, rgba(190, 227, 129, 1) 35%, rgba(208, 235, 147, 1) 40%, rgba(227, 243, 165, 1) 45%, rgba(246, 251, 183, 1) 50%, rgba(255, 247, 182, 1) 55%, rgba(255, 230, 162, 1) 60%, rgba(254, 213, 142, 1) 65%, rgba(254, 196, 122, 1) 70%, rgba(254, 178, 102, 1) 75%, rgba(247, 151, 86, 1) 80%, rgba(239, 119, 71, 1) 85%, rgba(231, 88, 57, 1) 90%, rgba(223, 56, 42, 1) 95%, rgba(215, 25, 28, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1a9641', endColorstr='#d7191c', GradientType=1);
    /* IE6-9 */


}

#contour_legend_bg {
    height: 20px;
    width: 75%;
    margin: 0 auto;
    border: 1px solid #ccc;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,fafafa+20,bdbdbd+40,808080+60,424242+80,050505+100 */
    background: rgb(255, 255, 255);
    /* Old browsers */
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 1) 0%, rgba(250, 250, 250, 1) 20%, rgba(189, 189, 189, 1) 40%, rgba(128, 128, 128, 1) 60%, rgba(66, 66, 66, 1) 80%, rgba(5, 5, 5, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 1) 0%, rgba(250, 250, 250, 1) 20%, rgba(189, 189, 189, 1) 40%, rgba(128, 128, 128, 1) 60%, rgba(66, 66, 66, 1) 80%, rgba(5, 5, 5, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(250, 250, 250, 1) 20%, rgba(189, 189, 189, 1) 40%, rgba(128, 128, 128, 1) 60%, rgba(66, 66, 66, 1) 80%, rgba(5, 5, 5, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#050505', GradientType=1);
    /* IE6-9 */

}

#legend-text {
    position: relative;
    height: 14px;
    width: 75%;
    margin: 0 auto;
}

#dem-legend-text {
    position: relative;
    height: 14px;
    width: 75%;
    margin: 0 auto;
}

#contour-legend-text {
    position: relative;
    height: 14px;
    width: 75%;
    margin: 0 auto;
}

.range-input {
    position: absolute;
    /* top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); */
    padding: 10px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

.range-input input {
    -webkit-appearance: none;
    width: 200px;
    height: 2px;
    background-color: #4471ef;
    outline: none;
}

.range-input input::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    background-color: #eee;
    border: 2px solid #4471ef;
    border-radius: 50%;
    outline: none;
}

.range-input input::-webkit-slider-thumb:hover {
    background-color: #4471ef;
}

.range-input .value {
    color: #4471ef;
    text-align: center;
    font-weight: 600;
    line-height: 40px;
    height: 40px;
    overflow: hidden;
}

.range-input .value div {
    transition: all 300ms ease-in-out;
}



#month-slider-container main {
    width: 100%;
    margin: 0 auto;
    margin-top: 15px;
    ;
}


#month-slider-container .min {
    padding-top: 5px;
    padding-left: 10px;
    color: #6f6e70;
}

#month-slider-container .max {
    padding-top: 5px;
    padding-right: 10px;
    color: #6f6e70;
}

#month-slider-container #helper {
    padding-top: 40px;
    color: #46b7d5;
    font-style: italic;
}

#month-slider-container output {
    display: inline-block;
    font-size: 2em;
}

/* original css */
#month-slider-container .rangeslider,
#month-slider-container .rangeslider__fill {
    display: block;
    -moz-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

#month-slider-container .rangeslider {
    background: #e6e6e6;
    position: relative;
}

#month-slider-container .rangeslider--horizontal {
    height: 10px;
    width: 100%;
}

#month-slider-container .rangeslider--vertical {
    width: 20px;
    min-height: 150px;
    max-height: 100%;
}

#month-slider-container .rangeslider--disabled {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    opacity: 0.4;
}

#month-slider-container .rangeslider__fill {
    background: -webkit-linear-gradient(left, #abe0ed, #46b7d5);
    background: -o-linear-gradient(right, #abe0ed, #46b7d5);
    background: -moz-linear-gradient(right, #abe0ed, #46b7d5);
    background: linear-gradient(to right, #abe0ed, #46b7d5);
    position: absolute;
}

#month-slider-container .rangeslider--horizontal .rangeslider__fill {
    top: 0;
    height: 100%;
}

#month-slider-container #month-slider-container .rangeslider--vertical .rangeslider__fill {
    bottom: 0;
    width: 100%;
}

#month-slider-container .rangeslider__handle {
    background: white;
    color: #0085b2;
    /* font-weight: bold; */
    font-size: 14px;
    border: 1px solid #ccc;
    cursor: pointer;
    min-width: 120px;
    display: inline-block;
    margin: 5px 0px;
    height: 20px;
    line-height: 18px;
    text-align: center;
    position: absolute;
    /* background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjAiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g"); */
    /* background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, rgba(0, 0, 0, 0.1)));
  background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.1));
  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.1));
  background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.1)); */
    -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    -moz-border-radius: 22px;
    -webkit-border-radius: 22px;
    border-radius: 22px;
}

#month-slider-container .rangeslider__handle:after {
    font-family: FontAwesome;
    content: "";
    color: #cccccc;
    display: inline-block;
    width: auto;
    height: auto;
    margin: auto;
    position: initial;
    background: none;
}

#month-slider-container .rangeslider__handle:before {
    font-family: FontAwesome;
    content: "";
    color: #cccccc;
}

#month-slider-container .rangeslider__handle:active {
    background-img: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjEiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==");
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, rgba(0, 0, 0, 0.12)));
    background-image: -moz-linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.12));
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.12));
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.12));
}

#month-slider-container .rangeslider--horizontal .rangeslider__handle {
    top: -10px;
    touch-action: pan-y;
    -ms-touch-action: pan-y;
}

#month-slider-container .rangeslider--vertical .rangeslider__handle {
    left: -10px;
    touch-action: pan-x;
    -ms-touch-action: pan-x;
}

#month-slider-container input[type=range]:focus+.rangeslider .rangeslider__handle {
    -moz-box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);
    -webkit-box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);
    box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);
}

.center {
    text-align-last: center;
    -moz-text-align-last: center;
}

/**
Loader Styles

**/


.flexbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.flexbox>div {
    width: 150px;
    height: 150px;
    -webkit-box-flex: 0;
    /* -ms-flex: 0 0 25%; */
    /* flex: 0 0 25%; */
    border: 1px solid rgba(255, 255, 255, 0.1);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    flex-direction: column;
}

#infowindow_content th {
    font-size: 0.9em;
    font-family: monospace;
}



/* SPINNER 13 */

.ml-loader {
    position: relative;
    width: 70px;
    height: 70px;
}

.ml-loader div {
    -webkit-transform-origin: 32px 32px;
    -ms-transform-origin: 32px 32px;
    transform-origin: 32px 32px;
    -webkit-animation: 1.2s opaque ease-in-out infinite both;
    animation: 1.2s opaque ease-in-out infinite both;
}

.ml-loader div::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 30px;
    width: 5px;
    height: 18px;
    border-radius: 10px;
    background-color: #f44336;
}

.ml-loader div:nth-child(1) {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
}

.ml-loader div:nth-child(2) {
    -webkit-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    transform: rotate(30deg);
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
}

.ml-loader div:nth-child(3) {
    -webkit-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}

.ml-loader div:nth-child(4) {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}

.ml-loader div:nth-child(5) {
    -webkit-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    transform: rotate(120deg);
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
}

.ml-loader div:nth-child(6) {
    -webkit-transform: rotate(150deg);
    -ms-transform: rotate(150deg);
    transform: rotate(150deg);
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

.ml-loader div:nth-child(7) {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}

.ml-loader div:nth-child(8) {
    -webkit-transform: rotate(210deg);
    -ms-transform: rotate(210deg);
    transform: rotate(210deg);
    -webkit-animation-delay: 0.7s;
    animation-delay: 0.7s;
}

.ml-loader div:nth-child(9) {
    -webkit-transform: rotate(240deg);
    -ms-transform: rotate(240deg);
    transform: rotate(240deg);
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
}

.ml-loader div:nth-child(10) {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;
}

.ml-loader div:nth-child(11) {
    -webkit-transform: rotate(300deg);
    -ms-transform: rotate(300deg);
    transform: rotate(300deg);
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.ml-loader div:nth-child(12) {
    -webkit-transform: rotate(330deg);
    -ms-transform: rotate(330deg);
    transform: rotate(330deg);
    -webkit-animation-delay: 1.1s;
    animation-delay: 1.1s;
}

.ml-loader div:nth-child(13) {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
}

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

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


@-webkit-keyframes opaque {
    0% {
        opacity: 0.1;
    }

    40% {
        opacity: 1;
    }

    80% {
        opacity: 0.1;
    }

    100% {
        opacity: 0.1;
    }
}


@media only screen and (max-width: 968px) {
    .flexbox>div {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333333%;
        flex: 0 0 33.3333333%;
    }
}

@media only screen and (max-width: 768px) {
    .flexbox>div {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
    }
}

@media only screen and (max-width: 568px) {
    .flexbox>div {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
    }
}


table.info_table {
    border: 0px solid #000000;
    background-color: #eeeeee;
    width: 100%;
    width: 100%;
    text-align: center;
}

table.info_table tr {
    border: 1px solid #949494;
    padding: 0px 0px;
}


.leaflet-popup-content {
    margin: 5px 5px;
}