article, section, aside, hgroup, nav, header, footer, figure, figcaption {
  display: block;
}

body {
  background:url(images/CMBackground02.jpg);
  background-position:center;
  -moz-background-size:2000px 862px; /* Firefox 3.6 */
  background-size:2000px 862px;
  background-repeat:no-repeat;
  background-attachment:fixed;
}

#body-container {
  width: 1000px;
  position: relative;
  margin: auto;
  border:2px solid #41789e;
  background: #ffffff;
  border-radius:0px;
  -moz-border-radius:0px; /* Firefox 3.6 and earlier */
}

#body-container-trad {
  width: 1000px;
  position: relative;
  margin: auto;
  border:2px solid #41789e;
  background: #ffffff;
  border-radius:0px;
  -moz-border-radius:0px; /* Firefox 3.6 and earlier */
  background: url("images/AHJC2bg.jpg");
}

#header {
  background: url("images/CovHead03.png");
  height: 339px;
  width: 1000px;
}

img {
  box-shadow: 0px 10px 8px #888888;
}

/* START NAV MENU */
nav {
  background-color:#41789e;
  height: 41px;
  width: 100%;
  box-shadow: 0px 10px 8px #888888;
}
 
 
nav ul {
  font-family: Arial, Verdana;
  font-size: 20px;
  position: relative;
  left: 14.5%;
  margin: 0;
  padding: 0;
  list-style: none;
}
 
nav ul li {
  display: block;
  position: relative;
  float: left;
 
}
 
nav li ul {
  display: none;
}
 
nav ul li a {
  display: block;
  text-decoration: none;
  padding: 8px 22px 3px 0px;
  background: #41789e;
  color: #ffffff; 
  margin-left: 0px;
  white-space: nowrap;
  height:30px; /* Width and height of top-level nav items */
  width: 100%;
  /*width:90px;*/
  text-align:center;
}
 
nav ul li a:hover {
  background: #aadd6d;
  color: #000000;
}
 
nav li:hover ul {
  display: block;
  position: absolute;
  height:30px;
}
 
nav li:hover li {
  float: none;
  font-size: 11px;
 
}
 
nav li:hover a {
  background: #3A464F;
  height:30px; /* Height of lower-level nav items is shorter than main level */
}
 
nav li:hover li a:hover {
  background: #95A9B1;
}
 
nav ul li ul li a {
    text-align:left; /* Top-level items are centered, but nested list items are left-aligned */
}
 
/* END NAV MENU */

section {
  background: none;
}

p {
  font-family: Century Schoolbook;
  font-size: 18px;
}

#heads {
  width: 100%;
  text-align: center;
}

#headslocal {
  position: relative;
  margin-top: -20px;
}

#main-contianer {
  width: 100%;
  margin-top: 30px;
}

#main-container-full {
 width: 100%;
 margin-top: 30px;
}

#main-container-full-trad {
 width: 100%;
 margin-top: 30px;
}

#content {
  width: 50%;
  margin-left: 10px;
  margin-right: 10px;
}

#column2 {
  position: relative;
  top: -10px;
  left: 10px;
  -ms-column-count: 2;
  -moz-column-count: 2;
  text-align: left;
  -moz-column-gap: 20px;
  -webkit-column-count: 2;
  -webkit-column-gap : 20px;
  -moz-column-rule-style:  none;
  -moz-column-rule-width:  1px;
  -webkit-column-rule-style: solid;
  -webkit-column-rule-width:  1px;
}

#content-full {
  width: 95%;
  margin-left: 20px;
}

#tradimage {
  width: 100%;
  text-align: center;
}

#slide {
  position: relative;
  float: right;
  right: -50px;
  width: 50%;

}

#side {
  position: relative;
  float: right;
  right: -50px;
  width: 50%;

}

#purchase {
  margin-left: 25px;
}

#purchimage {
  width: 100%;
  text-align: left;
}

#footer {
  background: url("images/CovFooter01.png");
  height: 173px;
  width: 1000px;
}

#footlinks {
  position: relative;
  text-align: center;
  top: 90px;
  color: #ffffff;
}

footer a {
  color: #ffffff;
  text-decoration: none;
}

footer a:hover {
  color: #aadd6d;
}

/* Start Enlarging images */

ul.enlarge{
list-style-type:none; /*remove the bullet point*/
}

ul.enlarge li{
display:inline-block; /*places the images in a line*/
position: relative; /*allows precise positioning of the popup image when used with position:absolute - see support section */
z-index: 0; /*resets the stack order of the list items - we'll increase in step 4. See support section for more info*/
margin:10px 40px 0 20px; /*space between the images*/
}

ul.enlarge span{
position:absolute; /*see support section for more info on positioning*/
left: -9999px; /*moves the span off the page, effectively hidding it from view*/
}

ul.enlarge img{
/*give the thumbnails a frame*/
background-color: #aadd6d; /*frame colour*/
padding: 3px; /*frame size*/
/*add a drop shadow to the frame*/
-webkit-box-shadow: 0 10px 8px rgba(198, 198, 198);
-moz-box-shadow: 0 10 8px rgba(198, 198, 198);
box-shadow: 0px 10px 8px #c6c6c6;
/*and give the corners a small curve*/
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}

 ul.enlarge li:hover{
z-index: 50; /*places the popups infront of the thumbnails, which we gave a z-index of 0 in step 1*/
cursor:pointer; /*changes the cursor to a hand*/
}
/***We bring the large image back onto the page by reducing left from -9999px (set in step 2) to figures below***/
ul.enlarge li:hover span{ /*positions the <span> when the <li> (which contains the thumbnail) is hovered*/
top: -300px; /*the distance from the bottom of the thumbnail to the top of the popup image*/
left: -20px; /*distance from the left of the thumbnail to the left of the popup image*/
}
/***To make it look neater we used :nth-child to set a different left distance for each image***/
ul.enlarge li:hover:nth-child(2) span{
left: -100px;
}
ul.enlarge li:hover:nth-child(3) span{
left: -200px;
}

    ul.enlarge span img{
    padding: 2px; /*size of the frame*/
    background: #ccc; /*colour of the frame*/
    }

    /***Style the <span> containing the framed images and the caption***/
    ul.enlarge span{
    /**Style the frame**/
    padding: 10px; /*size of the frame*/
    background:#aadd6d; /*colour of the frame*/
    /*add a drop shadow to the frame*/
    -webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
    -moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
    box-shadow: 0 0 20px rgba(0,0,0, .75);
    /*give the corners a curve*/
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius:8px;
    /**Style the caption**/
    font-family: Century School book; /*Droid Sans is available from Google fonts*/
    font-size:.9em;
    text-align: center;
    color: #3d78a2;
    }

/* End of Enlarging Images */

/* Contact Us Page */

#lcontact {
  position: relative;
  top: 1px;
}

#gmap {
  position: absolute;
  left: 450px;
  top: 470px;
  height: 320px;
  width: 460px;
  box-shadow: 10px 10px 8px #888888;
}