﻿/* Layout4LargeImageSize=683*/



/* Common */
* {padding: 0; margin: 0; font-family: Arial, Verdana, Helvetica, sans-serif;}
body {background-color: #666666; color: white; 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: #ff6600; font-size: 130%; padding-bottom: 5px;}
.layout7 h1 {color: #323232;}
h2 {color: #ff6600; font-size: 120%; padding-bottom: 5px;}
h3 {color: #ff6600; font-size: 120%; font-weight: bold; padding-bottom: 5px;}

a {color: #ff6600; text-decoration: none;}
a:hover {text-decoration: underline;}

a.backtotop {display: block; margin-bottom: 10px; margin-top: 10px;}




p {margin: 0; padding: 0; font-size: 1.2em;}
p.centre-align {text-align: center;}
p.right-align {text-align: right;}

label {font-size: 1.2em;margin: 5px;}

textarea {padding: 1px 1px 1px 1px;}

span.fieldname {color: #ff6600; 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: 10px 10px 10px 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;}

select img {background-color: Red; margin-left: 5px;}




/* Master Pages */
.outer {background-color: #919191; background-image: url(images/header.jpg); background-repeat: no-repeat; background-position: top left; margin-bottom: 42px; margin-left: auto; margin-right: auto; margin-top: 42px; width: 1038px; overflow: hidden;}

.master-header {clear: both; height: 226px; width: 100%;}
.master-header a {color: #666666; font-weight: bold; text-decoration: none;}


.master-header-company-name {display: none;}
.master-header-telephone-number {display: none;}
.master-header-corporate-logo {}


.content-surround {background-image: url(images/content-surround-top.jpg); background-repeat: no-repeat; background-position: top left; clear: both; padding-left: 34px; padding-right: 34px;}
.content {clear: both; padding-top: 34px; width: 100%;}



.companyname-footer {background-image: url(images/footer.gif); background-repeat: no-repeat; background-position: top left; color: #323232; height: 40px; margin: 0px; padding-left: 34px; text-align: left; font-weight: bold; clear: both;}

.login-identity {width: 1030px; position: absolute; top: 250px;}
.login-identity p {color: white; font-size: 1.1em; font-weight: bold; text-align: right;}



/* Tables */
.row {clear: both; float:left; width: 100%;}

/* Two Column Tables */
.colx- {float: left;}
.col-x {float: left;}


/* Three Column Tables */
.colx-- {float: left;}
.col-x- {float: left;}
.col--x {float: left;}




/* Colour Surrounds */
.colour-surroundx-- {display: none;}
.colour-surround--x {display: none;}


/* Left Columns 70% Size Coloured Backgrounds */
.colx- .colour-surround-x- .row .col-x- {width: 683px;}
/* Right Columns 30% Size Coloured Backgrounds */
.col-x .colour-surround-x- .row .col-x- {width: 213px;}
/* Columns 50% Size Coloured Backgrounds */
.layout7 .colour-surround-x- .row .col-x- {width: 431px;}


/* Navigation Main */
.navigation-main .surroundx-- {display: none;}
.navigation-main .surround--x {display: none;}


.navigation-main a {color: White; font-size: 8pt; text-transform: uppercase;}
.navigation-main {font-weight: bold; padding-left: 25px; /*padding-bottom: 10px;*/ width: 955px; margin-bottom: 0px; } 

.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: 0px 8px;  margin-top: 8px; }
.menu-navigation-main li a:hover {color: black;} 
.menu-navigation-main li a.selected {color: black;} 

.menu-navigation-main-sub li a:hover {background-color: #ff6600; color: #ffdcc4;}

.menu-navigation-main-sub, .menu-navigation-main-sub ul {background-color: #ffdcc4; border: solid 1px #ff6600; left: 0; list-style-type: none; margin: 0px 0px 0px 0px; 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: #ffdcc4; color: black; 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;}



.navigation-main .surround-x- .row .col-x- {width: 950px;}



/* Bottom */
.footer .surroundx--, .menu-navigation-bottom .surround--x {display: none;}

.menu-navigation-bottom {clear: both; margin: 10px 34px 5px 34px; width: 970px;}
.menu-navigation-bottom-items {text-align: left; margin: 0px!Important; }
.menu-navigation-bottom-item {display: inline; padding-left: 1px; padding-right: 1px; margin-bottom: 0px; }
.navigation-bottom a {color: #323232; text-decoration: underline;}
.navigation-bottom div {color: #323232;}






/* Layouts */
.layout1 .colx, .layout2 .colx-, .layout2 .col-x, .layout3 .colx, .layout4 .colx-, .layout4 .col-x, .layout5 .colx, .layout6 .colx-, .layout6 .col-x, .layout7 .colx-, .layout7 .col-x	{background-color: #323232;}

.layout1 .col {width: 970px;}
.layout2 .colx-, .layout4 .colx-, .layout6 .colx- {width: 723px;}
.layout2 .col-x, .layout4 .col-x, .layout6 .col-x {margin-left: 34px; width: 213px;}

.layout7 .colx- {width: 471px}
.layout7 .col-x {margin-left: 26px; width: 471px}


/* Header-Image */
.header-image {width: 100%; margin-bottom: 32px; overflow: hidden;}			/* TODO: Check 2px difference between FF and IE  */
.col-content {padding: 15px 20px 20px 20px; display: table;}	
		
.colx- .col-image {margin-top: 0px; margin-bottom: 12px; width: 100%;}
.col-x .col-image {margin-top: 0px; margin-bottom: 0px; width: 213px;}




/* 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%;}





/*Google Map*/
.layout5 .map {width: 930px;}
.layout6 .map {width: 683px;}
.frame {width: 100%;}

.body-map{background-color: #323232; 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;}






/* Login / Reset Password  */
.login-surround {width: 100%; clear: both;}

.login-surround .table-surround .colx- {width: 80px!Important; margin: 0px;}
.login-surround .table-surround .col-x {width: 325px!Important; margin: 0px;}

.client-login .login-surround .colour-surround-x- .col-x- {height: 143px;}









/* Input areas */
.table-surround {margin-top: 10px;  width: 100%;}
.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; width: 100%;}

.colx- .table-surround {width:100%;}
.colx- .table-surround .colx- {width: 140px;}
.colx- .table-surround .col-x {width: 340px;}

/* 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: 290px;}
input.datatitlenumber {width: 160px;}
input.datatitlemoney {width: 160px;}







/*Progress Control*/
.progress-bar {padding: 10px 10px 10px 10px; display: table; width: 193px;}
img.progress-step {height: 12px; margin: 12px 4px 0px 0px; padding: 0px; width: 12px;}








/* Quotations - Common */
.divider {clear: both; border-bottom: dotted 1px #ff6600; height: 10px; margin-bottom: 5px; 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 #ffdcc4; clear: both; margin-bottom: 20px; width: 100%;}
.vehicle-list-item {clear: both; padding-bottom: 10px; padding-top: 10px; border-top: solid 2px #ffdcc4; 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 .colx- 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: #ff6600; display: block; font-weight: bold; margin-bottom: 10px; margin-top: 10px;}

