/*------------------------------------------------------------------
[Master Stylesheet]

Project:		Hyde Park Corner website
Version:		1.6
Changes:		1.1 - 02/02/10 - Blog CSS
				1.2 - 03/02/10 - Form CSS
				1.3 - 27/02/10 - Classes and IDs for the order/enquiry form
				1.4 - 04/03/10 - Customer login
				1.5 - 08/03/10 - Added classes etc for Trafficmaster/Argos/M&S forms
				1.6 - 14/05/10 - H4 / Engineer image
Primary use:	Web site / Some CSS for the blog
-------------------------------------------------------------------*/

/* Layout */


html {
	/* non-ie browsers short page fix */
	margin-bottom: 1px;
	height: 100%;
	margin: 0 auto;
}

body {
	font-family:"trebuchet MS", Verdana, Arial, sans-serif ;
	color:#333333;
	background:#FFFFFF;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in main class */
	height: 100%;
}

/* Structure */

.main{
	width: 890px;
	padding: 0px;
	margin: 0px auto;
	text-align: left;
	background-image:url(../media/background.jpg);
	background-repeat:no-repeat;
	font-size:12px;
	
}

.header{
	height: 160px;
}


.main-body{
	height: auto;
	padding:0 60px 20px 300px;
	
}


.main-body-form{
	height: auto;
	padding:0 60px 20px 60px;
	
}

.features{
	height: 163px;
	padding:0 0 0 90px;
	margin:0;
	background-color:#D4DCF0;
}


.news-bar{
	height: auto;
	background-color:#0050A4;
	/*padding:10px 60px 20px 300px;*/
	color:#FFFFFF;
	/*margin:0 0 50px 0;*/
	font-size:13px;
	display:table;
	width:890px;
}

.news-bar-left{
	width: 280px;
	float:left;
	background-color:#0050A4;
	text-align:right;
	padding:0 20px 0px 0px;
	
}

.news-bar-right{
	width: 590px;
	float:left;
	background-color:#0050A4;
	/*padding:10px 60px 20px 300px;
	color:#FFFFFF;
	margin:0 0 50px 0;*/
	font-size:13px;
}



.footer{
	height: 20px;
	font-size:10px;
	text-align:center;
	
}


.clear {
	clear: both;
}

/* Navigation */

#navigation {
   list-style: none;
   margin: 0; 
   padding: 0;
   position:relative;
   left:170px;
   top:60px;
   
}

#navigation li {
   float: left;
   font-size:12px;
   padding:0 20px 0 0;
   margin:0;
   
}

#navigation li a {
   display: block;
   /*width: 80px;*/
   max-width:90px;
   text-align: center;
   color:#FFFFFF;
   font-weight:bold;
   font-size:13px;
}

#navigation li a:hover {
   text-decoration:underline;
}




/* Headings/lists/general etc */

li{

	margin-left:20px;
	margin-bottom: 5px;
}

h1 {
	font-size: 22px;
	padding: 0;
	margin: 0;
	/* Hide from screen readers */
	position: absolute;
	left: 2000px;
	display:none;
}


h2 {
	font-size: 22px;
	font-weight:bold;
	margin:0 0 10px 0;
	padding:0;
	color:#3B3192;
}

h3 {
	font-size: 26px;
	font-weight:bold;
	margin:0 0 10px 0;
	color:#C7EAFB;
}

h4 {
	font-size: 16px;
	font-weight:bold;
	margin:0 0 10px 0;
	padding:0;
	color:#3B3192;
}

p{
	margin-top: 3px;
	margin-bottom: 7px;
	}

a{
	color : #2B6FBA; /*#009900;*/ /*1b1b1b */
	font-weight: bold;
	text-decoration: none;
}

a:hover{
	text-decoration: underline;
}

.news-bar a {
	color : #C7EAFB;
	font-weight: bold;
	text-decoration: none;
	
}

.news-bar a:hover {
	color : #C7EAFB;
	font-weight: bold;
	text-decoration: underline;
	
}

/* Blog */

.main-body-blog{
	height: auto;
	padding:20px;
	
}


/* form */

form label {
  display: block;
  float: left;
  width: 70px;
  
  
}

#contact_name {

 background-color: #FFFFFF;
 border: 1px #666666 solid; 
 margin: 2px;
 padding: 2px;
}


#email_address {

 background-color: #FFFFFF;
 border: 1px #666666 solid; 
 margin: 2px;
 padding: 2px;
}




#telno {

 background-color: #FFFFFF;
 border: 1px #666666 solid; 
 margin: 2px;
 padding: 2px;

}



#address {

 background-color: #FFFFFF;
 border: 1px #666666 solid; 
 margin: 2px;
 padding: 2px;
 font-family: verdana , arial, hevetica, sans-serif;
 font-size:12px;
 width:230px;
 height:150px;
}

#comments {

 background-color: #FFFFFF;
 border: 1px #666666 solid; 
 margin: 2px;
 padding: 2px;
 font-family: verdana , arial, hevetica, sans-serif;
 font-size:12px;
 width:330px;
 height:150px;
}



form input{
	margin: 3px;
}

form textarea{
	margin: 3px;
}

/*form div input.inputText {
  width: 2830px;
  padding: 1px 3px;
  margin: 0 0 0 0;
}*/

.submitbutton {
  color: #000000;
  font-family:Arial, Helvetica, sans-serif;
}

.hideform {
	display: none;
}

.required{
	color:#333333;
	font-size:10px;
}

.address-box{
	width: 250px;
	background-color:#FFFFFF;
	padding:5px;
}

/* Customer login */

.customerloginbox{
 float:left;
 background-image:url(../media/features-customerlogin2.jpg);
 width:195px;
 height:163px;
 background-repeat:no-repeat;
}

.customerloginform{
	position:relative;
	top:50px;
	left:20px;
	width:155px;
}

.customerlogin{
	height:18px;
	font-size:12px;
	padding:0;
	margin:0;"
}

/* Engineer search */

.engineer-image{

	margin-bottom:10px;
}