/* remove all padding, borders, margins */
html, body, dd, dt, dl, ul, ol, li, p, h1, h2, h3, h4, h5, h6
form, fieldset, a, div, img{margin: 0;padding: 0; border: 0;}
ul {
	list-style-type: none; /* remove list style for port images */
	}
body{
	background-color: #575e59;
	text-align:center; /* centers page for IE5 */
	}

/* re-style italics - or IE italics bug breaks layout */
i {
font-style: normal;
color: #800080;
}
	
#wrapper{
	width: 760px;
	text-align:left; /* counteracts body center align so works in other browsers than IE5 ok */
	margin-top: 5px;
	margin-left: auto;
	 margin-right: auto;
	}

#header{
	width: 750px;
	height: 140px;
	text-align:left; /* counteracts body center align */
	margin-left: auto;
	margin-right: auto;
	background-color: #ffffff;
	}
#header img{
	border-style: none;
	vertical-align: bottom; /* removes extra space in IE */
	}

#navbararea {
	width: 750px;
	background-color: #dde6f7;
	text-align:left; /* counteracts body center align */
	margin-left: auto;
	margin-right: auto;
	}
#navbar {
	text-align: center; 
	margin-top:0px; 
	margin-bottom: 0px;
	padding: 5px;
	}
#navbar a {
	font-size: 120%; font-family: Arial, Helvetica, sans-serif; color: #0e65ac; text-transform: uppercase; text-decoration: none;
	}
#navbar a:visited{
	color: #336985;
	text-decoration:none;
	}
#navbar a:hover{
	color: #0c3183;
	text-decoration:none;
	}
#navbar a:active{
	color: #6092b5;
	text-decoration:none;
	}
#navbar li{
	display: inline;
	}

#content{
	background-color: #ffffff;
	width: 750px;
	text-align:left; /* counteracts body center align */
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px;
	background: url(images/background.jpg) no-repeat #ffffff;
	}
	
#normalpagecontent{
	width: 490px;
	background-color: #eaeaea;
	text-align:left; /* counteracts body center align */
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 20px;
	border-style: solid;
	border-color: #c0c0c0;
	border-width: 1px;
	}
#normalpagecontent ul {
	list-style-position: inside;
	list-style-type: square;
	}
#normalpagecontent ul li li {
	list-style-type: circle;
	padding-left: 20px;
	}
#indexpagecontent{
	width: 750px;
	background-color: #ffffff;
	text-align:left; /* counteracts body center align */
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px 0px 0px 0px;
	}
#indexpageleft{
	width: 100px; 
	float: left;
	padding: 0px 0px 0px 0px;
	text-align:left;
	margin-left: auto;
	margin-right: auto;
	background-color: #ffffff;
	}
#indexpageright{
	width: 630px;
	float: right;
	margin: 5px 5px 5px 5px;
	padding: 5px 5px 5px 0px;
	background-color: #ffffff;
	}	
	
#portfoliopagecontent{
	width: 750px;
	background-color: #ffffff;
	text-align:left; /* counteracts body center align */
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px 0px 0px 0px;
	}

#articlespagecontent{
	width: 750px;
	background-color: #eaeaea;
	text-align:left; /* counteracts body center align */
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px 0px 0px 0px;
	}
#articlespageposts {
	width: 450px; 
	float: left;
	padding: 10px;
	text-align: left;
	margin-left: 50px;
	margin-right: auto;
	background-color: #ffffff;
	border-style: solid;
	border-color: #c0c0c0;
	border-width: 1px;
	}
#articlespagemenu {
	width: 200px;
	float: right;
	margin: 0px;
	padding: 5px;
	background-color: #fffb95;
	}	
#articlespagemenu li {
	padding-top: 10px;
	}
	
.articlespagelists ul {list-style-type: disc;
margin-left: 10px; padding: 10px;
}
.articlespagelists li {padding: 0px 10px 0px 0px}
	
/* use float to arrange columns */
#left{
	width: 180px; 
	float: left;
	padding: 0px 5px 0px 10px;
	text-align:left;
	margin-left: auto;
	margin-right: auto;
	}
#left a {
	font-family: Arial, Helvetica, sans-serif; 
	text-decoration:none;
	font-size: 110%;
	color:#0e65ac;
	}
#left a:visited{
	color: #408690;
	text-decoration:none;
	}
#left a:hover {
	color: #0c3183;
	text-decoration: none;
	}
