/* andreas01 -background: #f4f4f4 url(bg.gif) top center repeat-y; an open source xhtml/css website layout by Andreas Viklund (http://andreasviklund.com). Made for OSWD.org, free to use as-is for any purpose as long as the proper credits are given for the original design work. For design assistance and support, contact me through my website or through http://oswd.org/email.phtml?user=Andreas

Version: 1.0
(July 25, 2005)

Screen layout small screens: */

  #nav, #announce, #extras, .noprint {display: none;}
width: 100%; margin: 0; float: none;

body {
margin: 0 auto;
width: 100%; 
padding: 0;
font: 100% Arial,sans-serif;
}


#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }

#lightbox img{ border: none; } 
#overlay img{ border: none; }
#overlay{ background-image: url(overlay.png); }

* html #overlay{
	background-color: #000;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="overlay.png", sizingMethod="scale");
	}
#wrap {
background: #ffffff;
color: #303030;
margin: 0 auto;
width: 95%;
}

#header {
clear: both;
margin: 20px  0 5px 0;
padding: 0;
height: 80px;
width: 100%;
float: left;
display: block;
color: #FFFF00;
background: #3f3f3f;
font-size: 2em;
text-align: right;

}

#header a[href^="mailto"]{color:#ffff00;}

#header h1 {
width: 37.5%;
margin: 0 0 10px 0;
float: left;
}

#header p {
width: 62.5%;
float: right;
text-align: center;
color: #a0a0a0;
margin: 0 0 10px 0;
font-size: 0.8em;
line-height: 4em;
}

#frontphoto {
margin: 0 0 10px 0;
border: 0;
}

  #box1 div { display: none; position: relative; left: -20px; top:  -3em; }
 /*  #text-box-1 { display: block; } */
  #box1:hover div {float:right; display: block; width: 32em; font-size: 100%; background-color: #FFF; }

  #box1b div { display: none; position: relative; left: -20px; top:  -7em; }
 /*  #text-box-1 { display: block; } */
  #box1b:hover div {float:right; display: block; width: 32em; font-size: 100%; background-color: #FFF; }
  #box1c div { display: none; position: relative; left: -20px; top:  -11em; }
 /*  #text-box-1 { display: block; } */
  #box1c:hover div {float:right; display: block; width: 32em; font-size: 100%; background-color: #FFF; }
  #box1d div { display: none; position: relative; left: -20px; top:  -15em; }
 /*  #text-box-1 { display: block; } */
  #box1d:hover div {float:right; display: block; width: 32em; font-size: 100%; background-color: #FFF; }
  #box1e div { display: none; position: relative; left: -20px; top:  -19em; }
 /*  #text-box-1 { display: block; } */
  #box1e:hover div {float:right; display: block; width: 32em; font-size: 100%; background-color: #FFF; }
  #box1f div { display: none; position: relative; left: -20px; top:  -23em; }
 /*  #text-box-1 { display: block; } */
  #box1f:hover div {float:right; display: block; width: 32em; font-size: 100%; background-color: #FFF; }

  #box2 div { display: none; position: relative; left: 0px; top:  0px; }
 /*  #text-box-2 { display: block; } */

  #box2:hover div { display: block; width: 60em; font-size: 100%; background-color: #FFF; }

#avmenu {
clear: both;
width: 100%;
height: 80px;
margin: 0 0 0px 0;
padding: 0;
font-size: 2em;
vertical-align: middle;
}

#avmenu ul {    
list-style: none;
margin: 0 0 0px 0;
padding: 0;
vertical-align: middle;
width: 100%;


}   

#avmenu li {
height: 80px;
vertical-align: middle;
display: block;
width: 20%;
float: left;
}

#avmenu li a {

