﻿.module-189 {
    margin-top: 2em;
}
.module-189 .fa {
    font: normal normal normal 14px/1 FontAwesome !important;
}
.module-189-inner, .page-title-without-breadcrumb {
    max-width: 1120px;
    margin: 0 auto;
}
body.has-no-select-store #m189-SelectStore {
    display: none;
}
#m189-SelectServicesTime, #m189-SelectRecommended, #m189-SelectAppointment {
    display: none;
}
body.has-no-select-store #m189-SelectServicesTime {
    display: block;
}
.module-189 fieldset {
    width: 100%;
    margin-top: 15px;
}
.module-189 legend {
    padding: 1.2em  1em 1em;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1.4em;
    display: block;
    width: 100%;
    color: #fff;
    background-color: black;
}
.module-189 fieldset h4 {
    padding: 1em 0 0.5em 0;
}
.eztfs_c_opening-container a {
    cursor: pointer;
}
.eztfs_c_navigation a {
    color: #0084FD;
    cursor: pointer;
    margin-left: 0.4em;
}
.eztfs_c_navigation {
    display: none;
}
.module-189 fieldset .eztfs-appointments, .module-189 fieldset #eztfs-bookingcustomer,
.module-189 fieldset #eztfs-bookingdetails, .module-189 fieldset .eztfs-services {
    width: 100%;
    min-height: 400px;
}
.module-189 fieldset .eztfs-appointments input[type=text] {
    width: 68%;
}
.eztfs_c_opening-container {
    margin: 0 0 4px;
    padding: 2px;
    display: block;
}
.eztfs_c_opening-container:hover {
    background-color: #ffe119;
}
#eztfs-servicearea, #eztfs-otherservices {
    clear: both;
}
.eztfs_wait_icon {
    display: none;
}
#m189-EnterDetails label {
    display: block;
}
#m189-EnterDetails li {
    margin-bottom: 0.5em;
}
#m189-EnterDetails input[type=text] {
    width: 90%;
}
#m189-EnterDetails select {
    width: 90%;
}
textarea#eztfs_comments {
    width: 89%;
    height: 93px;
}
#a_notes2 {
    visibility: hidden;
}
.eztfs-storefinder {
    min-height: 400px;
    width: 100%;
}
a#eztfs-navigation-services {
    margin: 0;
}
p.eztfs-error-message {
    color: #FFFFFF;
    background-color: red;
    text-align: center;
    padding: 4px 0;
    margin-bottom: 8px;
}
.service-warning {
    font-size: 1em;
    width: 100%;
    color: #E82E2E;
    padding: 10px;
    margin: 10px 0;
}
.scheduleappointment button:hover:before {
    border-color: #33B44A;
}
.module-512-service-error { background-color: #FF9; text-align: center; font-weight: 800; display:none; }
#eztfs-bookingcompleted { padding: 2% 0; }
button.appointment { width: 70%; height: 52px; margin-left: 30%; margin-top: 20px;}
#m512-retailerlist { clear: both; padding-top: 23px; margin-top:3vw;}
.eztfs-services p strong, .eztfs-appointments p strong { font-size: 1.1em; }
#m512-retailerHidden { display: none; }
.showmorearea {     
    margin: 2vw 0 0 0;
    width: 100%;
    text-align: center; 
    display:inline-block;
}
.showmorearea a { cursor: pointer; font-weight: 800;}
/*services*/
.eztfs_c_otherservicelist { display: none; }
.wrapper.columns fieldset .service-list-column { float: left; width: 50%; }
/*date picker*/
#eztfs-bookingcompleted p.addr, #eztfs-bookingcompleted p.services, #eztfs-bookingcompleted p.time { font-weight: 600; font-size: 1.3em; line-height: 1.5;}
#eztfs-bookingcompleted p.services { font-size: 1em; }
#eztfs-bookingcompleted p.time { font-size: 1em; }
#eztfs-bookingcompleted p.phone { font-weight: 600; font-size: 1em; }
#m510-help-popup { display: none; position: absolute; padding: 10px; background: #f2f0f0; color: #000; border: 1px solid #1a1a1a; font-size: 90%; width: 400px; z-index: 10; }
#m510-help-popup p { background: inherit; padding: inherit; color: inherit; height: inherit; white-space: normal; }
a#m510-help-link:hover { text-decoration: underline; cursor: pointer; }
a#m510-help-link { background: none; color: #33b44a; padding: 0 0 0.9em 0; font-size: 1em; line-height: 1; width: 200px; position: relative;}
a#m510-help-link:after { width: auto; height: auto; content: normal; background: none; }
span.shuttle-warning { font-size: 0.84em; }
span.other-service-note { font-size: 0.8em; font-style: italic; }
/*modal*/
#m512-modal-background { z-index: 20; height: 100%; width: 100%; position: fixed; top: 0; left: 0; background-color: rgb(0, 0, 0); opacity: 0.8; -moz-opacity: 0.80; filter: alpha(opacity=80); }
.confirmation-form-wrapper {width: 96%; max-width: 520px;  border: solid 4px #bdbcbc; z-index: 50; position: absolute; background-color: #fff;}
.confirmation-form { padding: 10px 30px 20px 30px; }
.confirmation-form h1 { font-weight: 500; font-size: 1.4em; margin: 0 0 0.2em 0; }
.confirmation-form p { margin: 0; font-size: 1em; }
div#confirmcontent { padding-bottom: 25px; }
div#confirmcontent p.title { margin-top: 10px; font-weight: 800; }
.confirmation-form button#confirm-submit {
    float: right !important;
}
.confirmation-form.submitting {
    opacity: 0.2;
    background-color: #dadada;
}
a.servicegroup-toggle {
    display: block;
    cursor: pointer;
}
a.sched-btn {
    cursor: pointer;
}

/* Wiygul Schedule Appointment */

.sched-nav {
   padding: 30px 0;
}
.sched-nav div {
    float: left;
    width: 33%;
    border-top: solid 2px #ddd;
    padding-top:15px;
} 
.sched-nav div a {
    font-weight: 500;
    color: #ddd;
    cursor: default;
    text-decoration: none;
}
.sched-nav div.selected {
    border-top: solid 5px #ff6510;
}
.sched-nav div.selected a {
    color: #000;
    cursor: pointer;
    font-weight:800 !important;
}

.module-189 *{
    font-family: "canada-type-gibson",sans-serif;
    min-height:initial;
}

h1{
    color: #231f20;
    font-style: normal;
    font-weight: 800;
    width: 90%;
    display: block;
    margin: 0 auto;
}

.sched-nav{
    width:90%;
    display:block;
    margin: 0 auto 20px auto;

}

.sched-nav div:not(.selected) a{
    font-weight:600 !important;
}

.name-appointment{
    background:#f6f6f6;
}

#appointment-form{
    background-color:white;
    padding: 5% 10%;
    display: inline-block;
    width: 100%;
}

