* {
	margin: 0;
	padding: 0;
}
        
.boxes {
	width: 960px;
	height: 304px;
	}

.menutext {
	margin: 10px 10px 10px 0px;
	}

#design1 {
	position: absolute;
	left: 0px;
	top: 0px;
	}

/*Cyan Box 1*/
#cyanbox1 {
	margin: 0;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #33cc99;
	width: 140px;
	height: 159px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 130px;
	height: 149px;
	}
html>body #cyanbox1 {
	width: 130px;
	height: 149px;
  	}	
#cyanwork1 {
	width: 120px;
	height: 121px;
	margin-top: 0px;
	margin-left: 0px;
	}
#cyanwork1 a {
   display: block;
   width: 120px;
   height: 121px;
   text-decoration: none;
   background: url(images/cyanwork1.jpg);
   }
#cyanwork1 a:hover {
  background-position: -120px 0;
  }

/*Blue Box 1*/
#bluebox1 {
	margin-left: 160px;
	margin-top: -159px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #3399cc;
	width: 222px;
	height: 159px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 212px;
	height: 149px;
	}
html>body #bluebox1 {
	width: 212px;
	height: 149px;
  	}
#bluework1 {
	width: 202px;
	height: 121px;
	margin-top: 0px;
	margin-left: 0px;
	}
#bluework1 a {
   display: block;
   width: 202px;
   height: 121px;
   text-decoration: none;
   background: url(images/bluework1.jpg);
   }
#bluework1 a:hover {
  background-position: -202px 0;
  }
  
/*Pink Box 1*/	
#pinkbox1 {
	margin-left: 401px;
	margin-top: -159px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #ff99cc;
	width: 140px;
	height: 159px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 130px;
	height: 149px;
	}
html>body #pinkbox1 {
	width: 130px;
	height: 149px;
  	}
#pinkwork1 {
	width: 120px;
	height: 121px;
	margin-top: 0px;
	margin-left: 0px;
	}
#pinkwork1 a {
   display: block;
   width: 120px;
   height: 121px;
   text-decoration: none;
   background: url(images/pinkwork1.jpg);
   }
#pinkwork1 a:hover {
  background-position: -120px 0;
  }

/*Red Box 1*/
#redbox1 {
	margin-left: 0px;
	margin-top: 20px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #cc3333;
	width: 301px;
	height: 127px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 291px;
	height: 117px;
	}
html>body #redbox1 {
	width: 291px;
	height: 117px;
  	}
#redwork1 {
	width: 281px;
	height: 89px;
	margin-top: 0px;
	margin-left: 0px;
	}
#redwork1 a {
   display: block;
   width: 281px;
   height: 89px;
   text-decoration: none;
   background: url(images/redwork1.jpg);
   }
#redwork1 a:hover {
  background-position: -281px 0;
	}

/*Grey Box 1*/
#greybox1 {
	margin-left: 320px;
	margin-top: -127px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #666666;
	width: 222px;
	height: 127px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 212px;
	height: 117px;
	}
html>body #greybox1 {
	width: 212px;
	height: 117px;
  	}
#greywork1 {
	width: 202px;
	height: 89px;
	margin-top: 0px;
	margin-left: 0px;
	}
#greywork1 a {
   display: block;
   width: 202px;
   height: 89px;
   text-decoration: none;
   background: url(images/greywork1.jpg);
   }
#greywork1 a:hover {
  background-position: -202px 0;
	}

#me {
	margin-left: 544px;
	margin-top: -301px;
	padding-left: 10px;
	padding-top: 10px;
	background-image: url(images/steven.png);
	background-repeat: no-repeat;
	width: 254px;
	height: 211px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 244px;
	height: 201px;
	}
html>body #me {
	width: 244px;
	height: 201px;
  	}
	
/*Purple Box 1*/
#purplebox1 {
	margin-left: 561px;
	margin-top: -85px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #333399;
	width: 141px;
	height: 85px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 131px;
	height: 75px;
	}
html>body #purplebox1 {
	width: 131px;
	height: 75px;
  	}
#purplework1 {
	width: 121px;
	height: 47px;
	margin-top: 0px;
	margin-left: 0px;
	}
#purplework1 a {
   display: block;
   width: 121px;
   height: 47px;
   text-decoration: none;
   background: url(images/purplework1.jpg);
   }
