@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");
.day_mobile{font-weight: bold;display: none;}
.navbar-fixed-top,
.navbar-fixed-bottom {
    position: fixed;
}
.fran_opp {
    text-align: center;
    color: #fff;
    vertical-align: middle;
    background: rgba(0, 0, 0, 1) url("") no-repeat scroll 0 0;
    margin-bottom: 5px;
    padding: 10px;
    font-size: 22px;
    font-weight: bold;
}
.fran_opp a {
    color: #9e4dab;
}
.online_member {
    width: 110px;
}
.taglinelogo {
    font-size: 24px !important;
}
.new_visitors {
    width: 62%;
    padding-top: 20px;
}
.navbar .nav > li.active > a {
    padding: 5px 5px 8px;
}
.navbar .nav > li > a {
    padding: 5px 15px;
}
.navbar-inner {
    background: rgba(0, 0, 0, 1) url("") no-repeat scroll 0 0;
}
.Web-Size_new_design {
    background: rgba(0, 0, 0, 1) url("") no-repeat scroll 0 0;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    margin-bottom: 10px;
}
.section-heading {
    padding: 20px 15px 0 15px;
}
.section-heading h2,
.section-heading h3 {
    color: #fff;
}
.section-heading h2 {
    font-size: 22px;
}
.section-heading h3 {
    font-size: 18px;
}
/*.thank1 {display: inline-table;}*/
.span9 .app-box .Page-Size {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: center;
}
.Tab_new_design {
    float: left;
    width: 33.33%;
    /* font-size: 25px; */
    padding: 50px 0px;
    font-weight: bold;
}
.thank1 .Tab_new_design {
    width: 29.8%;
    padding: 50px 15px;
}
.Tab_new_social {
    float: left;
    width: 30%;
    margin-right: 1%;
    margin-left: 1%;
    /* font-size: 25px; */
    padding: 50px 0px;
    font-weight: bold;
}
.new_google {
    padding: 20px;
    color: #000;
    background: #08fb01;
}
.new_yelp {
    padding: 20px 50px;
    background: #990100;
}
.new_facebook {
    padding: 20px;
    background-color: #4886eb;
    color: #000;
}
.opening-time {
    margin: 10px;
    width: 215px !important;
    padding-top: 47px !important;
}
.Tab_new_2 {
    float: left;
    /* font-size: 15px; */
    padding: 25px 0;
    width: 32%;
    margin: 0px 5px;
}
.Tab_new_2 a {
    color: #000;
    display: block;
    padding: 5px;
    /* font-weight: bold; */
}
.font-35 {
    font-size: 35px !important;
}
.font-25 {
    font-size: 25px !important;
}
.font-16 {
    font-size: 16px !important;
}
.ptb-20 {
    padding-top: 20px;
    padding-bottom: 20px;
}
.ptb-30 {
    padding-top: 30px;
    padding-bottom: 30px;
}
.ptb-50 {
    padding-top: 50px;
    padding-bottom: 50px;
}
.slider-title {
    top: 450px !important;
}
.Counter {
    float: none !important;
    display: inline-block !important;
    border-radius: 8px !important; /* border:1px solid #fff!important; background:#fff!important; */
    padding: 0 !important;
}
.yelp2 {
    padding-bottom: 19px !important;
}
.facebook2 {
    background: url(../images/facebook-review.png) no-repeat left top !important;
    text-align: center !important;
    font-size: 14px !important;
    color: #fff !important;
    width: 139px !important;
    height: 20px !important;
    padding: 40px 10px 2px 55px !important;
    float: right;
    line-height: 16px;
    font-weight: normal;
}
.facebook2:hover {
    text-decoration: none;
}
.google2 {
    background: url(../images/google-review.png) no-repeat left top !important;
    text-align: center !important;
    font-size: 15px !important;
    color: #5d5d5d !important;
    width: 139px !important;
    height: 20px !important;
    padding: 15px 0px 27px 67px !important;
    float: right;
    line-height: 17px;
    font-weight: normal;
}
.google2:hover {
    text-decoration: none;
}
.opening-time {
    margin: 0 auto !important;
}
.span1 {
    margin-right: 10px !important;
    margin-left: 0 !important;
    width: 119px !important;
}
.appoint {
    width: 100%;
}
.appoint table {
    border: 0px solid #fff;
    margin: 0 auto;
}
.appoint table tr {
    line-height: 30px;
}
.appoint table tr th {
    line-height: 40px;
    padding: 30px;
}
.appoint table tr a {
    color: #fff;
    text-decoration: none;
}
.appoint table tr a:hover {
    color: #ac6ed4;
}
/* .navbar .nav>li.dropdown>a{background: url(../images/dropdown-arrow8976.png?1367228053) center 24px no-repeat !important;} */
.dropdown-menu {
    margin-top: 1px !important;
}
.navbar .nav > li {
    font-size: 16px !important;
}
.alfa {
    height: 70px;
    margin-top: 150px;
}
.faq_header{ margin-top: 150px; }
.new_alfa {
    height: 70px;
    margin-top: 55px;
}
.bita {
    height: 70px;
    margin-top: 80px;
}
.gema {
    height: 70px;
    margin-top: 30px;
}
.mob-view {
    display: none;
}
.mob-view-all {
    display: none;
}
.visible-mobile-new {
    display: none;
}
.mob-menu {
    display: none !important;
}

.mob-visible {
    display: none;
}
.mob-out {
}
@media (min-width: 1200px) {
    .modal-lg, .modal-xl {max-width: 800px !important;}
    .modal-xl {max-width: 1140px !important;}
}

@media (min-width: 992px) {
    .accept-select {display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;}
}

@media (max-width: 980px) {
    .mob-view-all {
        display: block;
    }
    .mob-view {
        display: inline-block;
        margin-top: 13px;
        margin-left: 15px;
    }
    .book-desk {
        display: none !important;
    }
    .book-mob {
        display: block !important;
    }
    .mob-menu {
        display: block !important;
    }
    .book-btn-new {
        margin-left: 0px !important;
        display: block !important;
        text-align: center;
        padding: 5px !important;
    }
    .book-new {
        width: 30%;
        margin-right: 1%;
        margin-left: 1%;
    }
    .visible-mobile-new {
        display: block;
    }
    .span-new {
        margin-left: 0px !important;
    }
    .mob-visible {
        display: block;
    }
    .mob-out {
        display: none;
    }
}
@media (max-width: 979px) {
    .dropdown-menu > li > a {
        font-size: 14px;
    }
}
.book-desk {
}
.book-mob {
    display: none;
}
.book-new {
    display: inline-block;
}
.book-btn-new {
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #9e4dab;
    /* background-image: -moz-linear-gradient(top,#7d5daf,#644891);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#7d5daf),to(#644891));
background-image: -webkit-linear-gradient(top,#7d5daf,#644891);
background-image: -o-linear-gradient(top,#7d5daf,#644891);
background-image: linear-gradient(to bottom,#7d5daf,#644891);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF7D5DAF',endColorstr='#FF644891',GradientType=0);
border-color: #644891 #644891 #412e5e;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
*background-color: #644891;
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); */
    font-size: 13px;
    font-weight: bold;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    padding: 5px 12px;
    display: inline-block;
    margin-left: 180px;
    text-decoration: none;
}
.defau-btn {
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #9e4dab;
    /* background-image: -moz-linear-gradient(top,#7d5daf,#644891);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#7d5daf),to(#644891));
background-image: -webkit-linear-gradient(top,#7d5daf,#644891);
background-image: -o-linear-gradient(top,#7d5daf,#644891);
background-image: linear-gradient(to bottom,#7d5daf,#644891);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF7D5DAF',endColorstr='#FF644891',GradientType=0);
border-color: #644891 #644891 #412e5e;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
*background-color: #644891;
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); */
    font-size: 13px;
    font-weight: bold;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    padding: 5px 12px;
    display: inline-block;
    text-decoration: none;
}
.book-btn-new:hover,
.defau-btn:hover {
    color: #fff;
    text-decoration: none;
    background-color: #f698cb;
}
.sidebar-item.opening-time {
    margin-bottom: 15px !important;
    margin-left: 0px !important;
}

