/**
 * File Name: MEDIA CSS
 * Author: Shariar
 * Description: 
 * Version: 1.0
 */


/**
 * 1.0 Media Queries
 */

@-webkit-viewport   { width: device-width; }
@-moz-viewport      { width: device-width; }
@-ms-viewport       { width: device-width; }
@-o-viewport        { width: device-width; }
@viewport           { width: device-width; }


/**
 * 1.1 Desktop Large, 1200px and up
 * Large desktops and laptops
 */

@media screen and (min-width: 1200px) { ... }


/**
 * 1.2 Desktop, 992px and 1199px
 * Landscape tablets and medium desktops
 */

@media screen and (min-width: 992px) and (max-width: 1199px) { ... }


/**
 * 1.3 Tablet, 768px and 991px
 * Portrait tablets and small desktops
 */

@media screen and (min-width: 768px) and (max-width: 991px) {

}


/**
 * 1.4 Mobile Large, up to 767px
 * Landscape phones and portrait tablets
 */
@media screen and (max-width: 980px) {
	#limobooking-step2-wrapper .vehicles-body.grid-view .vehicles-grid .vehicles-item {
		width: 33%;
	}
}
@media screen and (max-width: 800px) {
	#limobooking-step2-wrapper .vehicles-body .vehicles-item .vehicles-item-mid {
		float: none;
		padding: 0 210px;
	}
}

@media screen and (max-width: 767px) {
	body {
		/*background-color: red;*/
	}
	
	#limobooking-header-area a:link, 
	#limobooking-header-area a:visited, 
	#limobooking-header-area a:active {
		padding-left: 4px;
	}
	#limobooking-header-area a:link, 
	#limobooking-header-area a:visited, 
	#limobooking-header-area a:active {
		padding-right: 5px;
	}
	#limobooking-header-area a.reset-booking-form:link, 
	#limobooking-header-area a.reset-booking-form:visited, 
	#limobooking-header-area a.reset-booking-form:active {
		padding-top: 0px;
		position: absolute;
		top: 58px;
		left:12px;
	}

	#limobooking-header-area .promo-code {
		float: none;
		margin: 0px;
		display: table;
		clear: both;
		width: 100%;
		text-align: right;
		padding: 5px 0 10px;
		padding-right: 5px;
		border-top: 1px solid #e7e7e7;		
	}	
	#limobooking-header-area .promo-code .inputbox {
		width: 120px;
	}
	#limobooking-step1-wrapper {
		max-width: 470px;
		margin: 0 auto;
	}	
	#limobooking-step1-container-area .limobooking-step1-right-area {
		float: none;
	}
	#limobooking-steps-area .step-number-wrap .step-text {
		font-size: 11px;
	}

	#limobooking-step2-wrapper .vehicles-list .vehicles-header {

	}
	#limobooking-step2-wrapper .vehicles-list .vehicles-header .col-sm-6 {
		text-align: center;
	}
	#limobooking-step2-wrapper .vehicles-list .vehicles-header .sort-outer .pull-right {
		float: none !important;
	}
	#limobooking-step2-wrapper .vehicles-list .vehicles-header .sort-outer .sort-title {
		display: inline-block;
		float: none !important;
	}
	#limobooking-step2-wrapper .vehicles-list .vehicles-header .sort-outer .btn-toolbar .btn, 
	#limobooking-step2-wrapper .vehicles-list .vehicles-header .sort-outer .btn-toolbar .btn-group, 
	#limobooking-step2-wrapper .vehicles-list .vehicles-header .sort-outer .btn-toolbar .input-group {
		float: none !important;
	}
	#limobooking-step2-wrapper .vehicles-body .vehicles-item .vehicles-item-mid h3 {
		font-size: 16px;
	}
	#limobooking-step2-wrapper .tripSummary .trip-summary-info h3 span.chevron-up {
		display: inline-block;
	}	

	#limobooking-step3-wrapper .col-right-border {
		background: none;
		margin-right: 0px;
	}
	#limobooking-step3-wrapper .col-left-border {
		background: none;
	}
	.limobooking-step3-container-area  .col-max-width {
		max-width: 470px;
		width: 100%;
		margin: 0 auto;
	}
	.limobooking-step3-container-area  .col-max-width.left {
		float: none;
	}
	.limobooking-step3-container-area  .col-max-width.right {
		float: none;
	}	
	#limobooking-step1-container-area .limobooking-step1-right-area {
		padding-left: 15px;
		padding-right: 15px;
	}	
}

@media screen and (min-width: 600px) and (max-width: 767px) {
	#limobooking-step2-wrapper .vehicles-body.grid-view .vehicles-grid .vehicles-item {
		width: 50%;
	}
}

@media screen and (max-width: 620px) {
	#limobooking-header-area .promo-code .inputbox {
		width: 120px;
	}
}
/**
 * 1.5 Mobile, up to 480px
 * Portrait phones and smaller
 */
