body.narrow.tablet.mobile table.grid tr.bookingForm td { padding: 8px; border: 3px solid #d3d3d3; }

body.narrow.tablet #logo {width: 300px; margin: 0 10px; background-size: 100% auto; }
/*body.narrow.tablet.mobile #logo {width: 300px; margin: 0 5px;}*/

body.narrow.tablet #header {height: 60px; padding: 15px 0;}
body.narrow.tablet.mobile #header {height: 60px; padding: 10px 0;}

body.narrow div.middle {
    width: 98%;
    max-width: 900px;
}

body.narrow.tablet .contentmain {margin: 0px 10px 10px 10px; padding-top: 20px; padding-bottom: 20px;}
body.narrow.tablet.mobile .contentmain {margin: 0px 5px 5px 5px; padding-top: 10px; padding-bottom: 10px;}

body.narrow.tablet div.left-content {width: 100%;}
body.narrow.tablet div.right-content {width: 100%; margin-top: 20px;}

body.narrow.tablet span.toggle.tablet {display: none;}
body.narrow.tablet.mobile span.toggle.mobile {display: none;}
body.narrow.tablet.mobile span.captilize.mobile {text-transform: capitalize;}
body.narrow.tablet span.captilize.tablet {text-transform: capitalize;}
body.narrow.tablet input.booksearch {margin: 30px 0 15px 10px;}
body.narrow.tablet.mobile input.booksearch {margin: 20px 0 15px 10px;}

body.narrow.tablet table.grid th.time, body.narrow.tablet table.grid td.time
{
    width: 65px; padding-left: 0;
}

body.narrow.tablet.mobile table.grid th.availability { line-height: 18px; padding-left: 15px; }


body.narrow.tablet.mobile table.grid th.time, body.narrow.tablet.mobile table.grid td.time
{
    width: 50px;
}


body.narrow.tablet table.grid th.date, body.narrow.tablet table.grid td.date
{
    width: 65px; white-space: nowrap;
}

body.narrow.tablet table.grid td.buttons a.button.book {margin-right: 7px; padding: 9px 10px; }
body.narrow.tablet table.grid th.buttons {width: 110px;}
body.narrow.tablet table.grid td.buttons {width: 110px;}

body.narrow.tablet table.grid td.availability div.background { height: 38px; }
body.narrow.tablet table.grid td.availability div.background div.foreground { height: 38px; }
body.narrow.tablet table.grid table.grid td.availability div.background div.text { height: 38px; line-height: 38px; }

body.narrow.tablet a.button.prices {  background: url('/assets/images/info-icon.png') no-repeat 2px 4px; text-indent: -9999px; width: 3px; height: 12px; margin-right: 0px;}


     

body.narrow.tablet table.grid
{
    width: 100%;
}

/*body.narrow.tablet table.grid.middle.no-border*/

body.narrow.tablet table.grid td.availability
{
    width: auto;
    padding-right: 5px;
}

body.narrow.tablet div.counter {margin: 0 10px;}
body.narrow.tablet div.counter {margin: 0 5px;}
body.narrow.tablet.mobile div.counter div.message {font-size: 1.15em; text-align: right; }
body.narrow.tablet.mobile div.counter.with-steps div.message {font-size: 12px; }


body.narrow.tablet div.contactdetails {margin-top: 20px;}
body.narrow.tablet.mobile div.contactdetails {margin-top: 10px;}

body.narrow.tablet.mobile ul.form {width: 99%;}
body.narrow.tablet.mobile ul.form li:not(.memberno) {clear: both; width: 100%; padding-right: 0;}
body.narrow.tablet.mobile ul.form input {width: 94%;}

body.narrow.tablet.mobile #creditCardDetails input#cardExpiry, body.narrow.tablet.mobile #creditCardDetails input#ccv {width: 94%; margin-right: 0;}
body.narrow.tablet.mobile #creditCardDetails ul.form li.label.cardccv {float:left; clear: none; width: 100%; margin-left: 0;}

body.narrow.tablet ul.form textarea {width: 200px;}
body.narrow.tablet.mobile ul.form textarea {width: 94%;}

body.narrow.tablet ul.form input.val-product, body.narrow.tablet ul.form input.val-extra, body.narrow.tablet ul.form input.timeProduct {width: 50px;}
body.narrow.tablet.mobile ul.form input.val-product, body.narrow.tablet.mobile ul.form input.val-extra, body.narrow.tablet.mobile ul.form input.timeProduct { width: 25px; }
body.narrow.tablet.mobile ul.form li.label { padding-left: 1px; max-width: none; padding-bottom: 3px;}

body.narrow.tablet table.grid td ul.form li.label { display:block; width: 100% !important; margin-right: 0;  margin-bottom: 5px; padding-top: 5px;}
body.narrow.tablet.mobile table.grid td ul.form select { width: 90px !important; }
body.narrow.tablet.mobile ul.form li.memberno { width: auto; padding-right: 10px; }
body.narrow.tablet.mobile ul.form div.text { margin: 10px 6px 0 6px;}
body.narrow.tablet.mobile ul.form input.timeProduct {clear: both;  }

body.narrow.tablet div.select-time div.text.hide-if-tablet {    width: 0; height:0; overflow: hidden;  }

body.narrow.tablet.mobile div.select-time select {padding-left: 2px; padding-right: 2px; width: 72px;}
body.narrow.tablet.mobile li.product-0 div.text {display: none;}

body.narrow.tablet ul.form select#duration {width: 75px;}

body.narrow.tablet.mobile select {width: 100%;}

body.narrow.tablet.mobile .form.margin {margin: 0px 0 15px 0;}


body.narrow.tablet
    table.form td {
        /*padding: 6px 8px 4px 0px;*/
        height: 28px;
        vertical-align: top;
        line-height: 28px;
        padding-top: 4px;
    }

body.narrow.tablet.mobile table.grid.confirm {min-width: 0; width: 100%;}


body.narrow.tablet div.box {padding-top: 15px;}
body.narrow.tablet div.box {padding-top: 10px;}

    body.narrow.tablet div.box.reserve a.button {
       display:block;
       width: auto;
       float:none;
       margin: 10px 0 0 0;
           
    }

body.narrow.tablet div.or {
    float: none;
    margin: 10px 0;
    text-align: center;
}

body.narrow.tablet div.white-popup {
    padding: 12px;
}

body.narrow.tablet a.button.full-width-if-tablet
{
    width: auto;
    display: block;
    float: none;
    margin-top: 10px;
    margin-right: 0;
}

body.narrow.tablet.mobile a.button.full-width-if-mobile {
    width: auto;
    display: block;
    float: none;
    margin-top: 10px;
    margin-right: 0;
}


body.narrow div.menu ul.main { display: none; }
body.narrow div.menu ul.submenu {display: block;}
body.narrow.tablet div.menu ul.submenu {margin-top: -30px;}

body.narrow div.menu { right: 0; top: 0; position: absolute; height: 40px; }
body.narrow div#header div.social {display: none; }
body.narrow div#header a.book-head {display: none; }

body.narrow.tablet h1 {font-size: 2em; line-height: 110%;}
body.narrow.tablet.mobile h1 {font-size: 1.75em; line-height: 150%;}

body.narrow div.booking-steps.left {float:none;}

body.narrow.tablet .booking-steps {font-size: 1.15em;}
    body.narrow.tablet .booking-steps ul li {
        padding-left: 12px;
        padding-right: 12px;
    }

    body.narrow.tablet .booking-steps ul li i.fa {top: .25em; right: -8px;}



    body.narrow.tablet.mobile .hide-if-mobile {display:none;}


body.narrow  div.counter.with-steps {
    float:none;
    position: relative;
    margin: 5px auto;
    top: inherit;
    left: inherit;
    right: inherit;
    width: 210px;
}






body.narrow  div.counter.with-steps .hasCountdown .countdown_show2 div  {
    width: 50px; padding: 5px 0 3px 0;
}

body.narrow  div.counter.with-steps div.message {margin-top: 3px;}

body.narrow  div.counter.with-steps .countdown_section {
	font-size: 11px;
}
body.narrow  div.counter.with-steps .countdown_amount {
	font-size: 13px;
}





.show-if-tablet {display:none;}
.show-if-mobile {display:none;}
body.narrow.tablet .hide-if-tablet {display:none;}
body.narrow.tablet .show-if-tablet {display:block;}
body.narrow.tablet.mobile .show-if-mobile {display:block;}

body.narrow.tablet.mobile .date-selection {margin-top: 15px;}

body.narrow.tablet ul.form li.heading { padding-top: 12px; }