
#header .headerTimeSlot:before {
	content: "\a019";
	color: #808080;
	font-size: 25px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

@media  (min-width: 768px) {

}

@media (min-width: 1280px) {

	#header .headerTimeSlot:before{
		content:"\a019";/*ico-calendar*/
		color:#808080;
		font-size:25px;
		position:absolute;
		top: 50%;
		left: 5px;
		transform: translate(0,-50%);
	}


	input[type=number]::-webkit-inner-spin-button,
	input[type=number]::-webkit-outer-spin-button {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		margin: 0;
	}

	.slider {
		display: none;
	}

	.slider .ob_errmsg {
		color: #e0001a;
		text-transform: uppercase;
	}

	.scrollableContainer {
		position: relative;
		overflow-y: auto;
	}

	.darkLayer {
		display: none;
		background-color: rgba(51, 51, 51, 0.68);
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		z-index: 999999;
	}

	.scrollableContainer.slide {
		right: 0;
		overflow-y: scroll;
	}

	.timeSlotSection.slide {
		right: 0;
	}

	.scrollableContainer {
		position: fixed;
		top: 0;
		bottom: 0;
		right: -450px;
		background-color: #FFFFFF;
		width: 450px;
		z-index: 999999;
		transition: all 0.5s;
	}


	.headLineSliderContainer, .sliderSection {
		border-bottom: 1px solid #CCCCCC;
	}

	.timeSlotSection {
		position: fixed;
		bottom: 0;
		width: 450px;
		z-index: 999999;
		right: -450px;
		transition: all 0.5s;
	}

	#ob_delivery, #ob_pickup {
		min-height: 450px;
	}

	.sliderContainer {
		position: absolute;
	}

	.timeSlotSection .back {
		background-color: #e0001a;
		width: 100%;
		height: 50px;
		font-size: 18px;
		color: #FFFFFF;
		text-transform: uppercase;
		border: none;
		z-index: 9999999;
	}

	.headLineSliderContainer {
		text-align: center;
		padding: 30px 45px;
	}

	.sliderContainer #headlineTimeslot {
		color: #e0001a;
		font-weight: bold;
		font-size: 26px;
	}

	.sliderContainer #descriptionTimeslot {
		line-height: 1.5;
	}

	.sliderContainer  .circleBorder {
		width: 40px;
		height: 40px;
		border: 1px solid #d9d9d9;
		border-radius: 50%;
		display: inline-block;
		text-align: center;
		float: left;
	}

	.sliderContainer .circle {
		width: 30px;
		height: 30px;
		border-radius: 50%;
		display: inline-block;
		margin-top: 4px;
	}

	.sliderContainer .circle.selected {
		background-color: #32ba70;
		color: #FFFFFF;
	}

	.sliderContainer .circle.selected:before {
		content: "\a067";
		top: 6px;
		position: relative;
	}

	.deliveryMethod {
		float: left;
		padding: 40px 0;
		margin-left: 5px;
	}

	.sliderContainer .deliveryMethodSection {
		height: 100px;
		padding-left: 15px;
	}

	.sliderContainer .obSelectorHeadline {
		float: left;
		margin: 10px 0 0 5px;
	}

	.sliderSection {
		height: 120px;
		text-align: center;
	}

	.sliderContainer #zipcode {
		width: 100%;
		height: 50px;
		font-size: 18px;
		padding: 10px 10px 10px 35px;
		border: solid 1px #ccc;
	}

	.sliderContainer .inputDropDownDefault.pointOfService {
		width: 250px;
		height: 50px;
		font-size: 18px;
		padding: 10px 10px 10px 35px;
		border: solid 1px #ccc;
		cursor: pointer;
		float: left;
		border-right: 0;
		text-align: center;
	}

	.sliderContainer .obButton.obSearchStore {
		display: inline-block;
		height: 50px;
		width: 48px;
		cursor: pointer;
		background-color: #fff;
		position: relative;
		border: 1px solid #d9d9d9;
		border-left: 0;
		float: left;
	}

	.sliderContainer #onboardingPickupForm {
		text-align: center;
	}

	.sliderContainer .obButton.obSearchStore:BEFORE {
		position: absolute;
		top: 50%;
		left: 50%;
		content: "\a010";
		font-size: 14px;
		color: #ca0614;
		margin-top: -7px;
		margin-left: -7px;
	}

	.sliderContainer .obButton.obSearchStore.open:BEFORE {
		content: "\a013";
	}

	.sliderContainer .obInputTextWrapper {
		text-align: center;
		margin: 30px 80px;
		position: relative;
	}

	.sliderContainer #onboardingDeliveryForm, .sliderContainer #ob_pickup .obPickupTimeslotSeparator
	{
		border-top: 0;
	}

	.sliderContainer #onboardingPickupForm {