#purplework1 a:hover {
  background-position: -121px 0;
	}

/*Green Box 1*/
#greenbox1 {
	margin-left: 800px;
	margin-top: -306px;
	padding-left: 10px;
	padding-top: 10px;	
	top: 0px;
	background-color: #99cc33;
	width: 142px;
	height: 139px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 132px;
	height: 129px;
	}
html>body #greenbox1 {
	width: 132px;
	height: 129px;
  	}
#greenwork1 {
	width: 122px;
	height: 101px;
	margin-top: 0px;
	margin-left: 0px;
	}
#greenwork1 a {
   display: block;
   width: 122px;
   height: 101px;
   text-decoration: none;
   background: url(images/greenwork1.jpg);
   }
#greenwork1 a:hover {
  background-position: -122px 0;
	}


/*Maroon Box 1*/
#maroonbox1 {
	margin-left: 720px;
	margin-top: 19px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #660033;
	width: 222px;
	height: 147px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 212px;
	height: 137px;
	}
html>body #maroonbox1 {
	width: 212px;
	height: 137px;
  	}
#maroonwork1 {
	width: 202px;
	height: 109px;
	margin-top: 0px;
	margin-left: 0px;
	}
#maroonwork1 a {
   display: block;
   width: 202px;
   height: 109px;
   text-decoration: none;
   background: url(images/maroonwork1.jpg);
   }
#maroonwork1 a:hover {
  background-position: -202px 0;
	}	
	
/*DESIGN 2*/		
#design2 {
	position: absolute;
	left: 960px;
	top: 0px;
	}

/*Large Blue Box 2*/		
#lgbluebox2 {
	margin-left: 0px;
	margin-top: 0px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #3399cc;
	width: 222px;
	height: 176px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 212px;
	height: 166px;
	}
html>body #lgbluebox2 {
	width: 212px;
	height: 166px;
  	}
#lgbluework2 {
	width: 202px;
	height: 138px;
	margin-top: 0px;
	margin-left: 0px;
	}
#lgbluework2 a {
   display: block;
   width: 202px;
   height: 138px;
   text-decoration: none;
   background: url(images/lgbluework2.jpg);
   }
#lgbluework2 a:hover {
  background-position: -202px 0;
	}	
	
/*Pink Box 2*/		
#pinkbox2 {
	margin-left: 0px;
	margin-top: 20px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #ff99cc;
	width: 222px;
	height: 109px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 212px;
	height: 99px;
	}
html>body #pinkbox2 {
	width: 212px;
	height: 99px;
  	}
#pinkwork2 {
	width: 202px;
	height: 71px;
	margin-top: 0px;
	margin-left: 0px;
	}
#pinkwork2 a {
   display: block;
   width: 202px;
   height: 71px;
   text-decoration: none;
   background: url(images/pinkwork2.jpg);
   }
#pinkwork2 a:hover {
  background-position: -202px 0;
	}	

/*Grey Box 2*/		
#greybox2 {
	margin-left: 242px;
	margin-top: -306px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #666666;
	width: 141px;
	height: 146px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 131px;
	height: 136px;
	}
html>body #greybox2 {
	width: 131px;
	height: 136px;
  	}
#greywork2 {
	width: 121px;
	height: 108px;
	margin-top: 0px;
	margin-left: 0px;
	}
#greywork2 a {
   display: block;
   width: 121px;
   height: 108px;
   text-decoration: none;
   background: url(images/greywork2.jpg);
   }
#greywork2 a:hover {
  background-position: -121px 0;
	}	

/*Black Box 2*/		
#blackbox2 {
	margin-left: 402px;
	margin-top: -146px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #000000;
	width: 141px;
	height: 146px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 131px;
	height: 136px;
	}
html>body #blackbox2 {
	width: 131px;
	height: 136px;
  	}	
#blackwork2 {
	width: 121px;
	height: 108px;
	margin-top: 0px;
	margin-left: 0px;
	}
#blackwork2 a {
   display: block;
   width: 121px;
   height: 108px;
   text-decoration: none;
   background: url(images/blackwork2.jpg);
   }
#blackwork2 a:hover {
  background-position: -121px 0;
	}	
	
