body
	{
	background: #231F20;
	padding: 0px;
	margin: 0px;
	font-family: Arial;
	color: #231F20;
	}

a img
	{
	border: none;
	}

a:link {color: #231F20; text-decoration: underline;}     /* unvisited link */
a:visited {color: #231F20; text-decoration: underline;}  /* visited link */
a:hover {color: #231F20; text-decoration: none;}   /* mouse over link */
a:active {color: #231F20; text-decoration: underline;}   /* selected link */

#pipesintheground
	{
	position: absolute;
	top: 521px;
	left: 0px;
	height: 59px;
	width: 395px;
	display: block;
	background: #231F20 url(../images/pipes.png) no-repeat;
	}

.cursor
	{
	cursor: pointer;
	}

.overlay
	{
	position: absolute;
	top: 0px;
	left: -4000px;
	height: 768px;
	width: 2000px;
	z-index: 20;
	}

.overlay div.leftSide
	{
	width: 40%;
	margin: 40px 8% 0px 4%;
	font-size: 13.5pt;
	float: left;
	}

.slim div.leftSide
	{
	margin: 30px 1% 0px 1%;
	}

.overlay div.rightSide
	{
	width: 40%;
	margin: 40px 4% 0px 0px;
	float: left;
	}

.slim div.rightSide
	{
	margin: 30px 1% 0px 0px;
	width: auto;
	}

.closeWorldButton
	{
	float: right;
	}

#webDesignOverlay
	{
	background: #fff100 url(../images/innerVolcanoCloseup.png) no-repeat bottom left;
	}

#graphicDesignOverlay
	{
	background: #EC008C url(../images/BearCloseup.png) no-repeat bottom left;
	}

#world
	{
	height: 768px;
	width: 5118px;	
	overflow: hidden;
	}

#sky
	{
	width: 100%;
	height: 511px;
	background: #4ac0f2 url(../images/sky.jpg) repeat-x 0px 0px;
	}

#header
	{
	position: absolute;
	top: 75px;
	left: 506px;
	background-color: transparent;
	display: block;
	width: 545px;
	}


#header h1 a
	{
	display: block;
	height: 0px;
	width: 322px;
	overflow: hidden;
	padding: 43px 0px 0px 0px;
	background: transparent url(../images/logoheader.png) no-repeat 0px 0px;
	}

#header h1 span
	{
	position: absolute;
	top: 40px;
	height: 20px;
	left: 417px;
	font-size: 14pt;
	font-weight: normal;
	color: #ffffff;
	}

#header h1
	{
	margin: 0px;
	height: 43px;
	}

#header p
	{
	display: block;
	width: 452px;
	margin: 0px;
	padding: 8px 6px 7px 9px;
	background-color: #ffffff;
	font-size: 14pt;
	color: #231F20;
	}

#footer
	{
	position: absolute;
	top: 743px;
	left: 19px;
	color: #696A6C;
	font-size: 14pt;
	}

a.cyan
	{
	color: #00AEEF;
	}

a.magenta
	{
	color: #EC008C;
	}

a.yellow
	{
	background-color: #231f20;
	padding: 0px 3px 0px 3px;
	color: #FFF200;
	}

#pipesinthesky
	{
	position: absolute;
	top: 0px;
	left: 92px;
	height: 434px;
	width: 390px;
	background: transparent url(../images/pipesinthesky.png) no-repeat;
	}

#factory
	{
	position: absolute;
	top: 288px;
	left: 81px;
	height: 185px;
	width: 302px;
	background: transparent url(../images/factory.png) no-repeat;
	}

#aboutInfo
	{
	position: absolute;
	top: 355px;
	left: 261px;
	}

#about, #twitter
	{
	position: absolute;
	top: 470px;
	left: 506px;
	width: 419px;
	font-size: 13.5pt;
	color: #ffffff;
	}

#about p:first-child
	{
	margin-top: 0px;
	}


#hills1
	{
	position: absolute;
	top: 400px;
	left: 580px;
	height: 115px;
	width: 250px;
	background: transparent url(../images/hills1.png) no-repeat;
	}

#ground1
	{
	position: absolute;
	top: 413px;
	left: 0px;
	height: 354px;
	width: 1370px;
	background: transparent url(../images/ground2.png) no-repeat;
	}

#ground2
	{
	position: absolute;
	top: 413px;
	left: 2378px;
	height: 354px;
	width: 2740px;
	background: transparent url(../images/ground2.png) repeat-x;
	}

#volcanoTop
	{
	position: absolute;
	top: 11px;
	left: 1699px;
	height: 169px;
	width: 473px;
	background: transparent url(../images/volcanoTop.png) no-repeat;
	}

#volcano
	{
	position: absolute;
	top: 180px;
	left: 1369px;
	height: 611px;
	width: 1076px;
	background: transparent url(../images/volcano2.png) no-repeat;
	}

#innerVolcano
	{
	position: relative;
	top: 148px;
	left: 474px;
	height: 231px;
	width: 231px;
	background: transparent url(../images/innerVolcano.png) no-repeat;
	}


#fade1
	{
	position: absolute;
	top: 521px;
	left: 1413px;
	height: 59px;
	width: 127px;
	background: transparent url(../images/fade1.png) no-repeat;
	}

#webDesign, #accessibility
	{
	position: absolute;
	top: -165px;
	left: 339px;
	height: 396px;
	width: 432px;
	background: transparent url(../images/thoughtBubble.png) no-repeat;
	font-size: 13.5pt;
	padding: 0px 40px 0px 40px;
	}

#exampleSites
	{
	position: absolute;
	top: 15px;
	left: 2250px;
	height: 396px;
	width: 347px;
	background: transparent url(../images/thoughtBubble.png) no-repeat;
	font-size: 13.5pt;
	}
/*
#webDesign>*, #accessibility>*, #graphicDesign>*, #contact>*
	{
	position: relative;
	margin-left: 40px;
	margin-right: 40px;
	}
*/

#webDesign p, #accessibility p, #contact p, #graphicDesign p
	{
	margin-top: 0px;
	}

#webDesign h2, #accessibility h2
	{
	display: block;
	top: 36px;
	margin: 35px 0px 0px 0px;
	padding-top: 29px;
	height: 0px;
	overflow: hidden;
	width: 105px;
	background: transparent url(../images/webDesign.png) no-repeat;
	}

#contact h2
	{
	display: block;
	top: 36px;
	margin: 45px 0px 0px 0px;
	padding-top: 29px;
	height: 0px;
	overflow: hidden;
	width: 105px;
	background: transparent url(../images/contact.png) no-repeat;
	}

div.rightSide h3
	{
	font-size: large;
	font-size: 1.17em;
	font-weight:bold;
	display: block;
	margin-bottom: 3px;
	}

a.closeButton, a.closeContactButton
	{
	float: right;
	display: block;
	overflow: hidden;
	height: 0px;
	width: 15px;
	position: relative;
	top: -15px;
	padding-top: 15px;
	background: transparent url(../images/closeButton.png) no-repeat;
	}

div.rightSide a.closeButton
	{
	top: -23px;
	}

a.buttonWhite
	{
	background: transparent url(../images/closeButtonWhite.png) no-repeat;
	}

a.buttonBlack
	{
	background: transparent url(../images/closeButtonBlack.png) no-repeat;
	}

#flowerMonster
	{
	position: relative;
	top: -148px;
	left: 2405px;
	height: 787px;
	width: 285px;
	background: transparent url(../images/flowerMonster.png) no-repeat;
	font-size: 13.5pt;
	}

#smallCloud
	{
	position: absolute;
	top: 180px;
	left: 2262px;
	height: 62px;
	width: 91px;
	background: transparent url(../images/smallCloud.png) no-repeat;
	}

#gem
	{
	position: absolute;
	top: 463px;
	left: 2247px;
	height: 75px;
	width: 75px;
	background: transparent url(../images/gem.png) no-repeat;
	}

#portfolioClouds
	{
	position: absolute;
	top: 120px;
	left: 1612px;
	height: 378px;
	width: 584px;
	background: transparent url(../images/portfolioClouds.png) no-repeat;
	font-size: 13.5pt;
	}

#cloudInfo
	{
	position: absolute;
	top: 180px;
	left: 2366px;
	}

#gemInfo
	{
	position: absolute;
	top: 470px;
	left: 2366px;
	}

em.info
	{
	font-size: xx-large;
	}

em#webDesignInfo
	{
	position: absolute;
	top: 217px;
	left: 714px;
	}


ol.gallery
	{	
	margin: 0px;
	display: block;
	overflow: hidden;
	position: relative;
	left: 40px;
	}

.slim ol.gallery
	{
	left: 0px;
	margin: 0px;
	padding: 0px;
	width: 175px;
	}

ol.gallery li a
	{
	display: block;
	height: 100px;
	margin: 8px;
	padding: 0px;
	width: 150px;
	}


ol.gallery li
	{
	list-style-type: none;
	position: relative;
	display: block;
	top: 0px;
	}

a.external
	{
	display: block;
	padding: 0px;
	height: 250px;
	width: 400px;
	}

ol.gallery li a, a.external
	{
	border: 5px solid #DDDDDD;
	}

ol.gallery li a, ul#miniGallery li a
	{
	float: left;
	}

ol.gallery li a:hover, a.external:hover
	{
	border: 5px solid #a3a3a3;
	}

div.rightSide
	{
	padding-top: 57px;
	}

div.rightSide div.details
	{
	font-size: small;
	width: 410px;
	}

div.rightSide div.rightPage
	{
	position: relative;
	top: 16px;
	}

/* ILLUSTRATION */

#forest
	{
	position: absolute;
	top: 343px;
	left: 3371px;
	height: 266px;
	width: 787px;
	}

#bear
	{
	position: absolute;
	top: 105px;
	left: 3651px;
	height: 400px;
	width: 294px;
	background: transparent url(../images/bear.png) no-repeat;
	}

#treesFront
	{
	position: absolute;
	top: 32px;
	left: 0px;
	height: 279px;
	width: 789px;
	background: transparent url(../images/frontTrees.png) no-repeat;
	}

#treesBack
	{
	position: absolute;
	top: 343px;
	left: 3371px;
	height: 266px;
	width: 787px;
	background: transparent url(../images/backTrees.png) no-repeat 0px 0px;
	}

em#graphicsInfo
	{
	position: absolute;
	top: 310px;
	left: 3947px;
	width: 300px;
	}

#graphicDesign
	{
	position: absolute;
	top: -316px;
	left: 561px;
	height: 396px;
	width: 432px;
	background: transparent url(../images/speachBubble.png) no-repeat;
	font-size: 13.5pt;
	padding: 0px 40px 0px 95px;
	}

#acorn
	{
	position: absolute;
	top: 138px;
	left: 676px;
	height: 59px;
	width: 59px;
	background: transparent url(../images/acorn.png) no-repeat;
	}

em#acornInfo
	{
	z-index: 11;
	position: absolute;
	top: 134px;
	left: 750px;
	}

#graphicDesign h2
	{
	display: block;
	top: 36px;
	margin: 37px 0 0px 0px;
	padding-top: 29px;
	height: 0px;
	overflow: hidden;
	width: 140px;
	background: transparent url(../images/graphicDesign.png) no-repeat;
	}

.scrollDown, .scrollUp
	{
	display: block;
	width: 128px;
	height: 0px;
	padding-top: 32px;
	overflow: hidden;
	position: relative;
	left: 193px;
	}

.slim .scrollDown, .slim .scrollUp
	{
	left: 21px;
	}

.scrollDown
	{
	background: transparent url(../images/downArrow.png) no-repeat;
	}

.scrollUp
	{
	background: transparent url(../images/upArrow.png) no-repeat;
	}

.scrollDown:hover, .scrollUp:hover
	{
	background-position: 0px -32px;
	}


#twitter ul
	{
	list-style-type: none;
	padding-left: 0px;
	margin-top: 0px;
	}

#twitter ul li
	{
	margin-bottom: 10px;
	}

#twitter ul li span
	{
	display: block;
	margin-bottom: 0px;
	}

#twitter ul#twitter_update_list li a
	{
	/* timestamp link */
	color: #231F20;
	text-decoration: none;
	margin-top: 0px;
	}


#twitter ul#twitter_update_list li span a {
	/* links in tweet */
	color: #ffffff;
	text-decoration: underline;
}

#twitterbird
	{
	position: absolute;
	display: block;
	height: 100px;
	width: 120px;
	background: transparent url(../images/twitterbird.png) no-repeat 0px 0px;
	top: 48px;
	left: 1000px;
	}

em#aboutTwitter
	{
	z-index: 11;
	position: absolute;
	top: 80px;
	left: 871px;
	}


#contactFlower
	{
	position: absolute;
	display: block;
	height: 81px;
	width: 153px;
	background: transparent url(../images/flowerMonster.png) no-repeat 0px 0px;
	top: 64px;
	left: 343px;
	}

em#contactInfo
	{
	z-index: 11;
	position: absolute;
	top: 75px;
	left: 484px;
	}

#contact
	{
	position: absolute;
	top: -250px;
	left: 435px;
	height: 196px;
	width: 432px;
	background: transparent url(../images/speachBubbleSmall.png) no-repeat;
	font-size: 13.5pt;
	padding: 0px 40px 0px 95px;
	}
	
#footer a:link
	{
	color: #696A6C;
	}
	
#footer a:hover
	{
	color: #ffffff;
	}