/*#############################################################
URL: http://templates.arcsin.se
#############################################################*/

/* STANDARD ELEMENTS */
		html {min-height: 100%;}
		
		* {
			margin: 0;
			padding: 0;
		}
		
		
		
		body {
			background: #E7E7E2 url('../images/layout/body.jpg') no-repeat center top;
			color: #444;
			font: normal 62.5% Tahoma,sans-serif;
		}
		
		p,code,ul {padding-bottom: 1.2em;}
		
		li {list-style: none;}
		
		
		form,input {margin: 0; padding: 0; display: inline;}
		
		code {
			background: #FFF;
			border: 1px solid #EEE;
			border-left: 6px solid #CCC;
			color: #666;
			display: block;
			font: normal 1em Tahoma,sans-serif;
			line-height: 1.6em;
			margin-bottom: 12px;
			padding: 8px 10px;
			white-space: pre;
		}
		
		blockquote {
			background: url(../images/layout/quote.gif) no-repeat;
			display: block;
			font-weight: bold;
			padding-left: 28px;
		}


/* STRUCTURE */
		.inner-container {
			border: 2px solid #D7D7D2;
			background: #FFF;
			font-size: 1.2em;
			margin: 0 auto;
			padding: 10px;
			width: 760px;
		}
		
		.outer-container {
			background: url('../images/layout/container.jpg') no-repeat center bottom;
		}



/* HEADER */
		.header {
			background: url('../images/layout/headbackcolor4.jpg');
			height: 190px;
		}
		
		.header h1{
	/* padding top and left positions text in the header box created by ".header" */
			padding-top: 80px;
	padding-left: 250px;
	font-family: "Lucida Sans";
	font-size: 30px;
	color: #FFFFFF;
		}
		
		.header a{
			text-decoration:none;
			color: #FFFFFF;
			padding-bottom:5;
		}
		
		
		
	/* header image class, moves pic left and positions off top, left, and bottom edge */
		.headimg {
			float:left;
			position: relative;
			left: 22px;
			top: 22px;
			right: 0px;
			bottom: 22px;
		}



/* PATH below header, has navigation elements */
		.path {
			background:#466962;
			color: #FFF;
			font: normal 1.1em Verdana,sans-serif;
			padding: 8px 12px;
			border-top-width: medium;
			border-right-width: medium;
			border-bottom-width: medium;
			border-left-width: medium;
			border-top-style: solid;
			border-top-color: #CCCCCC;
		}
		.path a {
			color: #FAFAFA;
			text-decoration: none;
		}
		.path a:hover {
			color: #FFE;
			text-decoration: underline;
		}
			
			