/*Red Box 2*/		
#redbox2 {
	margin-left: 242px;
	margin-top: 20px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #cc3333;
	width: 302px;
	height: 141px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 292px;
	height: 131px;
	}
html>body #redbox2 {
	width: 292px;
	height: 131px;
  	}	
#redwork2 {
	width: 282px;
	height: 103px;
	margin-top: 0px;
	margin-left: 0px;
	}
#redwork2 a {
   display: block;
   width: 282px;
   height: 103px;
   text-decoration: none;
   background: url(images/redwork2.jpg);
   }
#redwork2 a:hover {
  background-position: -282px 0;
	}	

/*Blue Box 2*/		
#bluebox2 {
	margin-left: 563px;
	margin-top: -306px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #3399cc;
	width: 219px;
	height: 109px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 209px;
	height: 99px;
	}
html>body #bluebox2 {
	width: 209px;
	height: 99px;
  	}	
#bluework2 {
	width: 199px;
	height: 71px;
	margin-top: 0px;
	margin-left: 0px;
	}
#bluework2 a {
   display: block;
   width: 199px;
   height: 71px;
   text-decoration: none;
   background: url(images/bluework2.jpg);
   }
#bluework2 a:hover {
  background-position: -199px 0;
	}	
	
/*Purple Box 2*/		
#purplebox2 {
	margin-left: 563px;
	margin-top: 20px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #3333cc;
	width: 219px;
	height: 178px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 209px;
	height: 168px;
	}
html>body #purplebox2 {
	width: 209px;
	height: 168px;
  	}	
#purplework2 {
	width: 199px;
	height: 140px;
	margin-top: 0px;
	margin-left: 0px;
	}
#purplework2 a {
   display: block;
   width: 199px;
   height: 140px;
   text-decoration: none;
   background: url(images/purplework2.jpg);
   }
#purplework2 a:hover {
  background-position: -199px 0;
	}
	
/*Cyan Box 2*/		
#cyanbox2 {
	margin-left: 800px;
	margin-top: -307px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #33cc99;
	width: 141px;
	height: 144px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 131px;
	height: 134px;
	}
html>body #cyanbox2 {
	width: 131px;
	height: 134px;
  	}	
#cyanwork2 {
	width: 121px;
	height: 106px;
	margin-top: 0px;
	margin-left: 0px;
	}
#cyanwork2 a {
   display: block;
   width: 121px;
   height: 106px;
   text-decoration: none;
   background: url(images/cyanwork2.jpg);
   }
#cyanwork2 a:hover {
  background-position: -121px 0;
	}

/*Green Box 2*/		
#greenbox2 {
	margin-left: 800px;
	margin-top: 18px;
	padding-left: 10px;
	padding-top: 10px;	
	background-color: #99cc33;
	width: 141px;
	height: 144px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 131px;
	height: 134px;
	}
html>body #greenbox2 {
	width: 131px;
	height: 134px;
  	}	
#greenwork2 {
	width: 121px;
	height: 106px;
	margin-top: 0px;
	margin-left: 0px;
	}
#greenwork2 a {
   display: block;
   width: 121px;
   height: 106px;
   text-decoration: none;
   background: url(images/greenwork2.jpg);
   }
#greenwork2 a:hover {
  background-position: -121px 0;
	}
	
/*PHOTO I*/			
#photo1 {
	position: absolute;
	left: 1920px;
	top: 0px;
	}
	
/*Green Box 3*/			
#greenbox3 {
	margin-left: 0px;
	margin-top: 0px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #99cc33;
	width: 141px;
	height: 160px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 131px;
	height: 150px;
	}
html>body #greenbox3 {
	width: 131px;
	height: 150px;
  	}	
#greenwork3 {
	width: 121px;
	height: 122px;
	margin-top: 0px;
	margin-left: 0px;
	}
#greenwork3 a {
   display: block;
   width: 121px;
   height: 122px;
   text-decoration: none;
   background: url(images/greenwork3.jpg);
   }
#greenwork3 a:hover {
  background-position: -121px 0;
	}
	
/*Pink Box 3*/			
#pinkbox3 {
	margin-left: 161px;
	margin-top: -160px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #ff99cc;
	width: 141px;
	height: 160px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 131px;
	height: 150px;
	}
html>body #pinkbox3 {
	width: 131px;
	height: 150px;
  	}		
