html, body, h1, h2, h3, h4, ul, li {
margin: 0;
padding: 0;
}
body {
background: url(images/body-bg.jpg) left 100% repeat fixed;
font-family: Georgia, "Times New Roman", Times, serif;
}

div#wrapper {
width: 95%;
font-size: 50%;
margin-top: 30px;
margin-bottom: 30px;
margin-left: auto;
margin-right: auto;
}

div#header {
text-align: center;
}
#header h1 {
  margin: auto;
  color: black;
  font: oblique 5em "Times new roman", serif;
  font-weight: bold;
}
#header h1 strong {
  font-weight: bolder;
  color: #0E1520;
}


div#top-nav {
  margin: auto;
  width: 350px;
  height: 30px;
}
#top-nav ul {
  text-align: center;
  line-height: 32px;
}
#top-nav li {
  display: inline;
  font-size: 16px;
  color: white;
  border: thin inset white;
}
#top-nav a {
  text-decoration: none;
  font-weight: normal;
  color: darkblue;
}
#top-nav a:hover {
  text-decoration: underline;
  background: white;
}


div#main {
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
}
#main h1 {
  color: #0E1520;
  text-align: center;
  font: oblique 4em "Times new roman", serif;
  font-weight: bold;
}
#main h1 strong {
  font-weight: bolder;
  color: darkblue;
}


div#subsleft {
  float: left;
  width: 20%;
  padding-left: 25px;
  padding-bottom: 10px;
  margin-top: 10px;
}
#subsleft h1 {
  margin: auto;
  color: black;
  font: oblique 3em "Times new roman", serif;
  font-weight: bold;
}
#subsleft h1 strong {
  font-weight: bolder;
  color: #0E1520;
}
#subsleft ul {
  text-align: left;
  line-height: 32px;
}  
#subsleft li {  
  font: oblique 4em "Times new roman", serif;
  font-weight: bold;
  color: black;
  border: thin inset lightgrey;
}
#subsleft ul li a{
  color : black;
  background-color : transparent;
  text-decoration : none;
}
#subsleft ul li a:hover{
  text-decoration : underline;
  background: white;
}


div#subsright {
  float: right;
  width: 20%;
  padding-right: 25px;
  padding-bottom: 10px;
  margin-top: 10px;
}
#subsright h1 {
  margin: auto;
  color: black;
  font: oblique 3em "Times new roman", serif;
  font-weight: bold;
}
#subsright h1 strong {
  font-weight: bolder;
  color: #0E1520;
}
#subsright ul {
  text-align: left;
  line-height: 32px;
}  
#subsright li {  
  font: oblique 4em "Times new roman", serif;
  font-weight: bold;
  color: black;
  border: thin inset white;
}
#subsright ul li a{
  color : black;
  background-color : transparent;
  text-decoration : none;
}
#subsright ul li a:hover{
  text-decoration : underline;
  background: white;
}


div#canvas {
  text-align: center;
  margin-left: 210px;
  margin-top: 20px;
  margin-bottom: 10px;
  float: center;

}
#canvas h1 strong {
  font-weight: bolder;
  color: #0E1520;
}
#canvas ul {
  text-align: center;
  line-height: 32px;
}  
#canvas li {  
  display: inline;
  font-size: 16px;
  color: white;
  border: thin inset white;
}
#canvas ul li a{
  color : #115EAC;
  background-color : transparent;
  text-decoration : none;
}


div#footer {
  text-align: center;
}
#footer h1 {
  margin: auto;
  color: #0E1520;
  font: oblique 4em "Times new roman", serif;
  font-weight: bold;
}
#footer h1 strong {
  font-weight: bolder;
  color: #0E1520;
}
#footer ul {
  text-align: center;
  line-height: 32px;
}  
#footer li {  
  display: inline;
  font-size: 16px;
  color: white;
  border: thin inset white;
}
#footer ul li a{
  color : #115EAC;
  background-color : transparent;
  text-decoration : none;
}
  #footer ul li a:hover{
  text-decoration : underline;
}


.grow img {
  height: 250px;
  width: 600px;
 
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}
 
.grow img:hover {
  width: 600px;
  height: 380px;
}


.shrink img {
  height: 380px;
  width: 600px;
 
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}
 
.shrink img:hover {
  height: 200px;
  width: 600px;
}