/*
   New Perspectives on HTML, CSS, and JavaScript
   Final Project

   Media Arts and Animation

   Author: Josh Robertson     
   Date:   August 26, 2015     
   Filename:  MAStyle.css, LabCharacter.jpg

*/

/* Body Styles */

body {
   background-color: black;
   padding-left: 10%;
}

/* Header Styles */

h3 {
   display: block;
   font-family: sans-serif;
   color: white;
   font-type: bold;
   text-align: center;
   font-size: 34px;
   height: 120px;
   background: url(LabCharacter.jpg);
   background-position: 50% 85%;
   background-size: 1400px 800px;
   background-repeat: no-repeat;
   margin-top: -5px;
}


/* Navigation Styles */

nav.horizontal {
   margin-top: -45px;
   padding-left: 14%;
   padding-top: 0%;
}

nav.horizontal ul {
   height: 22px;
   background-color: rgb(40, 40, 130);
   border-radius: 40px 40px 40px 40px;
   width: 70%;
}

nav.horizontal ul li {
   padding: 0px;
   float: left; 
   width: 14%; 
   line-height: 22px;
   height: 20px; 
}

nav.horizontal ul li a {
   display: block; 
   text-align: center;
   width: 73%; 
   font-size: 10px; 
   font-family: Century Gothic;
   text-decoration: none; 
   color: white;
}

nav.horizontal ul li:hover {
   background-color: rgba(255, 255, 255, 0.6);
}


/* Figure Styles */

figure {
   display: block;
   padding-left: 1%;
   padding-top: 3%;
   float: right;
   border: 3px;
   border-color: black;
}

/* Article Styles */

article {
   display: block;
   color: white;
   margin-top: -14px;
   font-size: 18px;
   background-color: rgb(60, 150, 60);
   border-radius: 40px 40px 40px 40px;
   background-position: center center;
   width: 80%;
   height: 740px;
   padding-left: 5%;
   padding-top: 5%;
} 

h1 {
   font-family: times;
   font-size: 40px;
   text-align: center;
   margin-top: -20px;
}  

h2 {
   font-size: 24px;
}

img {
   border-color: black;
}