@media (min-width: 320px) and (max-width: 720px) {
    .Tab_new_design {
        float: none;
        width: 100%;
        /* font-size: 25px; */
        padding: 20px 0px 20px;
        font-weight: bold;
    }
    .Tab_mob_design {
        float: left;
        width: 30%;
        margin-right: 1%;
        margin-left: 1%;
        padding: 20px 0px 20px;
        font-weight: bold;
        font-size: 12px;
        line-height: 12px;
    }
    .Tab_mob_design span.g1 {
        display: inline-block;
        text-align: center;
        margin-left: -90px;
        margin-top: 40px;
        font-size: 12px;
        width: 90px;
    }
    .Tab_mob_design span.y1 {
        display: inline-block;
        text-align: center;
        margin-left: -65px;
        margin-top: 34px;
        width: 90px;
        font-size: 12px;
    }
    .Tab_mob_design span.f1 {
        display: inline-block;
        text-align: center;
        margin-left: -70px;
        margin-top: 17px;
        width: 90px;
        font-size: 12px;
    }
    .appoint table tr th {
        padding: 0px;
    }
    .span1 {
        display: inline-block;
    }
    .navbar-fixed-top,
    .navbar-fixed-bottom {
        position: inherit;
    }
    .online_member {
        width: 76px;
    }
    .fullwidthbanner-container {
        max-height: 200px !important;
    }
    .navbar {
        margin-bottom: 0px;
    }
    body {
        padding-left: 0;
        padding-right: 0;
    }
    .Page-Size {
        width: 90%;
    }
    .container {
        width: 90%;
    }
    .mob-nav {
        padding-left: 0px;
        padding-right: 0px;
    }
    .alfa,
    .gema {
        /*height: 45px !important;*/
        margin-top: 100px !important;
    }
    .bita {
        /*height: 45px !important;*/
        margin-top: 10px !important;
    }
    .mob-visible {
        display: block;
    }
    .mob-out {
        display: none;
    }
    .yelp2 {
        padding-bottom: 19px !important;
    }
    .Counter {
        width: 93px;
    }
    .yelp2 {
        background: url(../images/yelp-mob.png) no-repeat left top !important;
        text-align: center !important;
        /* font-size: 14px !important; */
        color: #fff !important;
        width: 50px !important;
        height: 50px !important;
        /* padding: 40px 10px 2px 55px !important; */
        float: left;
        line-height: 16px;
        font-weight: normal;
    }
    .yelp2 {
        text-decoration: none;
    }
    .facebook2 {
        background: url(../images/facebook-mob.png) no-repeat left top !important;
        text-align: center !important;
        /* font-size: 14px !important; */
        color: #fff !important;
        width: 50px !important;
        height: 50px !important;
        /* padding: 40px 10px 2px 55px !important; */
        float: left;
        line-height: 16px;
        font-weight: normal;
    }
    .facebook2:hover {
        text-decoration: none;
    }
    .google2 {
        background: url(../images/google-mob.png) no-repeat left top !important;
        text-align: center !important;
        /* font-size: 15px !important; */
        color: #5d5d5d !important;
        width: 50px !important;
        height: 50px !important;
        /* padding: 15px 0px 27px 67px !important; */
        float: left;
        line-height: 17px;
        font-weight: normal;
    }
    .google2:hover {
        text-decoration: none;
    }
    .new_alfa {
        display: none;
    }
}
@media (max-width: 767px) {
    input[class*="span"] {
        display: inline-block;
    }
    .font-35 {
        font-size: 25px !important;
    }
    .navbar-fixed-top,
    .foot,
    footer,
    .fullwidthbanner-container {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    .Tables {
        overflow-x: auto;
    }
    .breadcrumbs-container {
        margin-left: 0;
        margin-right: 0;
    }
    .online_member {
        margin-left: 0;
    }
    .label-text {
        display: block !important;
    }
    select[class*="span"] {
        display: inline-block;
    }
    input[class*="span"] {
        width: 95%;
    }
    .new-book-not-mobile {
        display: none;
    }
    .new_margin_book_page {
        margin-bottom: 0px !important;
        margin-top: 10px;
    }
    .span9 .app-box .Page-Size {
        display: block;
    }
    /*.thank1 .Page-Size {margin: 0 auto;}*/
    .thank1 {
        background: transparent;
    }
    .thank1 .Tab_new_design {
        width: 100%;
        padding-top: 0;
    }

    .mob-visible {
        display: block;
    }
    .mob-out {
        display: none;
    }
    .m-none {display: none !important;}
}
/*
Max width before this PARTICULAR table gets nasty. This query will take effect for any screen smaller than 760px and also iPads specifically.
*/
@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    .day_mobile{display: block;}
    /* Force table to not be like tables anymore */
    #tab1 table,
    #tab1 thead,
    #tab1 tbody,
    #tab1 th,
    #tab1 td,
    #tab1 tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #tab1 thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #tab1 tr {
        margin: 0 0 0rem 0;
    }
    #tab1 tr:nth-child(odd) {
        background: #ccc;
    }
    #tab1 tr:nth-child(even) {
        background: #fff;
    }
    #tab1 td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        /*padding-left: 50% !important;*/
    }
    #tab1 td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 0;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }
    /*
Label the data
You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
*/
    /*#tab1 td:nth-of-type(1):before {
        content: "Tech";
        font-weight: bold;
    }
    #tab1 td:nth-of-type(2):before {
        content: "Mon";
        font-weight: bold;
    }
    #tab1 td:nth-of-type(3):before {
        content: "Tue";
        font-weight: bold;
    }
    #tab1 td:nth-of-type(4):before {
        content: "Wed";
        font-weight: bold;
    }
    #tab1 td:nth-of-type(5):before {
        content: "Thurs";
        font-weight: bold;
    }
    #tab1 td:nth-of-type(6):before {
        content: "Fri";
        font-weight: bold;
    }
    #tab1 td:nth-of-type(7):before {
        content: "Sat";
        font-weight: bold;
    }
    #tab1 td:nth-of-type(8):before {
        content: "Sun";
        font-weight: bold;
    }*/
    .table tbody td:nth-of-type(even),
    .table tbody td {
        background-color: inherit;
    }
    .span1 {
        width: 80px !important;
    }
    /* Force table to not be like tables anymore */
    #tab2 table,
    #tab2 thead,
    #tab2 tbody,
    #tab2 th,
    #tab2 td,
    #tab2 tr {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    #tab2 thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    #tab2 tr {
        margin: 0 0 0rem 0;
    }
    #tab2 tr:nth-child(odd) {
        background: #fff;
        margin-bottom: 10px;
    }
    #tab2 tr:nth-child(even) {
        background: #ccc;
        margin-bottom: 10px;
    }
    #tab2 td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 70% !important;
        text-align: left;
    }
    #tab2 td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 0;
        left: 0px;
        width: 60%;
        /* padding-right: 10px; */
        line-height: 30px;
        white-space: nowrap;
        padding-right: 0px;
        padding-left: 12px;
    }
    /*
Label the data
You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
*/
    #tab2 td:nth-of-type(1):before {
        content: "Technician";
        font-weight: bold;
        background: #ac6ed4;
        color: #fff;
    }
    #tab2 td:nth-of-type(2):before {
        content: "Rated";
        font-weight: bold;
        background: #ac6ed4;
        color: #fff;
    }
    #tab2 td:nth-of-type(3):before {
        content: "No. of Appointments";
        font-weight: bold;
        background: #ac6ed4;
        color: #fff;
    }
    #tab2 td:nth-of-type(4):before {
        content: "Tech Ratings";
        font-weight: bold;
        background: #ac6ed4;
        color: #fff;
    }
    #tab2 td:nth-of-type(5):before {
        content: "Customer Service";
        font-weight: bold;
        background: #ac6ed4;
        color: #fff;
    }
    #tab2 td:nth-of-type(6):before {
        content: "Yelp Tech Ratings";
        font-weight: bold;
        background: #ac6ed4;
        color: #fff;
    }
    #tab2 td:nth-of-type(7):before {
        content: "Yelp Customer Service";
        font-weight: bold;
        background: #ac6ed4;
        color: #fff;
    }
    .table tbody td:nth-of-type(even),
    .table tbody td {
        background-color: inherit;
    }
    .span1 {
        width: 80px !important;
    }
    #tab2 .title {
        display: none;
    }
}
/*29-11-2018*/
.span-new {
    margin-left: 30px;
}
.ml-0 {
    margin-left: 0px;
}
.calen {
    text-align: center;
}
.calen td,
.calen th {
    width: 50%;
    padding: 10px;
}
.calen th {
    font-size: 15px;
}
.avail {
    list-style: none;
}
.avail li {
    font-size: 16px;
    line-height: 25px !important;
    font-weight: normal !important;
}
.avail li span {
    font-weight: bold !important;
}
/*Datepicker*/
.ui-datepicker td span,
.ui-datepicker td a {
    text-align: center !important;
}
.ui-datepicker table {
    font-size: 14px !important;
}
.ui-datepicker td span,
.ui-datepicker td a {
    padding: 0.4em !important;
}
.ui-datepicker {
    width: 20em !important;
}
.bb-grey {
    border-bottom: 10px solid #222;
}
.foot {
    margin-top: 0 !important;
    padding-left: 15px;
    padding-right: 15px;
}
@media (max-width: 979px) {
    .fullwidthbanner-container {
        margin-left: 0px;
        margin-right: 0px;
    }

    .mob-visible {
        display: block;
    }
    .mob-out {
        display: none;
    }
}

