html, body, #map {
    height:100%;
    width:100%;
    padding:0px;
    margin:0px;
}

/* === buttons === */
button {
    font-size: large;
}


/* === Section Backward === */
.section-backward-viewbox {
    padding: 8px 8px;
    background: white;
    background: rgba(255,255,255,1);
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    border-radius: 5px;
}
.section-backward-content {
    margin: 0;
    font-size: 140%;
    text-align: left;
    color: #000000;
}

/* === Section Region Viewbox  === */
.section-regions-viewbox {
    padding: 8px 8px;
    background: white;
    background: rgba(255,255,255,1);
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    border-radius: 5px;
}
.section-regions-viewbox select {
    font-size: 160%;
    width: 30%
}
.section-regions-viewbox h3 {
    font-size: 140%;
    color: #0088cc;
}

/* ===  Section Regions List  === */
.section-regions-content {
    margin: 10px 0 0 0;
    font-size: 140%;
    text-align: left;
    color: #000000;

    min-width: 20vw;
    max-width: 45vw;
    max-height: 66vh;
    overflow-y: auto;
}
.section-regions-content ul {
    padding-left: 25px;
    padding-right: 10px;
}
.section-regions-content ul li {
    list-style-type: square;
}

/* === Section InfoBox === */
.section-infobox-wrapper {
    padding: 8px 8px;
    background: rgba(255,255,255,1);
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    border-radius: 5px;
}
.section-infobox-button-toggle-visibility {
    width: 100%;
}
.section-infobox-content {
    margin: 10px 5px 10px 5px;
    font-size: 140%;
    text-align: left;
    color: #000000;

    min-width: 45vw;
    max-height: 65vh;
    max-width: 45vw;
    overflow-y: auto;
}

.invisible {
    display: none;
}


/* === region-content childs styles === */
.region-content {
    margin: 5px;
    padding: 5px;
    font-family: 'Didact Gothic', sans-serif;
}

.region-content fieldset {
    margin: 0.5rem 0 0.5rem 0;
}

.region-content legend {
    font-weight: bold;
    font-size: large;
    padding-left: 5px;
    padding-right: 1em;
}

/*
    ☀ - star
    ⊕ - planet
    ☾ - moon
    ☄ - orbital station
    \0000a0 - unicode space
*/

.region-content fieldset.locations {
}

.region-content fieldset.locations ul {
    list-style: none;
}

.region-content fieldset.locations ul li:before {
    content: '⊕\0000a0';
}

.region-content fieldset.locations ul li > ul {
    list-style: none;
}

.region-content fieldset.locations ul li > ul li:before{
    content: '☾\0000a0';
}

.region-content fieldset.locations ul li > ul li > ul {
    list-style: none;
}

.region-content fieldset.locations ul li > ul li > ul li:before{
    content: '☄\0000a0';
}

.region-content fieldset.financial-content ul {

}
.region-content fieldset.financial-content ul li:before {
    content: '¤\0000a0';
}

code {
    background-color: #efffde;
    border: 1px solid #56a219;
    border-radius: 5px;
    padding: 0 5px 0 5px;
}