/* LAYOUT STYLES **************************/
#headerWrapper{ height:50px}
#contentWrapper{ padding-bottom:0}
#content { padding-top: 0px;}

.navbar-right{ margin-right:20px !important}
#searchHeaderToolbar{ background:#8c969b; border-radius:4px; color:#fff; line-height:36px; height:36px; float:right; margin-top:7px}
#headerLang{ float:left; border:none; margin:0 5px; padding:0}

#headerCurrency{ float:left; border:1px solid #afb6b9; border-width:0 0 0 1px; margin:0 5px 0 0; padding-left:15px; display:none}
#headerCurrency .nav{ margin:0}
#headerLang .nav>li>a, #headerLang .dropdown-menu>li>a, #headerCurrency .nav>li>a, #headerCurrency .dropdown-menu>li>button{ padding:10px; line-height:1em; color:#fff; text-align:left}
#headerCurrency .dropdown-toggle{ font-weight:bold;}
#headerLang .nav>li>a:hover, #headerLang .nav>li>a:focus, #headerLang .nav .open>a, #headerLang .nav .open>a:hover, #headerLang .nav .open>a:focus, #headerCurrency .nav>li>a:hover, #headerCurrency .nav>li>a:focus, #headerCurrency .nav .open>a{ background:#3f5058}
#headerCurrency .dropdown-menu>li>button:hover, #headerCurrency .dropdown-menu>li>button:focus{ background: #f5f5f5; color:#3f5058}

#headerCurrency .dropdown-menu>li>a:hover, #headerCurrency .dropdown-menu>li>a:focus{ color:#3f5058;}

#headerLang .dropdown-menu, #headerCurrency .dropdown-menu{ width: 100%; min-width: initial; border-radius:0 0 5px 5px; background:#3f5058; margin:0}
#headerCurrency .dropdown-menu{ width:200px}

#headerCurrency .dropdown-menu{ left:auto; right:0}

.currencyCode{ float:right; font-weight:bold}

#dnn_currencyPane.EvoqEmptyPane{ display:none !important}
.currencyNav{ display: inline-block;}

#contactDetails, #dnn_contactDetails{ float:right; text-align:right; margin-left:20px;}
#contactDetails a, #dnn_contactDetails a { color: #F5822B}
#contactNumber{ color:#F5822B; font-weight:bold; line-height:32px; font-size:30px}
#contactHours{ line-height:10px}