.Msg,
.btn-theme,
.Tables tr.title td {
    background: #9e4dab !important;
}
.Msg{background-color: #805fb3 !important;}
.navbar .nav > li.active > a {
    border-bottom: 6px solid #9e4dab !important;
}
.opening-time .week-day.today dt,
.navbar .nav > li.active > a:hover,
.foot .nav a:hover,
.foot a.read-more {
    color: #9e4dab !important;
}
.Tables td {
    border: 1px solid #9e4dab !important;
}
.navbar-inverse .btn-navbar {
    background: #9e4dab !important;
}
/*New Col*/
.col-50 {
    width: 48%;
    float: left;
    padding: 1%;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .mob-visible .Page-Size {display: flex;align-items: center;justify-content: center;}
}


@media (max-width: 767px) {
    .col-50 {
        width: 100%;
        float: none;
        margin-right: 0px;
    }
}
.sub-container-sm-1 {
    padding-left: 8px;
    padding-right: 8px;
}
.grouped-services .service-card:nth-of-type(-n + 2) .info-card-inner {
    border-top: 0;
}
.info-card-inner {
    /* border-top: 1px solid #CCD1D9; */
    padding-top: 20px;
    padding-bottom: 20px;
}
.sub-container-sm-0 {
    /* padding-left: 0;
padding-right: 0; */
    padding: 20px;
    background: #fff;
}
.info-card-top-left {
    overflow: hidden;
}
.info-card-name {
    font-size: 16px;
    margin-bottom: 10px;
    display: block;
    font-weight: 600;
}
.info-card-dur-price {
    color: #838b91;
    margin-bottom: 10px;
}
.info-card-duration {
    float: left;
}
.info-card-price {
    float: left;
    margin-left: 10px;
}
.info-card-price:before {
    content: "\00b7";
    margin-right: 10px;
}
#custom-colors .custom-color-border-color:active {
    border-color: #5b5c5e;
    border-color: var(--theme-color);
}
.custom-color-bg {
    background-color: #5b5c5e;
    background-color: var(--theme-color);
}
.info-card-btn {
    float: right;
    margin-bottom: 16px;
    margin-left: 16px;
    min-width: 68px;
}
.info-card-description {
    margin-top: 1px;
    margin-bottom: 13px;
}
.info-card-description {
    line-height: 1.43;
}
/*Employe Card*/
.select-staff-component .employee-card.employee-card-static {
    clear: none;
}
.select-staff-component.ember-view .info-card-inner .letters .msg-icon {
    margin-top: 1rem !important;
    display: inline-block;
}
#technician .info-card-inner .letters .msg-icon img {
    max-width: 80px;
}
#technician .info-card-inner {
    display: flex;
    justify-content: space-between;
}
#technician .info-card-inner .letters {
    display: inline-block;
    width: 120px;
}
#technician .info-card-top i {
    font-size: 18px;
}
.info-card-top-left .check-item i {
    font-size: 16px;
}
.employee-card .employee-picture {
    height: 80px;
    width: 80px;
    margin-right: 16px;
}
.employee-picture-first-initial-wrap,
.employee-picture-static {
    border-color: #434a54;
    border-width: 2px;
}
.employee-picture {
    border: 1px solid #9b9b9b;
    border-radius: 50%;
    float: left;
    text-align: center;
}
.employee-card-text-content,
.employee-picture,
.order-item,
.order-item-appointment-info,
.order-item-left-content,
.selected-service-card-dur-price,
.selected-service-card-staff-right {
    overflow: hidden;
}
.employee-picture-static [class^="lnr-"] {
    font-size: 40px;
}
.employee-picture-static [class^="lnr-"] {
    display: inline-block;
    font-size: 30px;
    vertical-align: middle;
}
.lnr-woman:before {
    content: "\e727";
}
.employee-card .employee-picture-first-initial {
    font-size: 3.25rem;
    line-height: 80px;
}
.employee-card .info-card-inner {
    min-height: 100px;
}
.select-staff-component .employee-card:nth-of-type(-n + 1) .info-card-inner {
    border-top: 0;
}
/*Timeline Css*/
.time-line ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    /* background-color: #333333; */
}
.time-line ul li {
    float: left;
}
.time-line ul li:first-child a {
    padding-left: 0px;
}
.time-line ul li a {
    display: block;
    color: #333;
    text-align: center;
    padding: 16px;
    font-size: 20px;
    text-decoration: none;
    font-weight: bolder;
}
.time-line ul li a:hover {
    /* background-color: #111111; */
    color: #644891;
    text-decoration: underline;
}
.time-line ul li a {
    display: block;
    background: rgb(255, 126, 0);
    color: white;
    width: 100px;
    min-height: 35px;
    padding: 4px 5% 4px 4px;
    margin-bottom: 10px;
    text-decoration: none;
    text-transform: uppercase;
    /* font-size: 24px; */
    -webkit-clip-path: url(#clipper);
    clip-path: url(#clipper);
}
/*23-01-2019*/
.locations .employee-card:nth-of-type(-n + 1) .info-card-inner {
    border-bottom: 1px solid #dadada;
}
/*28-01-2019 Book Appt*/
.ui-card {
    margin: 0 0 20px;
    position: relative;
}
.ui-card-inner {
    background: #fff;
    border: 1px solid #ccd1d9;
    border-radius: 4px;
}
.ui-card-inner,
.ui-card-stacked {
    box-shadow: 0 1px 3px 0 rgba(34, 36, 40, 0.2);
}
.ui-card-content.vertical-padding-medium {
    padding-top: 12px;
    padding-bottom: 12px;
}
.ui-card-content.horizontal-padding-medium {
    padding-left: 20px;
    padding-right: 20px;
}
.ui-card-content {
    padding: 12px 20px;
}
.ui-title {
    display: block;
    margin-bottom: 3px;
    padding-right: 10px;
}
.your-appointment .ui-separator-list {
    color: #838b91;
    font-size: 0.875rem;
}
.ui-separator-list {
    margin: 0;
    padding: 0;
}
.ui-separator-list-item {
    display: inline-block;
    list-style-type: none;
}
.ui-separator-list-item + .ui-separator-list-item {
    margin-left: 10px;
}
.ui-separator-list-item + .ui-separator-list-item:before {
    content: "\00b7";
    margin-right: 10px;
}
.ui-card-content + .ui-card-content {
    border-width: 1px 0 0;
    border-style: solid;
    border-color: #ccd1d9;
}
.media-object {
    overflow: hidden;
}
.media-object,
.thumbnail {
    display: block;
}
.media-object-float {
    float: left;
}
.ui-name-tag .employee-tag-label {
    display: block;
    font-size: 0.875rem;
    font-weight: 400;
}
#custom-colors a.custom-color-text:not(.category-link):not(.modal-close-x-text):not(.back-link):not(.disable-custom-border-bottom),
#custom-colors a.lt-line-clamp__less,
#custom-colors a.lt-line-clamp__more {
    border-bottom: 1px solid #5b5c5e;
    border-bottom: 1px solid var(--theme-color);
    text-decoration: none;
    line-height: 1.43;
}
#custom-colors .custom-color-text,
#custom-colors .custom-color-text:active,
#custom-colors .custom-color-text:hover,
#custom-colors .custom-color-text:visited {
    color: #5b5c5e;
    color: var(--theme-color);
}
.ui-name-tag .employee-tag-change {
    display: inline-block;
}
/*09-02-2019*/
.btn-success,
.btn-info,
.btn-warning,
.btn-danger {
    background-color: #9e4dab !important;
    border-color: #9e4dab !important;
}
.btn-grey {
    background-color: grey !important;
    border-color: grey !important;
    color: #fff !important;
    text-shadow: none;
}
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input,
input.span3 {
    height: 40px !important;
}
/*1-08-2019*/
.ml-15 {
    margin-left: 15px;
}
.post-box {
    background: #ffffff;
    border-radius: 4px 4px 4px 4px;
    border: 1px solid #dadada;
    color: #333333;
    font-size: 14px;
    line-height: 1.5em;
    min-height: 50px;
    text-align: left;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    display: block;
    margin-bottom: 15px;
    padding: 5px;
}
.post-box img {
    display: inline-block;
}
.post-content {
    padding: 10px 5px 0px;
    margin-bottom: 0px;
}
.post-content h2 {
    font-size: 22px;
    font-weight: bold;
}
.post-content h3 {
    font-size: 18px;
    color: #93a1b0;
    text-align: left;
    display: inline-block;
}
.post-content p {
    font-size: 14px;
    font-weight: normal;
}
.post-content_a {
    color: #fff;
    background: #9e4dab;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
    padding: 8px 15px;
    float: right;
}
.purple-bg {
    background: #9e4dab;
    color: #ffffff !important;
    margin-bottom: 15px;
}
.post-content-left {
    text-align: left;
    padding: 10px 15px;
}
.post-content-left p {
    font-size: 14px;
    font-weight: 400 !important;
    /*font-family: "Open Sans", sans-serif !important;*/
}
.post-content-left a {
    font-size: 16px !important;
}
.post-content-left h2,
.post-content-left p,
.post-content-left a {
    color: #ffffff !important;
}
.post-end {
    text-align: left;
}
.post-end p {
    font-size: 16px;
}
.post-end img {
    text-align: center;
}
.chanel_title {
    color: #000;
}
/* ----------
Responsive 
--------------- */
@media only screen and (max-width: 640px) {
    .select-staff-component .employee-card.employee-card-static {
        margin-bottom: 20px;
    }
    .accept-select select {width: 100%;}
    .send_btn {text-align: center;}
}

