* {
	margin: 0px;
	padding: 0px;
	}
	
body {background-color: #F4F3EC; }

p {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 12px; color: #545548; margin-bottom: 5px; line-height:110%;}
p.title  {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 12px; color: #000; margin-bottom: 10px; line-height:110%;}

p.menu  {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 12px; color: #545548;}

p.bio  {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 12px; color: #545548;  line-height:150%;

}
p.heading  {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 14px; color: #545548;}

p.light  {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 12px; color: #cccccc;}
p.light_small  {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 10px; color: #cccccc;}

p.back  {font-family: Times, Times New Roman, Palatino, serif; font-size: 10px; color: #545548; text-decoration: underline;}
p.topmenu {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 15px; color: #545548; margin-bottom: 2px; line-height:110%;}

p.menu_dotted {font-family: Times, Times New Roman, Palatino, serif; font-style: italic; font-size: 13px; color: #000; border-top: 1px dotted #545548;}
/* text */


.underline {text-decoration: underline; }

.dotted {text-decoration: none; border-bottom: 1px dotted #545548}

img, a img {
	border-style: none;
	}

/* links and activity */

a:link {color: #545548; text-decoration: none; background-color: transparent }
a:visited {color: #545548; text-decoration: none; background-color: transparent }
a:hover {color: #545548; text-decoration: none; background-color: #dfdfd3 }



/* Container */

#all {
	width: 1055px;
	margin: 0 auto 0 auto;
	padding-left: 16px;
	padding-right: 16px;
	border: 0px;
}


/* Header */

#header {
	float:left;
	width: 1055px;
	height: 178px;
	border-bottom: 9px solid black;
	margin-bottom: 13px;
}

#logo {
	float:left;
	padding-top: 87px;
	width: 196px;
	border: 0px;
}

/* Top menu */

#top_menu {
	float:right;
	padding-top: 111px;
}

#projects {
	float:left;
	width: 62px;
	height: 23px;
	border-bottom: 7px solid #000000;	
}

#projects:hover {
	border-bottom: 7px solid #545548;
}

#projects_active {
	float:left;
	width: 62px;
	height: 23px;
	border-bottom: 7px solid #545548;
}

#about {
	float:left;
	margin-left:5px;
	width: 62px;
	height: 23px;
	border-bottom: 7px solid #000000;

}

#about:hover {
	border-bottom: 7px solid #545548;
}

#about_active {
	float:left;
	margin-left:5px;
	width: 62px;
	height: 23px;
	border-bottom: 7px solid #545548;

}

#home {
	float:left;
	margin-left:5px;
	width: 62px;
	height: 23px;
	border-bottom: 7px solid #000000;
}

#home:hover {
	border-bottom: 7px solid #545548;
}

/* index picture */

#home_content {
	float:left;
	width: 1055px;
	padding-top: 0px;
	border: 0px;
}




/* Left menu */

#menu_left {
	float:left;
	width: 215px;
	height: 196px;
	margin-right: 16px;
}
.menu_item_first:hover {
	background: #dfdfd3;
}

.menu_item_first {
	width: 215px;
	padding-top: 9px;
	margin-top: 0px;
	padding-bottom: 0px;
	margin-bottom: 0px;
	border-bottom: 1px dotted #545548;
	border-top: 1px dotted #545548;
}
.menu_item_first_active {
	width: 215px;
	padding-top: 9px;
	margin-top: 0px;
	padding-bottom: 0px;
	margin-bottom: 0px;
	border-bottom: 1px dotted #545548;
	border-top: 1px dotted #545548;
	background: #dfdfd3;
}
.menu_item {
	width: 215px;
	padding-top: 9px;
	margin-top: 0px;
	border-bottom: 1px dotted #545548;
	background: #F4F3EC;
}
.menu_item_active {
	width: 215px;
	padding-top: 9px;
	margin-top: 0px;
	border-bottom: 1px dotted #545548;
	background: #dfdfd3;
}

.menu_item:hover {
	background: #dfdfd3;
}


/* Content */

#content {
	float:left;
	width: 824px;
	border: 0px;
	display: inline;
}

.work_holder {
	float:left;
	width: 824px;
	border: 0px;
}

.work {
	float: left;
	width: 616px;
	margin-bottom: 20px;
	border: 0px;
}


.work_first {
	float: left;
	width: 616px;
	margin-bottom: 20px;
	padding-top: 10px;
	border-top: 1px dotted #545548;
}


.text_across {
	float: left;
	width: 616px;
	padding-top: 10px;
	margin-top: 0px;
	border-top: 1px dotted #545548;
	padding-bottom: 0px;
	margin-bottom: 30px;
	
}


/* putting images in! */

.work_description {
	float: right;
	width: 192px;
	margin-top: 0px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px dotted #545548;
	border-top: 1px dotted #545548;
}


/* I think without adding yet more structure the best you can do with the 'back to top' is have it 
sitting just below the last picture in each section, rather than beside - see below, 
the clear:left gets rid of the float:left from the pictures so the 'back to top' 
is pushed down to the bottom of the work_holder <div> rather than sitting just under 
the description as it would otherwise (remove the clear and see what happens) and then the 
loat pushes it to the right like the text above */

.backtotop {
	clear:left;
	float:left;
	width: 824px;
	padding-bottom: 10px;
	padding-left: 632px;
}



#bar_bottom {
	clear:left;
	width: 1045px;
	height: 12px;
	border: 0px;
	padding-top: 10px;
	margin-top: 8px;
	padding-left: 10px;
	padding-bottom: 2px;
	margin-bottom: 0px;
	background-color: #000000;
	}