* {
  margin:0;
  padding:0;
}

header,video,footer,nav {
  display:block;
}
 
body{
  padding:3em;
}

nav {
  padding:.5em;
  background:#ccc;
  border-radius:5px;
}

h1 {
  font-size:20px;
  margin:0 0 1em 0;
  color:#393;
}

h2 {
  font-size:18px;
  margin:1em 0;
  color:#363;
}

nav li {
  display:inline;
  padding-right:2em;
}

a {
  color:#369;
  font-weight:bold;
}

nav a { 
  color:#333;
}

nav strong {
  color:#030;
}

footer {
  font-size:80%;
  margin:5em 0;
}

footer a img {
  border:none;
  display:block;
  margin:.5em auto;
}

#stage{
   background:#eee;
   width:400px;
   height:300px;
   overflow:hidden;
   position:relative;
   margin:2em 0;
}

#stage span {
  font-size:20px;
  color:#666;
  display:block;
  padding:2em;
}

video {
  width:400px;
  height:300px;
  position:absolute;
  top:0;
  left:0;
}
  
#controls{
  position:relative;
  width:400px;
}

#change{
  position:absolute;
  right:-100px;
  top:-300px;
  width:100px;
}

button{
  font-size:150%;
  text-align:center;
  display:block;
}

#change button{
  width:60px;
  border:none;
  background:#fff;
}