html {
    background-color: lightblue;
}

body {
/*    background-color: #777;*/
    margin: auto;
    width: 1000px;
    padding: 0;
}

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

a:hover {
    text-decoration: underline;
}

a:visited {
    color: darkred;
}

#header {
    font-size: 2em;
    font-family: sans-serif;
    text-align: center;
    font-weight: bold;
}

#content {
    text-align: center;
}

#activeDateSpan {
    padding: 0px 10px;
    font-size: 1.1em;
    font-weight: bold;
}

#dateDiv {
    padding: 5px 0px;
}

#heatmapSelectDiv {
    padding: 5px 0px;
}

#buttonDiv {
    text-align: center;
    padding: 5px 0px;
}

#buttonDiv button {
    margin: 0px 3px;
}

#statusMain {
    position: relative;
}

.airportStatus {
    position: relative;
}

#texasCanvas, #texasCanvasBackground, #riskCanvas, .airportCanvas {
    position: absolute;
    top: 0;
    left: 0;
}

#texasCanvasBackground {
    z-index: 100;
}

#texasCanvas {
    z-index: 101;
}

#riskCanvas {
    z-index: 102;
}

.airportCanvas {
    z-index: 100;
}

#heatmapModalBackDiv, #heatmapModalForeDiv {
    position: fixed;
}

#heatmapModalBackDiv {
    z-index: 200;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    backdrop-filter: blur(6px);
}

#heatmapModalForeDiv {
    z-index: 201;
    background-color: lightgray;

    top: 25%;
    left: 50%;
    transform: translate(-50%, -25%);
    
    width: 640px;
    max-width: 100%;
    height: 240px;
    max-height: 100%;

    box-shadow: 0 0 4px 2px black;
    border-radius: 8px;
}

#modalFGHeaderDiv {
    margin: 0;
    padding: 3px;
    height: 30px;
    width: 100%;
}

#modalFGCanvasDiv {
    position: relative;
    margin: 0;
    height: 180px;
    width: 100%;
}

#modalFGFooterDiv {
    margin: 0;
    padding: 3px;
    height: 30px;
    width: 100%;
}

#heatmapModalBackgroundCanvas, #heatmapModalForegroundCanvas {
    position: absolute;
    top: 0;
    left: 0;
}

#heatmapModalBackgroundCanvas {
    z-index: 202;
}

#heatmapModalForegroundCanvas {
    z-index: 203;
}

.hidden {
    display: none;
}

.invisible {
    visibility: hidden;
}