#left a:active{
	color: #9dceec;
	text-decoration:none;
	}
#left li {
	padding-top: 5px;
	}
#right{
	width: 535px;
	float: right;
	margin: 5px 5px 5px 0px;
	padding: 5px 5px 5px 5px;
	}	
#indexmainleft {
	float:left;
	width: 276px;
	padding: 5px 5px 5px 5px;
	background-color: #eaeaea;
	border-style: solid;
	border-color: #c0c0c0;
	border-width: 1px;
	}
#indexmainright {
	float: right;
	width: 320px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	color:#000000;
	background-color: #ffffff;
	}
#portfoliobox {
	height: 440px;
	width: 318px;
	background-color: #badaff; overflow: scroll;
	border-style: solid;
	border-color: #c0c0c0;
	border-width: 1px;
	}
#portfolioboxinside {
	width: 270px;
	background-color: #ffffff;
	border-style:solid;
	border-width: 1px;
	border-color: #d9d9d9;
	text-align: center;
	margin-left: auto; margin-right: auto;
	padding: 5px 5px 5px 5px;
	}
#portfolioboxinside img.screen {
	padding: 0px 5px 5px 0px; background: #ffffff url(images/screenshotshadow.jpg) no-repeat 100% 100%;
	}	
#portfolioleft {
	float:left;
	width: 250px;
	padding: 0px 5px 0px 5px;
	background-color: #eaeaea;
	border-style: solid;
	border-color: #c0c0c0;
	border-width: 1px;
		}	
#portfolioright {
	float:right;
	width: 270px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	color:#000000;
	background-color: #ffffff;
	}
#portfoliorightimages {
	border-style:solid;
	border-width: 1px;
	border-color: #d9d9d9;
	text-align: center;
	margin-left: auto; margin-right: auto;
	padding: 5px 5px 5px 5px;
	}
#portfoliorightimages img {
	padding: 0px 5px 5px 0px; background: #ffffff url(images/screenshotshadow.jpg) no-repeat 100% 100%;
	}
	
.portfolioindeximage {
float: right;
margin-left: auto;
margin-right: auto;
text-align: right;
padding: 0px 5px 5px 5px; background: #ffffff url(images/screenshotshadow.jpg) no-repeat 100% 100%;
}	
#projectsummary {
	border-style:solid;
	border-width: 1px;
	border-color: #1c9632;
	background-color: #c6d6ce;
	padding: 0px 0px 5px 20px;
	}
#projectsummary ul {
	list-style-position: inside;
	list-style-type: square;
	}
	
.examplesleft{
	width: 240px;
	float: left;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	}
.examplesleft img {
	padding: 0px 5px 5px 0px; background: #ffffff url(images/screenshotshadow.jpg) no-repeat 100% 100%; 
	}
	
.examplesright{
	width: 240px; 
	float: right;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	}
.examplesright img {
	padding: 0px 5px 5px 0px; background: #ffffff url(images/screenshotshadow.jpg) no-repeat 100% 100%;
	}

#aboutleft {
float:left;
}	
	
#aboutright {
float:right;
}	

.clear {clear: both;
height:0px;
}	

.aboutbullets li {
margin: 1em 0;
}

	
/*portfolio menu separator */
.separator {
	height: 1px;
	background-color: #d9d9d9;
	clear: both;
	margin: 1em 0;
	}	
#footer {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	}
#copyright {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	}
#footerimg img {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	vertical-align: bottom;
	}

html{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 75%;
	color: #000000;
	}
h1{
	font-size: 120%;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000; padding: 10px 0 10px 0;
	text-align:center;
	}
h2{
	font-size: 110%;
	font-family: Arial, Helvetica, sans-serif;
	color: #0e305d; padding: 10px 0 10px 0;
	}
h3{
	font-size: 110%;
	font-family: Arial, Helvetica, sans-serif;
	color: #0e305d; padding: 10px 0 10px 0;
	}	
p{padding: 0 0 10px 0; line-height: 150%;}
/* set colors for normal links - must specify or IE uses default*/
/* correct order is link, visited, hover then active */
/* visited link colour important for accessibility */
a:link {
	color: #0e65ac;
	text-decoration: none;
	}
a:visited {
	color: #336985;
	text-decoration: none;
	}
a:hover {
	color: #0c3183;
	text-decoration: none;
	}
a:active {
	color: #6092b5;
	text-decoration: none;
	}