/* Booking Addon Custom Styles */

.dt-sc-service-item.type2 .image img, .dt-sc-service-item.type2 .service-details h3:before, .dt-sc-service-item.type2 .service-details h3:after, 
.dt-sc-service-item.type2 .service-details h4, .single-dt_service .image, .single-dt_service .image > h4, .dt-sc-service-item.type2 .service-details h6, .dt-sc-goback-box .appointment-goback { 
-webkit-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; -ms-transition:all 0.3s linear; transition:all 0.3s linear; }

.dt-sc-service-item.type2 { border: 2px solid; }
.dt-sc-service-item.type2:hover { box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.20); -moz-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.20); -webkit-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.20); }
.dt-sc-service-item.type2 .image img { border:5px solid; }
.dt-sc-service-item.type2 .service-details h4 { font-weight: 500; margin: auto auto 10px; padding: 0px; font-size: 22px; border-radius: 50%; width: 70px; height: 70px; 
line-height: 70px; color: #fff; }

.dt-sc-service-item.type2 .image { margin: 0 auto; }
.dt-sc-service-item.type2 .service-details {float: left; width: 100%; clear: none; text-align: left; padding: 35px 0 0 0; position: relative; box-sizing: border-box; margin: 0; font-weight: 300;
text-align: center; }

.dt-sc-service-item.type2 .service-details h3 { font-size: 24px; padding-top: 20px; position: relative; }
.dt-sc-service-item.type2 .service-details h6 { margin-bottom: 20px; }
.dt-sc-service-item.type2 .service-details h3:before, 
.dt-sc-service-item.type2 .service-details h3:after {content: ""; display: block; position: absolute; left: 0; right: 0; margin: 0 auto; top: 0; width: 25px; height: 3px; background: #e0e0e0; }

.dt-sc-service-item.type2:hover .service-details h3:before {height: 2px; width: 60px; }
.dt-sc-service-item.type2:hover .service-details h3:after {width: 5px; height: 5px; border-radius: 50%; opacity: 1; top: -1px; -webkit-box-shadow: 0px 0px 0px 5px #fff; 
-moz-box-shadow: 0px 0px 0px 5px #fff; box-shadow: 0px 0px 0px 5px #fff; }
.dt-sc-service-item.type2 .service-details h3:after {opacity: 0; }
.dt-sc-service-item.type2 .service-details h3 a, .dt-sc-service-item.type2 .service-details h6 { color: #fff; }
.dt-sc-service-item.type2:hover { background-color: #ffffff; }

/* Booking Addon Service List Styles */

.dt-services-list .dt-sc-service-item { padding: 0; position: relative; padding: 50px 20px 50px 130px; margin: 0; min-height: auto; }
.dt-services-list .dt-sc-service-item .image { width: 90px; margin: auto auto auto 20px; top: 50%; left: 0; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); 
transform: translateY(-50%); }
.dt-services-list .dt-sc-service-item .image a { width: 100%; float: left; }
.dt-services-list .dt-sc-service-item .service-details { position: relative; display: inline-block; width: 100%; }
.dt-services-list .dt-sc-service-item .service-details > h3 a { font-size: 20px; color: #535353; }
.dt-services-list .dt-sc-service-item .service-details > h4 { position: absolute; top: 0; right: 0; margin: 0 auto; font-size: 28px; font-weight: 500; -webkit-transform: translateY(50%); 
-moz-transform: translateY(50%); transform: translateY(50%); }
.dt-services-list .dt-sc-service-item .dt-sc-service-meta ul li { font-size: 16px; color: #1f1f1f; }
.dt-services-list .dt-sc-service-item:after { border: 1px solid #dddddd; }

.dt-services-list .dt-sc-service-item:hover { background-color: rgba(241,241,241,0.2); }

/* Booking Addon Detail Styles */

.single-dt_service .image { display: inline-block; width: 100%; margin: 30px 0 40px; border: 5px solid; border-radius: 5px; position: relative; }
.single-dt_service .image img { float: left; width: 100%; }
.single-dt_service .image > h4 { position: absolute; font-weight: 500; margin: 0 auto; padding: 0px; font-size: 40px; border-radius: 50%; width: 125px; height: 125px; line-height: 125px; 
text-align: center; color: #fff; top: 40px; right: 40px; }

/* Reserve Appointment Styles */

ul.time-table > li span { font-size: 16px; font-weight: 600; }
ul.time-table > li ul.time-slots > li a { border: none; }
ul.time-table > li ul.time-slots > li a:hover { color: #fff; }

.dt-sc-appointment-wrapper .dt-sc-reservation-form input, .dt-sc-appointment-wrapper .dt-sc-reservation-form select, .dt-sc-reserve-appointment.type1 input, 
.dt-sc-appointment-wrapper .dt-sc-reservation-form input, .dt-sc-appointment-wrapper .dt-sc-reservation-form select, .dt-sc-reserve-appointment.type1 input, 
.dt-sc-reserve-appointment.type1 select, .dt-sc-appointment-scheduler-form select, .dt-sc-appointment-scheduler-form input { border-width: 0px 0px 1px; border-bottom-style: none none solid; 
padding: 10px 0; font-size: 16px; color: #535353; }

.dt-sc-reserve-appointment.type1 input[type="submit"] {float: none; padding: 15px 30px 15px; margin: 50px 0px 0px; border-radius: 50px; border: none; color: #fff; }

/* Reserve Appointment II Styles */

.dt-sc-schedule-progress { padding: 25px 0px 10px 0px; }
.dt-sc-schedule-progress .dt-sc-progress-step span, .dt-sc-goback-box .appointment-goback { background-color: #fff; }
.dt-sc-schedule-progress .dt-sc-progress-step:before, .dt-sc-schedule-progress.step1 .dt-sc-progress-step:before { left: auto; content: ""; width: 100%; }
.dt-sc-schedule-progress .dt-sc-progress-step:after, .dt-sc-schedule-progress:last-child .dt-sc-progress-step:before { content: none; }

.dt-sc-schedule-progress.dt-sc-completed-step .dt-sc-progress-step:before, .dt-sc-goback-box .appointment-goback:before:hover { border-width: 1px; border-style: solid; }

.dt-sc-available-times ul.time-slots>li { background-color: #fff; }
.dt-sc-available-times ul.time-slots>li a { border: none; }
.dt-sc-available-times ul.time-slots > li a:hover, .dt-sc-schedule-progress.dt-sc-completed-step .dt-sc-progress-step span, .dt-sc-goback-box .appointment-goback:hover { color: #fff; }

.dt-sc-booking-reservation { display: inline-block; width: 100%; margin-bottom: 30px; }

/*--------------------------------------------------------------
	18.0 - DT Responsive
	--------------------------------------------------------------*/
	
	@media only screen and (min-width:1200px) and (max-width:1380px) {
	
	.dt-sc-service-item.type2 .service-details h3 { font-size: 20px; }
	
	}
	
	/* Note: Design for a width of 960px */
	
    @media only screen and (min-width:992px) and (max-width:1199px) {

	.dt-services-list .dt-sc-service-item .service-details .dt-sc-service-meta { width: 80%; }
	.dt-sc-service-item .dt-sc-service-meta ul li { text-align: left; }
	.dt-services-list .dt-sc-service-item .service-details > h4 { right: -5px; font-size: 22px; }

	}

	@media only screen and (max-width: 767px) {

	.dt-services-list .dt-sc-service-item { padding: 50px 20px 50px 50px; text-align: center; }
	.dt-services-list .dt-sc-service-item .image { margin: auto auto 20px; top: 0; left: 0; right: 0; float: none; display: inline-block; width: 120px; -moz-transform: none; 
	-webkit-transform: none;transform: none; }
	.dt-sc-service-item .dt-sc-service-meta ul li { text-align: center; }
	.dt-services-list .dt-sc-service-item .service-details > h4 { position: relative; -moz-transform: none; -webkit-transform: none; transform: none; }
	
	}

	/* Common Styles for the devices below 479px width */
    
    @media only screen and (max-width: 479px) {
	
	.dt-sc-service-item.type2 { padding: 50px 20px; }
	.dt-sc-service-item.type2 .service-details a.dt-sc-button { font-size: 11px; }
	
	}