#appointment-form #m189-SelectStore h4, #appointment-form #m189-SelectServicesTime h3, #m189-SelectRecommended h3, #m189-SelectAppointment h3, #m189-EnterDetails h4 {
    padding:0px;         
    font-size: 26px;    
    font-weight:600;
    text-transform: uppercase;
}
#appointment-form #m189-SelectStore h4{
    margin:0 0 2vw 0 !important;  
}

#m189-EnterDetails h4{
    margin: 0 0 2vw 0;
}

#m189-SelectServicesTime h3, #m189-SelectRecommended h3, #m189-SelectAppointment h3{
    margin:0px;
}

#m189-SelectServicesTime h4, #m189-SelectRecommended h4, #m189-SelectAppointment h4{
    font-size: 16px;
    font-weight:initial;
    text-transform: initial;
    margin:2vw 0 !important;
}

#appointment-form input[type="text"], #eztfs-stayappointment, #eztfs-dropoffappointment, #eztfs-pickuptime, #m189-EnterDetails select, #m189-EnterDetails textarea{
    background-color:#f8f8f8;
    border:0px !important;
    color:#333;
    padding: 25px 10px;
    margin: 20px 0;
}

#appointment-form .hasDatepicker{
    background-image: url(https://www.r2cthemes.com/wiygul/i/icons/calendar.png);
    background-repeat: no-repeat;
    background-size: 18px;
    background-position: 95%;
}

