/***********************************************
 * Cleeve Driving Tuition (www.cleevedrivingtuition.co.uk)
 *
 * Author: John Leighton
 *
 * Copyright (c)2009 NT-Designs
 * http://www.nt-designs.co.uk
 *
 * Version: 2.0
 * contact-us.php
 **********************************************/

body {
  background-color: #e0f2fc; /*#ddd;*/
  font: 12px Arial, Helvetica, sans-serif;
  margin: 0;
  line-height: 1.5em;
  color: #5c5c61;
  background-image: url(../img/background.jpg);
  background-repeat: repeat-x;
  background-position: left top;
}

h1, h2, h3, h4 {
  margin: 10px 0;
  padding: 0 0 10px 0;
  font-size: 28px;
  font-weight: normal;
  color: #5c5c61;
}

h1 {
  margin: 10px 0 20px 0;
  border-bottom: 1px solid #ddd;
}

h2 {
  font-size: 24px;
}

h3 {
  /*font-weight: bold;*/
  font-size: 20px;
}

h4 {
  font-weight: bold;
  font-size: 14px;
}

a {
  text-decoration: underline;
  color: #000;
}

a:hover {
  text-decoration: none;
}

.small {
  font-size: 8px;
}

table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #c0c0c0;
}

th {
  text-align: left;
}

th, td {
  padding: 5px 10px;
}

p {
  /*margin: 0; */
}

ul.tick {
  list-style-type: none;
  margin: 10px 0 0 0;
  padding: 0 0 0 10px;
}

ul.tick li {
  background-image: url(../img/tick.jpg);
  background-repeat: no-repeat;
  padding: 2px 0 0 25px;
}

/***********************************************
 * sections
 **********************************************/
.section {
  margin: 0 auto;
  width: 960px;
}

/***********************************************
 * section 1 - the top strip
 **********************************************/
#section1 {
}

.section1container {
  position: relative;
  width: 900px;
  height: 146px;
  padding: 0 30px;
  background-color: #000;
  background-image: url(../img/top.jpg);
  background-repeat: no-repeat;
  background-position: 0px 0px;
}

#logo {
  float: left;
  width: 262px;
  height: 79px;
}

#logo a {
  float: left;
  display: block;
  width: 262px;
  height: 79px;
}

#clickthepepper {
  position: absolute;
  top: 85px;
  left: 645px;
  width: 250px;
  height: 33px;
}

#phonenow {
  float: left;
  width: 450px;
  height: 100px;
  text-align: right;
}

#phonenow h1 {
  padding: 0;
  margin: 40px 10px 0 0;
  font-size: 30px;
  font-weight: bold;
  color: #dd2000;
}

#menubar {
  position: absolute;
  top: 83px;
  left: 40px;
  width: 898px;
  height: 30px;
  padding: 0;
  margin: 0;
  z-index: 10;
}

#menubar ul {
  width: 900px;
  list-style-type: none;
  padding: 0;
  margin: 0;
}

#menubar ul li {
  float: left;
  margin: 0;
  padding: 0;
  /*border-bottom: 1px dotted #000;*/
}

#menubar ul li a {
  display: block;
  margin: 0;
  /*width: 100px;*/
  padding: 7px 20px 8px 20px;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  color: #fff;
}

#menubar ul li a:hover {
/*  text-decoration: none;*/
  /*background-image: url(../img/menuonbg.jpg);
  background-repeat: repeat-x;*/
  /*background-color: #e60002;*/
  color: #000;
}

#menubar ul li a.buttonon {
  /*background-image: url(../img/menuonbg.jpg);
  background-repeat: repeat-x;*/
  /*background-color: #e60002; */
  color: #e60002;
}

/* dropdowns */

#menubar li ul li {
  float: none;
  display: block;
  margin: 0;
}

#menubar li ul li a, #nav li ul li a {
  padding: 5px 0 5px 10px;
  border: 1px solid #fff;
}

#menubar li:hover ul li a, #nav li a:hover ul li a {
  background: #fff;
  color: #0c58a6;
  width: 198px;
  text-align: left;
  padding: 5px 0 5px 10px;
}

#menubar li ul li a:hover {
  color: #000;
  /*border: 1px solid #fff;*/
  background-image: url(../img/menuitem2.jpg);
  background-repeat: repeat-x;
  background-position: left top;
}

#menubar li ul {
  position: absolute;
  left: -5000px;
  z-index: 1001;
  width: 210px;
  background: #fff;
  padding: 1px;
  margin: -1px 0 0 0;
  border-bottom: 5px solid #000;
}

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

/***********************************************
 * section 2 - the menu strip
 **********************************************/
#section2 {
}

.section2container {
  position: relative;
  width: 900px;
  padding: 10px 29px 0px 29px;
  background-color: #fff;
  border-left: 1px solid #e5e5e5;
  border-right: 1px solid #e5e5e5;
}

#booknow {
  float: left;
  width: 260px;
  height: 50px;
  padding: 0 10px;
  margin: 0 0 9px 0;
  background-image: url(../img/booknow.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

#booknow h2 {
  color: #fff;
  padding: 5px 0 0 0;
}

.bookoption {
  float: left;
  width: 260px;
  height: 40px;
  padding: 5px 10px;
  margin: 0 0 8px 0;
  color: #fff;
/*  background-image: url(../img/bookoption.jpg);
  background-repeat: no-repeat;
  background-position: left top;
*/
}

.bookoption a {
  color: #fff;
}

