body{
margin:0;
padding:0;
font-family: DajaVu Sans, Arial;
}

/*background colors*/
/*HTML {background:#7EC5FF;}*/
HTML {background:tan;}

/*copywrite line*/
.copy:after {
  font-weight: normal;
  color: white;
  content: " Copyright 2014 Jerry Hadden's Guide Service";
}

#maincontainer{
width: 825px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
margin-top: 20px;
border: 1px solid blue;
background-color: transparent;
font-family: DajaVu Sans, Arial;
}

/*the lines below are the colors for text links*/

A:link {
 COLOR: blue /*The color of the link*/
}
A:visited {
 COLOR: blue /*The color of the visited link*/
}
A:hover {
 COLOR: DarkBlue /*The color of the mouseover or 'hover' link*/
}
BODY { COLOR: black /*The color of all the other text within the body of the page*/
}

h1{font-size: 1.7em;
font-family: DajaVu Sans, Arial;
}

h2{font-size: 1.2em;
font-family: DajaVu Sans, Arial;
}

h3{font-size: 1.0em;
font-family: DajaVu Sans, Arial;
}

 /*for the font size under the pictures*/
b{font-size: .9em;
font-family: DajaVu Sans, Arial;
}

p{font-family: DajaVu Sans, Arial; font-size: .9em;
}
 /*for the font size for the bottom links*/
p.links{font-family: DajaVu Sans, Arial; font-size: .7em;
}
 /*for the font size for under the pictures*/
p.caption{font-family: DajaVu Sans, Arial; font-size: .8em;
}

/*box is to make the side menu background blue and move it up over the top picture*/
.menubox{
position:absolute; z-index: 99;
margin-top: -95px;
margin-left: -3px;
width: 248px; background: #129fff;
border-left: 1px solid blue;
border-right: 1px solid blue;
}

/*below is for the left hand side menu*/

.ddblueblockmenu{
border: 1px solid black;
border-bottom-width: 1;
width: 245px;
}

.ddblueblockmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
font-family: Arial; font: normal 90%;
}

.ddblueblockmenu li a{
display: block;
padding: 3px 0;
padding-left: 3px;
width: 237px; /*185px minus all left/right paddings and margins*/
text-decoration: none;
color: black;
background-color: #129fff;
border-bottom: 1px solid #90bade;
border-left: 3px solid #129fff;
font-family: Arial;
}

* html .ddblueblockmenu li a{ /*IE only */
width: 187px; /*IE 5*/
width: 215px; /*185px minus all left/right paddings and margins*/
}

.ddblueblockmenu li a:hover {
background-color: #2586d7;
border-left-color: #1c64d1;
}

.ddblueblockmenu div.menutitle{ /*this is the heading text*/
color: black;
border-bottom: 1px solid black;
padding-top: 5px;
padding-left: 2px;
padding-right: 0px;
padding-bottom: 5px;
background-color: #2175bc;
font-family: Arial; font-size: 1.1em;
}

#maincontainerhatch{
width: 800px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
margin-top: 20px;
background-color: transparent;
font-family: DajaVu Sans, Arial;
}


#topsectiontop{
background-color: tan;
width: 806px;
height: 100px; /*Height of top section*/
margin-top: 5px;
margin-left: 5px;
margin-bottom: 5px;
padding: 3px;
border: 1px solid blue;
font-size: 1.1em; font-family: DajaVu Sans, Arial;
line-height: 1.02em;
}

#topsectionmiddle{
background: ;
height: 122px;/*Height of top section*/
margin-left: 5px;

margin-bottom: 5px;
font-size: 1.1em; font-family: DajaVu Sans, Arial;
}


#topsection{
background: tan;
 /*Height of top section height: 340px; */
width: 802px;
margin-left: 5px;

padding: 5px;
font-size: 1.1em; font-family: DajaVu Sans, Arial;
line-height: 1.02em;
border: 1px solid blue;
}

/*box to hold the insect dropdown and the top insect name section */
.dropdownbox{
width: 382px; height: 100px; background: tan;
margin-right: 6px;
border: 1px solid blue;
padding: 10px;
}


