/*
 * Author:		Adam.collison [adam.collison@digitaloverload.co.uk]
 * Agency:		Digital Overload Ltd.
 * Client: 		Knitting Machine Repairs
 * Project: 	Knitting Machine Repairs
 * Comment:		Base stylesheet
 */

@import url("reset.css");


/****************************************************************************
	=standard tags altered and site-wide styles created
*****************************************************************************/
html 
{
	font-size:				100%;
    line-height:			1.125em;
}

body
{
	font-family:			Verdana, Arial, Helvetica, sans-serif;
	font-size:				0.875em;
	background:				#fff;
	text-align:				center;
	color:					#333;
}

a
{
	color:					#c00;
}

a:hover
{
	color:					#c00;
}

strong
{
	font-weight:			bold;
}


/*--------------------------------------------------------------------------
	=structure
----------------------------------------------------------------------------*/

#structure
{
	width:					844px;
	margin:					auto;
	text-align:				left;
	background:				#fff url(../images/bg-structure.jpg) 0 0 repeat-y;
	font-size:				85%;
}

/*--------------------------------------------------------------------------
	=header
----------------------------------------------------------------------------*/
.header
{
	position:				relative;
	border-top:				6px solid #728D9C;
	margin:					0 18px;
}

.header p
{
	margin:					6px 0;
}

.header ul
{
	float:					right;
	border-right:			1px solid #888885;
	margin:					10px 0 0;
}

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

.header ul li
{
	float:					left;
}

.header ul li a
{
	float:					left;
	display:				block;
	padding:				0 10px 2px 10px;
	text-decoration:		none;
	color:					#fff;
	background:				#777775 url(../images/bg-nav.gif) 0 0 repeat-x;
	border:					1px solid #888885;
	border-right:			none;
	font-weight:			bold;
	font-size:				95%;
}

.header ul li a:hover,
.header ul li.selected a
{
	background:				#67A0CA;
	color:					#fff;
}


/*--------------------------------------------------------------------------
	=content
----------------------------------------------------------------------------*/

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

.content
{
	padding:				190px 0 20px 0;
	margin:					0 18px;
	font-size:				100%;
}

.content p
{
	margin:					0.8em 0;
}

.content .main-panel
{
	float:					left;
	width:					516px;
	border-right:			2px solid #AEAEAD;
	padding:				0 15px;
}

.feedback-panel  .main-panel
{
	width:					780px;
	border-right:			none;
	padding-right:			20px;
}

.content .support-panel
{
	float:					right;
	width:					240px;
}

.home
{
	background:				url(../images/bg-heading-home.jpg) 0 0 no-repeat;
}
.about
{
	background:				url(../images/bg-heading-about.jpg) 0 0 no-repeat;
}
.contact
{
	background:				url(../images/bg-heading-contact.jpg) 0 0 no-repeat;
}
.feedback-panel
{
	background:				url(../images/bg-heading-feedback.jpg) 0 0 no-repeat;
}

.contact form
{
	padding:				15px 0 0;
}

.contact .mandatory
{
	float:					right;
	margin:					0;
}

.contact em
{
	font-style:				normal;
	color:					#c00;
}

.contact table td,
.contact  table th
{
	padding:				2px 2px 7px 0;
	vertical-align:			top;
}

.contact  table th
{
	padding:				2px 20px 7px 0;
}

.contact  table input
{
	width:					250px;
}

.contact  table textarea
{
	width:					250px;
	height:					250px;
}

.errors
{
	color:					#c00;
	border:					1px solid;
	padding:				10px;
	margin:					5px 0 20px;
	background:				#FFECEC;
}

.success
{
	color:					#006600;
	border:					1px solid;
	padding:				10px;
	margin:					5px 0 20px;
	background:				#EBFFDF;
}

.errors p
{
	margin:					0 0 0.8em;
}

/*--------------------------------------------------------------------------
	=footer
----------------------------------------------------------------------------*/

.footer
{
	font-size:				85%;
	color:					#333;
	background:				#DBDBDB;
	margin:					0 6px;
}

.footer p
{
	padding:				5px 20px;
}

.footer:after
{
	content:				".";
	display:				block;
	clear:					both;
	height:					0;
	line-height:			0;
	visibility:				hidden;
}

.footer ul
{
	float:					right;
	padding:				20px;
}

.footer ul li
{
	float:					left;
	padding:				0 10px;
	border-right:			1px solid #ccc;
}

.footer ul li.last
{
	border-right:			0;
	padding-right:			0;
}

.footer ul li a
{
	color:					#999;
}

.footer ul li a:hover,
.footer ul li.selected a
{
	color:					#c00;
}

.content .pricelist
{
	margin-top:				18px;
}

.content .pricelist th
{
	padding:				4px 18px 4px 5px;
	font-weight:			bold;
	color:					#fff;
	background:				#999;
}

.content .pricelist td
{
	padding:				2px 18px 2px 5px;
}

.content .pricelist .even td
{
	background:				#F0F5FF;
}

.feedback
{
	border-top:			1px dotted #ccc;
	padding-top:		10px;
}

.customer
{
	margin-top:				-5px!important;
	font-style:				italic;
	padding-bottom:			15px;
}