#appointment-form select{
    -moz-appearance:none; /* Firefox */
    -webkit-appearance:none; /* Safari and Chrome */
    appearance:none;
    background-image: url(https://www.r2cthemes.com/wiygul/i/icons/down-arrow.svg);
    background-repeat: no-repeat;
    background-size: 18px;
    background-position: 95%;
    padding: 5px !important;
    height:50px !important;
}

#appointment-form #m189-EnterDetails select{
    background-position: 98%;    
}

#eztfs_dropoffdate, #eztfs_selectservicebtn, #eztfs_dropoffdate, #eztfs-stayappointment, #eztfs-dropoffappointment, #eztfs-pickuptime{
    width:100%;
}

#appointment-form #eztfs_find, #eztfs_enterinfobtn {
    width: 100%;
    border-radius: 25px !important;
    padding: 15px !important;
    text-transform: initial;
    margin:15px 0 0 0;
}

a.sched-btn, #eztfs_book {
    width: 100%;
    border-radius: 25px !important;
    padding: 15px !important;
    text-transform: initial;
    margin: 15px 0 0 0;
    background: #ff6510;
    font-size: 15px;
    font-weight: 400;
    display: inline-block;
    color: white;
    text-align: center;
}
a.sched-btn.back {
    color: #ff6510;
    background: none;
}
a.sched-btn a:hover, #eztfs_book:hover {
    text-decoration: none;
}
#m512-retailerList{
    margin-top:3vw;
}

#m512-retailerList .m512-retailerselectarea, #m512-retailerHidden .m512-retailerselectarea {
    width: 33.33%;
    position: relative;
    padding: 0 15px;
    float: left;
}

.m512-retailerselectarea > div{
    width:100%;
}
.m512-retailerselectarea .distance p {
    font-weight: 600;
    color: #008200;
    font-size: 16px;
}
.m512-retailerselectarea .addr p{
    color: black;
    font-size: 18px;
}
.m512-retailerselectarea .hours p{
    font-weight: initial !important;
    color: #999 !important;
}
.m512-retailerselectarea div{
    color:#999;
}
.m512-retailerselectarea input[type="button"]{
    font-weight:600;    
    text-transform: initial !important;
    border:1px solid black !important;    
    color:black !important;
    background:none !important;
    padding:15px 20px !important;    
}

#eztfs-servicearea a, #eztfs-recommendedservices a{    
    padding: 15px;
    font-weight: 600;
    color: black;
    border-bottom:1px solid #ccc;
}

#eztfs-servicearea a:hover{
    text-decoration: none;
}

#eztfs-servicearea a:before{
    content:" ";    
    background-size:contain !important;
    width: 35px;
    height: 35px;
    margin-right: 15px;
    float:left;
    display:inline-block;
}

#eztfs-servicearea a[data-target="#services-oilchange"]:before{    
    background:url(https://www.r2cthemes.com/wiygul/i/icons/oil-change.png) no-repeat;
}

#eztfs-servicearea a[data-target="#services-safety"]:before, #eztfs-servicearea a[data-target="#services-md"]:before {
    background: url(https://www.r2cthemes.com/wiygul/i/icons/safety-inspection.png) no-repeat;
}

#eztfs-servicearea a[data-target="#services-alignment"]:before{    
    background:url(https://www.r2cthemes.com/wiygul/i/icons/alignment.png) no-repeat;
}

#eztfs-servicearea a[data-target="#services-brake"]:before{    
    background:url(https://www.r2cthemes.com/wiygul/i/icons/brake.png) no-repeat;
}

#eztfs-servicearea a[data-target="#services-tires"]:before{    
    background:url(https://www.r2cthemes.com/wiygul/i/icons/tires.png) no-repeat;
}

#eztfs-servicearea a[data-target="#services-battery"]:before{    
    background:url(https://www.r2cthemes.com/wiygul/i/icons/battery.png) no-repeat;
}

