/* andreas01 - an open source xhtml/css website layout by Andreas Viklund  - http://andreasviklund.com - Free to use for any purpose as long as the proper credits are given to the original author.
Version: 2.0 (Jun 25, 2006)
Screen layout: */

/***** Body and main container *****/
body {
	margin:0 auto;
	padding: 1em 0;
	font:75% Verdana,Tahoma,Arial,sans-serif;
	color:#303030;
	background: #071e5b url("images/blue-background.jpg") repeat;
}

#wrap {
margin:0 auto;
width:721px;
}

/***** Various tags *****/
a {
text-decoration:none;
font-weight:bold;
color:#286ea0;
background-color:inherit;
}

a:hover {
text-decoration:underline;
color:#cbd7f8;
background-color:inherit;
}

a img {
border:0;
}

/***** Header *****/
/*The gap in the header is fixed!! Here's what I learned from John of Explorer Exposed!

"The problem stems from the height you put on the header
div, which is 17.1em. That value makes the header the
height of 17.1 capital M's turned sideways, so if someone
(like you) has their text size different than other people,
they will see the header displayed taller.

I predict that if you check you will find that your
IE has its text-size set to "Larger".

However, the BG image used on the header is a px height
and can't expand! What you want is to set the height of
the header div to the same px height as that BG image,
then it can't cause this problem."*/
#header {
	margin:0 1px 0 0;
	padding:0;
	height:208px;
	background:#071e5b url("images/framed-header.jpg") no-repeat center top;
}

#header h1 {
color:#505050;
background-color:inherit;
width:25em;
margin:0 0 1em;
font-size:2.2em;
float:left;
}

#header h1 a{
color:#505050;
background-color:inherit;
text-decoration:none;
}

#header p {
width:50em;
float:right;
text-align:center;
color:#505050;
margin:.7em 0 0;
font-size:1.1em;
font-weight:bold;
line-height:1.3em;
background-color:inherit;
}

#frontphoto {
margin:0 0 1em;
border:0;
}

/***** Left sidebar *****/
#leftside {
clear:left;
float:left;
width:13em;
margin:0 .4em;
padding: 0 0 0 2.5em;
}

#leftside h2,#leftside h3 {
color:#505050;
background-color:inherit;
font-size:1.3em;
margin:0 0 .5em;
padding:0;
}

#leftside div.announce {
	clear:left;
	margin:1em 0 4em;
	padding:.7em 0 .7em .5em;
	width:12.6em;
	font-size:0.9em;
	background-color:#fcfee1;
	color:#505050;
	line-height:1.5em;
	border: .2em solid #fff0b8;
}

#leftside div.announce p {
margin:1em 0 0;
padding:0;
}

/***** container for box-center *****/
#boxcenter {
	margin: 0 auto;
	padding: .4em 0;
	width: 721px;
	background : #071e5b url("images/center.jpg") repeat-y;
}

/***** Main content *****/
#content {
margin:0 15em .5em 15em;
border-left:1px solid #e0e0e0;
border-right:1px solid #e0e0e0;
padding:0 1em;
line-height:1.6em;
}
#contentwide {
font-size: 1em;
margin:1em 4em .5em 16em;
border-left: .1em solid #f0f0f0;
padding:0 0 0 1em;
line-height:1.6em;
}

#content h2,#contentwide h2 {
font-size:1.6em;
margin:0 0 1em;
}

#content h3,#contentwide h3 {
font-size:1.4em;
margin:0 0 .8em;
}

#content img,#contentwide img {
padding:.1em;
display:inline;
background:#cccccc;
color:#303030;
border:.4em solid #f0f0f0;
}

#content ul, #contentwide ul, #content ol, #contentwide ol {
margin:0 0 1.6em 2em;
padding:0;
}

#content li, #contentwide li {
margin:0;
padding:0 0 0 .5em;
}

#content ul ul, #contentwide ul ul, #content ol ol, #contentwide ol ol{
margin:0 0 0 1.6em;
padding:0;
}

/***** Footer *****/
#footer {
	clear:both;
	margin:-.1em auto 0;
	padding:0;
	width:721px;
	text-align:center;
	color:#808080;
	background: url("images/framed-footer.jpg") no-repeat;
	font-size:0.7em;
	height: 20em;
}

#footer a {
color:#808080;
background-color:inherit;
text-decoration:none;
}

#footer a:hover {
text-decoration:underline;
}

/***** Various classes *****/
.left {
	margin: .5em;
	float:left;
	border: 2px double #003366;
}
.right {
	margin: .5em;
	float:right;
	border: 2px double #003366;
}

.textright {
text-align:right;
}

.center {
text-align:center;
}

.small {
font-size:0.8em;
}

.bold {
font-weight:bold;
}

.hide {
display:none;
}

.credits {
font-size: 85%;
line-height: 1.15em;
}

.indent {
padding-left: .9em;
margin-left: .9em;
}

.img-shadowleft {
  float:left;
  background: url("images/shadowAlpha.png") no-repeat bottom right !important;
  background: url("images/shadow.gif") no-repeat bottom right;
  margin: 10px 4px 0 10px !important;
  margin: 10px 4px 0 5px;
  }

.img-shadowleft img {
  display: block;
  position: relative;
  background-color: #fff;
  border: 1px solid #a9a9a9;
  margin: -6px 6px 6px -6px;
  padding: 4px;
  }
  
.img-shadowright {
  float:right;
  background: url("images/shadowAlpha.png") no-repeat bottom right !important;
  background: url("images/shadow.gif") no-repeat bottom right;
  margin: 10px 0 0 10px !important;
  margin: 10px 0 0 5px;
  }

.img-shadowright img {
  display: block;
  position: relative;
  background-color: #fff;
  border: 1px solid #a9a9a9;
  margin: -6px 6px 6px -6px;
  padding: 4px;
  }