/*Main CSS stylesheet for www.bendaviesceramics.co.uk*/
* {
	padding: 0;
	margin: 0;
}
body {
	font: 55.5% Arial, Helvetica, sans-serif;
	background: #6a6c70 url('../Images/background_fade.gif') bottom left repeat-x fixed;
	color: #6d6059;
}
/*Page Layout*/
#wrapper {
	width: 80em;
	max-width: 100%;
	min-width:750px;
	margin: 0 auto 20px;
	background: #e4e1e2 url('../Images/body_fade.gif') bottom left repeat-x;
}
#header {
	width:100%;
}
#header h1 {
	font: 6em 'Times New Roman', serif;
	color:  #7d4228;
	margin:0 20px 20px 0;
	text-align: right;
}
#header h1 span {
	display: block;
	text-transform: lowercase;
	font: .55em arial, helvetica, sans-serif;
	letter-spacing: .62em;
	text-align: right;
	color: #7d8f9f;
	margin-right: -18px;
}
/*Navigation*/
#nav {
	clear: both;
	list-style: none;
	padding: 0 0 10px;
	border-bottom: 1px solid  #582F1D;
	margin:15px 0 0;
}

#nav:after{
	content: ".";
	display: block;
	clear: both;
	height: 1px;
	visibility: hidden;
}
#nav li {
	display: block;
	text-transform: lowercase;
	font-size: 1.8em;
	float:left;
	margin-right:.2em;
}
#nav a {
	text-decoration: none;
	padding-left: 14px;
	margin-right: .7em;
}
#nav a:link {
	color: #7d4228;
}
#nav a:visited {
	color: #7d4228;
}
#nav a:hover {
	color: #877875;
	background: transparent url('../Images/play.gif')  left 50% no-repeat;
}

#nav a:active {
}

/*Styling for the link corresponding to the page we're on.*/

#home a.home, #about a.about, #statement a.statement, #gallery a.gallery, #exhib a.exhib, #links a.links, #contact a.contact, #gallery.smoke #sub_nav a#smoke, #gallery.strata #sub_nav a#strata, #gallery.stone #sub_nav a#stone{
	color:#7d8f9f;
	background: transparent url('../Images/play1.gif') left 50% no-repeat;
}


#sub_nav{
	list-style:none;
	padding-top:15px;
	width:30em;
	float:right;
}

#sub_nav li{
	display:inline;
	text-transform:lowercase;
	font-size:1.2em;
	float:right;
}

#sub_nav li a{
	padding-left:14px;
	margin-left:36px;
	margin-right:.7em;
	text-decoration:none;
	font-style:italic;

}

#sub_nav li a:link{
	color: #839487;
	font-weight:normal;
}

#sub_nav li a:visited{
	color: #839487;
	font-weight:normal;
}

#sub_nav li a:hover{
	color: #623228;
	background: transparent url('../Images/play.gif') 0 50% no-repeat;
}
/*Site Content*/
#gutter {
	padding: 10px 30px;
}
#home_img, #exhibition_img {
	display: block;
	margin: 20px auto;
	border: 1px solid  #582F1D;
}

#exhibition_img{
	margin:20px 0;
}

#content{
	font-size:1.5em;
	line-height:1.4em;
	margin: 0 40px;
	clear:left;
}
p#footer {
	text-align: right;
	padding: 10px 0 0;
	border-top: 1px solid #582F1D;
	margin: 30px 0;
	font-size: .6em;
	clear:both;
}
#content p {
	margin: 20px 0;
	text-align: justify;
}
#content h2, #content h3 {
	text-transform: lowercase;
	color: #874638;
	font-style: italic;
	font-weight: normal;
	margin: 30px 0 20px;
}
#content h2 {
	font-size: 1.4em;
}

#content h2#clear{
	clear:both;
}
#content h3 {
	font-size: 1.1em;
	clear:both;
}

#content h3.edu{
	border-top: 1px dotted #582F1D;
	padding-top:20px;
}