.bluesign {
  background-image: url(../img/bluesign.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.brownsign {
  background-image: url(../img/brownsign.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.greensign {
  background-image: url(../img/greensign.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

#bookheader {
  float: left;
  width: 258px;
  height: 38px;
  padding: 0 10px;
  background-color: #dadada;
  border: 1px solid #ccc;
}

#bookmain {
  float: left;
  width: 258px;
  height: 164px;
  padding: 10px;
  background-color: #efefef;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  font-size: 18px;
  color: #000;
}


/***********************************************
 * section 3 - the vista strip
 **********************************************/
#section3 {
}

.section3container {
  position: relative;
  width: 900px;
  height: 318px;
  padding: 0px 30px 0px 30px;
  background-color: #fff;
  background-image: url(../img/bottom.jpg);
  background-repeat: no-repeat;
  background-position: left bottom;
}

#footertop {
  float: left;
  width: 900px;
  height: 140px;
  padding: 30px 0 10px 0;
}

/***********************************************
 * section 4 - the main strip
 **********************************************/
#section4 {
}

.section4container {
  position: relative;
  width: 900px;
  padding: 0 30px 10px 30px;
  background-color: #fff;
}

/***********************************************
 * section 5 - the main strip
 **********************************************/
#section5 {
}

.section5container {
  position: relative;
  width: 900px;
  padding: 10px 30px 34px 30px;
  background-color: #fff;
  background-image: url(../img/bottom.jpg);
  background-repeat: no-repeat;
  background-position: left bottom;
}

/***********************************************
 * section 6 - the footer strip
 **********************************************/
#section6 {
}

.section6container {
  position: relative;
  width: 900px;
  padding: 10px 30px;
}

#footer {
  float: left;
  width: 940px;
  background-color: #fff;
  text-align: center;
  border-top: 1px solid #bdbbac;
}

#footertext {
  float: left;
  width: 700px;
  text-align: center;
}

.link {
  float: left;
  width: 100px;
  padding-top: 10px;
  text-align: center;
}

/***********************************************
 * misc
 **********************************************/
.box900, .box670, .box590, .box440, .box320, .box280, .box200 {
  float: left;
  margin-right: 30px;
}

.box900 {
  width: 900px;
  margin-right: 0;
}

.box670 {
  width: 670px;
}

.box590 {
  width: 590px;
}

.box440 {
  width: 440px;
}

.box320 {
  width: 320px;
}

.box280 {
  width: 280px;
}

.box200 {
  width: 200px;
}

.bordertop {
  border-top: 1px dotted #000;
}

.lastbox {
  margin-right: 0;
}

.spacer {
  clear: both;
}

.whitefade {
  width: 890px;
  padding: 10px 10px 0 10px;
  background-image: url(../img/white-fade.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.sidebox {
  width: 215px;
  padding: 0 10px 10px 10px;
  /*background-image: url(../img/boxbg3.jpg);
  background-repeat: repeat-x;
  background-position: left top;*/
/*  border-top: 3px solid #000;*/
  border-top: 1px dotted #000;
}

.quotebox {
  width: 215px;
  padding: 10px;
  /*background-color: #e5e5e5;*/ /*#f1efe8;*/
  background-image: url(../img/quotes2.jpg);
  background-repeat: no-repeat;
  background-position: 0px 20px;
/*  border-top: 3px solid #000;*/
  /*border-top: 1px dotted #000;*/
}

.topped {
  border-top: 3px solid #f1efe8;
  padding: 10px 0 0 0;
}

.whitebg {
  background-color: #fff;
}

.centretext {
  text-align: center;
}

.righttext {
  text-align: right;
}

.testimonialbubble {
  float: left;
  width: 270px;
  height: 209px;
  padding: 10px;
  background-image: url(../img/testimonial-bubble.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}


/***********************************************
 * misc
 **********************************************/
.costtable {
  width: 438px;
  border: 1px solid #c0c0c0;
  margin-left: 30px;
}

.costtabledesc {
  float: left;
  width: 308px;
  padding: 5px;
}

.costtableprice {
  float: left;
  width: 50px;
  padding: 5px;
  text-align: right;
}

.ntdesigns {
  color: #5683ad;
  font-weight: bold;
}

/***********************************************/

blockquote {
  position: relative;
  width: 570px;
  float: left;
  margin: 1em 0pt 1em 0pt;
  padding: 1em 10px 1em 10px;
  border-bottom: 1px solid #ccc;
  background-image: none;
}

blockquote:hover {
  background-color: #eee;
}

blockquote h1 {
  padding: 8px 5px 8px 0;
  border: none;
}

blockquote p {
  background-image: none;
}

blockquote p.dtposted {
  position: absolute;
  top: 0.5em;
  right: 10px;
  padding-left: 0.5em;
  margin: 0pt;
  line-height: 1em;
  color: #444;
  text-align: right;
  /*background-color: #fff;*/
  font-weight: bold;
  font-style: italic;
}

/***********************************************/

#contactform, #editform {
  width: 590px;
  margin-top: 10px;
}

#contactform label, #editform label {
  float: left;
  display: block;
  text-align: right;
  padding-right: 10px;
  width: 70px;
  margin-bottom: 15px;
}

#contactform input {
  float: left;
  display: block;
  width: 402px;
  border: 1px solid #ccc;
}

#contactform select {
  float: left;
  display: block;
  width: 402px;
  border: 1px solid #ccc;
}

#contactform textarea, #editform textarea {
  float: left;
  width: 400px;
  margin-bottom: 10px;
  border: 1px solid #ccc;
}

#editform textarea {
  width: 588px;
}

#contactform br, #editform br {
  clear: both;
}

#contactbuttons, #formbuttons {
  margin-left: 81px;
}

#contactbuttons input, #formbuttons input {
  width: 100px;
}
