/* CSS Document */

/* basic */
html,body{height:100%}
html,body,div,p,table,tr,td,h1,h2,h3,h4,h5,form,img,map,area{margin:0;border:0;padding:0;}
body{background-color:#DADBD7;text-align:center;color:#333333;font:normal normal normal 10px/15px Arial, Helvetica, sans-serif;}
table,td{color:#666;font:normal normal normal 10px/15px Arial, Helvetica, sans-serif;}
p{margin-bottom:5px;}
p a:link,p a:visited{text-decoration:none;color:#CC0066;}
p a:hover{text-decoration:underline;color:#99cc00;}
.pbot{margin:0;}
.img1{padding:4px;}
.img2{padding-top:47px;}
.tx01{padding-left:8px;font:normal normal normal 9px/12px Arial, Helvetica, sans-serif;}
.textgreen{ color:#99CC00; font-weight:bold; font-size: 14px; text-transform: uppercase; margin: 4px; padding-top: 2px; border-top: 1px solid #666666;
}
.textgreen a {
	text-decoration: none;
}
.tx03{color:#999;font:normal normal normal 9px/12px Arial, Helvetica, sans-serif;margin:0px 0 3px 8px;}
.tx04{color:#999;font:normal normal normal 9px/12px Arial, Helvetica, sans-serif;margin-left:8px;}


h1{color:#99CC00;font:bold 20px/22px Arial, Helvetica, sans-serif; text-transform: uppercase;}
h2{color:#333;font:bold 18px/20px Arial, Helvetica, sans-serif;margin-bottom:3px;}
h3{color:#99CC00;font:16px/18px Arial, Helvetica, sans-serif;margin-bottom:5px;}
h4{color:#99CC00;font:12px/14px Arial, Helvetica, sans-serif;margin:5px 0 5px 10px;}
h5{color:#333;font:10px/16px Arial, Helvetica, sans-serif;margin-bottom:3px;}
h6{color:#99CC00;font:9px/12px Arial, Helvetica, sans-serif;margin:5px 0 5px 20px;text-decoration: none;
}
a {
	color: #99CC00;
	text-decoration: none;
}

/* boxes */
#wholebox{
	width:628px;
	margin:0 auto; 
	
		}
		
#topobox{width:628px;height:30px;background:url(images/topbar.jpg) #fefefe no-repeat;}
#middleobox{text-align:left;width:628px;background:url(images/middlebar.jpg) #fefefe repeat-y;}
#bxcont210{\width:628px;width:540px;padding:0 44px;}
#bxcont211{width:540px;height:40px;}
#sidesobox{width:540px;height:207px;background:#fefefe url(images/middlebar.jpg) no-repeat;}
#bxcont213{width:540px;height:30px;}
#bxcont214{width:540px;height:20px;}

#bottomoboxtop{clear:both;width:540px;height:5px;}

#bottomobox{
	width:628px;
	height:30px;
	background-image: url(images/bottombar.jpg);
	background-repeat: no-repeat;
}
.stories img {
	padding: 3px 5px 3px 3px;
	border: 1px solid #B5F232;
	margin: 2px;
}
#bottomoboxcenter{\width:628px;w\idth:540px;padding:0 44px;}
#bxcont311{width:540px;height:30px;}

#cbhead100{float:right;text-align:right;height:18px;voice-family:"\"}\"";voice-family:inherit;height:10px;padding-top:8px;}
#cbmain200{width:540px;}
#cbfoot000{float:left;text-align:left;padding-top:25px;}
#cbfoot100{float:right;width:98px;height:35px;voice-family:"\"}\"";voice-family:inherit;height:10px;padding-top:25px;}


/* Stories */
.mod000{width:540px;}
.leftlane{float:left;width:152px;height:250px;}
.stories{
	float:right;
	width:360px;
}
.stories p{margin:0 5px 10px 10px;}

.stories ul{list-style: none;margin:0;padding:0;border:none;}
.stories li{border-bottom:2px solid #8AAD00;margin:0;}
.stories li a{display: block;padding: 1px 1px 1px 1px; color:#CCF00;text-decoration:none;}
html>body .stories li a{width:auto;}
.stories li a:hover{color:#99cc00;}


/* scrolling story box on right */

#storyboxscroll {
        margin-bottom:50px;
		overflow: auto;
		height: 500px;
    }
#storyboxscroll li {
	list-style-type: none;
	color: #666666;
}
 #storyboxscroll p,
 #storyboxscroll li,
 #storyboxscroll li div {
	    line-height:20px !important;
    }	
 #storyboxscroll p img {
        float:left;
        margin:0px 10px 0px 10px;
    }
    
    div.storyboxscroll h3 a {
        font-family:arial, sans-serif;
        font-size:14px;
    }
	
	/* white scrolling story box on right */

#storyboxscrollwhite {
	width: 500px;
	margin-bottom:50px;
	margin-left:50px;
	overflow: auto;
	height: 500px;
	background-color: #FFFFFF;
    }
#storyboxscrollwhite li {
	list-style-type: none;
	color: #666666;
}
 #storyboxscrollwhite p,
 #storyboxscrollwhite li,
 #storyboxscrollwhite li div {
	line-height:20px !important;
	padding-left: 8px;
	padding-right: 8px;
    }	

	 #storyboxscrollwhite h6 {
	color:#99CC33;
	font:bold 18px/24px Arial, Helvetica, sans-serif;
	margin:0px;
	text-decoration: none;
	padding-top: 15px;
	padding-bottom: 10px;
    }
    
	 #storyboxscrollwhite a:hover {
	color:#99CC33;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
    }
    div.storyboxscrollwhite h3 a {
        font-family:arial, sans-serif;
        font-size:14px;
    }
	
	#storyboxscrollwhite img {
	margin-left:8px;
	margin-right:8px;
}

/*

.mod003{\width:360px;w\idth:345px;height:108px;voice-family:"\"}\"";voice-family:inherit;height:98px;padding:5px 5px 5px 10px;}
.mod004{width:345px;height:98px;background:url(../archkid_web/archbox/fr_imgbg_03.gif) #fefefe no-repeat;}
.mod005{margin-bottom:15px;border:1px solid #ccc;padding:5px 0;}
.mod005 p{margin-bottom:3px;}
.mod006{width:360px;height:55px;}
.mod007{float:left;width:75px;}
.mod008{float:left;width:275px;}
*/

/* Tables */
.tb000{width:345px;text-align:left;}
.tb01 td{font:normal normal normal 11px/15px Arial, Helvetica, sans-serif;}
.col001{width:55px;}
.col002{width:15px;}
.col003{width:228px;}
.col004{width:32px;text-align:right;}

	
	
/*  LEFT BOXES */
	
div.leftbox {
		border:1px dashed #333333;
		background-color:#B5F232;
        margin-top:15px;
        margin-bottom:20px;
	}
	
	
div.leftbox p,
div.leftbox form {
		margin:12px 8px 12px 8px;
		/* font-family:tahoma !important */;
		font-size:11px !important;
	}
	
div.leftbox h2 {
	position:absolute;
	margin:-5px 0px 0px -5px;
	font-size:12px;
	color:#FF6600;
	background-color: #FFFFFF;
	line-height: 18px;
	border: 1px solid #666666;
	padding: 2px;
	width: 126px;
	}
    
div.leftbox h3 {
        margin:12px 28px 12px 8px;
    }
	
	
	/* SCROLLBOX ON LEFT */
	
div.leftboxscroll {
	border:1px solid #333333;
	background-color:#B5F232;
	margin-top:15px;
	margin-bottom:20px;
	overflow: auto;
	height: 100px;
	}
	
	
div.leftboxscroll p,
div.leftboxscroll form {
		margin:12px 8px 12px 8px;
		/* font-family:tahoma !important */;
		font-size:11px !important;
	}
	
div.leftboxscroll h2 {
	position:absolute;
	margin:-5px 0px 0px -5px;
	font-size:12px;
	color:#FF6600;
	background-color: #FFFFFF;
	line-height: 18px;
	border: 1px solid #666666;
	padding: 2px;
	}
    
div.leftboxscroll h3 {
        margin:12px 28px 12px 8px;
    }


/* Nav on left */
#nav {width:140px;padding:0 0 0 0;font-family: Arial, Helvetica, sans-serif;color:#999;}
#nav ul{list-style: none;margin:0;padding:0;border:none;}
#nav li{border-bottom:1px solid #fefefe;margin:0;}
#nav li a{display: block;padding: 3px 3px 3px 10px;border-left: 12px solid #99cc00;color:#666;text-decoration:none;}
html>body #nav li a{width:auto;}
#nav li a:hover{border-left:10px solid #ccc;color:#99cc00;}

/* Forms */
.txfm1{color:#333;font:normal normal normal 10px/14px Arial, Helvetica, sans-serif;background-color:#fefefe;border:1px solid #ccc;}
.txfm2{color:#333;font:normal normal normal 9px/9px Arial, Helvetica, sans-serif;background-color:#fefefe;border:1px solid #ccc;}
.txfm3{
	color:#666666;
	font:11px/14px Arial, Helvetica, sans-serif;
	background-color:#fefefe;
	text-decoration: none;
	padding: 3px;
	margin: -15px;
	border-top: 5px solid #99CC00;
}
.txfm3 a:link {
	text-decoration: none;
	color: #666666;
	text-transform: uppercase;
}
#materials {
	background-image: url(images/greypattern.jpg);
}

#play {
	background-image: url(../archkid_web/images06/purpledotsbkgrd.gif);
}

#learn {
	background-image: url(images/greengreypattern.jpg);
	background-color: #999999;
}
.purple12arial {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 14px;
	color: #990099;
	font-weight: bold;
	padding-left: 5px;
}

#photosgrid{
	width: 280px;
	margin: 5px 0px 0px 35px;
}