/* 

Author  : James Thomson [james.thomson@soup.co.uk]
Client  : Soup Ltd.
Project : Train Blog

*/


/****************************************************************************
	=standard tags altered
*****************************************************************************/

*
{
	margin:					0;
	padding:				0;
}

body
{
	background-color:		#333;
	font-family:			Verdana, Lucida Console, Courier New, Sans-Serif;
	font-size:				small;
}

h1
{
	float:					left;
	margin:					18px 0 0 30px;
}

h2
{
	margin-bottom:			5px;
}

h3
{
	margin-bottom:			2px;
	font-size:				1.1em;
	text-transform:			uppercase;
}

h4
{
	margin-bottom:			6px;
}

h5
{
	font-size:				0.9em;
	font-weight:			bold;
	padding-bottom:			4px;
}

h1 img, h2 img, h3 img
{
	display:				block;
}

p
{
	margin-bottom:			10px;
}

address
{
	margin:					20px 0;
	line-height:			1.7em;
	font-style:				normal;
	font-weight:			bold;
}

a 
{
	color:					#C46200;
}

a img
{
	border:					none;
}

form
{
	display:				block;
	margin:					14px 0 5px;
}

ul
{
	padding-bottom:			3px;
	list-style:				none;
}

ul li
{
	padding-left:			13px;
	padding-bottom:			4px;
	background:				url(../images/bg_li.gif) 0 0.6em no-repeat;
}

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

label img
{
	display:				block;
}

input, textarea
{
	display:				block;
	border:					1px solid #888;
	font-size:				1.1em;
	font-family:			Verdana, Arial, Lucida Console, Courier New, Serif;
}

input 
{
	margin-bottom:			6px;
}

fieldset
{
	border:					none;
	margin-bottom:			3px;
}

table
{
	margin-bottom:			10px;
}

table th
{
	font-weight:			bold;
	text-align:				left;
}

td, th
{
	padding-right:			15px;
}

tr > td:first-child, tr > th:first-child
{
	text-align:				center;
}

dl
{
	margin:					5px 0 10px;
}

dl:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}

dd
{
	padding:				0 0 5px 20px;
}

/****************************************************************************
	=generic classes
*****************************************************************************/

.note
{
	margin:					20px 0 25px;
}

.right
{
	float:					right;
}

.right a
{
	margin-left:			10px;
}

.button
{
	border:					none;
}

.buttons
{
	margin-top:				32px;
	padding-top:			13px;
	background:				url(../images/bg_seperator.gif) top repeat-x;
}

.buttons:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}

.hidden_input
{
	border:					none;
}

.logo
{
	float:					left;
	margin:					18px 0 0 30px;
}

#img_or
{
	position:				absolute;
	left:					0;
	top:					-5px;
}

#img_either
{
	position:				absolute;
	left:					0;
	top:					-2px;
}

.page_indicator
{
	text-align:				right;
	font-weight:			bold;
	padding-bottom:			5px;
}

.screen
{
	display:				inline;
}

.handheld
{
	display:				none;
}


/****************************************************************************
	=page container, sets out the width of the content and centres page
*****************************************************************************/

#page_container
{
	width:					729px;
	margin:					15px auto;
	font-size:				0.85em;
	line-height:			1.4em;
}


/****************************************************************************
	=header, content which sits on the top orange section of the ticket
*****************************************************************************/

#header
{
	background:				url(../images/bg_header.gif) top left no-repeat;
	height:					78px;
}

#header ul
{
	float:					right;
	height:					16px;
	padding:				39px 27px 0 0;
}

#header ul:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}

#header ul li
{
	background:				none;
	float:					left;
	padding:				0 15px 0 0;
}


/****************************************************************************
	=content_container, only purpose is padding and background
*****************************************************************************/

#content_container
{
	background:				url(../images/bg_content.gif) top left repeat-y;
	padding:				15px 0 15px 30px;
}

#content_container:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}


/****************************************************************************
	=content, main page content, floated left with subcontent next to it
*****************************************************************************/

.content
{
	float:					left;
	width:					466px;
	padding-right:			18px;
}


/*--------------------------------------------------------------------------
	=body, body content of the 'content' class
----------------------------------------------------------------------------*/

.body
{
	padding-top:			9px;
	background:				url(../images/bg_seperator.gif) top repeat-x;
}


/*--------------------------------------------------------------------------
	=heading, header for the 'content' class
----------------------------------------------------------------------------*/

.heading
{
	padding-bottom:			10px;
	position:				relative;
}

.heading .button
{
	position:				absolute;
	bottom:					10px;
	right:					0;
}

.heading:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}


/****************************************************************************
	=footer, content which sits on the bottom orange section of the ticket
*****************************************************************************/

#footer
{
	height:					84px;
	padding-right:			43px;
	padding-top:			25px;
	background:				url(../images/bg_footer.gif) top left no-repeat;
	font-size:				0.9em;
}

#footer ul
{
	float:					right;
	clear:					both;
	margin-bottom:			45px;
	list-style:				none;
}

#footer ul li
{
	display:				inline;
	padding:				0;
	color:					#fff;
	background:				none;
}

#footer .right
{
	clear:					both;
}

#footer ul a
{
	padding:				2px 1px;
	color:					#fff;
	text-decoration:		none;
}