@media (max-width: 520px) {
    .main-content {
        padding-top: 0px;
    }
    .alfa {
        display: none;
    }
}

/* ======= 1/09/20 ======= */
/*.sepret-line {position: relative;}
.sepret-line::before {
    content: "";
    background-image: url("../images/line.png");
    background-repeat: repeat-x;
    background-size: 20px;
    display: block;
    width: 100%;
    height: 10px;
    color: #ccc;
    font-size: 14px;
}*/
.msg-box hr.thick {
    border: 0;
    height: 3px;
    margin: 1.2rem 0;
    background-image: linear-gradient(90deg,#ff8a00,#e52e71);
    border-radius: 5px;
}
.accept-select label, .accept-select select {font-size: 16px;}
.accept-select select:focus {border-color: transparent;}
.accept-select .span-new {margin-bottom: 20px;}
.heading-text blockquote {
    margin-bottom: 30px;
    padding: 10px 20px;
    position: relative;
    background: #f4ebd3;
    border-radius: 10px;
}
.heading-text blockquote:after {background: none;background-color: transparent;}
/*------ btn -------*/
.accept-button {
    border-radius: 4px;
    background-color: #9e4dab;
    border: none;
    color: #ffffff;
    text-align: center;
    font-size: 18px;
    transition: all 0.5s;
    cursor: pointer;
    margin: 5px;
    height: auto;
}
.accept-button span {
    cursor: pointer;
    display: inline-block;
    position: relative;
    transition: 0.5s;
}
.accept-button span:after {
    content: "\00bb";
    position: absolute;
    opacity: 0;
    top: 0;
    right: -20px;
    transition: 0.5s;
}
.accept-button:hover span {padding-right: 25px;}
.accept-button:hover span:after {opacity: 1;right: 0;}
/*------ # btn -------*/

/* ==============accept1.php new select style  ========== */
.select-css {
    display: block;
    font-weight: 600;
    color: #444;
    line-height: 1.3;
    padding: 0.6em 1.4em 0.5em 0.8em;
    box-sizing: border-box;
    border: 1px solid #aaa;
    box-shadow: 0 1px 0 1px rgba(0, 0, 0, 0.04);
    border-radius: 0.5em;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    height: auto !important;
    /* note: bg image below uses 2 urls. The first is an svg data uri for the arrow icon, and the second is the gradient. 
        for the icon, if you want to change the color, be sure to use `%23` instead of `#`, since it's a url. You can also swap in a different svg icon or an external image reference
        
    */
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"),
        linear-gradient(to bottom, #ffffff 0%, #e5e5e5 100%);
    background-repeat: no-repeat, repeat;
    /* arrow icon position (1em from the right, 50% vertical) , then gradient position*/
    background-position: right 0.7em top 50%, 0 0;
    /* icon size, then gradient */
    background-size: 0.65em auto, 100%;
}
/* Hide arrow icon in IE browsers */
.select-css::-ms-expand {
    display: none;
}
/* Hover style */
.select-css:hover {
    border-color: #888;
}
/* Focus style */
.select-css:focus {
    border-color: #aaa;
    /* It'd be nice to use -webkit-focus-ring-color here but it doesn't work on box-shadow */
    box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.7);
    box-shadow: 0 0 0 3px -moz-mac-focusring;
    color: #222;
    outline: none;
}

/* Set options to normal weight */
.select-css option {
    font-weight: normal;
}
.list_box{
    background-image: none;
}
.list_box option {
    padding: 5px;
}

/* Support for rtl text, explicit support for Arabic and Hebrew */
*[dir="rtl"] .select-css,
:root:lang(ar) .select-css,
:root:lang(iw) .select-css {
    background-position: left 0.7em top 50%, 0 0;
    padding: 0.6em 0.8em 0.5em 1.4em;
}

/* Disabled styles */
.select-css:disabled,
.select-css[aria-disabled="true"] {
    color: graytext;
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22graytext%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"),
        linear-gradient(to bottom, #ffffff 0%, #e5e5e5 100%);
}

.select-css:disabled:hover,
.select-css[aria-disabled="true"] {
    border-color: #aaa;
}
.navbar-fixed-top, .navbar-fixed-bottom{
  position: fixed;
}
.fran_opp{
  text-align: center;
  color: #fff;
  vertical-align: middle;
  background: rgba(0, 0, 0, 1) url("") no-repeat scroll 0 0;
  margin-bottom: 5px;
  padding: 10px;
  font-size: 22px;
  font-weight: bold;
}

.fran_opp a{
  color: #7355a3;
}
.online_member{
  width: 110px;
}
.taglinelogo{
   font-size: 24px !important;
}
.new_visitors{
  width: 62%;
  padding-top: 20px;
}
.navbar .nav > li.active > a{
  padding: 5px 10px 8px;
}
.navbar .nav > li > a{
   padding: 5px 10px;
}
.navbar-inner{
background: rgba(0, 0, 0, 1) url("") no-repeat scroll 0 0;
}
.Web-Size_new_design{
  background: rgba(0, 0, 0, 1) url("") no-repeat scroll 0 0;
  color: #fff; 
  text-align: center;
  vertical-align: middle;
  margin-bottom: 10px;
  padding: 50px 0;
}

.Tab_new_design {
  float: left;
  width: 33.33%;
  /* font-size: 25px; */
  padding: 50px 0px;  
  font-weight: bold;
}
.fourbyfour .Tab_new_design {width: 25%;}
/*======= ========*/

/*======= ========*/
/*----- iphone slider --------*/    
.mobile-frem {background: url("../images/iphone.png");background-repeat: no-repeat;background-size: 100%;}
.iphone-img {padding: 15px;background: #fff; margin: 20px;}
.mobile-frem .container {
    border: 1px solid #dedede;
    background-color: #f1f1f1;
    border-radius: 5px;
    padding: 10px;
    margin: 0;
    width: 100%;
}
.mobile-frem .darker {
    border-color: #ccc;
    background-color: #ddd;
}
.mobile-frem .container::after {
    content: "";
    clear: both;
    display: table;
}
.mobile-frem .container img {
    float: left;
    max-width: 40px;
    width: 100%;
    margin-right: 15px;
    border-radius: 50%;
}
.mobile-frem .container p {font-size: 14px !important;line-height: normal;font-weight: 500;margin: 0;word-break: break-all;}
.mobile-frem .container img.right {
    float: right;
    margin-left: 20px;
    margin-right: 0;
}
.mobile-frem .time-right {
    float: right;
    color: #aaa;
}
.mobile-frem .time-left {
    float: left;
    color: #999;
}
#example {height: 100% !important;}
#example ul {margin-left: 0;}
.mobile-frem .About-Tabs {width:100%; float:left; margin: 40px 0 0 0;}
.mobile-frem .About-Tab {width: 100%; background:#fff; text-align:left; height: 424px;}
.mobile-frem .About-Tab h3 {font-size:18px; color:#333; font-weight:600; background:#eee; padding:9px 0; border-bottom:2px solid #009cff;}
/*.About-Tab h3 img{background:url(../images/about-sprite.png) no-repeat; width:42px; height:40px; margin-right:20px; float:left;}*/
.mobile-frem .About-Tab h3 span {display:inline-block; padding-top:9px; text-transform:uppercase;}
.mobile-frem .About-Tab a {color:#333;}
.mobile-frem .About-Tab a:hover {text-decoration:none;}
.mobile-frem .jcarousel-wrapper {padding:0 10px;}

.mobile-frem .Slider-Image {width:100%; float:left; margin:20px 0;}

.mobile-frem .News-Wrapper {margin:10px; }
.mobile-frem .About-Tab li {padding: 5px 0 !important;display: flex;}
.mobile-frem .News-Wrapper span {font-size:12px; color:#666666;font-style:italic; padding:0;}
.mobile-frem .News-Wrapper p {font-size:13px !important; padding:0px 10px 0px 10px !important;}

.mobile-frem .About-Tab h3 img.tab1 {background-position:0 0;}
.mobile-frem .About-Tab h3 img.tab2 {background-position:-43px 0;}
.mobile-frem .About-Tab h3 img.tab3 {background-position:-86px 0;}

/*----- # iphone slider --------*/
.Tab_new_social{
  float: left;
  width: 30%;
  margin-right:1%; margin-left:1%;
  /* font-size: 25px; */
  padding: 50px 0px; 
  font-weight: bold;
}

.new_google{
  padding: 20px;
  color: #000;
  background: #08fb01;
}
.new_yelp{
  padding: 20px 50px;
  background: #990100;
}
.new_facebook{
  padding: 20px;
  background-color: #4886eb;
  color: #000;
}
.opening-time{
  margin: 10px;
  width: 215px !important;
  padding-top: 47px !important;
}
.Tab_new_2{
  float: left;
  /* font-size: 15px; */
  padding: 25px 0;
  width: 32%;
  margin: 0px 5px;
}
.Tab_new_2 a{
   color: #000;
    display: block;
    padding: 5px;
    /* font-weight: bold; */
}

.font-35{ font-size:28px !important;}
.font-25{ font-size:25px !important;}
.font-16{ font-size:16px !important;}
.ptb-20{ padding-top:20px; padding-bottom:20px;}
.ptb-30{ padding-top:30px; padding-bottom:30px;}
.ptb-50{ padding-top:50px; padding-bottom:50px;}

.slider-title { top:450px !important;}
.Counter { float:none !important; display:inline-block !important; border-radius:8px!important; border:1px solid #fff!important; background:#fff!important; padding:0!important}

.yelp2{ padding-bottom:19px !important;}
.facebook2 {
    background: url(../images/facebook-review.png) no-repeat left top !important;
    text-align: center !important;
    font-size: 14px !important;
    color: #fff !important;
    width: 139px !important;
    height: 20px !important;
    padding: 40px 10px 2px 55px !important;
    float: right;
    line-height: 16px;
    font-weight: normal;
}
.facebook2:hover{
  text-decoration: none;
}
.google2 {
    background: url(../images/google-review.png) no-repeat left top !important;
    text-align: center !important;
    font-size: 15px !important;
    color: #5d5d5d !important;
    width: 139px !important;
    height: 20px !important;
    padding: 15px 0px 27px 67px !important;
    float: right;
    line-height: 17px;
    font-weight: normal;
}
.google2:hover{
  text-decoration: none;
}

.opening-time{ margin:0 auto !important;}

.span1{ margin-right:10px !important; margin-left:0 !important; width:119px !important;}

.appoint{ width:100%;}
.appoint table{ border:1px solid #fff !important; margin:0 auto !important; border-collapse: inherit!important;}
.appoint table tr{ line-height:30px;}
.appoint table tr th{ line-height:40px; padding:30px;}
.appoint table tr a{ color:#fff; text-decoration:none;}
.appoint table tr a:hover{color:#ac6ed4;}


.navbar .nav>li.dropdown>a{background: url(../images/dropdown-arrow8976.png?1367228053) center 24px no-repeat !important;}
.dropdown-menu{ margin-top:1px !important;}
.navbar .nav>li{font-size:16px!important;}
.alfa{ height:70px; margin-top:150px}
.bita{height:70px; margin-top:80px;}
.gema{ height:70px; margin-top:30px}

.mob-view{display:none;}

.mob-view-all{display:none;}

.visible-mobile-new{display:none}

.mob-menu{ display:none !important;}

@media (max-width:980px){
 .mob-view-all{display:block;} 
.mob-view{display: inline-block; margin-top: 13px; margin-left: 15px;} 
.book-desk{ display:none !important;} 
.book-mob{display:block !important;}
.mob-menu{ display:block !important}
.book-btn-new{ margin-left:0px !important; display:block !important; text-align:center; padding:5px !important;}
.book-new{ width:30%; margin-right:1%; margin-left:1%;}

.visible-mobile-new{display:block}
.span-new{ margin-left:0px !important;}


 }
 
 @media (max-width: 979px){
.dropdown-menu>li>a {
    font-size: 14px;
}

 }
 
 
.book-desk{}
.book-mob{ display:none}
.book-new{ display:inline-block;}
.book-btn-new{
    
    text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
    background-color: #7355a3;
    background-image: -moz-linear-gradient(top,#7d5daf,#644891);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#7d5daf),to(#644891));
    background-image: -webkit-linear-gradient(top,#7d5daf,#644891);
    background-image: -o-linear-gradient(top,#7d5daf,#644891);
    background-image: linear-gradient(to bottom,#7d5daf,#644891);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF7D5DAF',endColorstr='#FF644891',GradientType=0);
    border-color: #644891 #644891 #412e5e;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
    *background-color: #644891;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    font-size: 13px;
    font-weight: bold;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color:#fff;
    padding:5px 12px;
    display:inline-block;
    margin-left:180px;
    text-decoration:none;
    
}

.defau-btn{
    
    text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
    background-color: #7355a3;
    background-image: -moz-linear-gradient(top,#7d5daf,#644891);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#7d5daf),to(#644891));
    background-image: -webkit-linear-gradient(top,#7d5daf,#644891);
    background-image: -o-linear-gradient(top,#7d5daf,#644891);
    background-image: linear-gradient(to bottom,#7d5daf,#644891);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF7D5DAF',endColorstr='#FF644891',GradientType=0);
    border-color: #644891 #644891 #412e5e;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
    *background-color: #644891;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    font-size: 13px;
    font-weight: bold;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color:#fff;
    padding:5px 12px;
    display:inline-block;
    text-decoration:none;
    
}


.book-btn-new:hover, .defau-btn:hover{ color:#fff; text-decoration:none; background-color: #644891;}
.sidebar-item.opening-time{ margin-bottom:15px !important; margin-left:0px !important;}

/*.mob-visible{display:none;}
.mob-out{}*/


@media (min-width:320px) and (max-width:600px){


    
.Tab_new_design{
  float: none;
  width: 100%;
  /* font-size: 25px; */
  padding: 20px 0px 20px    ; 
  font-weight: bold;
}
.Tab_mob_design{
  float: left;
  width: 30%;
  margin-right:1%; margin-left:1%;
   
   padding: 20px 0px 20px;
  font-weight: bold;
  font-size:12px;
  line-height:12px;
  
    
}

.Tab_mob_design span.g1{display: inline-block;
    text-align: center;
    margin-left: -90px;
    margin-top: 40px;
    font-size: 12px;
    width: 90px;
    }
    
.Tab_mob_design span.y1{display: inline-block;
    text-align: center;
    margin-left: -65px;
    margin-top: 34px;
    width: 90px;
    font-size: 12px;
    }
    
.Tab_mob_design span.f1{display: inline-block;
    text-align: center;
    margin-left: -70px;
    margin-top: 17px;
    width: 90px;
    font-size: 12px;
    }

.appoint table tr th{padding:0px;}
.span1{ display:inline-block;}

.navbar-fixed-top, .navbar-fixed-bottom{ position:inherit;}
.online_member { width: 76px;}

.fullwidthbanner-container{max-height: 200px !important;}
.navbar{ margin-bottom:0px;}

body{ padding-left:0; padding-right:0;}
.Page-Size {
    width: 90%;
}
.container {
    width: 90%;
}

.mob-nav{padding-left: 0px;padding-right: 0px;}

.alfa, .gema{ margin-top: 10px !important;}
.bita{margin-top: 10px !important;}
.faq_header{ margin-top: 0px; }
.mob-visible{display:block}
.mob-out{ display:none;}

.yelp2{ padding-bottom:19px !important;}

.Counter{ width:93px;}

.yelp2 {
    background: url(../images/yelp-mob.png) no-repeat left top !important;
    text-align: center !important;
    /* font-size: 14px !important; */
    color: #fff !important;
    width: 50px !important;
    height: 50px !important;
    /* padding: 40px 10px 2px 55px !important; */
    float: left;
    line-height: 16px;
    font-weight: normal;
}
.yelp2{ text-decoration:none;}

.facebook2 {
    background: url(../images/facebook-mob.png) no-repeat left top !important;
    text-align: center !important;
    /* font-size: 14px !important; */
    color: #fff !important;
    width: 50px !important;
    height: 50px !important;
    /* padding: 40px 10px 2px 55px !important; */
    float: left;
    line-height: 16px;
    font-weight: normal;
}
.facebook2:hover{
  text-decoration: none;
}
.google2 {
    background: url(../images/google-mob.png) no-repeat left top !important;
    text-align: center !important;
    /* font-size: 15px !important; */
    color: #5d5d5d !important;
    width: 50px !important;
    height: 50px !important;
    /* padding: 15px 0px 27px 67px !important; */
    float: left;
    line-height: 17px;
    font-weight: normal;
}
.google2:hover{
  text-decoration: none;
}



    
}




@media (max-width:767px){
    input[class*="span"]{ display:inline-block;}

    .font-35{ font-size:25px !important;}

    .navbar-fixed-top, .foot, footer, .fullwidthbanner-container{ margin-left:0px !important; margin-right:0px !important;  }

    .Tables{overflow-x:auto}
    .breadcrumbs-container{ margin-left:0; margin-right:0;}
    .online_member {margin-left:0;}

    .label-text{ display:block !important;}
    select[class*="span"]{ display:inline-block}
    input[class*="span"]{ width:95%;}

    .black-bg .span3 hr {border: 1px dotted #fff;}
    .black-bg .span3 {border: 1px solid #fff;margin: 2rem 0;}
}




/*
    Max width before this PARTICULAR table gets nasty. This query will take effect for any screen smaller than 760px and also iPads specifically.
    */
    @media
      only screen 
    and (max-width: 760px), (min-device-width: 768px) 
    and (max-device-width: 1024px)  {

        /* Force table to not be like tables anymore */
    #tab1 table, #tab1 thead, #tab1 tbody, #tab1 th, #tab1 td, #tab1 tr {
            display: block;
        }

        /* Hide table headers (but not display: none;, for accessibility) */
    #tab1 thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }

    #tab1 tr {
      margin: 0 0 0rem 0;
    }
      
    #tab1 tr:nth-child(odd) {
      background: #ccc;
    }
    #tab1 tr:nth-child(even) {
      background: #fff;
    }
    
    #tab1 td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #eee;
            position: relative;
            /*padding-left: 50% !important;*/
        }

    #tab1 td:before {
            /* Now like a table header */
            position: absolute;
            /* Top/left values mimic padding */
            top: 0;
            left: 6px;
            width: 45%;
            padding-right: 10px;
            white-space: nowrap;
        }

        /*
        Label the data
    You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
        */
    /*#tab1 td:nth-of-type(1):before { content: "Tech"; font-weight:bold; }
    #tab1 td:nth-of-type(2):before { content: "Mon"; font-weight:bold; }
    #tab1 td:nth-of-type(3):before { content: "Tue"; font-weight:bold; }
    #tab1 td:nth-of-type(4):before { content: "Wed"; font-weight:bold; }
    #tab1 td:nth-of-type(5):before { content: "Thurs"; font-weight:bold; }
    #tab1 td:nth-of-type(6):before { content: "Fri"; font-weight:bold; }
    #tab1 td:nth-of-type(7):before { content: "Sat"; font-weight:bold; }
    #tab1 td:nth-of-type(8):before { content: "Sun"; font-weight:bold; }*/
        
        
        
        .table tbody td:nth-of-type(even), .table tbody td{ background-color:inherit;}
        
        .span1{ width: 80px !important;}
        
        
    /* Force table to not be like tables anymore */
    #tab2 table, #tab2 thead, #tab2 tbody, #tab2 th, #tab2 td, #tab2 tr {
            display: block;
        }

        /* Hide table headers (but not display: none;, for accessibility) */
    #tab2 thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }

    #tab2 tr {
      margin: 0 0 0rem 0;
    }
      
    #tab2 tr:nth-child(odd) {
      background: #fff;
      margin-bottom:10px;
    }
    #tab2 tr:nth-child(even) {
      background: #ccc;
      margin-bottom:10px;
    }
    
    #tab2 td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #eee;
            position: relative;
            padding-left: 70% !important;
            text-align:left;
        }

    #tab2 td:before {
            /* Now like a table header */
            position: absolute;
            /* Top/left values mimic padding */
            top: 0;
            left: 0px;
            width: 60%;
            /* padding-right: 10px; */
            line-height: 30px;
            white-space: nowrap;
            padding-right: 0px;
            padding-left: 12px;
        }

        /*
        Label the data
    You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
        */
    #tab2 td:nth-of-type(1):before { content: "Technician"; font-weight:bold; background: #ac6ed4; color:#fff}
    #tab2 td:nth-of-type(2):before { content: "Rated"; font-weight:bold; background: #ac6ed4; color:#fff}
    #tab2 td:nth-of-type(3):before { content: "No. of Appointments"; font-weight:bold; background: #ac6ed4; color:#fff}
    #tab2 td:nth-of-type(4):before { content: "Tech Ratings"; font-weight:bold; background: #ac6ed4; color:#fff}
    #tab2 td:nth-of-type(5):before { content: "Customer Service"; font-weight:bold; background: #ac6ed4; color:#fff}
    #tab2 td:nth-of-type(6):before { content: "Yelp Tech Ratings"; font-weight:bold; background: #ac6ed4; color:#fff}
    #tab2 td:nth-of-type(7):before { content: "Yelp Customer Service"; font-weight:bold; background: #ac6ed4; color:#fff}
        
        
        
        .table tbody td:nth-of-type(even), .table tbody td{ background-color:inherit;}
        
        .span1{ width: 80px !important;}
        #tab2 .title{ display:none;}
        
        
        
    }   
    
    
/*29-11-2018*/
.span-new{ margin-left:30px;}
.ml-0{ margin-left:0px} 
.calen{ text-align:center;}
.calen td, .calen th{width:50%; padding:10px;}  
.calen th{ font-size:15px;}

.avail{ list-style:none;}
.avail li{ font-size:16px; line-height:25px !important; font-weight:normal !important;}
.avail li span{ font-weight: bold !important;}


/*Datepicker*/
.ui-datepicker td span, .ui-datepicker td a { text-align:center !important;}
.ui-datepicker table{ font-size:14px !important;}
.ui-datepicker td span, .ui-datepicker td a{ padding:0.4em !important;}
.ui-datepicker{ width:20em !important;}



/*8-01-2019 Onload Popup CSS*/

[role="button"] {
  cursor: pointer;
}
.modal-open {
  overflow: hidden;
}
.modal {
  display: none;
  overflow: scroll;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  -webkit-overflow-scrolling: touch;
  outline: 0;
}
.modal.fade .modal-dialog {
  -webkit-transform: translate(0, -25%);
  -ms-transform: translate(0, -25%);
  -o-transform: translate(0, -25%);
  transform: translate(0, -25%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
}
.modal.in .modal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
}
.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}
.modal-dialog {
  position: relative;
  width: auto;
  margin: 10px;
}
.modal-content {
  position: relative;
  background-color: #ffffff;
  border: 1px solid #999999;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  outline: 0;
}
.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000000;
}
.modal-backdrop.fade {
  opacity: 0;
  filter: alpha(opacity=0);
}
.modal-backdrop.in {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
.modal-header {
  padding: 15px;
  border-bottom: 1px solid #e5e5e5;
  min-height: 16.42857143px;
}
.modal-header .close {
  margin-top: -2px;
}
.modal-title {
  margin: 0;
  line-height: 1.42857143;
  font-size: 18px;
  display: inline-block;
}
.modal-body {
  position: relative;
  padding: 15px;
}
.modal-footer {
  padding: 15px;
  text-align: right;
  border-top: 1px solid #e5e5e5;
}
.modal-footer .btn + .btn {
  margin-left: 5px;
  margin-bottom: 0;
}
.modal-footer .btn-group .btn + .btn {
  margin-left: -1px;
}
.modal-footer .btn-block + .btn-block {
  margin-left: 0;
}
.modal-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}
.close {
  float: right;
  font-size: 21px;
  font-weight: bold;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  filter: alpha(opacity=20);
  opacity: .2;
}
button.close {
  -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    position: absolute;
    right: 0;
    z-index: 99999;
    opacity: 1;
    right:8px;
    font-size:30px;
}
.close:hover, .close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
  filter: alpha(opacity=50);
  opacity: .5;
}

body.modal-open {
    overflow: hidden;
}

@media (min-width: 1100px) {
  .modal-dialog {
    max-width: 700px;
    margin: 150px auto !important;
  }
  
}



@media (min-width: 768px) {
  .modal-dialog {
    max-width: 700px;
    margin: 30px auto;
  }
  .modal-content {
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
  }
  .modal-sm {
    width: 300px;
  }
  .mobile-orderlist {display: none !important;}
}
@media (min-width: 992px) {
  .modal-lg {
    width: 900px;
  }
}
[role="button"] {
  cursor: pointer;
}
.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  border-radius: 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.btn:hover,
.btn:focus,
.btn.focus {
  color: #333333;
  text-decoration: none;
}
.btn:active,
.btn.active {
  outline: 0;
  background-image: none;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  cursor: not-allowed;
  pointer-events: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none;
}
.btn-default {
  color: #333333;
  background-color: #ffffff;
  border-color: #cccccc;
}
.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #333333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  background-image: none;
}
.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
  background-color: #ffffff;
  border-color: #cccccc;
}
.btn-default .badge {
  color: #ffffff;
  background-color: #333333;
}
.btn-primary {
  color: #ffffff;
  background-color: #337ab7;
  border-color: #2e6da4;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #ffffff;
  background-color: #286090;
  border-color: #204d74;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
  background-color: #337ab7;
  border-color: #2e6da4;
}
.btn-primary .badge {
  color: #337ab7;
  background-color: #ffffff;
}
.btn-success {
  color: #ffffff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.btn-success:hover,
.btn-success:focus,
.btn-success.focus,
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  color: #ffffff;
  background-color: #449d44;
  border-color: #398439;
}
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  background-image: none;
}
.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled.focus,
.btn-success[disabled].focus,
fieldset[disabled] .btn-success.focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
  background-color: #5cb85c;
  border-color: #4cae4c;
}
.btn-success .badge {
  color: #5cb85c;
  background-color: #ffffff;
}
.btn-info {
  color: #ffffff;
  background-color: #5bc0de;
  border-color: #46b8da;
}
.btn-info:hover,
.btn-info:focus,
.btn-info.focus,
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  color: #ffffff;
  background-color: #31b0d5;
  border-color: #269abc;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  background-image: none;
}
.btn-info.disabled,
.btn-info[disabled],
fieldset[disabled] .btn-info,
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus,
.btn-info[disabled].focus,
fieldset[disabled] .btn-info.focus,
.btn-info.disabled:active,
.btn-info[disabled]:active,
fieldset[disabled] .btn-info:active,
.btn-info.disabled.active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active {
  background-color: #5bc0de;
  border-color: #46b8da;
}
.btn-info .badge {
  color: #5bc0de;
  background-color: #ffffff;
}
.btn-warning {
  color: #ffffff;
  background-color: #f0ad4e;
  border-color: #eea236;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning.focus,
.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
  color: #ffffff;
  background-color: #ec971f;
  border-color: #d58512;
}
.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
  background-image: none;
}
.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled.focus,
.btn-warning[disabled].focus,
fieldset[disabled] .btn-warning.focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
  background-color: #f0ad4e;
  border-color: #eea236;
}
.btn-warning .badge {
  color: #f0ad4e;
  background-color: #ffffff;
}
.btn-danger {
  color: #ffffff;
  background-color: #d9534f;
  border-color: #d43f3a;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger.focus,
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  color: #ffffff;
  background-color: #c9302c;
  border-color: #ac2925;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  background-image: none;
}
.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
  background-color: #d9534f;
  border-color: #d43f3a;
}
.btn-danger .badge {
  color: #d9534f;
  background-color: #ffffff;
}
.btn-link {
  color: #337ab7;
  font-weight: normal;
  border-radius: 0;
}
.btn-link,
.btn-link:active,
.btn-link.active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
  background-color: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
  border-color: transparent;
}
.btn-link:hover,
.btn-link:focus {
  color: #23527c;
  text-decoration: underline;
  background-color: transparent;
}
.btn-link[disabled]:hover,
fieldset[disabled] .btn-link:hover,
.btn-link[disabled]:focus,
fieldset[disabled] .btn-link:focus {
  color: #777777;
  text-decoration: none;
}