.left {
	float: left;
	margin: 5px 15px 15px 0;
	border: 1px solid  #582F1D;
}
.right {
	float: right;
	margin: 5px 0 15px 15px;
	border: 1px solid  #582F1D;
}
.clear {
	clear: both;
}
#content dl {
	text-align: justify;
	border-bottom: 1px dotted #582F1D;
}
#content dt {
	font-size: 1.2em;
	font-style: italic;
	color: #874638;
	margin: 35px 0 10px;
	padding-top: 10px;
	clear: both;
	text-transform: lowercase;
	border-top: 1px dotted #582F1D; 
}

#content dd img{
	margin-bottom: 35px;
}

#content dd:after{
	content: ".";
	display: block;
	clear: both;
	height:0;
	visibility: hidden;
}

#content #gallery_wrap{
	width:100%;
	margin:auto;
}

#content #gallery_wrap:after{
	content:".";
	display: block;
	clear: both;
	height:1px;
	visibility: hidden;
}

#content .gallery{
	margin:0 15px 30px;
	padding:0;
	float:left; 
}

#content .gallery_first{
	margin:0 15px 30px 0;
	padding:0;
	float:left; 
}

#content .gallery_last{
	margin:0 0 30px 15px;
	padding:0;
	float:right; 
}

#content #gallery_wrap h3{
	text-align:center;
	margin:10px 0;
}

#content .gallery_link{
	display:block;
	margin:auto;
	float:left;
}

#content q{
	font-style: italic;
}

#content a:link, #footer a:link {
	color:#7f3b26;
	text-decoration: none;
	font-weight: bold;
}
	  
#content a:visited, #footer a:visited {
	color:#966c46;
	text-decoration: none;
}

#content a:hover, #footer a:hover {
	text-decoration: underline;
	color:#b7512f;
}

#content a:link img{
	border: 1px solid #582F1D;
}

#content a:visited img{
	border: 1px solid #582F1D;
}

#content a:hover img{
	border: 1px solid #909dad;
}

/*Styles for the gallery*/

#thumbs{
	width:280px;
	float:left;
}

#thumbs .rows{
	float:left;
}

#thumbs a{
	float:left;
}

#thumbs a img{
	margin-bottom:17px;
}

#thumbs a img.margin{
	margin-right:13px;
}

#main-image{
	width:300px;
	float:right;
}

#main-image img{
	display:block;
	margin:auto;
	border:1px solid  #7d4228;
}

.loading{
	background: transparent url('../Images/loadingIcon.gif') no-repeat 50% 50%;
	height: 100%;
	width: 100%;
}

#gallery{
	float:left;
	margin-bottom:30px;
	width:100%;
}

/*Forms*/
form {
	margin: 20px;
	width: 80%;
}
fieldset {
	border: 1px solid #969696;
	background:#eae9f0;
	padding: 20px;
	position:relative;
	margin-top: 30px;
}
#content fieldset p {
	text-align: center;
	font-style: italic;
	font-weight: bold;
}
legend {
	text-transform: lowercase;
	color: #874638;
	background:#eae9f0;
	font-style: italic;
	font-weight: normal;
	font-size: 1.3em;
	border: 1px solid #969696;
	background: #eae9f0;
	padding:5px 8px;
}
.description {
	float: left;
	text-align: right;
	width: 17em;
}
/*Text describing a form control*/
.control {
	float: left;
	padding-left: 5px;
}
/*Form control*/
.control input {
	width: 10em;
}
.row {
	clear: both;
	padding: 15px 0;
}
/*Each form description and input is surrounded by a row div.*/
textarea {
	margin: auto;
	width: 90%;
	clear: both;
	float: left;
	height: 22em;
}
#submit, #clearform {
	padding: 5px;
	margin-right: 10px;
}
#content .inputError {
	clear: both;
	text-align: center;
	padding-top: 10px;
	margin-bottom: 5px;
}

/*Tables*/

td{
	vertical-align:top;
	padding: 15px 20px 15px 0;
}

th{
	text-align: left;
}
