/*=============================================================
Beechworth Photographers CSS
andrew@macdermid.net
==============================================================*/



/*=============================================================
=Colours
==============================================================

orange: #ff6600
black: #
grey: #666666
lighter grey: #9b9b9b
lightest grey: #cccccc
even lighter grey: #e6e7e8 was used for header and nav bg
red: #a21d21

*/


/*=============================================================
=Structure
==============================================================*/




body {
	margin: 0;
	padding: 0;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	background-image: url(bg.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
	text-align:center;
	min-width:800px;
	min-height:630px;
}

html, body{
	height:100%;
	margin:0;
	padding:0;
}

#vertical {
	float:left;
	height:50%;
	margin-top:-309px;/* half main elements height*/
	width:100%;
}

#hoz {
	position:relative;
	width:800px;
	margin-left:auto;
	margin-right:auto;
	height:618px;
	text-align:left;
	clear:both;
}

#header {
	height:132px;
	width:100%;
	margin-bottom:10px;
	position:relative;
}

#logo {
	width:124px;
	height:127px;
	position:absolute;
	right:0px;
	bottom:5px;
	margin:0;
	padding:0;
}

#content {
	position:relative;
	width:800px;
	height:400px;
	background-color:#f3f3f3;
}

#about {
	width:740px;
	margin:0 30px 32px 30px;
	padding-top:30px;
}

#julietbiophotos {
	left:30px;
	position:absolute;
	width:150px;
}

#julietbio {
	position:absolute;
	right:30px;
	width:560px;	
}

#erinbio {
	position:absolute;
	bottom:30px;
	right:30px;
	width:560px;	
}

#contact {
	padding-top:54px;	
}


#contactimg {
	padding-top:54px;	
	float:left;
	margin-right:30px;
}

#contacttextx {
	width:570px;
	padding-top:49px;	
	float:left;
}


#aboutusphoto {
	left:0px;
	bottom:0px;
	position:absolute;
	padding:8px;
	height:287px;
	background-color:#FFF;
}

#contactphoto {
	left:0px;
	bottom:0px;
	position:absolute;
	padding:8px;
	height:287px;
	background-color:#FFF;
}

#aboutintro, #contactintro {
	width:740px;
	margin:0px 0px 10px 0px;
	padding-top:10px;
}

#abouttext {
	right:30px;
	position:absolute;
	width:460px;
}

#contacttext {
	right:30px;
	position:absolute;
	width:460px;
	bottom:0;
}


/*=============================================================
=Typography
==============================================================*/
	  
	  
h1 a {
	text-decoration:none;
	color:#666666;
}

h1 {
	margin: 0;
	padding: 5px 0 5px 0;
	font-size:1.5em;
	color:#666666;
	width:50%;
	position:absolute;
	bottom:0px;
	text-align:left;
	float:left;
	font-weight:bold;
}


h2 {
	color:#333;
	font-size:1.3em;
	line-height:1.4em;
	margin:0 0 4px 0;
	width:50%;
}

h2:hover {
	cursor: pointer;
	color:#a21d21;
}

#content p {
	color:#666666;
	font-size:1.2em;
	margin-bottom:1em;
	margin:0;
}

#content #about p {
	font-size:1.5em;
	line-height:1.5em;
	color:#a7a5aa;
}

#content #aboutintro p, #content #contactintro p {
	font-size:1.3em;
	line-height:1.4em;
	color:#333;
}

#content #abouttext p, 
#content #contacttext p {
	font-size:1.2em;
	line-height:1.4em;
	color:#666666;
	margin-bottom:0.5em;
}

#julietbio p, #erinbio p {
	color:#a7a5aa;
	margin-bottom:0.7em;
}

#content .clientname, #content .clientname a {
	color:#333;	
}

#content a {
	color:#666666;
	text-decoration:none;
}

#content a:hover, #content .clientname a:hover {
	color:#a21d21;
	text-decoration:none;
}

#buyprint a, #ratespdf a {
	color:#a21d21;
	text-decoration: none;
}