#footer ul a:hover
{
	background:				#fff;
	color:					#CE5201;
}


/*--------------------------------------------------------------------------
	=subcontent, this is the right hand panel
----------------------------------------------------------------------------*/

.subcontent
{
	float:					left;
	width:					188px;
	font-size:				0.9em;
}

.subcontent h2
{
	float:					none;
	margin-bottom:			0;
}

.subcontent ul
{
	margin:					10px 0 10px 10px;
}


/*--------------------------------------------------------------------------
	=add_comment, for the Add Comment box and it's content
----------------------------------------------------------------------------*/

.add_comment
{
	position:				relative;
	padding:				15px 18px 2px 18px;
	background:				url(../images/bg_add_comment.gif) top left no-repeat;
}

.add_comment h2
{
	margin-bottom:			5px;
}

.add_comment textarea, .add_comment input
{
	width:					142px;
	display:				block;
}

.add_comment .buttons input
{
	width:					auto;
}

.add_comment .buttons
{
	margin-top:				0;
	padding-top:			5px;
	padding-bottom:			5px;
	background:				none;
}

.add_comment .buttons a
{
	margin-left:			3px;
}

.add_comment.thanks .buttons
{
	padding-top:			10px;
}

.add_comment textarea
{
	height:					55px;
}

.add_comment_either
{
	position:				relative;
	padding-bottom:			10px;
}


/*--------------------------------------------------------------------------
	=page_nav, this is the comments recordset navigation
----------------------------------------------------------------------------*/

.page_nav
{
	padding-bottom:			8px;
}

.page_nav:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}

.page_nav ul li
{
	float:					left;
	background:				none;
	padding:				0;
	margin:					auto 0;
	color:					#CE5201;
}

.page_nav ul li span.active_page
{
	font-weight:			bold;
	color:					#666;
}

.page_nav ul li.first
{
	padding-right:			6px;
}

.page_nav ul li.prev
{
	padding-right:			15px;
}

.page_nav ul li.last
{
	padding-left:			6px;
}

.page_nav ul li.next
{
	padding-left:			15px;
}

.page_nav ul li a
{
	font-weight:			bold;
	text-decoration:		underline;
	color:					#CE5201;
}

.page_nav ul:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}


/*--------------------------------------------------------------------------
	=blogs, encapsulates one or more blog entries
----------------------------------------------------------------------------*/

.blogs
{
	padding:				0 0 12px;
	background:				url(../images/bg_seperator.gif) top repeat-x;
}

.blogs:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}

.blogs a, #contact .body a
{
	padding:				0 2px;
	color:					#E67925;
	background-color:		#fff;
	font-weight:			bold;
	text-decoration:		none;
}

.blogs a:hover, #contact .body a:hover
{
	color:					#fff;
	background-color:		#E67925;
}

.blogs_header .right
{
	font-weight:			bold;
}


/*--------------------------------------------------------------------------
	=blog_entry, represent each blog entry within 'blogs' class
----------------------------------------------------------------------------*/

.blog_entry
{
	padding:				7px 10px 8px 2px;
	background:				url(../images/bg_seperator.gif) bottom repeat-x;
	font-size:				0.9em;
}

.blog_entry:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}

.blog_entry img
{
	float:					left;
	margin:					0 10px 3px 0;
	border:					1px solid #CE5201;
}

.blog_entry.first
{
	padding-top:			0;
}

.blog_entry p
{
	font-weight:			bold;
}

.blog_entry h3 span
{
	color:					#CE5201;
}

.blog_entry blockquote p
{
	font-weight:			normal;
	margin-bottom:			0;
}


.blog_content
{
	float:					left;
	width:					auto;
}

.blog_content.with_image
{
	width:					352px;
}

.blogs_footer .page_nav
{
	background:				none;
	padding-bottom:			0;
}


/*--------------------------------------------------------------------------
	=spec-blogs, blogs.php specific
----------------------------------------------------------------------------*/

#blogs .body
{
	background:				none;
	padding-top:			0;
}

#blogs .heading
{
	padding-bottom:			10px;
}


/*--------------------------------------------------------------------------
	=spec-blog_detail, blog_detail.php specific
----------------------------------------------------------------------------*/

#blog_detail .blog_entry
{
	font-size:				1em;
}

#blog_detail .blog_entry img
{
	margin-right:			15px;
	border-color:			#fff;
}

#blog_detail .blog_entry
{
	padding-bottom:			12px;
	padding-top:			2px;
}

#blog_detail .content .buttons
{
	padding-top:			0;
	margin-top:				12px;
	background:				none;
}

#blog_detail .blog_entry:after
{
	display:				block;
	content: 				".";
	height: 				0;
	font-size:				0;
	clear: 					both;
	visibility:				hidden;
}

#blog_detail .blog_content.with_image
{
	width:					280px;
}


/*--------------------------------------------------------------------------
	=spec-contact, contact.php specific
----------------------------------------------------------------------------*/

#contact .content p.last
{
	margin:					0;
	padding:				16px 0;
	background:				url(../images/bg_seperator.gif) bottom repeat-x;
}


/*--------------------------------------------------------------------------
	=spec-contact, contact.php specific
----------------------------------------------------------------------------*/

#home .body
{
	background:				none;
	padding-top:			0;
}