/* CONTENT STYLES ***************************/
.helpTooltip{ color:#0c8f8f; cursor:pointer}

/* Headings */
.title{ font-size:18px; color:#0c8f8f; margin-bottom:10px}
#searchCol .title, #bookingContent .title{ font-size:24px;}

ul.unstyled, ul.unstyled li{ margin:0; padding:0; list-style:none}

.equalHeight { overflow: hidden;}

/* Side Content ***************************/
#sideContent .title{ color:#405059;}
.searchColSVG svg path, .searchColSVG svg polygon, .searchColSVG svg rect { fill: #0c8f8f;}


/* Search STYLES **************************/
.noResults .searchColSection.collapse { display: block !important; height: auto !important; overflow: visible !important;}
.noResults .searchColSection.collapse.hidden { display: none !important;}
	
.searchColSection{ padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid #fff}
.searchFilterOption{ padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid #fff}
.searchFilterOption:last-child{ padding-bottom:0px; margin-bottom:0px; border:none}

/* search filter */
#filter_berth{ width:100%}
#filter_berth>.btn{ width:16.66666666666666666666%}

#searchContent, #bookingContent{ padding-bottom:75px}

#searchProgress{ margin:20px 0 30px}
#searchProgress .progressItem{ width:20%; float:left; border-bottom:5px solid #e9ebec; font-size:16px; text-align:center; line-height:50px; position:relative}
#searchProgress .progressItem.current{ color:#0c8f8f; border-color:#0c8f8f}
#searchProgress .progressItem.current:after{ content:" "; display: inline-block; width: 0; height: 0; position:absolute; top:100%; left:50%; margin-left: -10px; vertical-align: middle; border-top: 10px dashed; border-top: 4px solid #0c8f8f; border-right: 4px solid transparent; border-left: 4px solid transparent; border-width:10px}

#searchToolbar{ margin-bottom:20px}
#searchSortControl{ padding-right:10px; border-right:1px solid #8c969b; margin-right:10px}

#paymentOptions{ font-size:12px; line-height:16px; color:#8c969b; display:none}

.ui-slider-range{ background:#405059 !important}

/* search results */
.searchResult{ background:#f2f4f5; margin-bottom:20px; position:relative}
.alternativeTitle{ margin-top:20px}
.searchResult .title, .alternativeTitle .title{ font-size:24px; color:#0c8f8f; margin:10px 0}

.hiddenResult{ visibility:hidden; position:absolute; left:200%; width:100%}

#selectedVehicle, #alternateResults{ display:none}
#selectedVehicle{ padding:10px; background:#c00; margin-bottom:20px}
#selectedVehicle p{ padding:0 10px; color:#fff}
#selectedVehicle.searchResult{ margin-bottom:0}

.loadingOverlay{ position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(255,255,255,0.5); z-index: 10;}

.mainFeatures li, .otherFeatures li{ margin-bottom:5px !important}

.rateDetails{ text-align:center}
.rate{ font-size:26px; font-weight:bold; color:#e22c13; line-height: 1em; margin-bottom: 10px;}
.availabilityResult .rate{ font-size:24px; }
.convertedRate{ font-size:16px}

.btn-viewPriceDetails{ padding-top:0; padding-bottom:0}

.searchResult .rating{ font-size:12px; padding:0; line-height:25px; cursor:pointer; text-align:left; display:none}

.btn-emailResult{ border-radius:0 0 4px 4px; background-color:#8c969b; color:#fff; font-size:12px; padding-top:3px; padding-bottom:3px; margin-left:10px}

.rateWrapper{ padding-right:20px}

.rateDetails, .resultActions{ margin-bottom:20px}

.vehicleImages, .vehicleImages .carousel, .vehicleImages .carousel-inner{ height:185px}
.vehicleImages .carousel-inner>.item{ width:100%; height:100%}
.vehicleImages .carousel-inner>.item img{ width:100%; max-width:none; position: relative; top: 50%; transform: translateY(-50%);}
.vehicleImages .carousel-control .glyphicon-chevron-left, .vehicleImages .carousel-control .glyphicon-chevron-right{ font-size:20px}

.vehicleImages .carousel-control{ color:#fff}

.galleryImg{ width:100%; height:100%}

.vehicleDetails{ position:static}

.durationDistance{ background:#ddd; padding:10px; margin-bottom:10px;}

.priceDetails{ padding:20px}
.availabilityResult .priceDetails{ padding-bottom:0}
.priceDetails .table{ font-size:14px; margin-bottom:0}
.priceDescription{ width:40%}
.discountPrice{ color:#e22c13;}

.availabilityLimitedTag{ position:absolute; left:-10px; top:10px; line-height:18px; background:url(../include_graphics/search_lastVehicles.png) no-repeat top right; color:#fff; font-weight:bold; font-size: 13px; height:46px; padding: 0 36px 0 10px;}
.availabilityLimitedTag div{ background:url(../include_graphics/search_lastVehicles.png) no-repeat bottom left; position:absolute; left:0; bottom:0; width:10px; height:10px}

.availabilityDetails{ padding:0 20px; display:none}
.availabilityResult{ border-bottom:1px solid #fff; margin-bottom:20px; padding-bottom:20px}
.availabilityResult .rateWrapper{ padding-right:0}
.availabilityResult .rateDetails{ margin:0}

.availabilityDetails .alert{ margin:0 0 20px}

#noResults{ display:none}

#emailModal{ top:50px !important}

#emailDealForm{ position:relative}
#emailDealForm .loadingOverlay{ display:none}

#termsLinksWrapper{ text-align:right; margin-top:20px}
#termsLinksWrapper em{ display:block}
#termsLinksWrapper a{ display:inline-block; background:url(../include_graphics/terms-logos.png) no-repeat; margin-left:10px; height:25px; text-align:left; text-indent:-5000px}
#termsLinksWrapper a:hover{ opacity:.9}
#termsLinksWrapper a.termsLogo_starrv{ background-position:left top; width:65px}
#termsLinksWrapper a.termsLogo_apollo{ background-position:-78px top; width:77px}
#termsLinksWrapper a.termsLogo_cheapa{ background-position:-168px top; width:71px}
#termsLinksWrapper a.termsLogo_hippie{ background-position:right top; width:44px}

/* SEARCH FORM ****************/
#formVibe, #formMHR{ padding:0}
.searchForm { background: none; height: auto; border-radius: 0;}
.StartTime, .EndTime { margin-left:0px;}

.formError .form-control{ background:#c00; border-color:#c00; color:#fff}

/* bootstrap classes in the search form */
#searchBtn { line-height: 50px; font-size: 22px; margin: 10px 0;}

.searchForm .row { margin-left: -5px; margin-right: -5px;}
.searchForm .col-xs-1, .searchForm .col-sm-1, .searchForm .col-md-1, .searchForm .col-lg-1, .searchForm .col-xs-2, .searchForm .col-sm-2, .searchForm .col-md-2, .searchForm .col-lg-2, .searchForm .col-xs-3, .searchForm .col-sm-3, .searchForm .col-md-3, .searchForm .col-lg-3, .searchForm .col-xs-4, .searchForm .col-sm-4, .searchForm .col-md-4, .searchForm .col-lg-4, .searchForm .col-xs-5, .searchForm .col-sm-5, .searchForm .col-md-5, .searchForm .col-lg-5, .searchForm .col-xs-6, .searchForm .col-sm-6, .searchForm .col-md-6, .searchForm .col-lg-6, .searchForm .col-xs-7, .searchForm .col-sm-7, .searchForm .col-md-7, .searchForm .col-lg-7, .searchForm .col-xs-8, .searchForm .col-sm-8, .searchForm .col-md-8, .searchForm .col-lg-8, .searchForm .col-xs-9, .searchForm .col-sm-9, .searchForm .col-md-9, .searchForm .col-lg-9, .searchForm .col-xs-10, .searchForm .col-sm-10, .searchForm .col-md-10, .searchForm .col-lg-10, .searchForm .col-xs-11, .searchForm .col-sm-11, .searchForm .col-md-11, .searchForm .col-lg-11, .searchForm .col-xs-12, .searchForm .col-sm-12, .searchForm .col-md-12, .searchForm .col-lg-12{ padding-left:5px; padding-right:5px}

#resultsLoading, #formLoading{ position:relative; text-align:center; margin-bottom:20px}
#resultsLoading p, #formLoading p{ font-size:18px; margin:0}
#resultsLoading .loader, #formLoading .loader{ position:relative; height:30px}

/* BOOKING PAGES **********************/
.stepBtns{ text-align:right; margin-bottom:20px}

#conditionsLinkWrapper{ margin-top:20px}
.conditionsUrl{ display:block; text-align:right; line-height:30px}

#bookingContent .contentSection{ padding-top:0}

/* rental charges */
#rentalCharges.affix{ background:#e9ebec; top: 50px; position:fixed !important}
#rentalCharges.affix-bottom{ position:relative !important}

.chargeList{ font-size:14px; margin-bottom:0}
.chargeList>tbody>tr>td{ bordeR:none; padding-left:0; padding-right:0}
.chargeList .chargeDesc, .chargeList .chargeAmount{ border-bottom:1px solid #405059; padding-top:0 !important}
.chargeName{ padding-bottom:0 !important}
.chargeDesc{ font-style:italic}
.chargeAmount{ text-align:right; white-space:nowrap}
.chargeTotal{ font-weight:bold; border:0; padding-top}
.chargeTotal .chargeDesc, .chargeTotal .chargeAmount{ border:0 !important; padding-top:10px !important}

.chargeDetails{ font-size:12px; display:block; text-align:right; padding:0 !important}

/* credit cards */
#creditCardInfo{ font-size:12px}
#creditCardInfo img{ margin-bottom:10px}

.amount{ width:160px}
.totalAmount{ font-weight:bold; font-size:20px}

#infoLabel .amount{ width:120px; color:#c00}

/* travel summary */
.travelSummaryTitle{ color:#8c969b}
.travelSummaryDate{ font-size:22px}
.travelSummaryLocation{ font-size:18px}
.travelSummaryPax{ font-size:18px; font-style:italic; margin-top:10px}

/* coverages */
#coverages{ padding:20px !important; background:#f2f4f5; margin-bottom:50px}

.coverageOption{ background:#fff; border:1px solid #e9ebec; padding:20px}
.coverageSelected{ border-color:#8c969b}

.coverageTitle{ font-size:16px; font-weight:bold; margin-bottom:10px}

.coverageDetails{ min-height:120px}
.coverageText{ font-style:italic}

.coverageAmount{ float:left; width:55%}
.coverageAmount .amount{ width:auto; color:inherit; font-size:18px; font-weight:bold; line-height:1em}

.coverageActions{ float:left; width:45%}
.coverageActions .btn-coverageSelected{ display:none}
.coverageSelected .btn-coverageSelected{ display:block}
.coverageSelected .btn-coverageSelect{ display:none}

.coverageActions .btn-block+.btn-block{ margin-top:0}

/* equipment */
#equipment{ padding:20px !important; background:#f2f4f5; margin-bottom:50px}
#equipment .itemList{ margin-bottom:0}

#equipmentTooltip{ display:none}

.itemList{ border-collapse: separate; border-spacing: 0 5px}
.itemList>tbody>tr>td{ vertical-align:middle; border-bottom: 1px solid #ddd; border-color:#e9ebec; background:#fff; padding-left:20px; padding-right:20px}
.itemList>tbody>tr>td:first-child{ border-left: 1px solid #e9ebec}
.itemList>tbody>tr>td:last-child{ border-right: 1px solid #e9ebec}
.itemList .amount{ width:300px}

.itemListInput{ width:100px; text-align:center}
.itemListInput .checkboxField { height:35px}
.itemListInput .checkboxField  input{ margin-top:11px}

.itemListInput .selectField  select{ margin:0px}

/* preloader */
.loader-center{position:absolute; top:0; right:0; left:0; bottom:0}.loader-center-absolute{position:absolute;left:50%;top:50%;height:30px;width:150px;margin-top:-15px;margin-left:-75px}.object{width:10px;height:10px;background-color:#405059;float:left;margin-top:10px;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%}.second_object.object{float:right}.loader .first_object{-webkit-animation:first_object 2s infinite;animation:first_object 2s infinite}.loader .second_object{-webkit-animation:second_object 2s infinite;animation:second_object 2s infinite}@-webkit-keyframes first_object{25%,75%{-ms-transform:translate(70px,0) scale(2);-webkit-transform:translate(70px,0) scale(2);transform:translate(70px,0) scale(2)}50%{-ms-transform:translate(120px,0) scale(1);-webkit-transform:translate(120px,0) scale(1);transform:translate(120px,0) scale(1)}}@keyframes first_object{25%,75%{-ms-transform:translate(70px,0) scale(2);-webkit-transform:translate(70px,0) scale(2);transform:translate(70px,0) scale(2)}50%{-ms-transform:translate(120px,0) scale(1);-webkit-transform:translate(120px,0) scale(1);transform:translate(120px,0) scale(1)}}@-webkit-keyframes second_object{25%,75%{-ms-transform:translate(-70px,0) scale(2);-webkit-transform:translate(-70px,0) scale(2);transform:translate(-70px,0) scale(2)}50%{-ms-transform:translate(-120px,0) scale(1);-webkit-transform:translate(-120px,0) scale(1);transform:translate(-120px,0) scale(1)}}@keyframes second_object{25%,75%{-ms-transform:translate(-70px,0) scale(2);-webkit-transform:translate(-70px,0) scale(2);transform:translate(-70px,0) scale(2)}50%{-ms-transform:translate(-120px,0) scale(1);-webkit-transform:translate(-120px,0) scale(1);transform:translate(-120px,0) scale(1)}}


/*** MEDIA QUERIES ***/
@media (max-width: 767px)
{
	#header .navbar-header{ float:left}
	#headerNav{ clear:both}
	#headerNav .navbar-right{ margin:0px !important}
	
	#contactDetails, #dnn_contactDetails{ margin-right:20px; float:none; text-align:left}
	
	#searchHeaderToolbar{ float:none; min-height:35px}
	#headerLang{ position:absolute; left:10px}

    #headerCurrency{ position:absolute; left:60px}
	
	#paymentOptions{ margin-bottom:10px}
	
	#searchToolbar .form-group{ display: inline-block; margin-bottom: 0; vertical-align: middle}
	#searchSort{ display: inline-block; width:auto}
	 
	.StartTime, .EndTime{ margin-top:0}
}

@media (min-width: 768px)
{
    #headerNav{ float:right}

	#paymentOptions{ float:right; text-align:right}
}

@media (max-width: 991px)
{
	#searchHeaderToolbar{ display:block !important}
	#headerLang{ display:block}
	
	/*#mobilePhone{ line-height:43px; font-weight: bold; font-size: 18px;}
	#mobilePhone a{ color: #F5822B}
	#mobilePhone .glyphicon { font-size: 14px;}
	
	#mobileBtns{ margin-right:130px}*/
	.noResults #mobileBtns{ display:none}
	.mobileBtn{ width:50%; float:left}
	.mobileBtn .btn{ background:#405059}
	.mobileBtn .btn:hover{ background:#2B373D}
	.changeSearch, .changeFilter{ margin-bottom:20px; border-radius:0 0 0 4px; text-align:left; border-color:#2B373D; padding-top:10px; padding-bottom:10px}
	.changeFilter{ border-radius:0 0 4px 0}
	
	.searchColSection{ padding:0; margin:0; border-bottom:none; background:#f2f4f5}
	.searchColSectionInner{ padding:20px; background:#f2f4f5; margin-bottom:20px}
	
	.availabilityLimitedTag{ top:20px}
	
	.searchResult .title{ margin-bottom:0}
	
	.vehicleImages{ margin:10px 0 10px 10px}
	.productOverviewUrl{ border-top-left-radius:0; border-top-right-radius:0}
	.productOverviewUrlMobile{ margin:0 0 10px 10px}
	.vehicleImages, .vehicleImages .carousel{ height:172px}
	/*.vehicleImages .carousel-inner>.item>img { max-width: 200px; max-height:162px; width:auto}*/
	
	.vehicleMeta { text-align: left; margin-bottom: 0px;}
	
	.rateDetails{ margin-bottom:10px}
	.resultActionsMobile{ margin-right:10px}
	.btn-searchAlternatives{ margin:0 !important}
	
	.priceDetails{ padding:10px}

    #listUpdatedText{ position:fixed; background:#c00; color:#fff; padding:5px 10px; display:none}
}
@media (min-width: 992px)
{
	#searchCol { background-color: #e9ebec; padding:20px 20px 10000px 20px; margin-bottom: -10000px; height: 100%;}
	
	.hasResults  .searchFilter.collapse { display: block !important; height: auto !important; overflow: visible !important;}
	.hasResults  .searchFilter.collapse.hidden { display: none !important;}
	
	.vehicleMeta{ margin:10px 0 20px 0}

	.resultToolbar{ position:absolute; top:0; right:20px; z-index:1}
	.rating, .btn-emailResult{ float:left}
	
	.rateDetails{ margin-top:45px}
	
	.btn-resultSelect{ font-size: 18px; text-shadow: 0 1px 1px rgba(0,0,0,0.3);}
	
	.berthIcons img, .featureIcons img{ height:20px; width:auto; margin:0 3px}
	

    #ui-datepicker-div{ font-size:0.8em}
}

@media (min-width: 992px) and (max-width: 1199px) 
{
	.berthIcons, .featureIcons{ display:block}

	.vehicleLinks a{ display:block}
}

@media (min-width: 1200px)
{
	.berthIcons img, .featureIcons img{ height:26px; width:auto; margin:0 3px}
	
	.vehicleLinks a{ display:inline-block}
	.termsLink{ border-left:1px solid #8C969B; padding-left:10px; margin-left:10px}
	
	#rentalCharges.affix{ width:230px}
}