#buyprint a:hover, #ratespdf a:hover {
	text-decoration: none;
	color:#a21d21;
}

#contacttext p.intro, #abouttext p.intro {
	color:#666666;
	font-size:1.4em;
	line-height:1.4em;
}

#content #contacttext .highlight {
	color:#a21d21;
}


/*=============================================================
=Lists
==============================================================*/

#content ul {
	list-style:none;
	list-style-type:none;
	padding:0;
	margin:0;
}

#content ul li {
	color:#666666;
	font-size:1.2em;
	padding-bottom:0.5em;
	text-decoration:none;
}

#content li a {
	color:#666666;
	text-decoration:none;
}


#content #abouttext ul {
	list-style-type:disc;
	margin-left:18px;
	padding-bottom:0.5em;
}

#content #abouttext ul li {
	font-size:1.2em;
	line-height:1.4em;
	padding-bottom:0em;
	color:#666666;
}

dl {
	width:570px;	
	font-size:1.3em;
	line-height:1.5em;
	margin-top:20px;
}

dt {	
	width:92px;
	clear:left;
	float:left;
	color:#333;
	font-weight:bold;
}

dd {
	width:466px;
	float:left;
	margin-left:12px;
	color:#666666;
}

dd a:link {
	color:#666666;
	text-decoration:none;
}

#content dd a:hover {
	color:#a21d21;
	text-decoration:none;
}

#contacttext dl {
	width:460px;
	font-size:1.3em;
	line-height:1.4em;
	margin-top:10px;

}


#contacttext dt {
	width:100px;
	font-weight:bold;
	margin-bottom:6px;
}



#contacttext dd {
	width:348px;
	margin-bottom:6px;
}






.extraspacing {
	margin-top:16px;	
	
}


/*=============================================================
=Gallery
==============================================================*/
	  
     
#gallery {
	width:800px;
	height:400px;
	margin: 0;
	padding: 0;
	overflow:hidden;
	background-color:#f3f3f3;
}

#gallerylinks ul, #gallerylinks ul li {
	list-style: none;
	width:100%;
	margin: 0;
	padding: 0;
}

#gallerylinks ul {
	text-align: center;
	margin-bottom:10px;
	margin-top:10px;
}

#gallerylinks ul li {
	display: inline;
}

#gallerylinks ul li a:link,
#gallerylinks ul li a:visited {
	color:#000;
	padding: 0 2em;
	text-decoration: none;
	outline:none;
}

#gallerylinks ul li a:hover {
	background-color:#e6e7e8;
	background-color:#a21d21;
	text-decoration: none;
	color:#FFFFFF;
}

#gallerylinks ul li.activeSlide a  {
	background-color:#e6e7e8;
	color:#a21d21;
	text-decoration: none;
	outline:none;
}


/*=============================================================
=Navigation
==============================================================*/


#navigation {
	position: absolute;
	margin: 0;
	padding: 0;
	height:40px;
	bottom:0;
}


#navigation ul {
	position: absolute;
	font-size:1.5em;
	font-weight:normal;
	text-align: center;
	list-style: none;
	margin: 20px 0 0 0;
	padding: 0;
	width:800px;
}

#navigation.notgallery {	
	margin: 33px 0 0 0;
}

#navigation ul li {
	width:100%;
	display: inline;
	color:#666666;
	padding: 0px 1em;
}

#navigation ul li a {
	color:#666666;
	text-decoration: none;
}

#navigation ul li a:hover {
	/*background-color:#9b9b9b;*/
	text-decoration: none;
	color:#a21d21;
}

/*second level menu layout*/
	#navigation ul li ul {
	position: absolute;
	left: -999em;
	top: -40px;
	width:800px;
	font-size:1em;
	padding-bottom:4px;
}

/*second level item layout*/
	#navigation li ul li a {
	color:#9b9b9b;
	font-weight: normal;
	display:inline;
}

#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
	left: 0;
}


/*=============================================================
=Images
==============================================================*/

#aipplogo {
	margin-top:16px;
}


#erinimg {
	float:right;
	margin-left:16px;
}

img {
	border:none;
}