@media screen and (max-width: 600px) {
	#limobooking-step2-wrapper .vehicles-list .vehicles-header .sort-outer .vm-options {
		display: none;
	}
	#limobooking-step2-wrapper .vehicles-body .vehicles-item .vehicles-item-mid {
		display: none;
	}
	#limobooking-step2-wrapper .vehicles-body .vehicles-item .vehicles-item-left {
		float: none;
		margin: 0 auto;
		width: 100%;
	}
	#limobooking-step2-wrapper .vehicles-body .vehicles-item .vehicles-item-right {
		float: none;
		width: 100%;
	}
	#limobooking-step2-wrapper .vehicles-body .vehicles-item .vehicles-item-left h3.small-device {
		display: block;
		font-size: 23px;
	}
	#limobooking-step2-wrapper .vehicles-body .vehicles-item .vehicles-item-left img {
		width: 200px;
		margin: 0 auto;
		margin-bottom: 10px;
	}
}
@media screen and (max-width: 480px) {
	#limobooking-header-area .promo-code .inputbox {
		width: 120px;
	}
	/*
	#limobooking-step2-wrapper .tripSummary .trip-summary-info h3 a:link, 
	#limobooking-step2-wrapper .tripSummary .trip-summary-info h3 a:visited, 
	#limobooking-step2-wrapper .tripSummary .trip-summary-info h3 a:active {
		width: 250px;
		display: inline-block;
	}
	*/
	#limobooking-step2-wrapper .tripSummary .trip-summary-info span.edit a.back_first:link,
	#limobooking-step2-wrapper .tripSummary .trip-summary-info span.edit a.back_first:visited,
	#limobooking-step2-wrapper .tripSummary .trip-summary-info span.edit a.back_first:active {
		width: auto;
	}
	
	#limobooking-step2-wrapper .tripSummary .trip-summary-info .date-time {
		display: block;
	}
	#limobooking-step1-container-area .btn-default, #limobooking-step2-container-area .btn-default {
		vertical-align: top;
	}	

	.step1-sm-inputWrap.dropoffDate.custom-col-xs-6.custom-col-md-6 {
		padding-bottom: 15px;
	}
	.step1-sm-inputWrap.dropoffDate.custom-col-xs-6.custom-col-md-6,
	.step1-sm-inputWrap.dropoffTime.custom-col-xs-6.custom-col-md-6 {
		width: 100%;
	}

}

@media screen and (min-width: 250px) and (max-width: 600px) {
	#limobooking-step2-wrapper .vehicles-body.grid-view .vehicles-grid .vehicles-item {
		width: 100%;
	}	
	#limobooking-step2-wrapper .vehicles-body.grid-view .vehicles-grid .vehicles-item {
		height: 100%;
		float: none;
		border-bottom: 1px solid #e9e9e9; 
		padding-bottom: 45px;
	}
	.vehicles-body.grid-view .vehicles-grid .vehicles-item-i:hover .vehicles-item-box {
		background: #FFFFFF;
		border: none;
		border-radius: 0px;
		margin: 0px;
		padding: 0px;
		-webkit-box-shadow: none;
		box-shadow: none;
		background-image: none;
		background-image: none;
		background-image: none;
		background-repeat: none;
	}	
	.vehicles-body.grid-view .vehicles-grid .vehicles-item-i {
		height: 100%;
	}
	.vehicles-body.grid-view .vehicles-grid .vehicles-item-i:hover {
		overflow: visible;
		z-index: 0;
	}	
	.vehicles-body.grid-view .vehicles-grid .vehicles-item-box {
		padding: 0px;
		height: 100%;
	}	
	.vehicles-body.grid-view .vehicles-grid .vehicles-item-box h3.vehicle-title {
		white-space: normal;
		overflow: visible;
		font-size: 23px;
	}
}

@media screen and (max-width: 320px) {
	#limobooking-header-area .promo-code {
		text-align: right;
		padding-right: 5px;
	}
	#limobooking-header-area .promo-code .inputbox {
		width: 120px;
	}
	#limobooking-step2-wrapper .tripSummary .trip-summary-info h3 a:link, 
	#limobooking-step2-wrapper .tripSummary .trip-summary-info h3 a:visited, 
	#limobooking-step2-wrapper .tripSummary .trip-summary-info h3 a:active {
		/*width: 240px;*/
		width: 200px;
	}
	#limobooking-step2-wrapper .tripSummary .trip-summary-info span.edit {
		margin-left: 0px;
	}
	#limobooking-step2-wrapper .vehicles-list .vehicles-header h2.vehicles-title {
		font-size: 19px;
		margin-bottom: 10px;
	}
	#limobooking-step2-wrapper .tripSummary .trip-summary-info .buttonWrap a:link, 
	#limobooking-step2-wrapper .tripSummary .trip-summary-info .buttonWrap a:visited, 
	#limobooking-step2-wrapper .tripSummary .trip-summary-info .buttonWrap a:active {
		display: block;
		width: 240px;
		margin-bottom: 5px;
	}

}

@media screen and (min-width: 250px) and (max-width: 480px) {
	.timeSet .pickupDate {
		margin-bottom: 15px;
	}
	.timeSet .pickupDate,
	.timeSet .pickupTime,
	.timeSet .returnTripPickupDate,
	.timeSet .returnTripPickupTime	{
		width: 100%;
	}
	#limobooking-step1-container-area .btn-default {
		margin-bottom: 10px;
	}
	.wait-timeWrap .date_input {
		width: 100%;
	}
	.sm-width .step1-inputWrap-sm {
		width: 100%;
	}
	#enterPromoCodeStep3 .col-xs-6.col-sm-7.col-md-8 {
		width: 100%;
	}
}