display: block;
text-align:center;
vertical-align: middle;
height: 80px;
text-decoration: none;
color: #FFFF00;
padding: 0px 0 0 0px;
background: #3f3f3f;
border-left: 0px;
}   
#avmenu li.active a{
font-weight:600;
background: #3f3f3f;
color:#ffff00 ;
border-left: 0px;
text-decoration:underline;
}
#avmenu li.active a:hover {
background: #ffff00;
color: #3f3f3f;
border-left: 0px;
}

#avmenu li a:hover {
background: #FFFF00;
color: #3f3f3f;
border-left: 0px;
}

#avmenub {
clear: both;
width: 100%;
margin: 0 0 10px 0;
padding: 0;
height:80px
}

#avmenub ul {    
list-style: none;
margin: 0 0 0px 0;
padding: 0;
width: 100%;

}   

#avmenub li {
margin-bottom: 4px;
border-bottom: 2px solid #f0f0f0;
display: block;
width: 16.66%;
float: left;
}

#avmenub li a {
font-weight: 100;
display: block;
text-align:center;
vertical-align: middle;
font-size: 2em;
height: 80px;
text-decoration: none;
color: #000000;
padding: 0px 0 0 0px;
background: #ffffff;
border-left: 0px;
}   
    
#avmenub li.active a {
background: #ffffff;
color: #3f3f3f;
border-left: 0px;
font-weight: 600;
text-decoration:underline;
}

#avmenub li a:hover {
background: #ffff00;
color: #3f3f3f;
border-left: 0px;
}










#content {

margin-left:0px;
width: 100%;


font-size: 2em;

text-align: left;
}


#flvideo {
margin: 0 0px 0 0;
border-left: 0px;
border-right: 0px;
padding: 0 0 0 0;
line-height: 1.6em;
text-align: left;
}

#content h1 {
font-size: 2.2em;
line-height: 1em;
margin: 0 0 1em 0;
}

#content h2 {
font-size: 2.2em;
line-height: 1em;
margin: 0 0 1em 0;
}
h2b {
display: block;
width:250px;
font-size: 1.3em;
margin: 0 0 0.em 0em;
background: #cccccc;
padding: 0.5em 0.5em 0.25em 0.25em;
border: 2px solid #f0f0f0;
}

#content img {
padding: 1px;
display:inline;
border: 0px solid #f0f0f0;
}

h3 {
font-size: 1.3em;
margin: 0 0 10px 0;
}

a {
text-decoration: none;
color: #286ea0;
}

a:hover {
text-decoration: underline;
color: #286ea0;
}

a img {
border: 0;
}

#footer {
clear: both;
margin: 0 auto;
padding: 10px 0 20px 0;
border-top: 4px solid #f0f0f0;
width: 95%;
text-align: center;
color: #808080;
font-size: 0.9em;
}

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

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

.left {
margin: 10px 10px 5px 0;
float: left;
}

.right {
margin: 10px 0 5px 10px;
float: right;
}
.centerimg {
display: block;
margin-left:auto;
margin-right:auto;
}
.textright {
text-align: right;
}

.center {
text-align: center;
}

.small {
font-size: 0.8em;
}

.bold {
font-weight: bold;
}

.hide {
display: none;
}

#slideshow {
    margin: 10px auto;
    position: relative;
    width: 400px;
    height: 600px;
    padding: 10px;
  
}

#slideshow > div {
    position: absolute;
    top: 10px;
   left: 10px;
   right: 10px;
    bottom: 10px;
}


table.sample {
	border-width: 1px;
	border-spacing: 0px;
	border-style: none;
	border-color: gray;
	border-collapse: separate;
	background-color: white;
}
table.sample th {
	border-width: 3px;
	padding: 5px;
	text-align:center;
	border-style: none;
	border-color: gray;
	background-color: white;
	-moz-border-radius: ;
}
table.sample td {
	border-width: 3px;
	padding: 5px;
	vertical-align:top;
	border-style: none;
	border-color: gray;
	background-color: white;
	-moz-border-radius: ;
}