html, body {
    background-color: #fff;
    color: #fff;
    font-family: 'Source Code Pro', sans-serif;
    font-weight: 200;
    height: 100vh;
    margin: 0;
}
h1,h2,h3,h4,h5,h6 { font-family: 'Montserrat'; font-weight: 600; margin:1em 0;}

#content h3 { font-family: 'Source Code Pro'; }

.full-height {
    height: 100vh;
}

.flex-center {
    align-items: center;
    display: flex;
    justify-content: center;
}
#admin-menu { background-color: #ff9800; }
#header { background-color: #F44336; overflow: hidden; padding: 8px 0;}
#header h1 { margin: 0; }

ul.navigation { margin: 4px 0 0 0; padding: 0; list-style-type: none; }
ul.navigation li { float: left; }
ul.navigation li a { color:  white; margin-right: 1.25em; font-size: 1.25em; transition: background-color 1s; padding: 4px 6px;}
ul.navigation li a:hover { text-decoration: none; background-color: #ff8a8a; }

#content { color: #333; }

.download .suggested { padding: 4px 10px; border-radius: 4px; background-color: #ecb715; cursor: pointer; float:left; color: white; margin-top: 4px; margin-right: 11px; border:none; }
.download .suggested:nth-child(1) { background-color:  #f44336; }
.download .suggested:nth-child(3) { background-color:  #4caf50; }
.download .default { 
    background-color:  #cccccc; 
     }
.download {
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 4px 4px #eaeaea;
    padding: 0 1em 3em 1em;
    font-size: .9em;
}
.spacer { padding: 1em 0;clear: both; }
input.whatever {
    float: left;
    margin-top: 8px;
    /* border-radius: 4px; */
    border: none;
    border-bottom: 1px solid #ccc;
    margin-right: 8px;
}

.download img { width: 100%; height: auto; }

.overlay { 
    background: #FF00FF;
    background-color: transparent;
}