/*
------------------------------------------------------------------------------------------------
	GENERIC CSS - styles.css											  
------------------------------------------------------------------------------------------------
	Created: 	20-03-2007															
	Author: 	Ember Interactive (www.emberinteractive.co.uk)						
	Website: 	Mango Photography - Courses															
------------------------------------------------------------------------------------------------
*/


/*
----------------------------------------------------------------------------------------- GLOBAL
															
------------------------------------------------------------------------------------------------
*/

body {
	background: #000;
	font-family: "Lucida Grande", "Gill Sans", Arial, Verdana, Sans-Serif;
	font-size: 62.5%;
	margin: 0;
	padding: 0;
	}
	
/*
-------------------------------------------------------------------------------- TITLES AND TEXT
														
------------------------------------------------------------------------------------------------
*/

h1 {color: #FFCC00; font-size: 2.0em; line-height: 50px; font-weight: normal; margin: 0; padding: 10px 0 0 20px;}

h2 {color: #FFCC00; font-size: 1.5em; font-weight: bold; margin: 0; padding: 5px 0 0 20px;}
h2 span {color: #FFCC00; font-size: 0.75em; font-weight: normal; margin: 0; padding: 0;}

h4 {color: #FFF; font-size: 1.25em; font-weight: bold; margin: 0; padding: 10px 0 0 20px;}

p {color: #FFF; font-size: 1.10em; line-height: 1.75em; font-weight: normal; margin: 0; padding: 5px 15px 5px 20px;}
p span {color: #FFCC00;}

p.quote {color: #FFCC00; font-style: italic;}

a {color: #FFCC00; margin: 0; padding: 0;}
a:link, a:visited {text-decoration: none;}
a:hover {color: #FF9900; text-decoration: none;}
a.active {color: #FF9900;}

ul {
	margin: 5px 0 5px 20px; 
	padding: 0; 
	list-style-type: none;
	}
	
li { 
	background: url(images/bg_bullet.gif) left center no-repeat;
	color: #fff;
	font-size: 1.10em;
	line-height: 2em;
	margin: 0;
	padding: 0 0 0 20px;
	}

/*
------------------------------------------------------------------------------------- NAVIGATION
														
------------------------------------------------------------------------------------------------
*/

ul#nav {position: absolute; width: 780px; margin: 0; padding: 0;}
ul#nav li {float: left; list-style-type: none;}
ul#nav li a {height: 33px; display: block; position: absolute; top: 0; text-indent:-9999px; outline: none;}

li#navIntro a, li#navWedding a, li#navPortrait a, li#navOne a, li#navAccommodation a, li#navBooking a, li#navContact a {background: url(images/bg_button.gif);}

li#navIntro a {background-position: 0 0; width: 111px; left: 0; }
li#navIntro a:hover, li#navIntro a.active {background-position: 0 -33px;} 

li#navWedding a {background-position: -111px 0; width: 132px; left: 111px;}
li#navWedding a:hover, li#navWedding a.active {background-position: -111px -33px;}

li#navPortrait a {background-position: -243px 0; width: 124px; left: 243px;}
li#navPortrait a:hover, li#navPortrait a.active {background-position: -243px -33px;}

li#navOne a {background-position: -367px 0; width: 108px; left: 367px;}
li#navOne a:hover, li#navOne a.active {background-position: -367px -33px;}

li#navAccommodation a {background-position: -475px 0; width: 130px; left: 475px;}
li#navAccommodation a:hover, li#navAccommodation a.active {background-position: -475px -33px;}

li#navBooking a {background-position: -605px 0; width: 83px; left: 605px;}
li#navBooking a:hover, li#navBooking a.active {background-position: -605px -33px;}

li#navContact a {background-position: -688px 0; width: 92px; left: 688px;}
li#navContact a:hover, li#navContact a.active {background-position: -688px -33px;}

/*
----------------------------------------------------------------------------------------- LAYOUT
															
------------------------------------------------------------------------------------------------
*/

#master {width: 780px; margin: 0 auto; padding: 0;}

#header {height: 100px; margin: 0; padding: 0;}

#navigation {background: url(images/bg_navigation.gif) repeat-x; height: 33px; margin: 0; padding: 0; border: 1px solid #222;}

#content {margin: 0 0 30px 0; padding: 0;}

#content_left {float: left; width: 389px; margin: 0; padding: 0;}

#content_right {float: left; width: 390px; margin: 0; padding: 0; border-left: 1px solid #222;}

#footer {background: url(images/bg_footer.gif) repeat-x; height: 33px; margin: 0; padding: 0; border: 1px solid #222; text-align: center;}

/*
----------------------------------------------------------------------------------------- HEADER
															
------------------------------------------------------------------------------------------------
*/

#header img.logo {float: left; margin: 0; padding: 20px 0 0 20px;}

#banner {float: right; width: 330px; height: 58px; margin: 20px 0 0 0; padding: 0 20px 0 0;}

.banner1 {background: url(images/banner1.gif) no-repeat;}
.banner2 {background: url(images/banner2.gif) no-repeat;}
.banner3 {background: url(images/banner3.gif) no-repeat;}
.banner4 {background: url(images/banner4.gif) no-repeat;}
.banner5 {background: url(images/banner5.gif) no-repeat;}
.banner6 {background: url(images/banner6.gif) no-repeat;}

/*
----------------------------------------------------------------------------------------- FOOTER
															
------------------------------------------------------------------------------------------------
*/

#footer p.footer_left {float: left; margin: 0; padding: 7px 0 0 20px;}

#footer p.footer_right {float: right; margin: 0; padding: 7px 20px 0 0;}

#footer span {color: #FFCC00;}

/*
----------------------------------------------------------------------------------- INTRODUCTION
															
------------------------------------------------------------------------------------------------
*/

#content_left_home {float: left; width: 390px; margin: 0; padding: 0;}

#content_right_home {float: left; width: 369px; margin: 0; padding: 0 20px 0 0; text-align: left; border-left: 1px solid #222;}

#content_right_home p {float: left; margin: 0; padding: 0 0 0 39px; line-height: 30px;}

img.photo_home {float: right; margin: 7px 0 0 30px; padding: 0;}

/*
---------------------------------------------------------------------------------------- COURSES
															
------------------------------------------------------------------------------------------------
*/

img.photo_wedding {margin: 17px 10px 20px 20px; padding: 0;}

#dates {margin: 10px 37px 0 20px; padding: 0;}

#dates .date {float: left; display: block; width: 160px; margin: 0; padding: 0; font-weight: bold;}
#dates .price {float: left; display: block; width: 60px; margin: 0; padding: 0;}
#dates .status {float: left; display: block; width: 100px; margin: 0; padding: 0;}

/*
---------------------------------------------------------------------------------------- BOOKING
															
------------------------------------------------------------------------------------------------
*/

fieldset {border: 0 solid; padding: 0;}

label {display: block; color: #FFCC00; margin-bottom: 5px;}

input {width: 200px; font-size: 1em; line-height: 1.75em; font-weight: normal; font-family: "Lucida Grande", "Gill Sans", Arial, Verdana, Sans-Serif;}

select {width: 175px; font-size: 1em; line-height: 1.75em; font-weight: normal; font-family: "Lucida Grande", "Gill Sans", Arial, Verdana, Sans-Serif; padding: 2px;}

.btn {width: 100px; margin-top: 20px; background: #FFCC00;}

.thanks {height: 345px;}

/*
---------------------------------------------------------------------------------- ACCOMMODATION
															
------------------------------------------------------------------------------------------------
*/

img.photo_accomm {margin: 5px 0 20px 20px; padding: 0;}

/*
---------------------------------------------------------------------------------------- CONTACT
															
------------------------------------------------------------------------------------------------
*/

#map {height: 350px; width: 350px; border: 1px solid #fff; margin: 20px 0 20px 20px; padding: 0;}

/*
------------------------------------------------------------------------------------------ MISC.
															
------------------------------------------------------------------------------------------------
*/

br.clear {clear: both; overflow: hidden; line-height: 0px;}

/*
------------------------------------------------------------------------------------------- BLOG
															
------------------------------------------------------------------------------------------------
*/

#blog {display: block; width: 127px; height: 25px; margin-left: 633px; position: absolute; top: 135px!important; background: url(images/blog_button.gif) no-repeat;}
#blog a {display: block; width: 127px; height: 25px; text-indent:-9999px; outline: none;}