html { box-sizing: border-box }*, *:before, *:after { box-sizing:inherit; }
body, html {
    background-color: #f8f6f4;
    height: 100%;
    font-family: Verdana, sans-serif;
    font-size: 15px;
    line-height: 1.5;
    margin: 0;
}
h1 { font-size: 36px; }
h2 { font-size: 30px; }
h3 { font-size: 24px; }
h4 { font-size: 20px; }
h5 { font-size: 18px; }
h6 { font-size: 16px; }
p, li, td, a { color:#757575; }
img { border-style: none; }
a:active, a:hover { outline-width: 0; }
table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    display: table
}
th { background-color: #ddd; }
th, td {
    padding: 2px 8px;
    text-align: left;
}
.bgimg {
    background-position: center;
    background-size: cover;
    background-image: url("background.jpg");
    background-color: #f8f6f4;
    min-height: 60%;
}
.heading {
    background-color: #000;
    color: #fff;
    display: inline-block;
    letter-spacing: 4px;
    padding-left: 8px;
    padding-right: 8px;
    text-align: center;
}
.hidden {
    display: none;
}
.quote-color {
    background-color: #ddeeff;
}
.selected-color {
    background-color: #616161;
    color: white !important;
}
.dropshadow {
    box-shadow: 5px 5px 5px #ccc,0 2px 10px #ccc;
}
.w3-top,.w3-bottom{position:fixed;width:100%;z-index:1}.w3-top{top:0}.w3-bottom{bottom:0}
.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important}
.w3-block{display:block;width:100%}
.w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}
.w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before,
.w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both}
.w3-display-container{position:relative}
.w3-display-container:hover .w3-display-hover{display:block}.w3-display-container:hover span.w3-display-hover{display:inline-block}.w3-display-hover{display:none}
.w3-display-bottomleft{position:absolute;left:0;bottom:0}.w3-display-bottomright{position:absolute;right:0;bottom:0}
.w3-center{text-align:center!important}
.w3-padding{padding:8px 16px!important}
.w3-padding-small{padding:4px 8px!important}
.w3-padding-large{padding:12px 24px!important}
.w3-padding-16{padding-top:16px!important;padding-bottom:16px!important}
.w3-padding-48{padding-top:48px!important;padding-bottom:48px!important}
.w3-padding-64{padding-top:64px!important;padding-bottom:64px!important}
.w3-display-middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}
.w3-small{font-size:12px!important}
.w3-large{font-size:18px!important}
.w3-content{max-width:980px;margin:auto}.w3-rest{overflow:hidden}
.w3-leftbar{border-left:6px solid #ccc!important}.w3-rightbar{border-right:6px solid #ccc!important}
.w3-button{border:none;display:inline-block;outline:0;padding:16px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
.w3-button{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.w3-button:disabled{cursor:not-allowed;opacity:0.3}
.button-green {background-color:#A9DFBF; color:#000}
.w3-button:hover{color:#000!important;background-color:#ccc!important}
.w3-input {
    border: none;
    border-bottom: 1px solid #ccc;
    display: block;
    font-size: 18px;
    padding: 8px;
    width: 100%;
}
.w3-border{border:1px solid #ccc!important}

@media screen and (prefers-color-scheme: dark) {
    body, html {
        background-color: #181818;
        color: white;
    }
    p, li, td, a { color: #aaa; }
    th { background-color: #888; }
    .heading {
        background-color: #fff;
        color: #000;
    }
    .quote-color { background-color: #345; }
    .w3-input { background-color: #666 !important; }
    .button-green {background-color:#196F3D; color:#FFF}
    .dropshadow {
        box-shadow: 5px 5px 5px #666,0 2px 10px #666;
    }
}