.loading-div {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

#app-navigation {
    padding: 50px 0 0 0 !important;
    margin: 0 !important;
}

#app-navigation .nav {
    padding: 0;
    margin: 0 0.4em;
}

#app-content-wrapper #app-content {
    height: 100%;
    padding: 0;
    margin: 0;
}

#inner-app-content {
    width: 100%;
    height: 100%;
    padding: 50px 0 0 0;
    margin: 0;
}

#main-window {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#map {
    width: 100%;
    height: 100%;
    margin: 0;
}

#graphs {
    width: 100%;
    height: 0;
    margin: 0;
    background-color: #e0e0e0;
}

#graph-map-btn {
    width: 10em;
    height: 2.1em;
    display: flex;
    position: relative;
    flex-direction: row;
    margin: 1em;
    border-radius: 20%;
}

#graph-btn {
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    font-size: 12pt;
    background: blue;
    padding: .1em;
    margin: 0;
}

#map-btn {
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    font-size: 12pt;
    background: #3939ec;
    padding: .1em;
    margin: 0;
}

#slider-bar {
    height: 100%;
    width: 0.5em;
    position: absolute;
    left: calc(100% - 0.5em);
    background: gray;
}

#slider-bar:hover {
    cursor: pointer;
    background-color: #e0e0e0;
}

option[aria-disabled=true] {
    opacity: .5;
}

label {
    margin: 0 0.5em;
}



ul {
    margin: 2.14em;
}

td {
    width: 100vw;
}

tr:hover {
    background-color: #f5f5f5;
}

.modal-body {
    overflow: auto;
}

.modal {
  overflow-y:auto;
}

.chkbx-group, .attr-checkbox {
    position: relative;
    border-radius: 0.36em;
    border: 0.14em solid #e6e6e6;
    background-color: #e6e6e6;
    padding: 0;
    transform: scale(1.3);
}

.chkbx-group:checked, .attr-checkbox:checked {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    top: 0.07em;
    padding: 0;
    position: relative;
    transform: scale(1.3);
}

.chkbx-group:hover, .attr-checkbox:hover {
    position: relative;
    border-radius: 0.36em;
    border: 0.14em solid #555;
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    padding: 0;
    transform: scale(1.3);
}

.chkbx-group:checked:hover, .attr-checkbox:checked:hover {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    top: 0.07em;
    padding: 0;
    position: relative;
    transform: scale(1.3);
}

.loading-gif {
    height: 50%;
}

.toggle.btn-xs {
    margin-left: 1em;
}

.panel {
    margin-bottom: 0;
}

/* check this */
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 0.07em;
    width: 70%;
    padding-right: 1%;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    padding-left: 0;
}

.toggle.ios, .toggle-on.ios, .toggle-off.ios {
    border-radius: 1.4em;
}

.toggle.ios .toggle-handle {
    border-radius: 1.4em;
}

[data-notify="container"] {
    width: 50%;
}

.hide-dimension {
    display: none;
}

/* flex classes */
.flex-row {
    display: flex;
    flex-direction: row;
    width: 100%;
}

.justify-center {
    display: flex;
    justify-content: center;
}

.justify-right {
    display: flex;
    justify-content: right;
}

.justify-left {
    display: flex;
    justify-content: left;
}

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

/* width classes */

.width-5-em {
    width: 5em;
}

.width-10-em {
    width: 10em;
}

.width-20-em {
    width: 20em;
}

.width-25-em {
    width: 25em;
}

.width-33min-3em {
    width: calc(33.33% - 3.33em);
}

.width-33min-5em {
    width: calc(33.33% - 5.83em);
}

.width-33min-8em {
    width: calc(33.33% - 8.33em);
}

.width-33percent {
    width: 33.33%;
}

.width-50percent {
    width: 50%;
}

.width-66percent {
    width: 66.6%;
}

.width-100percent {
    width: 100%;
}

.height-100percent {
    height: 100%;
}

.center-row {
    display: flex;
    align-items: center;
    justify-content: center;
}