@charset "UTF-8";
/* CSS Document */
* {
	margin:0;
	padding:0;
}
	
body {
	background: top left url(images/bg.gif) #111;
	font:Arial, Helvetica, sans-serif;
	color:#111;
	font-size:12px;
}

#container {
	position:relative;
	width:796px;				
	margin:0px auto;		/* Centre	*/
	margin-top:50px; 			/*Space at the top */
	background: #fff;
	border:3px solid #666;
}

#title {
	background: url(images/title.png) top left no-repeat;
	height:170px;
	width:100%;
}

#title h1 span {
	display:none;				/* hide title text	*/
}

#title h2 span {
	display:none;				/* hide title text	*/
}

#title.websites_title {
	background: url(images/websites_title.png) top left no-repeat;
}

#title.design_title {
	background: url(images/design_title.png) top left no-repeat;
}

#title ul {
	list-style:none;
}

#title li {
	height:260px;
	width:260px;
	position:absolute; 
	top: 142px;
}

#title li.back {
	background:transparent url(images/back.png) no-repeat; 
	left: 738px;
}

#title a {
	display:block;					
	height:0px;				/*stops text being displayed*/
	width:48px;				/*width of lin area*/
	padding-top:25px;		/*height of link area*/
	overflow:hidden;
}

#title a#back {
	background:transparent url(images/back_over.png) -300px -300px no-repeat;
}

#title a#back:hover {
	background-position: 0 0; z-index:50;   /*negative values of any margin defined in the #content a parenthesis*/
}

#footer {
	background: url(images/footer.png) top left no-repeat;
	height:56px;
	width:100%;
	padding:8px 0 0 18px;
	text-align:left;
}

p,ul {
	padding-bottom:7px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
}

a {
	text-decoration:none;
	color:#333333;
}

a:hover {
	text-decoration:underline;
}

/*____________ end of general css ________________*/

/*____________ index specific ____________________*/

#content {
	background: url(images/content.png) no-repeat top #fff;
	height:378px;
	width:100%;
}


#content ul {
	list-style:none;
}

#content li {
	height:260px;
	width:260px;
	position:absolute; 
	top: 186px;
}

#content li.websites {
	background:transparent url(images/websites.png) no-repeat; 
	left: 22px;
}

#content li.design {
	background:transparent url(images/design.png) no-repeat;
	left: 286px;
}

#content li.cv {
	background:transparent url(images/cv.png) no-repeat;
	left: 552px;
}

#content a {
	display:block;					
	height:0px;				/*stops text being displayed*/
	width:220px;			/*width of lin area*/
	padding-top:186px;		/*height of link area*/
	overflow:hidden;
}

#content a#websites {
	background:transparent url(images/websites_over.png) -300px -300px no-repeat;
}

#content a#websites:hover {
	background-position: 0 0; z-index:50;   /*negative values of any margin defined in the #content a parenthesis*/
	margin:0;
}

#content a#design {
	background:transparent url(images/design_over.png) -300px -300px no-repeat;
}

#content a#design:hover {
	background-position: 0 0; z-index:50;	/*negative values of any margin defined in the #content a parenthesis*/
	margin:0;
}

#content a#cv {
	background:transparent url(images/cv_over.png) -300px -300px no-repeat;
}

#content a#cv:hover {
	background-position: 0 0; z-index:50;	/*negative values of any margin defined in the #content a parenthesis*/
	margin:0;
}

#content p {
	text-align:left;
	padding:300px 0px 0px 22px;
	width:626px;
}
/*___________________ end of index specific ___________*/

/*___________________ website.htm specific ________________*/


#web-content {
	background: url(images/websites_content.png) no-repeat top #fff;
	height:378px;
	width:100%;
}


#web-content ul.menu {
	list-style:none;
}

#web-content li {
	height:367px;
	width:261px;
	position:absolute; 
	top: 182px;
}

#web-content li.varsity {
	background:transparent url(images/varsity.png) no-repeat; 
	left: 24px;
}

#web-content li.merriman {
	background:transparent url(images/merriman.png) no-repeat;
	left: 286px;
}

#web-content li.imagine {
	background:transparent url(images/imagine.png) no-repeat;
	left: 550px;
}

#web-content a {
	display:block;					
	height:0px;				/*stops text being displayed*/
	width:226px;			/*width of lin area*/
	padding-top:75px;		/*height of link area*/
	overflow:hidden;
}

#web-content a#varsity {
	background:transparent url(images/varsity_over.png) 150px 100px no-repeat;
}

#web-content a#varsity:hover {
	background-position: 0 0; z-index:50;
	margin:0;
}

#web-content a#merriman {
	background:transparent url(images/merriman_over.png) 150px 100px no-repeat;
}

#web-content a#merriman:hover {
	background-position: 0 0; z-index:50;	
	margin:0;
}

#web-content a#imagine {
	background:transparent url(images/imagine_over.png) -150px 100px no-repeat;
}

#web-content a#imagine:hover {
	background-position: 0 0; z-index:50;
	margin:0;
}

#web-content h3 span {
	display:none;
}

#web-content p {
	text-align:left;
	margin:22px 0px 0px 8px; /* align text in box*/
	width:210px;
}

#web-content p.indent {
	margin-top:0;
	padding-left:8px;
	padding-bottom:8px;
	background:url(images/bullet.png) top left no-repeat;
	background-position: 0px 6px; 
}


/*___________________ end of website.htm specific ________________*/

/*______________________ design.htm specific _____________________*/

#design-content {
	background: url(images/design_content.png) no-repeat top #fff;
	height:378px;
	width:100%;
}


#design-content ul {
	list-style:none;
	display:block;
}

#design-content li {
	height:367px;
	width:261px;
	position:absolute; 
	top: 186px;
}

#design-content li.flash {
	background:transparent url(images/flash.png) no-repeat; 
	left: 24px;
}

#design-content li.leaflet {
	background:transparent url(images/leaflet.png) no-repeat;
	left: 287px;
}

#design-content li.travel {
	background:transparent url(images/travel.png) no-repeat;
	left: 548px;
}

#design-content a {
	display:block;					
	height:0px;				/*stops text being displayed*/
	width:226px;			/*width of lin area*/
	padding-top:140px;		/*height of link area*/
	overflow:hidden;
}

#design-content a#flash {
	background:transparent url(images/flash_over.png) -300px -300px no-repeat;
}

#design-content a#flash:hover {
	background-position: 0 0; z-index:50;   /*negative values of any margin defined in the #design-content a parenthesis*/
	margin:0;
}

#design-content a#leaflet {
	background:transparent url(images/leaflet_over.png) -300px -300px no-repeat;
}

#design-content a#leaflet:hover {
	background-position: 0 0; z-index:50;	/*negative values of any margin defined in the #design-content a parenthesis*/
	margin:0;
}

#design-content a#travel {
	background:transparent url(images/travel_over.png) -300px -300px no-repeat;
}

#design-content a#travel:hover {
	background-position: 0 0; z-index:50;	/*negative values of any margin defined in the #design-content a parenthesis*/
	margin:0;
}

#design-content h3 span {
	display:none;
}

#design-content p {
	text-align:left;
	margin:34px 0px 0px 8px;
	width:210px;
}

#design-content p.indent {
	margin-top:0;
	padding-left:8px;
	padding-bottom:8px;
	background:url(images/bullet.png) top left no-repeat;
	background-position: 0px 6px; 
}

/*___________________________________ end of design.htm specific _______________________*/