/* MAIN */
	.main {
	border-top: 4px solid #FFF;
	padding: 8px 12px 0 0;
	background-repeat: repeat-y;
	}
	
	/* content */
	.content {
	float: right;
	width: 560px;
	font-family: Verdana, Arial, Helvetica, sans-serif;	/* setting for font of main text */
	line-height:1.5em;
	}
	
	.content .descr {
		color: #664;
		font-size: 0.9em;
		margin-bottom: 6px;
	}
	
	.content a {color:#286EA0; font-weight:700;}
	.content a:visited{color:#3399CC;}
	
	.content li {
	list-style: url(../images/layout/li.gif);
	margin-left: 18px;
	}

/*list that has two columns....this is modified coding from a tutorial */
	
ul{
    margin: 0 auto;
}

/* The wider the #list_wrapper is, the more columns will fit in it */
#list_wrapper{
    width: 550px
}

/* The wider this li is, the fewer columns there will be */
    ul.multiple_columns li{
        text-align: left;
        float: left;
        height: 30px;
        width: 250px;
    }
	
	
/*end of tutorial coding */

	.content img {
	padding:10px;
}


	.content h2 {
	line-height:125%;
	font-size:135%;
	padding-bottom:10px;
}

	.content h3 {
	line-height:120%;
	font-size:125%;
	padding-bottom:10px;
}

/* LEFT NAVIGATION */
		/* TOP LEFT LINKS */
		
		.navigation {
			float: left;
			width: 160px;
			
		}

		.navigation h2 {
			color: #5A5A43;
			font: bold 1.1em Tahoma,sans-serif;
			line-height: 30px;
			margin: 0;
			padding-left: 12px;
		}
		.navigation ul {
			border-top: 1px solid #EAEADA;
			padding-top: 0;
			padding-right: 5;
			padding-bottom: 0;
			padding-left: 5px;
			width:160;
					}
			
		.navigation li a {
					background:url(../images/layout/menubg.gif) repeat-x bottom left;

	border-left:4px solid #ccc; /*preceding sets left side gray bar in link box */
	font-size: 1.3em;
	color: #0066FF;
	display: block;
	text-decoration: none;
	padding-top: 8px;
	padding-right: 0;
	padding-bottom: 8px;
	padding-left: 5%;
	width:150;
		}
		
		.navigation li a:hover {
			background:url(../images/layout/menubg2.gif) repeat-x bottom left;
			color:#333333;
			border-left-width: 4px;
			border-left-style: solid;
			border-top-color: #b0b0b0;
			border-right-color: #b0b0b0;
			border-bottom-color: #b0b0b0;
			border-left-color: #333333;
			border-top-width: 1px;
			border-right-width: 1px;
			border-bottom-width: 1px;
			border-top-style: solid;
			border-right-style: solid;
			border-bottom-style: solid;
		}


	/* LINKS TO OTHER THINGS */
		.navb {
			float: left;
			width: 160px;
		}
		.headnavb {
			color: #5A5A43;
			font: bold 1.1em Tahoma,sans-serif;
			line-height: 18px;
			margin: 0;
			padding-left: 12px;
		}
		.navb img{
	border:thin solid #999999;
		}		
		.navb ul {
			border-top: 1px solid #EAEADA;
			padding-top: 0;
			padding-right: 5;
			padding-bottom: 0;
			padding-left: 5px;
			width:160;
					}
			
		.navb li a {
	border-left:2px solid #ccc;
	color: #286EA0;
	display: block;
	text-decoration: none;
	padding-top: 8px;
	padding-right: 0;
	padding-bottom: 8px;
	padding-left: 5%;
	width:150;
	font-weight: bold;
		}
		
		.navb li a:hover {
			color:#333333;
			border-left-width: 2px;
			border-left-style: solid;
			border-left-color: #333333;
		}



/* FOOTER */
		.footer {
	background: #466962;
	color: #F7F7F2;
	font: bold 1em sans-serif;
	margin-top: 5px;
	padding-top: 10px;
	padding-right: 12px;
	padding-bottom: 10px;
	padding-left: 12px;
		}
		
		.footer a {
	color:#FFF;
		}
		

		.footer a:visited {
	color: #99FFCC;
}
		
		.footer a:hover {
	color: #999999;
}
			
			
/* ADD BOXES*/

	/* TOP BIG ADD BOX */
		.bigadbox {
		float: left;
		margin-top: 10px;
		margin-right: 35px;
		margin-bottom: 5px;
		margin-left: 0;
		border-top-width: 3px;
		border-right-width: 3px;
		border-bottom-width: 3px;
		border-left-width: 3px;
	}
	


	/* LEFT COLUMN ADD BOX */
		.leftadd {repeat-x bottom left #f4f4f4;
	border-bottom:1px solid #d8d8d8;
	border-left:1.3px solid #ccc;
	border-right:1px solid #d8d8d8;
	border-top:1px solid #d8d8d8;
	clear:left;
	line-height:1.3em;
	padding:5px;
	width:140px;
	margin-left: 7px;
	}

	/* BOTTOM FOOTER ADD BOX */



/* MISC */
			.clearer {clear: both; font-size: 0;}
			.left {
	float: left;
	margin-right: 7px;
}
			.right {float: right;}
			.center {text-align:center;}
			

/* TESTING - NOT BEING USED */

/* DIV box for posting a picture, floated left, and some text that runs off of the right side */
.pictextbox
{
	border:medium solid #CCFFCC;
	clear: left;
	float: left;
	height: 270px;
	width: 400px;
	margin-top: 5px;
	margin-bottom: 5px;
}
.picinbox
{
	border:medium inset #333333;
	margin: 5px;
}
			
/* MISC */

.blue {
	border: thin solid #2A3F55;
	background-color: #CCCCFF;
	padding-right: 5px;
}

.blue2 {
	border: thin solid #2A3F55;
	background-color: #CCCCFF;
	padding: 7px;
}

.addreplace
{
	width:300;
	height:250;
	float:left;
	padding: 15px;
}


/* MY CSS CODE TO MAKE PICTURE BOXES WITH TEXT UNDERNEATH THEM

the following set up picture/centered below text with a gray border box in the main content. The size of the phots may have to be adjusted, these are fine to work with 250 wide thumbs. Two .boxl can be used in a pair to make them fill two pictures across the page. The formatting of the picture/texts, i.e. their layout requirements, are found in the "untitled.html" file in the root directory. 2 pictures across, one picture to the left, or one picture to the right.

It may be necessary to use a div tag with a style="clear:both" after the pictures if they end up being unruly and running over and into things that come after them.
*/

.boxl{width:275px;height:auto;float:left;}

.boxr{width:275px;height:auto;float:right;margin-left:10px;}
/*the margin left here makes up for my content img CSS tag not having this to push text off the box*/

.box2{width:260px;height:auto;border: thin solid #CCCCCC;}

.box2nb{width:260px;height:auto;}

.box3{text-align:center;padding: 8px;}


.border {padding: 1px;display:inline;background: #cccccc;border: 4px solid #f0f0f0;}

.bold {font-weight: bold;}

.leftwheels {float: left;margin-right: 7px;	margin-top: 10px;}