/*	Colours in use

	1d1d1d	Body Background Colour
	dbd9d9	Dark darkred Backgrounds (Navigation)
	60000e	Navigation Font Colour
	f6f6f6	Light darkred Backgrounds (Page Text)
	666666  General Font Colour
*/




/* Common */
* {padding: 0; margin: 0; font-family: Verdana, Arial, Helvetica, sans-serif;}
body {background-color: #1d1d1d; background-image: url(images/back-grad.gif);  background-repeat: repeat-x; color: #666666; font-size:70%; margin-top: 0px; margin-left: auto; margin-right: auto;} 
body.popup {background-color: white; background-image: none; color: #666666; font-size:70%; margin-top: 0px; margin-left: auto; margin-right: auto;} 



h1 {color: #60000e; font-size: 130%; padding-bottom: 5px;}
h2 {color: #60000e; font-size: 120%; padding-bottom: 5px;}
h3 {color: #60000e; font-size: 110%; font-weight: bold; padding-bottom: 5px;}

a {color: #60000e; text-decoration: none;}
a:hover {text-decoration: underline;}

a.backtotop {display: block; margin-bottom: 10px; margin-top: 10px;}




p {margin: 0; padding: 0;}
p.centre-align {text-align: center;}
p.right-align {text-align: right;}

textarea {padding: 1px 1px 1px 1px;}

span.fieldname {color: #60000e; font-weight: bold;}

ul {list-style-type:none;}
li {background-image: url(images/bullet.gif); background-position: 0px 3px; background-repeat: no-repeat; list-style-type:none; margin-left:4px; padding-left:12px;}

img {border: none;}
img.left-align {margin: 5px 10px 5px 0px;}
img.centre-align {margin: 5px 10px 5px 10px;}
img.right-align {margin: 5px 0px 5px 10px;}

address {font-style:normal;}

.validator {color: Red; font-size: 1.1em; font-weight: bold;}

.validation-summary {background-color: #ffe8e8; background-image: url(images/exclamation.gif);background-position: 5px 5px; background-repeat:no-repeat; border: solid 1px #ffc4c4; color: Red; margin-bottom:10px; padding: 10px 5px 10px 5px;}
.validation-summary .header {font-size: 1.3em; font-weight: bold;}
.validation-summary span {padding-left: 40px;}

.validation-summary ul {margin-top: 15px;}
.validation-summary li {background-image: none; margin: 3px 0px 7px 0px; }

.button-surround {float: right; padding-right: 12px;}


select img {background-color: Red; margin-left: 5px;}


/* Master Pages */
.outer {background-color: white; margin-left: auto; margin-right: auto; padding: 20px 25px 5px 25px; width: 712px;}

.master-header {clear: both; height: 50px; width: 100%;}
.master-header a {color: #666666; font-weight: bold; text-decoration: none;}

.master-header-company-name {font-family: Arial; float: left; font-size: 205%; margin-top: 7px; text-decoration: none; text-transform: uppercase;}
.master-header-telephone-number {display: none;}
.master-header-corporate-logo {float: right;}

.content-surround {clear: both; padding-top: 4px;}
.content {clear: both; padding-top: 15px; width: 100%;}

.companyname-footer {margin-top: 5px; text-align: center; font-size:xx-small; clear: both;}

.login-identity {clear: both; float: left; width: 50%;}
.login-identity p {color: #60000e; font-size: 1.1em; font-weight: bold;}



/* Tables */
.row{clear: both; float:left; width: 100%;}

/* Three Column Tables */
.colx- {float: left;}
.col-x {float: left;}


/* Three Column Tables */
.colx-- {float: left;}
.col-x- {float: left;}
.col--x {float: left;}




/* Surrounds */
.surroundx-- .row {margin-top: 5px;}
.surroundx-- .row, .surround-x- .row, .surround--x .row {background-color: #dbd9d9; color: #60000e;}

.surroundx-- .row .colx--{background-image: url(images/corner-tl.gif);  background-repeat: no-repeat; background-position: top; height: 5px; overflow: hidden; width: 5px; overflow: hidden;}
.surroundx-- .row .col-x- {height: 5px; overflow: hidden; width: 702px;}
.surroundx-- .row .col--x {background-image: url(images/corner-tr.gif);  background-repeat: no-repeat; background-position: top;height: 5px; overflow: hidden; width: 5px; overflow: hidden;}


.surround-x- .row {padding-bottom: 3px; padding-top: 3px;}
.surround-x- .row .colx-- {height: 5px; overflow: hidden; width: 5px;}
.surround-x- .row .col-x- {overflow: hidden; padding-left: 5px; padding-right: 5px; width: 692px;}
.surround-x- .row .col--x {height: 5px; overflow: hidden; width: 5px;}


.surround--x .row {margin-bottom: 5px;}
.surround--x .row .colx-- {background-image: url(images/corner-bl.gif);  background-repeat: no-repeat; background-position: top; height: 5px; overflow: hidden; width: 5px;}
.surround--x .row .col-x- {height: 5px; overflow: hidden; width: 702px;}
.surround--x .row .col--x {background-image: url(images/corner-br.gif);  background-repeat: no-repeat; background-position: top;height: 5px; overflow: hidden; width: 5px;}




.colour-surroundx-- .row, .colour-surround-x- .row, .colour-surround--x .row {background-color: #f6f6f6;}

.colour-surroundx-- .row .colx--{background-image: url(images/light-corner-tl.gif);  background-repeat: no-repeat; background-position: top; height: 10px; overflow: hidden; width: 10px;}
.colour-surroundx-- .row .col-x- {height: 5px; overflow: hidden;}
.colour-surroundx-- .row .col--x {background-image: url(images/light-corner-tr.gif);  background-repeat: no-repeat; background-position: top;height: 10px; overflow: hidden; width: 10px;}

.colour-surround-x- .row {padding-bottom: 3px; padding-top: 3px;}
.colour-surround-x- .row .colx-- {height: 10px; overflow: hidden; width: 10px;}
.colour-surround-x- .row .col-x- {overflow: hidden; padding-left: 5px; padding-right: 5px;}
.colour-surround-x- .row .col--x {height: 10px; overflow: hidden; width: 10px;}

.colour-surround--x .row .colx-- {background-image: url(images/light-corner-bl.gif);  background-repeat: no-repeat; background-position: top; height: 10px; overflow: hidden; width: 10px;}
.colour-surround--x .row .col-x- {height: 10px; overflow: hidden;}
.colour-surround--x .row .col--x {background-image: url(images/light-corner-br.gif);  background-repeat: no-repeat; background-position: top;height: 10px; overflow: hidden; width: 10px;}







/* Page Layouts */

/* Layout 1 - Single Column Text */
.layout1 .colx {width: 100%;}


/* Layout 2 - Two Column Text split 70% / 30% */
.layout2 .colx- {width: 484px;}
.layout2 .col-x {margin-left: 25px; padding: 0px 0px 15px 0px; width: 203px;}


/* Layout 3- Single Column Image Gallery */
.layout3 .colx {width: 100%;}


/* Layout 4 - Two Column Image Gallery 70% / 30%  */
.layout4 .colx- {width: 484px;}
.layout4 .col-x {margin-left: 25px; padding: 0px 0px 15px 0px; width: 203px;}


/* Layout 5 - Single Column Google Map */
.layout5 .colx {width: 100%;}


/* Layout 6 - Two Column Google Map split 70% / 30% */
.layout6 .colx- {width: 484px;}
.layout6 .col-x {margin-left: 25px; padding: 0px 0px 15px 0px; width: 203px;}


/* Layout 7 - Two Column Text split 50% / 50% */
.layout7 .colx- {width: 343px;}
.layout7 .col-x {margin-left: 25px; width: 343px;}


/* Header-Image */
.header-image {width: 100%; margin-bottom: 12px;}			/* TODO: Check 2px difference between FF and IE  */
.col-content {padding-bottom: 20px;}						/* TODO: Check if right columns should have this */
.colx- .col-image {margin-top: 0px; margin-bottom: 12px; width: 100%;}
.col-x .col-image {margin-top: 0px; margin-bottom: 12px; width: 203px;}


/* Left Columns 70% Size Coloured Backgrounds */
.colx- .colour-surroundx-- .row .col-x- {width: 464px;}
.colx- .colour-surround-x- .row .col-x- {width: 454px;}
.colx- .colour-surround--x .row .col-x- {width: 464px;}


/* Right Columns 30% Size Coloured Backgrounds */
.col-x .colour-surroundx-- .row .col-x- {width: 183px;}
.col-x .colour-surround-x- .row .col-x- {width: 173px;}
.col-x .colour-surround--x .row .col-x- {width: 183px;}



/* Columns 50% Size Coloured Backgrounds */
.layout7 .colour-surroundx-- .row .col-x- {width: 323px;}
.layout7 .colour-surround-x- .row .col-x- {width: 313px;}
.layout7 .colour-surround--x .row .col-x- {width: 323px;}



/* Navigation */

/* Main */
.navigation-main {font-weight: bold; width: 100%;} 
.menu-navigation-main ul {margin: 0px; overflow: hidden; padding: 0px;}
.menu-navigation-main li {background-image: none; display: inline; list-style-type: none; margin: 0px; padding: 0px;}

.menu-navigation-main li a {border-right: solid 1px white; display: block; float:left; padding: 6px 8px;}

.menu-navigation-main-sub li a:hover {background-color: #dbd9d9; color: #f6f6f6;}

.menu-navigation-main-sub, .menu-navigation-main-sub ul {background-color: #f6f6f6; border: solid 1px #dbd9d9; left: 0; list-style-type: none; margin: 0; padding: 0; position: absolute; top: 0; visibility: hidden; z-index: 100;}

.menu-navigation-main-sub li {background-image: none; list-style-type: none; margin: 0; padding: 0; overflow: hidden; width: 170px;}
.menu-navigation-main-sub li a {background-color: #f6f6f6; display: block; padding: 4px 5px; text-decoration: none; width: 160px; overflow: hidden; margin: 0;}	

* html .ddsubmenustyle li a {display: inline-block;} /* IE6 CSS hack  */

.downarrowpointer {border: 0; padding-left: 4px; }
.rightarrowpointer {border: 0; left: 100px; padding-top: 3px; position: absolute;}
.ddiframeshim {background: transparent; border-width: 0; display: block; height: 0; position: absolute; width: 0; z-index: 500;}


/* Bottom */
.menu-navigation-bottom {clear: both; margin-left: auto; margin-right: auto; width: 100%;}
.menu-navigation-bottom-items {text-align: center;}
.menu-navigation-bottom-item {display: inline; padding-left: 1px; padding-right: 1px;}
.navigation-bottom a {color: #60000e;}






/* Thumbnail Images */
.image-gallery-thumbnails {margin-bottom: 10px; margin-top: 10px; width: 100%;}
.image-gallery-thumbnails ul {}
.image-gallery-thumbnails li {background-image: none; display: inline; list-style-type: none; margin: 0px; padding: 0; }
.image-gallery-thumbnails img {border: none; margin: 0px; padding: 1px 0px 1px 0px; width: 55px;}
.image-gallery-thumbnails a {margin: 0px; padding: 0px;}



/* Large Image View (Two Column) */
.image-gallery-viewer {margin-bottom: 10px; margin-top: 10px;}
.image-gallery-viewer img {display: block; margin-left: auto; margin-right: auto;}
.image-gallery-viewer p {font-weight:bold; text-align: center; width: 100%;}





/* Login / Reset Password  */
.login-surround {margin-bottom: 10px; width: 100%; clear: both;}

.login-surround .table-surround .colx- {width: 60px!Important;}
.login-surround .table-surround .col-x {width: 250px!Important;}

.client-login .login-surround .colour-surround-x- .col-x- {height: 169px;}





/*Progress Control*/
img.progress-step {height: 12px; margin: 12px 4px 0px 0px; width: 12px;}







/*Google Map*/
.frame {width: 100%;}

.body-map{background-color: white; background-image: none;}

.google-map {height: 402px; margin-bottom: 10px; width: 100%;}
.google-map b {color: Black; font-size: 1.2em; font-weight: bold;}
.google-map p {color: Black;}






/* Input areas */
.table-surround {margin-top: 10px;}
.table-surround .colx-, .table-surround .col-x   {margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; }
.table-surround .colx- span {display: block; margin-top: 5px;}

.colx- .table-surround {width:100%;}
.colx- .table-surround .colx- {width:120px;}
.colx- .table-surround .col-x {width: 320px;}


/* Input Field Widths */

input.firstname {width: 150px;}
input.surname {width: 200px;}
input.company {width: 300px;}
input.address1 {width: 300px;}
input.address2 {width: 300px;}
input.address3 {width: 300px;}
input.address4 {width: 300px;}
input.city {width: 300px;}
input.postcode {width: 100px;}
input.zipcode {width: 60px;}
input.plusfour {width: 50px;}
input.telno {width: 200px;}
input.faxno {width: 200px;}
input.email {width: 300px;}

input.pickuppoint {width: 300px;}
input.destination {width: 300px;}

input.eventdescription {width: 300px;}
textarea.furtherrequirements {height: 98px; width: 300px;}
input.passengers {width: 50px;}


.login-surround input.email {width: 220px;}
input.password {width: 220px;}

input.datatitletext {width: 300px;}
input.datatitlenumber {width: 160px;}
input.datatitlemoney {width: 160px;}




/* Quotations - Common */
.divider {clear: both; border-bottom: dotted 1px #60000e; height: 10px; width: 100%;}


/* Quotations - Journey Details */
.insert-movement {background-image: url(images/plus.gif); background-repeat:no-repeat; display: block; float: left; height: 14px; padding-left: 17px; margin-right: 15px; margin-top: 10px;}
.delete-movement {background-image: url(images/minus.gif);  background-repeat:no-repeat; display: block; float: left; height: 14px; padding-left: 17px; margin-right: 15px; margin-top: 10px;}


/* Quotations -  Vehicles */
.vehicle-list {border-bottom: solid 2px #dbd9d9; clear: both; margin-bottom: 20px; width: 100%;}
.vehicle-list-item {clear: both; padding-bottom: 10px; padding-top: 10px; border-top: solid 2px #dbd9d9; width: 100%;}
.vehicle-list-item:after {content:"."; visibility: hidden;}

.vehicle-list-item .row  {margin-top: 10px;}
.vehicle-list-item .row .colx-- {height: auto; width: 115px;}
.vehicle-list-item .row .col-x-  {height: auto; width: 235px!important;}
.vehicle-list-item .row .col-x-:after {content:"."; visibility: hidden;}		/* Firefox hack - displays column width correct when no content */
.vehicle-list-item .row .col--x {height: auto; width: 90px;}

.vehicle-list-item .row .colx-- img {width: 115px;}

.vehicle-facility-list {}
.vehicle-facility-list ul {margin-left: 20px; margin-right: 20px;}
.vehicle-facility-list ul li {margin-right: 5px;}


.facility-list {margin-bottom: 10px; width: 100%;}
.facility-list-item {width: 50%;}



/* Quotations - Summary */
.quotation-summary .table-surround .colx- span {margin-top: 0px;}				/* Removes the margin to compensate for textbox alignment. */
.quotation-summary .colx- .table-surround .colx- {width:150px;}
.quotation-summary .colx- .table-surround .col-x {width: 290px;}

.summary-section {margin-top: 10px;}

.edit-journey-details, .edit-vehicle-details, .edit-facilities, .edit-additional-information {background-image: url(images/back.gif); background-repeat:no-repeat; display: block; float: left; height: 14px; padding-left: 17px; margin-right: 15px; margin-top: 10px;}



/* Quotations -  Confirmation */
.quotation-confirmation p {text-align: center;}
.quotation-confirmation .fieldname {display: block; margin-top: 10px;}

.quotation-confirmation-1 {display: block; margin-bottom: 5px;}

.quotation-confirmation-3 {display: block; margin-bottom: 5px;}

.reference-number {color: #60000e; display: block; font-weight: bold; margin-bottom: 10px; margin-top: 10px;}