html, body {
	background-color: #000;
	color: #fff;
	font-family: verdana, sans-serif, non-serif;
	font-size: 94%;
	margin: 0;
	padding: 0;
	}

/* page divisions */

#topline {
	padding:0;

	text-align: right;
	font-size: 90%;
	line-height: 3.5;
	margin:0;
	}
	
#topline p {
	padding: 2px;
	float:right;
	text-align: right;
	height: 100%;
	line-height: 3.5;
	margin:0 1em 0;
	background-color:#000;
	width:34%;
	color:#fff;
	}
	
#topline p a:link,#topline p a:visited  {
text-decoration:underline;
	color:#fff;
	}	
	
#topline p a:hover{color:#67a;}
#decorativeline {
	padding: 0;
	margin:0;
	background: #000 url(/images/t_head.jpg);
}	
	
#titleline {
	padding: 1px;
	width:50%;
	text-align:left;

}	

#menu {
	float: right;
	padding: 0;
	margin: 0 3% 3px 1px;
	background: #486d72;
	border: 2px solid #000;
	width: 16%; 
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 14%;
	}
	

#content {
	padding: 0 0 2px 2px;
	margin: 0 auto;
	width: 76%;
	}	
	
.contentright {
	float: right;
	padding: 0 6px 6px 6px;
	margin: 0 0 0 4px;
	text-align:left;	
	background:#fff;
	color:#000;	
	font-size:85%;		
	width: 62%; 
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 60%;
	}
	
.narr {
	padding: 4px 0 0 8px;
	margin: 4px 0 10px 8px;	
	text-align:left;	
	}
		
img {
	border:0;
	}		
.contentleft {
	padding: 2px 6px 2px 4px;
	margin:  0 8px 8px 6px;	
	width: 32%; 
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 30%;
	}	
#main {
	padding:0;
	margin:0 auto;
	width:96%;
	}	
#footer {
	padding: 0;
	background: #486d72 url(/images/b_head.jpg) repeat-x;
	}
	
/* top line navigation */


	
/* menu navigation */ 

#menu ul {
	padding: 0 4px 0 0;
	margin:0 4px 20px 0;
	font-size:75%;
	}	
#menu li {
	padding:0 6px;
	margin:0 0 6px 4px;
	list-style:none;
	}
		

	
/* content navigation */



/* basic */

image {
	border:0;
	}
	
h1 {
	font-size:220%;
	line-height: 1.2;	
	letter-spacing:1em;	
	border:0;
	padding:0;
	margin:0 0 0 .4em;
	color:#fff;
	text-shadow:2px 2px 2px #d2f8fb;
	font-family: "edding-780-1","edding-780-2",cursive;
	}	
h2 {
	font-size:140%;
	font-weight: bold;
	border:0;
	padding:0 2px;
	background: #486d72 url(/images/b_head.jpg) repeat-x;
	}
h3 {
	font-size:120%;
	font-weight: bold;
	border:0;
	padding:0;
	margin:0 0 20px 0;
	text-align:center;
	}	
	
.hometext {
	margin:8px 0 0 4px;
	vertical-align:top;
	}	
	
image.home {
	padding: 0 6px 0 0;
	}
	
.initial {
	letter-spacing:2px;	
	}

.pagetitle {
	float:right;
	color:#66ccff;
	padding:4px 20px 0 0;
	margin:0;
	font-size:140%;
	font-weight:bold;
	}
	
.clear {
	clear:both;
	}
	
.right {
	float:right;
	}	
	
#wrapper {width:100%;margin:0px auto;padding:0}


#container {
  background:url(../images/gradient.jpg);
  position:relative;
  width:99%px;
  height:43px;
}

#overlay {
  position:absolute;
  top:0;
  left;0;
   width:99%;
  height:43px;
  background:url(../images/overlay.png);
}


#webitect {
	margin: 2em;
	padding: 0;
}
#webitect li {
	margin: 0 0 2em .5em;
	font-size: 80%;
	line-height: 1.5;
		color:#fff;
}

body:nth-of-type(1) #webitect li{
	list-style-type:none;
	padding: 0 0 0 45px;
	position:relative;
		color:#fff;
}

body:nth-of-type(1) #webitect li:before{
	/*fill it with a blank space*/
	content:"\00a0";

	/*make it a block element*/
	display: block;
	color:#fff;
	
	/*adding an 8px round border to a 0x0 element creates an 8px circle*/
	border: solid 9px #000;
	border-radius: 9px;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	height: 0;
	width: 0;

	/*Now position it on the left of the list item, and center it vertically
	(so that it will work with multiple line list-items)*/
	position: absolute;
	left: 7px;
	top: 40%;
	margin-top: -8px;
}


body:nth-of-type(1) #webitect li:after{
	/*Add another block-level blank space*/
	content:"\00a0";
	display:block;
	color:#fff;

	/*Make it a small rectangle so the border will create an L-shape*/
	width: 3px;
	height: 6px; 

	/*Add a white border on the bottom and left, creating that 'L' */
	border: solid #fff;
	border-width: 0 2px 2px 0;

	/*Position it on top of the circle*/
	position:absolute;
	left: 14px;
	top: 40%;
	margin-top: -4px;  

	/*Rotate the L 45 degrees to turn it into a checkmark*/
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
}