/* 		border-bottom: 1px solid #ccc; */
		margin-top: 30px;
	}

	.sliderContainer #onboardingPickupForm .dropDownDefaultContainer {
		display: inline-block;
		text-align: center;
	}


	.sliderContainer .emptyTimeSlot label {
		display: none;
	}



	.sliderContainer .ob_errmsg {
		padding: 10px;
		text-align: left;
	}

	.sliderTimeSlotContainer, .timeSlotContainer {
		position: relative;
	}

	.sliderContainer .dateSlot {
		margin: 6px 30px;
		text-align: center;
		text-transform: uppercase;
	}

	.sliderContainer .dateSlot .monthTimeSlot {
		font-weight: bold;
	}

	.sliderContainer .slotContainer {
		width: 100%;
		padding-left: 25px;
		margin-top: 35px;
	}

	.sliderContainer .singlePriceSlot .priceSlot {
		width: 100%;
		height: 100%;
		color: #36b776;
	}


	.sliderTimeSlotTable {
		margin-bottom: 20px;
	}

	.page-onboarding #header {
		display: none;
	}

	.sliderContainer .obInputTextWrapper.ko:BEFORE, .sliderContainer #onboardingPickupForm .dropDownDefaultContainer.ko:BEFORE {
		background-color: #ca0614;
		border-radius: 50%;
		width: 16px;
		height: 16px;
		content: "\a063";
		font-size: 7px;
		position: absolute;
		top: 50%;
		left: 10px;
		z-index: 5;
		line-height: 16px;
		color: #fff;
		transform: translateY(-50%);
		margin-top: 0;
	}

	.sliderContainer .obInputTextWrapper.ok:BEFORE, .sliderContainer #onboardingPickupForm .dropDownDefaultContainer.ok:BEFORE {
		background-color: #36b776;
		border-radius: 50%;
		width: 16px;
		height: 16px;
		content: "\a067";
		font-size: 6px;
		position: absolute;
		top: 50%;
		left: 10px;
		z-index: 5;
		line-height: 16px;
		color: #fff;
		transform: translateY(-50%);
		margin-top: 0;
	}

	.slider #onboardingZipCodeForm {
		border-bottom: 1px solid #CCCCCC;
	}

	/*STATUS TIMESLOT*/
	.sliderTimeSlotTable .priceSlot.notAvailable {
		background-image: linear-gradient(0deg, transparent 3px, #808080 3px, #808080 3px, transparent 4px, transparent 4px, rgba(255, 255, 255, .05) 4px, rgba(255, 255, 255, .05) 4px, transparent 4px, transparent), linear-gradient(90deg, transparent 3px, #808080 3px, rgba(255, 255, 255, .05) 4px, transparent 4px, transparent 4px, rgba(255, 255, 255, .05) 4px, rgba(255, 255, 255, .05) 4px, transparent 4px, transparent);
		background-size: 7px 7px;
		cursor:not-allowed;
		border: 1px solid #ccc;
		border-radius: 4px;
		border-bottom: 0;
	}

	.sliderTimeSlotTable .priceSlot.notAvailable .price {
		color: #9e9e9e;
	}

	.sliderTimeSlotTable .priceSlot {
		display: inline-block;
		width: 100px;
		margin: 0 6px 12px 0;
		height: 55px;
		line-height: 2;
		text-align: center;
	}

	.sliderTimeSlotTable .slotContainer .priceSlot.selected {
		background-color: #25C179;
		color: #fff;
		border-radius: 4px;
	}

	.sliderTimeSlotTable .slotContainer .priceSlot .price {
		font-weight: bold;
	}

	.sliderTimeSlotTable .slotContainer .singlePriceSlot.lowAvailability .priceSlot {
		border-radius: 5px;
	}

	.sliderTimeSlotTable .slotContainer .singlePriceSlot.lowAvailability .priceSlot.selected .price {
		color: #fff;
	}

	.sliderTimeSlotTable .slotContainer .fullyBooked {
		background-color: #FE0004;
		border: 1px solid #FE0004;
		color: #fff;
		cursor:not-allowed;
		border-radius: 5px;
	}

	.sliderTimeSlotTable .slotContainer .fullyBooked .time {
		color: #fff;
	}

	.sliderTimeSlotTable .slotContainer.available {
		background-color: #fff;
		border: 1px solid #CCCCCC;
		color: #000;
	}

	.sliderTimeSlotTable .slotContainer .lowAvailability {
		border: 1px solid #FCCF87;
	}
	.sliderTimeSlotTable .slotContainer .lowAvailability .priceSlot {
		color: #FCCF87;
	}

	.priceSlot .time {
		color: #000;
	}

	.priceSlot.selected .time {
		color: #fff;
	}
	/*STATUS TIMESLOT*/


}