a{
  text-decoration: none;
}
a, label{
   color:#448;
}
a:hover{
  text-decoration:underline;
  color:#77a;
}
label:hover{
  cursor:pointer;
}
h1,h2,h3,h4,h5{
  line-height:2em;
  text-decoration: underline;
}
html,
body {
  height:100%;
  font-family: "arial";
}
body {
  color:#555;
  text-align: center;
}
li{
	list-style:none;
	text-align:left;
}
.content{
  position:relative;
  top:25%;
}
.navbar>li{
	display: inline-block;
	padding:2em;
	height:1em;
}
.dropdown{
  position:relative;
  display:block;
}

input[type="checkbox"]{
  position:absolute;
  top:-999px;
}
input[type="checkbox"] ~ label::after{
  content:"→ ";
  display:inline-block;
  width:1em;
}
input[type="checkbox"]:checked ~ label::after{
  content:"↓ ";
}
input[type="checkbox"]:checked ~ .dropdown-content{
	display:block;
}
.dropdown-content{
	position: absolute;
	display:none;
  border:1px solid black;
  border-top:0px;
  padding:1em;
  border-radius:0px 0px 0.3em 0.3em;
  z-index:1;
}
.dropdown-content, body{
  background-color: #eef;
}
.dropdown-content>*{
  margin:0;
  padding:0;
}
@media only screen and (max-width: 1000px){
  .dropdown{
    position: inherit;
  }
  .navbar>li{
    display:block;
    padding:0.5em;
  }
  .dropdown-content{
    position:relative;
    padding:0 0 0 0;
    margin: 0 0 0 0;
  }
  input[type="checkbox"]:checked ~ .dropdown-content{
	  display: inherit;
  }
  label,a {
    display:inline-block;
    width:100%;
  }
}

.navigation{
	padding:0px;
	margin:1em;
	border:1px solid black;
}

.navigation > li{