@import "reset.css";

body{ background:url(../graphics/bg.png) repeat-x top; font-family:Arial; font-size:12px; color:#333; text-align:center}
#popup{ background:none}

#wrapper{ width:990px; margin:10px auto 0; text-align:left; background:url(../graphics/content-bg.png) repeat-y}
#popup #wrapper{ background:none; width:640px}

#header{ height:80px; position:relative; background:url(../graphics/header-bg.png) no-repeat top}
#logo{ float:left; margin:22px 0 0 20px}

#tag-line{ float:left; margin:40px 0 0 0; font-size:20px; line-height:1em}

#top-nav-wrapper{ position:absolute; top:0; right:0; background:url(../graphics/top-nav-bg.png) no-repeat top right}
#top-nav-inner{ background:url(../graphics/top-nav-bg.png) no-repeat bottom left; padding:0 20px; height:40px; color:#fff}
#top-nav{ padding-top:10px; line-height:25px}
#top-nav a{ color:#fff; font-size:11px}
#top-nav a:hover{ color:#007AC1; text-decoration:none}
#top-nav img{ margin-bottom:-3px}

#main-nav, #main-nav-de{ background:url(../graphics/strip-bg.png) repeat-y; height:45px; position:relative; padding-left:60px; margin:0 -5px}
#main-nav-de{ padding-left:30px}
/*#nav{ margin:0; list-style:none; position:relative; z-index:10; background:url(../graphics/main-nav-seperator.png) no-repeat left top; height:45px; padding-left:2px}
#nav li{ float:left; position:relative; background:url(../graphics/main-nav-seperator.png) no-repeat right top; padding-right:2px}
#nav li:hover{ border-top:5px solid #fff; background-position:right -5px}
#nav a{ display:block; font-size:14px; color:#fff; background:url(../graphics/main-nav-bg.png) no-repeat top; line-height:35px; text-decoration:none}
#nav a:hover, #nav li:hover a{ background-position: right -40px}
#nav a span{ display:block; background:url(../graphics/main-nav-bg.png) no-repeat top; padding:0px 15px 5px}
#nav a:hover span, #nav li:hover a span{ background-position: left -80px}

.nav-bottom-left, .nav-bottom-right{ background:url(../graphics/nav-bottom-bg.png) no-repeat left top; width:10px; height:10px; position:absolute; bottom:0; display:none}
.nav-bottom-left{ left:-10px}
.nav-bottom-right{ background-position:left bottom; right:-8px}

#nav li:hover .nav-bottom-left, #nav li:hover .nav-bottom-right{ display:block}*/

#nav{ margin:0; list-style:none; position:relative; z-index:10; background:url(../graphics/main-nav-seperator.png) no-repeat left top; height:45px; padding-left:2px}
#nav li{ margin:0; float:left; position:relative; background:url(../graphics/main-nav-seperator.png) no-repeat right top; padding-right:2px}
#nav li:hover{ background-color:#CCE1ED; padding:0}
#nav a{ display:block; font-size:14px; color:#fff; background:url(../graphics/main-nav-bg2.png) repeat-x top; line-height:35px; text-decoration:none; padding:0px 15px 5px; font-weight:normal}
#nav a.top-level:hover, #nav li:hover a.top-level{ background-position: right -40px; position:relative; top:-5px; padding:0px 17px 10px 15px; height:35px}
#nav a.sub:hover, #nav li:hover a.sub{ background-position: right -85px}
#nav .nav-left, #nav .nav-right{ background:url(../graphics/main-nav-bg2.png) no-repeat; width:10px; height:45px; position:absolute; top:-5px; display:none}
#nav .nav-left{ background-position:left bottom; left:-5px}
#nav .nav-right{ background-position:left -130px; right:-5px}

#nav li:hover .nav-left, #nav li:hover .nav-right{ display:block}

#nav li ul{ margin:0; list-style:none; position: absolute; width: 200px; left: 5px; top:40px; display:none; z-index:100000; background:#006098; padding:5px 0}

#nav li ul li{ width:auto; float:none; margin:0 5px; padding:0; background:none}
#nav li ul li:hover{ background:none; border:none}

#nav li ul li a{ text-align:left; line-height:20px; padding:5px 10px; background:none; border-bottom:1px dotted #fff; color:#fff}
#nav li ul li a:hover{ background:#CCE1ED; color:#333}
#nav li:hover ul ul{ display:none;}
#nav li:hover ul, #nav ul li:hover ul{ display:block;}

.main-nav-bottom{ position:absolute; top:35px; left:0; z-index:0}

#ie-wrapper #nav a.top-level:hover, #ie-wrapper #nav li:hover a.top-level{height:35px; width:20px; white-space:nowrap}

#top-content-wrapper{ background:#cce1ed; margin:0 5px; padding:5px 15px 15px}
#grey-box, #top-content{ float:left; width:465px}
#grey-box{ background:#231f20 url(../graphics/grey-box-bg.png) no-repeat left top; margin-right:20px; color:#fff}
#grey-box .inner{ background: url(../graphics/grey-box-bg.png) no-repeat right bottom}

#content{ padding:15px 20px 5px}

#footer-wrapper{ background:#006098}
#footer{ width:1000px; margin:0 auto; background:url(../graphics/strip-bg.png) repeat-y; color:#fff}
#footer .inner{ padding:10px 25px 0}
#footer a{ color:#fff}
#footer img{ display:block; margin:0}
#footer-bottom{ width:1000px; margin:0 auto; background:url(../graphics/footer-bottom-bg.png) no-repeat top; line-height:30px; padding:10px 0; color:#333; font-size:10px}
#popup #footer-bottom{ background:none; width:640px}
#footer-plain{ background:#007AC1; color:#fff; padding:10px;font-size:11px; line-height:18px}

#footer ul{ margin:0; list-style:none}
#footer li{ margin:0}

.footer-section{ width:255px; float:left; text-align:left; font-size:11px; line-height:18px}
.middle-section{ width:440px}

.footer-section-title{ line-height:25px; border-bottom:1px dotted #fff; font-size:12px; font-weight:bold; margin-bottom:10px; font-size:14px}

.footer-section .left{ margin-right:20px}

.footer-branch-location{ width:110px; float:left}

#popup .footer-section{ width:200px; float:right}

/* content styles */
.clear{ clear:both}
.left-clear{ clear:left}
.inner{ padding:10px}
.left{ float:left}
.right{ float:right}
img.left{ margin-right:10px}
img.right{ margin-left:10px}
.centered{ text-align:center}
.hidden{ display:none}
.right-align{ text-align:right}

.blue{ color:#007AC1}

.read-more{ text-align:right}
.read-more a{ background:url(../graphics/arrow.png) no-repeat right; padding-right:14px}

.back{ background:url(../graphics/arrow-left.png) no-repeat left; padding-left:14px}

p{ line-height:18px; margin-bottom:10px}
strong{ font-weight:bold}
em{ font-style:italic}

a{ text-decoration:none; font-weight:bold; color:#007AC1}
a:hover{ text-decoration:underline}

h1, h2, h3, h4{ line-height:1em; margin-bottom:10px; font-weight:bold}
h1{ font-size:28px; color:#007AC1}
h2{ font-size:24px}
h3{ font-size:22px; color:#999}
h4{ font-size:16px; color:#999}

hr{ border:1px dotted #999; border-width:0 0 1px; margin-bottom:10px; padding-top:10px}

blockquote{ margin:10px 0 10px 20px}

ul{ margin:0 0 10px 20px; list-style:disc}
li{ margin-bottom:5px}

.column-section h4{ margin:0}

#useful-info h3{ color:#007AC1; font-size:16px;}

.top-content-title{ font-size:20px; font-weight:bold; margin-bottom:10px}
.top-img{ float:right; margin:35px 0 0 10px}

.sub-text{ font-weight:bold; margin:-5px 0 10px}

.left-half, .half{ width:50%; float:left}
.left-half .inner{ padding:0; margin-right:10px}
.half .inner{ padding:0; margin-left:10px}

.three-column, .four-column{ margin-bottom:10px}
.three-column .column{ width:310px; float:left; margin-right:10px}
.three-column .right-col{ margin:0}
.four-column .column{ width:25%; float:left}

.column-section{ background:url(../graphics/column-section-bg.png) no-repeat left bottom; margin-bottom:10px}
.column-section .inner{ background:url(../graphics/column-section-bg.png) no-repeat right top}
.home-vehicles a{ font-size:14px}

.destinations .column .inner{ border:1px solid #999}
.destination-title{ font-size:16px}

#fleet-column .column-section{ font-size:11px}

.home-vehicles a{ font-size:14px}

.content-sections-wrapper{ margin-bottom:10px}
.content-sections-inner, .content-sections-wrapper .inner{ background:url(../graphics/content-sections-bg.png) no-repeat}
.content-sections-inner{ background-position:left bottom}
.content-sections-wrapper .inner{ background-position:right top}
.left-content-section, .content-section{ width:470px; float:left}
.left-content-section{ margin-right:10px}

.map{ border:1px solid #007AC1; width:475px; height:500px; position:static}

.print{ margin:10px 0 0 10px}
.print a{ background:url(../graphics/icon_print.png) no-repeat left; padding:2px 0  2px 20px; line-height:16px}
/* end content */

/* sitemap */
#sitemap, #sitemap ul{ background:url(../graphics/vline.png) repeat-y left; margin:0; padding:0; list-style:none}
#sitemap ul{ margin-left:10px}
#sitemap li{ margin: 0; padding: 0 12px; line-height: 20px; background: url(../graphics/node.png) no-repeat; color: #369}
#sitemap li.last { background:#fff url(../graphics/lastnode.png) no-repeat}
#sitemap ul li a{ font-weight:normal}
/* end sitemap */

/* form styles */
#contact-form select, #booking-form input{ font-size:11px}

#contact-form .form-element{ padding:2px 0; margin-bottom:3px}
#contact-form .form-element label{ display:block; width:120px; float:left; line-height:24px}

.req{ color:#c00}

#contact-form .input-desc{ margin-left:120px; font-size:10px; clear:left}

#contact-form .input input{ border:1px solid #ccc; width:400px; padding:3px}
#contact-form .textarea textarea{ border:1px solid #ccc; width:400px; padding:3px}

.buttons{ text-align:center}

#contact-form{ padding:10px 210px; border:1px dotted #ccc; border-width:1px 0}
/* end forms */

/* table styles */
.table-list{border-collapse:collapse; width:100%; margin:5px 0; border:1px dotted #0079C1}
.table-list td{ color:#333; background:#fff; padding:6px; line-height:16px; vertical-align:top}
.table-list .odd td{ background:#D7E6F4}

.table-list th{ background:#0079C1 url(../graphics/th-bg.png) no-repeat top left; font-size:13px; color:#fff; border:1px solid #0079C1; padding:6px; font-weight:bold; text-align:left}

.table-list tr:hover td{ background:#aed1f1; cursor:default}

.three-column .table-list td{ width:50%}
/* end tables */

#vehicles h3{ font-size:20px}

#compare-col{ background:#CCE1ED; border-radius:10px; -moz-border-radius:10px; margin-bottom:10px}
#compare-col h3{ color:#333}
/* Vehicle comparrisons */
.add-vehicle{ display:block; width:114px; height:36px; text-indent:-5000em; float:right; background:url(../graphics/compare-bg.png) no-repeat top}
.vehicle-title .add-vehicle{ margin:18px 10px 0 0}

.selected-vehicle{ background-position:left bottom}

#compare-list{ }

.compare-item{ background:url(../graphics/compare-item-bg.png) no-repeat left bottom; padding:5px; margin-bottom:5px}
.compare-item-img{ float:left}
.compare-item-details{ margin-left:70px}
.vehicle-name{ font-weight:bold; font-size:16px; color:#FE6601; line-height:25px}
.vehicle-subtitle{ font-weight:bold; line-height:25px}

.remove-item{ display:block; text-indent:-5000em; float:right; width:16px; height:16px; background:url(../graphics/remove-item.png) no-repeat; position:relative; z-index:100}

.disabled{ filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; width:135px; height:30px}

#compare-btn{ border:none}
#compare-table-wrapper{ position: relative; background:#E2E2E2; border:1px solid #bababa; border-radius:10px; -moz-border-radius:10px}
#compare-table-wrapper .inner{ padding:10px}

.compare-table{ width:320px; float:left; border:1px solid #bababa; background:#fff; border-radius:5px; -moz-border-radius:5px; margin-left:10px; text-align:left}
.first{ margin:0}
.compare-table .inner{ padding:5px}

.compare-table .compare-item-details{ margin-left:100px; height:75px}
.compare-table .vehicle-name{ font-size:20px; padding-top:10px}

.compare-vehicle-details{ margin-bottom:10px}

.category-section{ margin-bottom:10px}
.category-section .vspecs-table{ margin:0}

#compare-booking-form-wrapper{ position:fixed; bottom:0; right:0; width:520px; z-index:10000}
#compare-booking-form{ padding:15px 10px 10px 15px; background:url(../graphics/compare-book-bg.png) no-repeat left top}

#compare-booking-form .quick-search select{ font-size:11px}

#compare-booking-form-btn{ display:block; color:#fff; background:url(../graphics/compare-booking-form-btn-bg.png) no-repeat left bottom; float:right; font-size:14px; line-height:35px; padding:5px 15px 0 30px}
#compare-booking-form-wrapper a.form-open{ margin-bottom:-5px; background-position:left top}
/* end comparrisons */
/* smooth scroll styles */

div.scrollingHotSpotLeft, div.scrollingHotSpotRight{ position:absolute; top:200px; z-index:200; width: 100px; height: 100px; background: url(../graphics/big_transparent.gif);}
div.scrollingHotSpotLeft{ left:-1px; cursor: url(../graphics/cursors/cursor_arrow_left.cur),w-resize; display:none}

div.scrollingHotSpotLeftVisible{ background:url(../graphics/compare-arrows.png) no-repeat left top}

div.scrollingHotSpotRight{ right:-1px; cursor: url(../graphics/cursors/cursor_arrow_right.cur),e-resize}

div.scrollingHotSpotRightVisible{ background:url(../graphics/compare-arrows.png) no-repeat left bottom}

div.scrollWrapper{ position: relative; overflow: hidden; width: 100%; height: 100%}

div.scrollableArea{ position: relative; width: auto; height: 100%}

/* booking form */
#bookingForm-wrapper{ position:relative}
#price-match-badge{ position:absolute; top:-5px; right:0px}
#price-info{ position:absolute; left:10px; bottom:10px}
#bookingForm-wrapper .quick-search{ padding:10px}

#bookingForm-wrapper h3{ display:none}

#bookingForm-wrapper .form-element{ padding:3px 0; font-size:11px}
#bookingForm-wrapper .form-element label{ display:block; line-height:15px; width:110px; float:left}

#bookingForm-wrapper .form-element input, #bookingForm-wrapper .form-element select{ font-size:inherit; font-family:inherit; border:1px solid #999}

#bookingForm-wrapper #pickup-element, #bookingForm-wrapper #return-element{ width:50%; float:left; border:1px solid #fff; border-width:1px 0; padding:10px 0; margin:10px 0}
#bookingForm-wrapper #pickup-element label, #bookingForm-wrapper #return-element label{ float:none; width:auto; margin-bottom:5px}
#bookingForm-wrapper #pickup-element *, #bookingForm-wrapper #return-element *{ margin:0 3px 3px 0}

#StartDepotCode, #EndDepotCode{ width:120px}
#StartDate, #EndDate{ clear:left; width:120px}

#adults-element{ clear:left}
#adults-element, #children-element{ width:50%; float:left}

#promotion-element{ clear:left}

#bookingForm-wrapper .button{ text-align:right; margin-top:10px; height:30px}

#bookingForm-wrapper #Search{ border:none; background:url(../graphics/search-btn.png) no-repeat; width:108px; height:30px; text-align:left; display:block; text-indent:-999em; float:right; overflow:hidden; display:block; font-size: 0; line-height: 0; cursor:pointer}

#compare-booking-form{ text-align:left; color:#fff}
#compare-booking-form #price-match-badge{ top:5px}
#booking-form{ position:relative}
.hide-booking .quick-search div{ display:none}
.hide-booking .quick-search #noBooking{ display:block; padding:40px 10px; font-size:12px; }