#eztfs-servicearea a[data-target="#services-heating"]:before{    
    background:url(https://www.r2cthemes.com/wiygul/i/icons/heating-cooling.png) no-repeat;
}

#eztfs-servicearea a[data-target="#services-other"]:before{    
    background:url(https://www.r2cthemes.com/wiygul/i/icons/others.png) no-repeat;
}

#eztfs-servicearea a[data-target="#services-scheduled"]:before {
    background: url(https://www.r2cthemes.com/wiygul/i/icons/maintenance.png) no-repeat;
}

#eztfs-servicearea a:after{
    content:url(https://www.r2cthemes.com/wiygul/i/icons/plus.svg);
    width: 23px;
    height: 23px;
    float:right;
    display:inline-block;
}

#eztfs-servicearea a[aria-expanded="true"]:after, #eztfs-recommendedservices a[aria-expanded="true"]:after{
    content:url(https://www.r2cthemes.com/wiygul/i/icons/minus.svg);
}

#eztfs-servicearea a[aria-expanded="false"], #eztfs-recommendedservices a[aria-expanded="false"]{
    background-color:none;    
}

#eztfs-servicearea a[aria-expanded="true"], #eztfs-recommendedservices a[aria-expanded="true"] { 
    background-color:#f8f8f8;
    border:0px;    
}

#eztfs-servicearea a:hover, #eztfs-recommendedservices a:hover{
    background-color:#f8f8f8;
    text-transform: none;
}

#eztfs-servicearea ul, #m189-SelectRecommended ul{
    padding: 15px;
    list-style-type: none;
}

#eztfs-appointmentpreference .appointment-preference-area{
    padding:15px;
}

#eztfs-servicearea input[type="checkbox"], #eztfs-recommendedservices input[type="checkbox"], .appointment-preference-area input[type="radio"]{
    margin: 4px 0 0 -20px;
    position: absolute;  
}


@media (max-width:991px){
    .m512-retailerselectarea .addr p{
        font-size:16px;
    }
}

#eztfs-servicearea label, #eztfs-recommendedservices label, #eztfs-appointmentpreference label{
    margin-left: 20px !important;
}


@media (max-width:767px){
    #m512-retailerList .m512-retailerselectarea, #m512-retailerHidden .m512-retailerselectarea{
        width:100%;
        margin-top: 20px;
    }
    .sched-nav div{
        width:100%;
        margin: 0 0 15px 0;
    }
    #appointment-form select{        
        background-position: 93%;
    }    
    #appointment-form #m189-EnterDetails select{
        background-position: 96%;    
    }
}

#ui-datepicker-div ..ui-widget-content{
    color:black !important;
}

#ui-datepicker-div .ui-datepicker-header{   
    background:none !important;
    color:black !important;
    border:0px !important;
}

#ui-datepicker-div .ui-state-default{
    background: none !important;
    color: #666 !important;
    border: 0 !important;
    text-align: center !important;
    font-size: 13px;
    padding: 9px;
}

#ui-datepicker-div .ui-datepicker-calendar thead th{
    color:black !important;
    font-size:13px !important;
}

#ui-datepicker-div .ui-state-highlight{
    background:#ff6510 !important;
    border-radius:20px;
    color:white !important;        
}

#ui-datepicker-div .ui-icon-circle-triangle-e{
    content:url(https://www.r2cthemes.com/wiygul/i/icons/right-arrow.svg);
    width: 23px;
    height: 23px;    
    display:inline-block;
    background:none;
    padding: 3px;
}

#ui-datepicker-div .ui-icon-circle-triangle-w{
    content:url(https://www.r2cthemes.com/wiygul/i/icons/left-arrow.svg);
    width: 23px;
    height: 23px;    
    display:inline-block;
    background:none;
}

#eztfs_selectservicebtn, #eztfs-stayappointment, #eztfs-pickupdate, #eztfs_dropoffdate, #eztfs-dropoffappointment, #eztfs-pickuptime, #eztfs_dropoffdate{
    max-width:300px;
}

#eztfs-servicearea p {
    padding: 0 15px;
}