/*******************************************************************/
/* Styles for serenapengelley.co.uk  (c) Copyright Tom White. 2006 */
/*******************************************************************/
body {
	font-family:  Trebuchet MS, Arial, Verdana sans-serif; 
	font-size: 90%; /* 90% for scaling or 10.65pt for fixed */
	background: white url(images/grad_bg.gif) repeat-x;
	margin: 0;
	line-height: 125%;
	text-align: center;
}

a {color: #5CA887; text-decoration: none;}
a img, div.selected img{text-decoration: none; border: none; vertical-align: top; }
a:hover {text-decoration: underline}

p {color: #666; text-align: justify; margin: 0 0 0.2em 0em; padding: 0.3em 0 0em 1em; border-left: 1px dashed #ccc; font-weight: normal;}

h1 {
	float: left;
	color: #aaa;
	font-size: 120%;
	background: url(images/h1_bg.gif) repeat-y;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 250%;
	margin: 0.5em 0.7em 0 0em;
	padding: 0 0.2em 0 0.8em;
	border-bottom: 1px dashed #ddd;
	border-top: 1px dashed #ddd;
	letter-spacing: 1px;
	clear: both;
}

sup, sub {font-size: 80%;}

dl {
	font-size: 100%;
	margin: 0.6em 0em 0em 1.1em;	
	padding: 0.2em 1em 0 0;
	border-right: 1px dashed #ccc;
}

dt {
	margin: 0em;
	padding: 0;
	color: #999;
	padding-left: 0.8em;
	background: transparent url(images/data_bl.gif) no-repeat center left;
}

dd {
	color: #613A3A;
	margin: 0 0 0.6em 2em;
}


/* Mulipurpose classes */

.flright {float: right}
.flleft {float: left}

.clearboth {clear:both}
.hideit {display:none}
.alignright {text-align: right}
.aligncenter {text-align: center}
.bold {font-weight: bold}
.logotext {color: #444; font-family:Arial, Helvetica, sans-serif}
.logotext span{color: #A5422E}
.quote {margin: 0; padding: 0em 0em 0.5em 1em; font-size: 160%; color: #aaa; line-height: 120%;}
.quote img.left {margin: 0.3em 0.7em 0.5em 0em; float: left}
.quote img.right {margin: 0.8em 0em 0em 0.7em; float: right}
/* Author hook */
.videsign {float: right; font-size: 70%; color: #ccc}

/* containers */
#wrapper {
	width: 760px; 
	margin: 3em auto 0 auto; 
	padding: 0em;
	background: white url(images/grad_invert_bg.gif) repeat-x;
	border: 1px solid #bbb;
	text-align: left;
	/*border-bottom: 20px solid #bbb;*/	
}
	
#content {
	width:352px; 
	height: 390px;
	float: left;
}

#title {
	width: 383px;
	height: 79px;
	background: url(images/serena.jpg) no-repeat;
}

#background {
	margin: 0.8em; 
	height: 27.5em; 
	padding: 0;
}
.backindex {background: white url(images/index_title.jpg) no-repeat right top; }
.backcontact {background: white url(images/contact_title.jpg) no-repeat 310px top; }
.backportraits {background: white url(images/portraits_title.jpg) no-repeat right top; }
.backweddings {background: white url(images/weddings_title.jpg) no-repeat right top;}
.backlandscape1 {background: white url(images/landscape1_title.jpg) no-repeat right top;}
.backlandscape2 {background: white url(images/landscape2_title.jpg) no-repeat right top;}



#rightcontent {
	text-align: center;
	width:350px; 
	height: 330px;
	float: right;
	margin: 0;
	padding: 20px 0 0 0;
}
#rightcontent .thumb {margin:  20px 20px 0 0em; width:90px; height: 70px; border: 1px solid #ddd; padding: 1px}
#rightcontent[id] .thumb:hover {border: 2px solid #eee; padding: 0;border-bottom: 2px solid #aaa; border-right: 2px solid #aaa;}
* html #rightcontent a:hover {border-bottom: 2px solid #999; border-top: 2px solid #999; }
#rightcontent div {border-bottom: 3px solid #ddd; border-right: 3px solid #ddd; background: #fff; color: #BB213C; padding: 0.25em 0.5em; margin: 0 20px 10px 20px; }

#footer {
	width: 741px; 
	margin: 0.7em auto;
	background: transparent url(images/footer_bg.gif) no-repeat left bottom; 
	padding: 5px 10px; 
	font-size: 100%;
	color: #fff;
	border-top: 1px solid #bbb;
	border-right: 1px solid #bbb;
}
#footer a {font-weight: bold; letter-spacing: 2px; color: #FFECE5; text-decoration: none; font-size: 110%; line-height: 130%;}
#footer a:hover {color: #fff; text-decoration: underline}
.selected {display: inline; border-top: 3px solid #eee; border-bottom: 3px solid #a2a2a2; font-weight: bold; letter-spacing: 2px; color: #fff; text-decoration: none; font-size: 110%; line-height: 130%; padding: 0;}

/*Buttons */

#gallerybtn {
	 padding: 0em 0 0em 0.6em;
 	 margin: 0;
	 list-style: none;
	
}

#gallerybtn li {
	float: left;
	position: relative;
	margin: 0;

}
.mini_btn {
	float: right;
	margin: 0.5em 0 0em 1em;
	padding: 0.2em 0.3em;
	border: 1px dashed #ccc;
}
.mini_btn_rt {
	float: right;
	padding: 0em 0.5em; 
	margin: 7px 20px 10px 0px;
	border-top: 1px solid #ddd; 
	border-left: 1px solid #ddd; 
	border-bottom: 2px solid #aaa; 
	border-right: 2px solid #aaa; 
	background: #fff;
}
* html .mini_btn_rt {margin: 7px 10px 10px 0px;}


/* Sprite rollovers */
a.port_butt span, a.wedd_butt span, a.land_butt span, a.port_butt_sm span, a.wedd_butt_sm span, a.land_butt_sm span {
	margin:0px; 
	padding:0px; 
	visibility:hidden;
}

a.port_butt { 
	display: block;
	width:105px; 
	height:85px; 
	text-decoration: none; 
	background: url(images/btn_portrait.jpg) no-repeat;
}

a.port_butt:hover {
	background:url(images/btn_portrait.jpg) no-repeat 0px -84px;
}

a.wedd_butt { 
	display: block;
	width:105px; 
	height:85px; 
	text-decoration: none; 
	background: url(images/btn_wedding.jpg) no-repeat;
}

a.wedd_butt:hover {
	background:url(images/btn_wedding.jpg) no-repeat 0px -84px;
}
a.land_butt { 
	display: block;
	width:105px; 
	height:85px; 
	text-decoration: none; 
	background: url(images/btn_landscape.jpg) no-repeat;
}

a.land_butt:hover {
	background:url(images/btn_landscape.jpg) no-repeat 0px -84px;
}

/* Image.php */

#imagebody {margin: 0em 0em 0em 0em; padding: 0; text-align: center; }
#imagebody img {border: 2px solid #ccc; margin: 0;}