.clearfix:before,
.clearfix:after,
.modal-footer:before,
.modal-footer:after {
  content: " ";
  display: table;
}
.clearfix:after,
.modal-footer:after {
  clear: both;
}
.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.pull-right {
  float: right !important;
}
.pull-left {
  float: left !important;
}
.hide {
  display: none !important;
}
.show {
  display: block !important;
}
.invisible {
  visibility: hidden;
}
.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.hidden {
  display: none !important;
}
.affix {
  position: fixed;
}

/* .modal-open body {
    overflow: hidden;
} */


@media (max-width:1300px){.modal {overflow:auto;}}

/*******/
.section-header h2 {
    font-weight: 700;
    color: #fff;
    font-size: 25px;
    margin-bottom: 1.5%;
}
/* ===== New home page menu ===== */
.navbar.navbar-inverse.fran_opp.top-bar .row {display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;margin-right: -15px;
  margin-left: -15px;}
.navbar.navbar-inverse.fran_opp.top-bar .row .top-header {text-align: center !important;}
.new-menu {display: inline-block;width: 100%;}
.new-menu .nav.book-desk {width: 100%;display: flex;justify-content: flex-end;}
.new-menu .nav.book-desk li a {font-size: 14px !important;font-weight: normal;padding: 5px 8px;}
.d-block {display: block;}
.navbar-box ul.dropdown-menu .bg-red, .nav.mob-menu a.bg-red {background: #da1403 !important;color: #fff !important;}

.small-boxs ul {margin-left: 0;display: flex;flex-wrap: wrap;}
.small-boxs ul li {flex: 0 0 31%;max-width: 31%;padding: 5px;list-style: none;}
.small-boxs ul .inner-box {margin-bottom: 2px;padding: 15px 0 15px 10px;transition: all 0.5s ease;background: #6a4c98;border-radius: 5px;display: flex;align-items: center;justify-content: }
.small-boxs ul .inner-box.bg-red {background: #da1403;}
.small-boxs ul .inner-box.bg-red a {line-height: normal;}
.small-boxs ul .inner-box:hover {border-color: #f698cb;}
.small-boxs ul .inner-box a {font-size: 13px;color: #fff;font-weight: 600;}
.small-boxs ul .inner-box a span {font-size: 11px;font-weight: 400;}
.small-boxs ul .inner-box a:hover {text-decoration: none;}
.small-boxs ul .inner-box img {display: block;margin-right: 8px;}
.minheightcls {min-height: 250px;}

/* ==== Week Table ==== */
.week-tables {padding: 2rem 0;}
.week-tables .week-data {position: relative;padding-top: 4rem;}
.week-tables .table tbody td {font-size: 14px;color: #000;}
.week-tables .week-data .owl-nav {position: absolute;top: -75px;z-index: 8;width: 100%;display: flex !important;align-items: center;justify-content: center;}
.week-tables .week-data .owl-nav button {display: flex;align-items: center;}
.week-tables .week-data .owl-nav button:hover .txt-arrow {color: #9e4dab;}
.week-tables .week-data .owl-nav span.txt-arrow {font-size: 18px;color: #fff;padding: 0 10px;}
.week-tables .week-data .owl-nav .owl-prev {flex-direction: row-reverse;}
.week-tables .owl-theme .owl-nav [class*=owl-]:hover {background: transparent;}
.week-tables .owl-dots {display: none !important;}