#pinkwork3 {
	width: 121px;
	height: 122px;
	margin-top: 0px;
	margin-left: 0px;
	}
#pinkwork3 a {
   display: block;
   width: 121px;
   height: 122px;
   text-decoration: none;
   background: url(images/pinkwork3.jpg);
   }
#pinkwork3 a:hover {
  background-position: -121px 0;
	}

/*Blue Box 3*/			
#bluebox3 {
	margin-left: 0px;
	margin-top: 18px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #3399cc;
	width: 302px;
	height: 127px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 292px;
	height: 117px;
	}
html>body #bluebox3 {
	width: 292px;
	height: 117px;
  	}
#bluework3 {
	width: 282px;
	height: 89px;
	margin-top: 0px;
	margin-left: 0px;
	}
#bluework3 a {
   display: block;
   width: 282px;
   height: 89px;
   text-decoration: none;
   background: url(images/bluework3.jpg);
   }
#bluework3 a:hover {
  background-position: -282px 0;
	}
	
/*Grey Box 3*/			
#greybox3 {
	margin-left: 321px;
	margin-top: -306px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #666666;
	width: 222px;
	height: 139px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 212px;
	height: 129px;
	}
html>body #greybox3 {
	width: 212px;
	height: 129px;
  	}			
#greywork3 {
	width: 202px;
	height: 101px;
	margin-top: 0px;
	margin-left: 0px;
	}
#greywork3 a {
   display: block;
   width: 202px;
   height: 101px;
   text-decoration: none;
   background: url(images/greywork3.jpg);
   }
#greywork3 a:hover {
  background-position: -202px 0;
	}
	
/*Cyan Box 3*/			
#cyanbox3 {
	margin-left: 321px;
	margin-top: 20px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #33cc99;
	width: 222px;
	height: 147px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 212px;
	height: 137px;
	}
html>body #cyanbox3 {
	width: 212px;
	height: 137px;
  	}
#cyanwork3 {
	width: 202px;
	height: 109px;
	margin-top: 0px;
	margin-left: 0px;
	}
#cyanwork3 a {
   display: block;
   width: 202px;
   height: 109px;
   text-decoration: none;
   background: url(images/cyanwork3.jpg);
   }
#cyanwork3 a:hover {
  background-position: -202px 0;
	}
	
/*Red Box 3*/			
#redbox3 {
	margin-left: 564px;
	margin-top: -306px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #cc3333;
	width: 219px;
	height: 119px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 209px;
	height: 109px;
	}
html>body #redbox3 {
	width: 209px;
	height: 109px;
  	}	
#redwork3 {
	width: 199px;
	height: 81px;
	margin-top: 0px;
	margin-left: 0px;
	}
#redwork3 a {
   display: block;
   width: 199px;
   height: 81px;
   text-decoration: none;
   background: url(images/redwork3.jpg);
   }
#redwork3 a:hover {
  background-position: -199px 0;
	}
	
/*Purple Box 3*/			
#purplebox3 {
	margin-left: 564px;
	margin-top: 20px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #333399;
	width: 219px;
	height: 167px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 209px;
	height: 157px;
	}
html>body #purplebox3 {
	width: 209px;
	height: 157px;
  	}	
#purplework3 {
	width: 199px;
	height: 129px;
	margin-top: 0px;
	margin-left: 0px;
	}
#purplework3 a {
   display: block;
   width: 199px;
   height: 129px;
   text-decoration: none;
   background: url(images/purplework3.jpg);
   }
#purplework3 a:hover {
  background-position: -199px 0;
	}
	
/*Black Box 3*/			
#blackbox3 {
	margin-left: 801px;
	margin-top: -305px;
	padding-left: 10px;
	padding-top: 10px;
	background-color: #000000;
	width: 141px;
	height: 304px;
  	voice-family: "\"}\"";
  	voice-family: inherit;
	width: 131px;
	height: 294px;
	}
html>body #blackbox3 {
	width: 131px;
	height: 294px;
  	}	
#blackwork3 {
	width: 121px;
	height: 266px;
	margin-top: 0px;
	margin-left: 0px;
	}
#blackwork3 a {
   display: block;
   width: 121px;
   height: 266px;
   text-decoration: none;
   background: url(images/blackwork3.jpg);
   }
#blackwork3 a:hover {
  background-position: -121px 0;
	}