/*General Style*/
  html{
    background-color: #000;
  }
  body{
  background-color:#f0f0ee;
  background-image: url("images/feather.jpg");
  background-repeat: no-repeat;
  background-position: 87% 40%;
  font-family: Roboto, sans-serif;
  font-size: 100%;
}


/*Birds Image Style*/
.birds{
  width: 20%;
  display: block;
  float: left;
  margin-top: -4%;
  margin-left: -2%; 
}

/*Navigation Style*/
.navigation{
  clear: right;
  width: 25%;
  margin-left: 70%;
  }
.dropbtn {
  background-color: #000;
  color: #f0f0ee; 
  padding: 16px;
  font-size: 20px;
  font-variant: small-caps;
  letter-spacing: 0.1em;
  border: none;
}
.dropdown {
  position: relative;
  display: inline-block;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}
.dropdown-content a:hover {background-color: #ddd;}

.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn {
  background-color: #343636;
  color: #fff;
}


/*Main Section Styles*/
.main {
  display: block;
  float: left;
  clear: left;
  width: 50%;
  padding-left: 10%;
}
.main h1{
  font-family: Merienda, cursive;
  font-size: 3.8em; 
  text-align: center;
  margin-top: -5%;
  padding-bottom: 3%;
}
.main  span{
  background-color: #000;
  font-size: 0.8em;
  font-family: Roboto, sans-serif;
  font-variant: small-caps;
  color: #f0f0ee;
  padding: 1.8%;
  text-align: center;
}
.main h2{
  font-family: Merienda, cursive;
  font-size: 3em;
  text-align: center;
  margin-top: -10%;
  margin-bottom: 0%;
}
.main p{
  font-family: 'Merienda','Courgette', cursive;
  font-size: 0.8em;
  margin-left: 6%;
  text-align: center;
  width: 90%;
}
/*Cat Image Styles*/
.cat{
  width: 8%;
  display: block;
  float: left;
  clear: both;
  margin-bottom: -0.6%;
  padding-bottom: 0%; 
}
/*Footer Styles*/
footer{
  background-color: black;
  clear: both;
  color: #666666;
  font-family: Helvetica, sans-serif;
  font-size: 0.5em;
  font-weight: lighter;
  height: 100px;
  width: 100%;
} 
footer p{
  padding-top: 5%;
  text-align: center;
}
footer a{
  color: #666666;
}
footer a:hover{
  color: #FFFFFF;
  text-decoration: none;
}