/* picture is 130px width by 100px height.  The footer is 20px height.  If that changes then all of these height/width values will have to be changed*/

h1 {
font-weight: bold;
color: white;
text-align: center;
font-size:25px;
}

h3 {
text-decoration:underline;
}

#excess {
position:relative;
width: 100%;
height: 100%;
float: left;
}

body{
background-color: lightgreen;
height:100%;
padding-bottom:20px; /*this is the height of the footer*/
overflow:auto;
}


#container {
width:830px;
/*height:100%;*/
margin:auto;
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
background-color:#009933;
font-family:"Times New Roman", Times, serif;
}

#top{
/*display:table-row;*/
margin-bottom:0;
clear:both;
/*width:100%;*/
}

#middle{
/*display:table-row;*/
margin-bottom:0;
clear:both;
/*height:100%;*/
/*position:fixed;
top:0;
bottom:0;
left:0;
right:0;
padding-top:100px;
padding-bottom:20px;*/
}

#headerleft {
float:left;
    width:180px;
    position:relative;
/*left:210px;*/
background-color:#FFA500;
margin-bottom:0;
}

#headermiddle {
float:left;
position:relative;
background-color:#084D1E;
margin-bottom:0;
width:470px;
height:100px;
color:black;
/*left:210px;*/
/*padding:left:130px;*/
}


#headerright {
float:left;
background-color:#084D1E;
margin-bottom:0;
width:180px;
height:100px;
color:white;
/*left:210px;*/
/*padding:left:130px*/
position:relative;
font-size:12px;
}

/*
#leftExcess {
background-color:lightgreen;
color:#084D1E;
width:calc(100% - 1100px);
height:100%;
float:left;
position:absolute;
z-index: 9000;
}

#rightExcess {
background-color:lightgreen;
color:#084D1E;
width:100px;
height:100%;
float:left;
right:0px;
position:absolute;
z-index: 9000;
}
*/

#leftside {
background-color:#009933;
color:black;
width:180px;
/*height:calc(100% - 120px);*/
height:599px;
top:100px;
float:left;
position:absolute;
text-align:center;
}

#rightside {
background-color:#009933;
color:black;
width:180px;
/*height:calc(100% - 120px);*/
height:599px;

top:100px;
right:0px;
float:left;
position:absolute;
text-align:center;
}


#content {
background-color:lightgreen;
color:black;
/*float:left;*/
/*width:calc(100% - 276px);*/
width:470px;
/*height:calc(100% - 120px);*/
position:absolute;
top:100px;
left:180px;
/*right:138px;*/
font-size:20px;
text-align:center;
}

#titlebar {
background-color:lightyellow;
font-weight:bold;
font-size:26px;
}

#footer {
color:yellow;
background-color:#084D1E;  /*Salem Green*/
clear:both;
height:20px;
width:830px;
bottom:0;
top:679px;
position:absolute;
font-size:20px;
text-align:center;
float:left;
}

a:link {color:yellow;}      /* unvisited link */
a:visited {color:yellow;}  /* visited link */
a:hover {color:white;}  /* mouse over link */
a:active {color:white;}  /* selected link */

#friendsLinks a:link {color:#084D1E;}      /* unvisited link */
#friendsLinks a:visited {color:#084D1E;}  /* visited link */
#friendsLinks a:hover {color:yellow;}  /* mouse over link */
#friendsLinks a:active {color:yellow;}  /* selected link */
#friendsLinks{
font-size:20px;
}

#map a:link {color:#084D1E;}      /* unvisited link */
#map a:visited {color:#084D1E;}  /* visited link */
#map a:hover {color:#009933;}  /* mouse over link */
#map a:active {color:#009933;}  /* selected link */
#map{
font-size:20px;
}