html, body, #containerDiv {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Source Sans Pro';
}

#mapDiv { 
    height: 100%;
    width: 100%;
}
#containerDiv {
    top: 50px;
    position: fixed;
    /* z-index:0; margin:0; padding:0;  */
}
#mapDiv {
    top: 20px;
}
#loader{
    z-index: 1;
    top: 50vh;
    left: 50vw;
}

.esri-view-height-medium .esri-expand .esri-widget--panel, .esri-view-height-medium .esri-expand .esri-widget--panel-height-only, .esri-view-height-medium .esri-ui-corner .esri-component.esri-widget--panel, .esri-view-height-medium .esri-ui-corner .esri-component.esri-widget--panel-height-only {
    max-height: 600px;
}

@media only screen and (max-width: 576px) {    
    #mapDiv {
        top: 0px;
    }
    .esri-component, .esri-basemap-gallery, .esri-widget, .esri-widget--panel-height-only{
        max-height: 180px !important;
    }
}