/*  Whats Under Your Bonnet? Stylesheet  ** http://www.whatsunderyourbonnet.co.uk/  */
/*  *** Developed By Friendly Code - http://www.friendlycode.co.uk/ ***  */
html, body{height:100%}
body{font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:14px; margin:0 auto; text-align:center; background:url(../images/bg.jpg) fixed repeat 0 20px;}
em{font-style:italic}
#wrapper{margin: 0 auto; text-align:left; width:980px; background:#FFF url(/images/nuts.jpg) no-repeat 540px 0; padding:10px; line-height:20px; position:relative}

#header{margin-bottom:10px;}
#header #logo{margin-left:10px}
#header h1{float:right; font-style:italic; color:#999; font-size:25px; margin-top:20px}

#menu{background:url(../images/menuBg.jpg) repeat-x; height:70px}

#menu li{float:left; font-size:16px; font-weight:bold; height:70px}
#menu li a{color:#111; text-decoration:none; padding:25px; display:block; position:relative; text-align:center}
#menu li a:hover{background:#E7E7E7;}
#menu li .active{background:#E7E7E7; text-decoration:underline}


#banner{height:253px; background:url(../images/bannerBg.jpg) repeat-x; clear:left; font-size:12px; color:#FFF}
#banner h3{font-size:30px; width:480px; padding:35px 20px 0 20px; line-height:40px}
#banner img{float:right}
#banner p{padding:0 20px; margin:0}

#slideArea{float:right; margin-left:20px; margin-bottom:20px; width:390px!important; text-align:right; height:301px!important}
#slideArea div{float:right; right:0!important}
#slideArea.home{width:370px!important;}

#content{margin:20px 10px}
#content h1{font-size:18px; margin-bottom:15px}
#content h2{font-size:16px; margin-bottom:15px}
#content p{font-family:Arial, Helvetica, sans-serif; margin:0 0 15px 0}


#footer{font-size:11px; margin-top:10px; color:#666666; border-top: 5px solid #EEE; padding-top:5px}
#footer a{color:#666666; text-decoration:none}
#footer a:hover{color:#666666; text-decoration:underline}
#footer p{float:left; margin:0; width:500px}
#footer #friendly{float:right; width:180px; text-align:right;}

.testimonials strong{font-weight:bold; font-style:italic; text-align:right; display:block; margin-top:-10px}
.testimonials p{line-height:30px}
.testimonials .quoteLeft{margin-right:7px}
.testimonials .quoteRight{margin-left:7px}

/** FORMS **/
#contactForm{float:right; width:522px}
form label{clear:left; float:left; width:150px; margin-bottom:5px}
input, textarea {padding:10px; background: #BFD2DD; border:1px solid #eee; float:left; width:350px; color:#1F2128; margin-bottom:5px; font-weight:bold}
textarea{height:100px; font-family:'Calibri','Myriad Pro','Helvetica Neue',Arial,Helvetica,sans-serif; font-size:16px}
.submit, .upload{width:370px}
.submit:hover{background:#1F2128; color:#F7F9FB; cursor:pointer}
.error{background:#FCD6D6 none repeat scroll 0 0;color:red;float:left;padding:10px;width:350px;}
.success{background: #C5EFAB none repeat scroll 0 0;color:green;float:left;padding:10px;width:350px;}
.formInfo{margin-left:150px; margin-bottom:5px}
.formError{background:#FCD6D6 none repeat scroll 0 0; color:red; padding:10px; margin-bottom:10px}
.formSuccess{background: #C5EFAB none repeat scroll 0 0; color:green; padding:10px; margin-bottom:10px}


.clear{clear:both}
.right{float:right; margin-left:10px; margin-bottom:10px}
.left{float:left; margin-right:10px; margin-bottom:10px}
