body{
  background-image: url("website images/.jpg");
  background-size: 100%;
  background-attachment: fixed;
}

main{
  width: 1020px;
  min-height: 764px;
  position: relative;
  margin: auto;
  margin-top: -8px;
  border: 2px solid #000;
  z-index: 0;
}

header{
  width: 1020px;
  height: 148px;
  border: 2px solid #000;
  position: absolute;
  top: -2px;
  left: -2px;
  z-index: 1;
  opacity: 1;
} 

p{
  color: white;
}

h1 {
  color: white;
  text-shadow: 2px 2px 4px #000000;
}

h2 {
  color: white;
  text-shadow: 2px 2px 4px #000000;
}

h3{
  color: white;
  text-shadow: 2px 2px 4px #000000;
}

article{
  width: 807px;
  height: 160px;
  border: 1 px solid #000;
  position: relative;
  margin: 6px 5px 0px 5px;
  border-radius: 0px;
  padding: 0px;
  font-family:Garamond ;
  z-index: 2;   
 }

aside{
  width: 189px;
  min-height: 504px; 
  position: absolute;
  top: 198px;
  left: -2px;
  padding: 5px 5px 5px;
  z-index: 1;
}

section{
  width: 820px;
  min-height: 514px; 
  border: 3px solid #000; /* Black */
  position: absolute;
  top: 198px;
  right: -3px;
  z-index: 1;
  padding: 0px;
}
figure{
  position: absolute;
  height: 145px;
  z-index: 4;
} 

 figure.left{
  margin: 5px 0px 0px 5px;
  left:0px;
  top:0px;
  width: 145px;
  border: 2px solid #000;
}

figure.right{
  margin: 5px 5px 5px 5px;
  right:0px;
  top:0px;
  width: 640px;
  border: 1px solid #000;
}

figure2{
  position: absolute;
  height: 145px; 
  z-index: 4;
}


figure2.right{
  margin: 5px 5px 5px 5px;
  right:0px;
  top:0px;
  width: 145px;
  border: 1px solid #000;
}

figure2.left{
  margin: 5px 0px 0px 5px;
  left:0px;
  top:0px;
  width: 640px;
  border: 2px solid #000;
}

footer{
  padding: 5px 5px 5px 5px;
  width: 1010px;
  height: 38px;
  border: 2px solid #000; 
  position: absolute;
  bottom: -2px;
  left: -2px;
  z-index: 2;
}

/* background/transparency */

.opacity{
  width: 192px;
  min-height: 506px;
  opacity:0.7;
}


.opacity1, .opacity2, .opacity3{
  z-index: 1;
   
}

.opacity1{
  width: 192px;
  min-height: 504px;
  opacity: 0.7;
}

.opacity2{
  width: 820px;
  min-height: 514px;
  opacity: 0.7;
}

.opacity3{
  padding: 0px;
  width: 1020px;
  min-height: 48px;
  opacity: 0.5;
}

.border{
  border: 2px solid #000
}


/*navigation of website*/

nav{
  width: 1020px;
  height: 48px;
  border: 2px solid #000;
  position: absolute;
  top: 148px;
  left: -2px;
  z-index: 2;
}

nav ul{
  text-align:center;
  margin:5px 20px 0px 145px; 
  padding-top: 7px;
}

nav ul li{
  display: inline;
  list_style: none;
  float: left;
}
  
  /* navigation link colors */
a:link {color:#fff;} /* unvisited link */
a:visited {color:#fff;} /* visited link */
a:hover {color:#000;} /* mouse over link */
a:active {color:#fff;}  /* selected link */


nav a:link, nav a:hover, nav a:visited{
  font-weight: bold;
  font-size: 1.2em;
  text-decoration: none;
  padding: 0px 15px 0px 15px;
  border: 2px solid #000;
  margin: 5px;
}
