/* the whole content container*/
.topcontainer {
	position: relative;
	width: 598px;
	height: 500px;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid gray;
	}	

/*the top nav container*/

.topnavcontainer {
	position: relative;
	width: 598px;
	height: 20px;
	margin-top: 50px;
	margin-left: auto;
	margin-right: auto;	
	}
	
#topnav {
	margin: 0;
	padding: 0;
	margin-left: 350px;
	}

#topnav li {
	display: inline;
	}

#topnav a {
	background-color: #ffffff;
	color: gray;
	text-decoration: none;
	font: normal 10px/12px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", sans-serif;
	}

#topnav a:hover {
	color: #000000;
	}

#topnav a:active {
	color: #cccccc;
	}

/*the side nav container on the portfolio pages*/

.sidenavcontainer {
	position: relative;
	padding: 30px;
	padding-top: 80px;
	float: left;	
	}
	
#sidenav {
	margin: 0;
	padding: 0;
	width: 100px;
	}

#sidenav li {
	margin: 0;
	padding: 0;
	display: block;
	text-align: left;
	}

#sidenav li a {
	background-color: #ffffff;
	color: #999999;
	text-align: left;
	text-decoration: none;
	font: normal 10px/14px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", sans-serif;
	}

#sidenav a:hover {
	color: #000000;
	}

#sidenav a:active {
	color: #ffffff;
	}

/*the background images on all the pages*/

.bgimage {
	position: relative;
	float: left;
	}

/*ccss for the designer page*/

.desheader {
	color: #76CBE0;
	text-decoration: none;
	font: normal 18px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", sans-serif;
	}
		
.designpic {
	position: relative;
	float: left;
	padding: 40px;
	padding-top: 50px;	
	}
		
.designtext{
	position: relative;
	float: left;
	padding-top: 50px;
	width: 275px;
	color: gray;
	font: normal 11px/18px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", sans-serif;
	}
	
/*css for the portfolio pages*/

.portheader {
	color: #019AC3;
	text-decoration: none;
	font: normal 18px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", sans-serif;
	}
	
.portsplit {
	color: #019AC3;
	text-decoration: none;
	font: normal 14px/16px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", sans-serif;
	}
		
.portpic {
	position: relative;
	padding: 20px;
	padding-top: 50px;
	float: left;
	}
		
.porttext {
	position: relative;
	width: 250px;
	height: 420px;
	margin-top: -185px;
	margin-left: 275px;
	padding-left: 15px;
	border-left: 1px solid gray;
	background-color: #ffffff;
	color: gray;
	font: normal 11px/13px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", sans-serif;
	}

.desctext {
	color: gray;
	text-decoration: none;
	font: normal 10px/12px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", sans-serif;
	}
	
.animalfarm {
	position: relative;
	float: left;
	padding: 37px;
	}
	
.landscape {
	position: relative;
	float: left;
	padding-left: 4px;
	padding-top: 105px;
	}
	
.paper {
	position: relative;
	float: left;
	padding: 60px;
	}

/*css for the experience page*/

.expheader {
	color: #076CAE;
	text-decoration: none;
	font: normal 14px/16px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
.expheader2 {
	color: #076CAE;
	text-decoration: none;
	font: normal 16px/18px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
.experiencetext{
	position: relative;
	float: left;
	padding: 10px;
	padding-top: 50px;
	padding-left: 20px;
	width: 175px;
	text-align: right;
	}

.experienceform{
	position: relative;
	float: left;
	padding: 25px;
	width: 275px;
	color: gray;
	font: normal 11px/13px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}

/*css for the contact page*/

.conheader {
	color: #F26BB1;
	text-decoration: none;
	font: normal 14px/16px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
.contacttext{
	position: relative;
	float: left;
	width: 150px;
	padding: 50px;
	text-align: right;
	}
	
.contactform{
	position: relative;
	float: left;
	width: 275px;
	text-align: left;
	background-color: #ffffff;
	color: gray;
	font: normal 11px/18px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
.digicon {
	position: relative;
	float: left;
	padding: 20px;
	padding-top: 55px;	
	}
			
/*css for random stuff, like text and images and so on . . .*/
	
img {
	border: none;
	margin: 0;
	padding: 0;
	}
	
p {
	color: gray;
	text-decoration: none;
	font: normal 11px/18px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}

.info {
	color: #019AC3;
	text-decoration: none;
	font: normal 10px/12px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
i {
	color: #019AC3; 
	}
	
h1 {
	color: #ff9900;
	text-decoration: none;
	font: normal 10px/14px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
h2 {
	color: #019AC3;
	text-decoration: none;
	font: normal 10px/14px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
a {
	color: gray;
	text-decoration: none;
	}

.formintro {
	color: #F26BB1;
	text-decoration: none;
	font: normal 12px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
.formintro2 {
	color: #076CAE;
	text-decoration: none;
	font: normal 12px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	}
	
.quote {
	text-decoration: none;
	font: normal 12px/14px "Lucida Grande", "Lucida Sans Unicode", "News Gothic", verdana, lucida, sans-serif;
	color: #000000;
	}