/* CSS Document */

<!-- Index page boxes / content -->

	#content1 {
		width: 400px;
		height: 200px; 
		background: #FFFFFF;
		text-align:left; 
		}

	#content {
		width: 400px;
		height: 50px; 
		background: #FFFFFF;
		text-align:left;
		border-right: 1px dashed #999999;
		border-bottom: 1px dashed #999999; 
		padding: 10px;
	}
		
	.box1, .box2, .box3, .box4, .box5, .box6, .box7, .box8, .box9, .box10, .clearbox {
		float: right;
		width: 45px;
		height: 45px;
		border: 1px solid #000;
		margin: 4px;
		padding: 4px;
		font: 0.7em "Trebuchet MS", sans-serif;
		text-decoration: none;
	}
		
	.box1 {color: #FFFFFF;
		background: #000066;
		text-align: left;	}
	.box1:hover {background: #FFFF99;
		color: #000000;
	
	}

		
	.box2 {color: #FFFFFF;
		background: #333333;
		text-align: left;	}
	.box2:hover {background: #CCCCCC;
		color: #000000;
	}
	
	.box3 {color: #FFFFFF;
		background: #006600;
		text-align: left;}
	.box3:hover {background: #FF99FF;
		color: #000000;
	}
	
	.box4 {color: #FFFFFF;
		background: #0099FF;
		text-align: left;	}
	.box4:hover {background: #FFFFFF;
		color: #000000;
	}
	
	.box5 {color: #FFFFFF;
		background: #CC0000;
		text-align: left;	}
	.box5:hover {background: #33FFFF;
		color: #000000;
	}

	.box6 {color: #FFFFFF;
		background: #FF6600;
		text-align: left;	}
	.box6:hover {background: #0066FF;
		color: #000000;
	}
	
	.box7 {color: #FFFFFF;
		background: #660033;
		text-align: left;	}
	.box7:hover {background: #99FFCC;
		color: #000000;
	}
	.box8 {color: #FFFFFF;
		background: #663300;
		text-align: left;	}
	.box8:hover {background: #99CCFF;
		color: #000000;
	}
	.box9 {color: #FFFFFF;
		background: #330033;
		text-align: left;	}
	.box9:hover {background: #CCFFCC;
		color: #000000;
	}
	.box10 {color: #FFFFFF;
		background: #006666;
		text-align: left;	}
	.box10:hover {background: #FF9999;
		color: #000000;
	}	
	
	.clearbox {	border: 1px solid white;
		background: white;
		color: white;
	}
	.clearbox:hover {background: white;
		color: white;
	}
	
	.clearboth {clear: both;}
	
<!-- Pages -->	
	#menu {
		border:none; 
		background:#fff;
		width: 800px;
		height: 22px;
		padding: 0px;
		text-align: right;
	}
	
	#footer {
		border:none; 
		background:#fff;
		width: 800px;
		height: 22px;
		padding: 0px;
		text-align: center;		
	}	
	
	#main {
		background:#fff;
		width: 800px;
		height: 600px;
	}
	
	.databox { float: right;
		height: auto;
		width: 350;
		border: 1px solid #000000;
		padding: 5px;
	}
				
	
<!-- Menu boxes -->

	.menubox1, .menubox2, .menubox3, .menubox4, .menubox5, .menubox6, .menubox7 {
		float: right;
		width: 55px;
		height: 20px;
		border: 0px solid #000;
		margin: 0px;
		padding: 2px;
		font: 0.7em "Trebuchet MS", sans-serif;
		text-decoration: none;
	}
		
	.menubox1 {color: #FFFFFF;
		background: #000066;
		text-align: left;	
	}
	.menubox1:hover {background: #FFFF99;
		color: #000000;
	
	}

		
	.menubox2 {color: #FFFFFF;
		background: #333333;
		text-align: left;	}
	.menubox2:hover {background: #CCCCCC;
		color: #000000;
	}
	
	.menubox3 {color: #FFFFFF;
		background: #006600;
		text-align: left;}
	.menubox3:hover {background: #FF99FF;
		color: #000000;
	}
	
	.menubox4 {color: #FFFFFF;
		background: #0099FF;
		text-align: left;	}
	.menubox4:hover {background: #FFFFFF;
		color: #000000;
	}
	
	.menubox5 {color: #FFFFFF;
		background: #CC0000;
		text-align: left;	}
	.menubox5:hover {background: #33FFFF;
		color: #000000;
	}

	.menubox6 {color: #FFFFFF;
		background: #FF6600;
		text-align: left;	}
	.menubox6:hover {background: #0066FF;
		color: #000000;
	}

	.menubox7 {color: #FFFFFF;
		background: #330033;
		text-align: left;	}
	.menubox7:hover {background: #CCFFCC;
		color: #000000;
	}

