/*
Theme Name: The Birthday Co. Template v2
Theme URI: http://thebirthdaycompany.com.au
Description: Another <a href="http://nelga.com">Nelgamedia</a> Masterpiece.
Version: 2.0
Author: Glen McPherson
Author URI: http://nelga.com
Quote: Travel North. That's the only direction your compass should ever point.

[[ Table of Contents ]]
	
	1. Body	
		1.1  *
		1.2  body
		
	2. Text	
		2.1  Body Text / p
		2.2  Links / a
		2.3  Link Hovers / a:hover
		2.4  Product Collection / .collection
		2.5  Header Colon Divider / .collection span
		2.6  Product Title / .product
		2.7  Collection Subnav / #subnav
		2.8  Body Copy Paragraph Breaks / div#body_copy p
		2.9  Breakout / .breakout_txt
		2.10 Footer / .footer_txt
		
	3. Layout	
		3.1  Site Wrapper / #wrapper
		3.2  Header / #header
		3.3  Navigation Bar / #navigation
		3.4  Left Column (text/content) / #leftcolumn
		3.5  Right Column (gallery) / #rightcolumn
		3.6  Footer / #footer
		
	4. Header Layout
		4.1  Tab Wrapper / #header_tabs_wrapper
		4.2  Stockists Tab / #header_left_tab
		4.3  Contact Us Tab / #header_right_tab
	
	5. Navigation Layout
		5.1  Number Collection Button / #nav_number
		5.2  Animal Collection Button / #nav_animal
		5.3  Goodie Collection Button / #nav_goodie
		5.4  Journal Collection Button / #nav_journal
	
	6. Sub Navigation - Son of Suckerfish
		6.1  Sub-navigation / #subnav_bar
		6.2  Sub-nav horizontal list / #subnav, #subnav ul
		6.3  Sub-nav bg & border / #subnav ul
		6.4  Sub-nav text block / #subnav a
		6.5  Sub-nav drop text block / #subnav li ul li a
		6.6  Sub-nav drop padding / #subnav li ul li
		6.7  Sub-nav horizontal floats / #subnav li
		6.8  Sub-nav middle dot / #subnav li.dot
		6.9  Sub-nav hide drop / #subnav li ul
		6.10 Sub-nav drop hover / #subnav li:hover ul
	
	7. Left (Text) Content
		7.1  Left Content Wrapper / #content_wrapper
		7.2  Collection & Product Title / #page_title
		7.3  Body Copy / #body_copy
		7.4  Breakout Box / #breakout_box
		
	8. CForms Contact Form
		8.1  Ordered Form Fields / .cf-ol
		

[[ Colour Reference Chart ]]

	1. Browns	
		Light Brown (Subnav Highlights) / #b4a16a
		Medium Brown (Body Text) / #746f62
		Dark Brown (Headings/Subnav/Breakout) / #645f51
		
	2. Blues	
		Turquoise (Category Heading) / #61c0bd

*/

/* -------- 1. Body Begin -------- */

* { padding: 0; margin: 0; }

body {
	background: url(img/body_bg.gif) repeat-x;
	color: #746f62;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 62.5%; /* Resets 1em to 10px */
	text-align: left;
}

/* -------- 1. Body End -------- */

/* -------- 2. Text Begin -------- */

p {
	color: #746f62;
	font-size: 1.2em;
	font-style: normal;
	font-weight: normal;
	}

a {
	color: #b4a16a;
	text-decoration: none;
	}

a:hover{
	color: #b4a16a;
	text-decoration: underline;
	}

.collection {
	color: #645f51;
	font-size: 2.4em;
	font-weight: bold;
	letter-spacing: -1px;
	}
	
.collection span {
	font-style: normal;
	font-weight: normal;
	}

.product {
	color: #61c0bd;
	font-style: normal;
	font-weight: normal;
	}

#subnav {
	color: #645f51;
	font-size: 1.6em;
	font-style: normal;
	font-weight: normal;
	}

.subnav_drop {
	font-size: 0.9em;
	}

div#body_copy p{
	margin: 0 0 15px 0;
	}

.breakout_txt {
	color: #645f51;
	font-size: 1.8em;
	font-style: normal;
	font-weight: normal;
	}

.footer_txt {
	color: white;
	font-size: 1.2em;
	font-style: normal;
	font-weight: normal;
	margin: 0.8em 0 0 76px;
	}

.footer_txt a {
	color: white;
	}

/* -------- 2. Text End -------- */

/* -------- 3. Layout Begin -------- */

#wrapper { 
	margin: 0 auto;
	width: 1020px;
	}

#header {
	background: url(img/header_img.gif) repeat-x;
	margin: 0;
	width: 1020px;
	height: 180px;
	display: block;
	}

#navigation {
	margin: 0;
	width: 1020px;
	height: 89px;
	display: block;
	}

#leftcolumn { 
	margin: 0 0 0 40px;
	width: 470px;
	height: 620px;
	float: left;
	display: block;
	}

#rightcolumn { 
	margin: 0 40px 0 0;
	width: 470px;
	height: 620px;
	float: right;
	display: block;
	}

