body {
	font-family: Arial, Helvetica, sans-serif;
	color: #006666;
}

#wrapper {
	width: 90%;
	max-width: 800px;
	min-width: 750px;
	margin: 0 auto;
	border:solid 1px white;
	}
	
#wrapper2 {
	width: 90%;
	max-width: 1024px;
	min-width: 900px;
	margin: 0 auto;
	border:solid 1px white;
	}
	
#logo {
	text-align:center;
	background:#fff;
	border:solid 1px white;
	padding-right: 2.7em;
	}

#main {
	margin: 0;
	padding: 0;
	float:left;
}

/*-maybe don't need this "content" style, copied from abc styles for instructions page here*/
/*
#content{
  float:left;
	width: 75%;
	margin: 0 0 14px 0;
	padding: 0 3% 0 0;
}
*/
#content {
	float: right;
	width: 60%;
	background-color: #E9ECEF;
	border: 4px double #8FA7A4;
	text-align: justify;
	}
#content2 {
  float:left;
	width: 45%;
	background-color: #E9ECEF;
		border: 4px double #8FA7A4;
			text-align: justify;
	margin: 0 0 14px 0;
	padding: 0 3% 0 0;
}

#sidebar {
	float: left;
	width: 34%;
	font-size: 72%;
	line-height: normal;
	color:#003333;
	border: 4px groove #8fa7a4;
	}

#sidebar2 {
	float: left;
	width: 34%;
	font-size: 72%;
	line-height: normal;
	color:#003333;
	border: 4px groove #8fa7a4;
	margin-top: 20px;
}
.sidebar3{
	float: right;
	width: 25%;
	font-size: 72%;
	line-height: normal;
	color:#003333;
	border: 4px groove #8fa7a4;
	margin-top: 20px;
}


/* padding/margins of main elements */

.gutter {padding: 0 1em}

#content .gutter {	padding: 0.5em 1.5em;}

#sidebar .gutter, #sidebar2 .gutter {padding: .5em 1em;}

#sidebar .clear, #sidebar2 .clear {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #003333;
	text-align: center;
}

/*Navigation*/

#nav {
	clear:both;
	background:#fff;
	padding: .8em 1em 1em 1em;
	margin: 0;
	white-space: nowrap;
	list-style-type: none;
	text-align: center;
	font-size: 70%;	
	border:solid 1px white;
}

#nav li {
	display: inline;
	color: #3286A2;
	text-transform:uppercase;
}

#nav li a {
	text-decoration: none;
    padding: .4em 3.1em 3em .2em;
	color: #006699;
}

#nav li a:hover {
	color: #990000;
	text-decoration: underline; 
	}
/*pass current link through body tag*/

body.home a#home, 
body.webdesign a#webdesign, 
body.photography a#photography, 
body.writing a#writing,
body.products a#products,
body.slideshows a#slideshows,
body.services a#services,   
body.about a#about,
body.links a#links,
body.coding a#coding {
	color: #3286A2;
	text-decoration: none; 
	}
/*thumbnails*/

#gallery {
	width: 100%;
	border: solid 1px white;
	margin: 0 auto;
	padding: 0;
	}
.clear-left {
	clear: left;
}


#wrapper:after, #gallery:after{ 
	content: "."; 
	display: block; 
	height: 0; 
	font-size:0; 
	clear: both; 
	visibility:hidden;
	 }	
	 
.thumbs {
	float: left;
	width: 33%;
	margin: 0 auto;
	font-size: 90%;
	text-align: center;
	}
.thumbs img {
	border:solid 2px teal;
}
.thumbs p {
	font-size: 80%;
	text-align:center;
}

.thumbs a {
	text-align:center;
	color: #3286A2;
	}

.thumbs2 {
	float: left;
	width: 100%;
	margin: 0 auto;
	font-size: 100%;
	text-align: justify;
	}

.float-right {
	float: right;
	width: 50%;
	font-size: 100%;
	text-align: justify;
	padding: 10px 5%;
	}

.float-left {
	float: left;
	width: 30%;
	font-size: 100%;
	padding: 20px 20px 10px 30px;
	}

.clear {
	clear:both;
	color: #003366;
}


/*Footer*/

#footer {
	clear: both;
	margin-top: 1.5em;
	background:#fff;
	text-align: center;
	padding: 1.5em 0;
	border:solid 1px white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
}

#footer ul {
padding: 0;
margin: 0;
list-style-type: none;
width: 100%;
text-align: center;
}

#footer li:first-child {border-left: none}
#footer li { display: inline; border-left: 1px solid #ccc; }
#footer li, #footer li a{
text-decoration: none;
padding: 0 .8em;
color: #3286A2;
}

#footer li a:hover {color: #990000;}

/*Links*/

a {
	color: #003333;
	text-decoration: none;
}
a:hover {
	color: #990000;
	text-decoration: underline;
	}
#sidebar a {color: #003333; text-decoration:none}
#sidebar a:hover, #sidebar2 a:hover {
	text-decoration:underline;
	color: #990000;
}
/*Typography*/

h1 {font-size: 125%;
text-align:center}

h2 {
font-size: 125%;
font-family:Verdana, Arial, Helvetica, sans-serif;
text-align:center;
color: #006666;
}

h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 125%;
	color: #993333;
	text-transform: capitalize;
	text-align: center;
	letter-spacing: .6em;
}
h6 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #660000;
	text-align: center;
}


h4 {
	font-size: 105%;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #003333;
	text-align: center;
}

h5 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-weight: bold;
	color: #006666;
	text-align: center;
}

.font-black {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #003333;
}

.thumbs-sidetext {
	float: left;
	width: 4%;
	margin: 0 auto;
	font-size: 90%;
}

#left {
	float: left;
	width: 65%;
	border: solid 1px red;
	background:#D9EBEC;
	}

#right {
	float: right;
	width: 33%;
	font-size: 90%;
	border: solid 1px teal;
	}
.right {
	float: right;
	width: 33%;
	font-size: 90%;
	border: solid 1px teal;
	}
/*images*/	
#right img {border: solid 2px teal}

.imgL {
	float: left;
	border: solid 2px teal;
	margin: 0 1.5em 1.5em 0;
	}
	
.imgR {
	float: right;
	border: solid 2px teal;
	margin: 0 0 1.5em 1.5em;
	}