html 	{width:100%; }
body	{
	background:#4E595F url('../images/body-bg.gif') repeat-x 0 0;
	margin:40;
	padding:0;
	font-family:"Trebuchet MS", Verdana, Arial, "Times New Roman", serif;
	font-size:95%;
	color:#000000;
	width:100%;
}

p		{
	line-height:100%;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 50;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0px;
	padding-left: 0;
	font-size: 100%;
}
h1		{
	padding:5;
	font-size:130%;
	font-weight:normal;
}
h2		{margin:0; padding:0 0 20px 0; font-size:140%; font-weight:normal; }
h6		{margin:0; padding:0 0 0px 0; font-size:100%; font-weight:normal; font-style: italic; }


/*link styling*/
a			{color:#000000; text-decoration:underline; }
a:hover		{text-decoration:none; }
#footer a	{color:#637076; }


/*structural elements*/
.section 		{
	text-align:center;
	width:100%;
	border-bottom:1px solid #637076;
	vertical-align: central;
}

#header			{
	background:#1A292F;
	text-align:left;
	width:720px;
	border-left:1px solid #637076;
	border-right:1px solid #637076;
	left: 0px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 5px;
	padding-left: 20px;
	vertical-align: central;
}
#container		{margin:0 auto; text-align:left; padding:0 20px 20px 20px; width:720px; border-left:1px solid #637076; border-right:1px solid #637076; }
h1#logo			{
	background:#E8EDF7;
	float:left;
	width:0px;
	border:0px solid #FFFFFF;
	min-height:24px;
	margin: 0x;
	padding: 0px;
	left: 40px;
}
#pictureRail	{text-align:center; }
#news			{background:#E8EDF7; float:left; width:200px; padding:20px 20px 5px 20px; border:1px solid #FFFFFF; }
#menu			{background:#1A292F; margin:0 0 0 260px; border:1px solid #FFFFFF; padding:10px; color:#FFFFFF; text-align:center; }
#content		{background:#E8EDF7; margin:20px 0 0 260px; padding:20px 20px 5px 20px; border:1px solid #FFFFFF; }
#footer			{margin:0 auto; text-align:left; padding:20px 20px 60px 20px; width:720px; border-left:1px solid #637076; border-right:1px solid #637076; }
#footer p		{background:#1A292F; padding:10px; font-size:90%; color:#637076; border:1px solid #637076; text-align:center; }


/*section dependant style over-rides*/
#news h3	{margin:0; padding:0 0 20px 0; color:#000000; font-size:120%; font-weight:bold; }
#news p		{
	padding:10px 0;
	border-top:1px solid #000000;
}

#header p	{
	text-align:center;
	font-size:100%;
	color:#E8EDF7;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-top: 0px;
	vertical-align: central;
}

ul#menu 	{ }
ul#menu li	{margin:0; padding:0; list-style:none; display:inline; }
ul#menu  a	{color:#FFFFFF; text-decoration:none; padding:10px 15px; }

#pictureRail img	{margin:20px 10px;border:1px solid #FFFFFF;  }
#content img		{
	border:1px solid #000000;
	float:left;
	margin:0;
}


/*This adds a little arrow under the menu item of the page you are on. (handy for navigation and usability)
To modify, edit the <body> tag by changing the id.
e.g, if the page you are on is the contact page, change: <body id="home"> to <body id="contact">*/
#home #homeLink,
#about #aboutLink,
#services #servicesLink,
#portfolio #portfolioLink,
#contact #contactLink
{background:url('../images/menu-a-bg.gif') no-repeat center bottom; }


/*just makes sure the content doesn't spill out the boxes, see http://www.positioniseverything.net/easyclearing.html for details*/
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