<!-- Family pages -->

	.fambox1, .fambox2, .fambox3, .fambox4, .fambox5, .fambox6, .fambox7 {
		float: left;
		width: 45px;
		height: 45px;
		border: 1px solid #000;
		margin: 4px;
		padding: 4px;
		font: 0.7em "Trebuchet MS", sans-serif;
		text-decoration: none;
	}
		
	.fambox1 {color: #FFFFFF;
		background: #000066;
		text-align: left;	}
	.fambox1:hover {background: #FFFF99;
		color: #000000;
	
	}
	.fambox2 {color: #FFFFFF;
		background: #333333;
		text-align: left;	}
	.fambox2:hover {background: #CCCCCC;
		color: #000000;
	}
	
	.fambox3 {color: #FFFFFF;
		background: #006600;
		text-align: left;}
	.fambox3:hover {background: #FF99FF;
		color: #000000;
	}
	
	.fambox4 {color: #FFFFFF;
		background: #0099FF;
		text-align: left;	}
	.fambox4:hover {background: #FFFFFF;
		color: #000000;
	}
	
	.fambox5 {color: #FFFFFF;
		background: #CC0000;
		text-align: left;	}
	.fambox5:hover {background: #33FFFF;
		color: #000000;
	}
	.fambox6 {color: #FFFFFF;
		background: #FF6600;
		text-align: left;	}
	.fambox6:hover {background: #0066FF;
		color: #000000;
	}
	.fambox7 {color: #FFFFFF;
		background: #330033;
		text-align: left;	}
	.fambox7:hover {background: #CCFFCC;
		color: #000000;
	}
	
<!-- family menu -->
	.fammenubox1, .fammenubox2, .fammenubox3, .fammenubox4, .fammenubox5, .fammenubox6, .fammenubox7 {
		float: left;
		width: 55px;
		height: 20px;
		border: 0px solid #000;
		margin: 0px;
		padding: 2px;
		font: 0.7em "Trebuchet MS", sans-serif;
		text-decoration: none;
	}
		
	.fammenubox1 {color: #FFFFFF;
		background: #000066;
		text-align: left;	
	}
	.fammenubox1:hover {background: #FFFF99;
		color: #000000;
	
	}

		
	.fammenubox2 {color: #FFFFFF;
		background: #333333;
		text-align: left;	}
	.fammenubox2:hover {background: #CCCCCC;
		color: #000000;
	}
	
	.fammenubox3 {color: #FFFFFF;
		background: #006600;
		text-align: left;}
	.fammenubox3:hover {background: #FF99FF;
		color: #000000;
	}
	
	.fammenubox4 {color: #FFFFFF;
		background: #0099FF;
		text-align: left;	}
	.fammenubox4:hover {background: #FFFFFF;
		color: #000000;
	}
	
	.fammenubox5 {color: #FFFFFF;
		background: #CC0000;
		text-align: left;	}
	.fammenubox5:hover {background: #33FFFF;
		color: #000000;
	}

	.fammenubox6 {color: #FFFFFF;
		background: #FF6600;
		text-align: left;	}
	.fammenubox6:hover {background: #0066FF;
		color: #000000;
	}
	
	.fammenubox7 {color: #FFFFFF;
		background: #330033;
		text-align: left;	}
	.fammenubox7:hover {background: #CCFFCC;
		color: #000000;
	}