#footer { 
	background: url(img/footer_bg.gif) repeat-x;
	margin: 0;
	width: 1020px;
	height: 31px;
	float: left;
	display: block;
	}
	
/* -------- 3. Layout End -------- */

/* -------- 4. Header Content -------- */

#header_tabs_wrapper {
	float: left;
	margin: 145px 0 0;
	width: 230px;
	height: 35px;
	}
	
#header_left_tab {
	background-image: url(img/header_tab1.gif);
	background-repeat: no-repeat;
	width: 107px;
	height: 35px;
	float: left;
	display: block;
	}
	
#header_right_tab {
	background-image: url(img/header_tab2.gif);
	background-repeat: no-repeat;
	width: 123px;
	height: 35px;
	float: right;
	display: block;
	}

/* -------- 4. Header End -------- */

/* -------- 5. Navigation Content -------- */

#header_home {
	width: 505px;
	height: 175px;
	float: left;
	display: block;
	}

#nav_number {
	background-image: url(img/nav_number.gif);
	background-repeat: no-repeat;
	margin: 0 0 0 73px;
	width: 129px;
	height: 120px;
	float: left;
	display: block;
	}
	
#nav_animal {
	background-image: url(img/nav_animal.gif);
	background-repeat: no-repeat;
	margin: 0 0 0 0;
	width: 129px;
	height: 120px;
	float: left;
	display: block;
	}

#nav_dinosaur {
	background-image: url(img/nav_dinosaur.gif);
	background-repeat: no-repeat;
	margin: 0 0 0 0;
	width: 129px;
	height: 120px;
	float: left;
	display: block;
	}
	
#nav_greeting {
	background-image: url(img/nav_greeting.gif);
	background-repeat: no-repeat;
	margin: 0 0 0 0;
	width: 129px;
	height: 120px;
	float: left;
	display: block;
	}

#nav_wrappingpaper {
	background-image: url(img/nav_wrappingpaper.gif);
	background-repeat: no-repeat;
	margin: 0 0 0 0;
	width: 129px;
	height: 120px;
	float: left;
	display: block;
	}
	
#nav_goodiebags {
	background-image: url(img/nav_goodiebags.gif);
	background-repeat: no-repeat;
	margin: 0 0 0 0;
	width: 129px;
	height: 120px;
	float: left;
	display: block;
	}

#nav_journal {
	background-image: url(img/nav_journals.gif);
	background-repeat: no-repeat;
	margin: 0 0 0 0;
	width: 129px;
	height: 120px;
	float: left;
	display: block;
	}

/* -------- 5. Navigation End -------- */

/* -------- 6. Sub Navigation Begin -------- */

#subnav_bar {
	margin: 10px 0 0 0;
	width: 430px;
	height: 25px;
	display: block;
	}

#subnav, #subnav ul {
	padding: 0;
	margin: 0;
	list-style: none;
	}

#subnav ul {
	display: block;
	border-top: solid 2px #a79994;
	border-bottom: solid 2px #a79994;
	border-left: solid 1px #f4efed;
	border-right: solid 1px #f4efed;
	background-color: white;
	}

#subnav a {
	display: block;
	width: auto;
	}

#subnav li ul li a {
	clear: left;
	display: block;
	width: 4em;
	}

#subnav li ul li {
	padding: 8px 15px 0 15px;
	}

#subnav li {
	float: left;
	width: auto;
	}

#subnav li.dot {
	float: left;
	margin: 0 4px 0 4px;
	}

#subnav li ul {
	position: absolute;
	width: 6em;
	padding-bottom: 10px;
	left: -999em;
	}

#subnav li:hover ul {
	left: auto;
	}

/* -------- 6. Sub Navigation End -------- */

/* -------- 7. Left (Text) Content Begin -------- */

#content_wrapper {
	width: 430px;
	margin: 33px auto 0 36px;
	}
	
#page_title {
	width: 430px;
	}
	
	
#body_copy {
	clear: left;
	margin: 10px 0 0 0;
	width: 380px;
	}
	
#breakout_box {
	width: 380px;
	}

/* -------- 7. Left (Text) Content End -------- */

/* -------- 8. CForms Contact Form Begin -------- */

.cform {
	margin: 35px 0 0 0;
	width: 340px;
	}


.cf_hidden {
	display: none;
	}

.cf-ol {
	list-style-type: none;
	}

.cf-ol li {
	margin-bottom: 10px;
	}
	
.cf-ol li span{
	float: left;
	width: 75px;
	margin: 5px 0 0 0;
	}

.cf-ol span {
	font-size: 1.2em;
	}
	
.reqtxt {
	color: #B4A16A;
	font-size: 0.5em;
	}
	
.single, .area {
	color: #746F62;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.2em;
	text-align: left;
	margin: 0 0 0 10px;
	width: 200px;
	border: 1px solid #a29c89;
	padding: 3px;
	}

.sendbutton {
	font-weight: bold;
	border: 1px solid #746F62; 
	background-color: #b4a16a;
	color: white;
	width: 100px;
	margin: 0 0 0 85px;
	}
	
.cf_info {
	color: #ff6666;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.2em;
	text-align: left;
	margin: 0 0 0 85px;
	width: 215px;
	}

/* -------- 8. CForms Contact Form End -------- */