body{
    margin: 0;
    padding: 0;
    background-image: linear-gradient(135deg, #9F2B00,#202020 50%);
    color: #ffffff;
    font-family: arial,sans-serif;
    font-size: 100%;
}
div {position:relative; box-sizing:border-box;}

#head{
    display: inline-block;
    width: 100%; height:3em;
    padding: 0 0.5em 0.2em 0.5em;
    background-image: linear-gradient(180deg, #D37506, #000000 50%);
    text-align: center;
    border-style: solid;
    border-color: #ffffff;
    border-width: 0 0 0.05em 0;
}
h1{margin:0.1em 0;font-size:2em; color:#D3D3CB; }
h2{margin:0.5em 0;font-size:1.125em;font-weight:normal;}
p.mac{margin:0.1em 0 0.1em 0;font-size:0.75em;}
span.inp{display:inline-block;margin:0.2em 0 0 0;padding:0.2em;background-color:#404040;}
span.mmnu{display:inline-block;margin:0.2em;border:0.05em solid #404040;padding:0.1em;background-color:#303030;color:#e0c0ff}
span.mmnusel{background-color:#404040;}
span.mmnutxt{display:inline-block;width:8em;padding:0.4em;overflow:hidden;vertical-align:middle;color:#e0c0ff;font-weight:bold;}
span.colour{display:inline-block;width:5em;height:1em;margin:0.2em;border:0.05em solid #ffffff;vertical-align:middle;}
span.time{display:inline-block;width:5em;margin:0.2em;vertical-align:middle;color:#ffffff}
button{display:inline-block;margin:0.2em;border:0.05em solid #ffffff;border-radius:0.5em;padding:0.3em 0.6em;background-color:#808080;color:#e0e0e0;font-size:0.75em;text-decoration:none;vertical-align:middle;}

.inpcntr{background-color:#000000;border:0.1em solid #ffffff;display:inline-block;width:10em;position:relative;}
.inpcntr>label{display:block;text-align:center;}
.inpcntr>input{display:none;}
.inpcntr>input+.inpedit{position:absolute;left:-0.1em;display:none;border:0.1em solid #ffffff;}
.inpcntr>input:checked+.inpedit{display:inline-block;}
.inpedit>label{display:inline-block;width:9.5em;text-align:right;}



/* default layout */
#navCtrlBtn{display:none;}
#navCtrl{display:none;}
#nav{padding:0.5em; border:0 solid #ffffff; display:inline-block; width:25%; vertical-align:top; background-color:rgba(0,0,0,0.25); }
#page{padding:0.5em; border:0 solid #ffffff; display:inline-block; width:75%; vertical-align:top; }

/* Narrow layout */
@media only screen and (max-width: 600px) {
	#navCtrlBtn{display:inline-block; position:absolute; right:1em; top:1em; }
	#nav{position:absolute; width:100%; display:none; left:0; top:3em; z-index:1; background-color:rgba(0,0,0,0.8); padding-bottom:5em; }
	#navCtrl:checked~#nav{ display:inline-block; }
	#page{width:100%;}
}