/* Anchor */
a {
    border-bottom:   0.3vh dotted gray;
    color:           black;
    text-decoration: none;
}

/* Aside */
aside {
    float:       right;
    font-size:   1.0vw;
    line-height: 4vh;
    margin:      0.5vh 0;
    width:       25%;
}

/* Body */
body {
    width:  100%;
    height: 100%;
    margin: 0;
}

/* Content */
.content {
    margin: auto;
    width:  70%;
}

/* Command */
.command {    
    background-color: rgb(224, 224, 224);
    color:            black;
    font-family:      monospace;
    font-size:        1vw;
}

/* Footer */
.footer {
    background-color: rgb(32, 32, 32);
    clear:            both;
    display:          block;
    text-align:       center;
    width:            100%;
}

.footer ul {
    margin:  0;
    padding: 0;
}

.footer ul li {
    display: inline-block;
}

.footer > ul > li > a {
    border-bottom: none;
    color:         rgb(255, 255, 255);
    display:       block;
    padding:       2vh 1vw 2vh 1vw;
}

/* Headers */
h1 {
    font-size: 2.0vw;
    margin:    5vh 0 0vh 0;
}

h2 {
    font-size: 1.8vw;
    margin:    5vh 0 0vh 0;
}

h3 {
    font-size: 1.6vw;
    margin:    5vh 0 0vh 0;
}

h4 {
    font-size: 1.4vw;
    margin:    5vh 0 0vh 0;
}

h5 {
    font-size: 1.2vw;
    margin:    5vh 0 0vh 0;
}

h6 {
    font-size: 1.0vw;
    margin:    5vh 0 0vh 0;
}

/* Image */
.image {
    margin: 0.1vh 0.1vw;
}

.image.center {
    display: block;
    margin:  0 auto;
}

.image.left {
    float:  left;
    margin: 1vh 1vw 1vh 0;
}

/* main */
section#main {
    float:       left;
    font-size:   1.0vw;
    margin:      0;
    line-height: 4vh;
    width:       65%;
}

/* navigation */
nav {
    background-color: rgb(32, 32, 32);
    display:          block;
    font-size:        1.6vw;
    font-weight:      900;
    text-align:       center;
    vertical-align:   middle;
    width:            100%;
}

nav ul {
    margin:  0;
    padding: 0;
}

nav ul li {
    display: inline-block;
}

nav > ul > li > a {
    border-bottom: none;
    color:         rgb(255, 255, 255);
    display:       block;
    line-height:   10vh;
    padding:       0 2vw;
}

nav > ul > li:hover {
    background-color: rgb(64, 64, 64);
}

nav > ul > li:hover > a {
    color: rgb(255, 255, 255);
}

/* path */
.path {
    background-color: rgb(224, 224, 224);
    color:            black;
    font-family:      monospace;
    font-size:        1vw;
}


/* Radio buttons */
.radio input[type="radio"] {
    display: none; 
}

.radio label {
    background-color: rgb(192, 192, 192);
    display:          inline-block;
    font-size:        0.8vw;
    line-height:      3vh;
    margin:           1vh 0;
    padding:          1vh 1vw;
}

.radio input[type="radio"]:checked + label { 
    background-color: rgb(64, 64, 64);
    color:            rgb(255, 255, 255);
}

/* Submit button */
input[type=submit] {
    background:                 rgb(64, 64, 64);
    border:                     0;
    border-top-left-radius:     1vw 2vh;
    border-top-right-radius:    1vw 2vh;
    border-bottom-right-radius: 1vw 2vh;
    border-bottom-left-radius:  1vw 2vh;
    color:                      rgb(255, 255, 255);
    font-size:                  1.2vw;
    padding:                    2vh 2vw;
}

/* Video wrapper */
.videowrapper {
	position:       relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top:    0;
	height:         0;
}
.videowrapper iframe {
	position: absolute;
	top:      0;
	left:     0;
	width:    100%;
	height:   100%;
}