/*box to hold the insect dropdown and the top insect name section */
.dropdownbox2{
width: 382px; height: 100px; background: tan;
border: 1px solid blue;
padding: 10px;
}







#topsectionhatch{
position:absolute; z-index: 99;
width: 750px;
background-color: black;
height: 30px; 
margin-left: 6px;
margin-bottom: 0px;
font-size: 1.1em; font-family: DajaVu Sans, Arial;
line-height: 1.02em;
}

#contentwrapper{
float: left;
width: 100%;
}

#contentwrapperhatch{
float: left;
width: 100%;
}

#contentcolumn{
margin-left: 245px; /*Set left margin to LeftColumnWidth*/
}

/*for the index page without the left column*/
#contentcolumnindex{
margin-left: 0px; /*Set left margin to LeftColumnWidth*/
}

#leftcolumn{
float: left;
width: 245px; /*Width of left column #129fff */
margin-top: 5px;
margin-left: -825px; /*Set left margin to -(MainContainerWidth)*/
background: tan;
border-top: 1px solid blue;
border-left: 0px solid blue;
border-right: 1px solid blue;
font-family: DajaVu Sans, Arial; font-size: .9em;
}

/* this box is so I can add text to the bottom of the pics when they are floated left ofr right */
.boxpics{
margin-left: 0px;
background-color: transparent;
padding: 0px;
}

.boxpics2{
margin-left: 5px;
background-color: transparent;
padding: 0px;
}

.logobox2{
margin-left: 145px;
background-color: transparent;
padding: 0px;
}

/*box is for the guide and index pages so they have borders like the three column pages*/
.contentbox{
margin-top: 6px;
margin-left: 7px;
width: 546px; background: tan;
border: 1px solid blue;
padding-top: 0px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}
/* this is for the index page with no left column */
.contentboxindex{
background-color: tan;
margin-top: 6px;
margin-left: 7px;
margin-right: 7px;
margin-bottom: 7px;
width: 789px;
height: 1200px;
border-top: 1px solid blue;
border-left: 1px solid blue;
border-right: 1px solid blue;
border-bottom: 1px solid blue;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

/*for the hatch chart*/
.contentboxhatch{
margin-top: 4px;
margin-left: -10px;
margin-bottom: 5px;
width: 790px; background: transparent;
padding-top: 0px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

.contentboxguide{
margin-top: 6px;
margin-left: 7px;
margin-bottom: 5px;
width: 546px; background: tan;
border: 1px solid blue;
padding-top: 0px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}



/*box 2 and 3 are for the links and screen savers pages*/
.box2{
margin-top: 5px;
margin-left: 7px;
width: 258px; background: tan;
height: 660px;
border: 1px solid blue;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

.box3{
margin-top: 5px;
margin-right: 7px;
width: 258px; background: tan;
height: 660px;
border: 1px solid blue;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

/*box is the top box on the pages with boxes*/
.box{
margin-top: 6px;
margin-left: 7px;
width: 545px; background: tan;
border: 1px solid blue;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

/*box 5 is for the middle boxes on the conditions and flow pages*/
.box5{
margin-top: 5px;
margin-left: 7px;
width: 545px; background: tan;
border: 1px solid blue;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

/*box4 is the bottom box*/
.box4{
margin-top: 5px;
margin-left: 7px;
width: 545px; background: tan;
border: 1px solid blue;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

/*box 6 and 7 are for the wallpaper page*/
.box6{
margin-top: 5px;
margin-left: -7px;
width: 262px; background: tan;
height: 900px;
border: 1px solid blue;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

.box7{
margin-top: 5px;
margin-right: -6px;
margin-left: 4px;
width: 262px; background: tan;
height: 900px;
border: 1px solid blue;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
}

#footer{
clear: left;
width: 100%;
height: 18px;
background: black;
font-family: DajaVu Sans, Arial; font-size: .8em;
color: #FFF;
text-align: center;
padding: 4px 0;
}

.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
font-family: DajaVu Sans, Arial;
}

hr{
margin-top: 5px;
width: 80%;
height: 1px;
color: blue;
}