@charset "utf-8";
/* CSS Document */

/* Table of Contents
-----------------------------
1. Mobile
2. iPad
3. large desktop
4. Other
*/

#mobile-menu{display: none;}
.mobile-contact {display: none;}
.filter-mobile {display: none;}
html,body {-webkit-text-size-adjust: 100%; /*/ Prevent font scaling in landscape while allowing user zoom /*/}

/*-------- screen css correction needed --------*/

/*----- gallery page -----*/
#banner .cycle-slideshow .center {-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%);}

/*----- career page -----*/
#apply-now .sbSelector:hover, #apply-now .sbSelector:link, #apply-now .sbSelector:visited {width: 100%;}
#apply-now .file-upload-wrapper input[type="text"] {pointer-events: none;}

/* mobile address and hours block */
.mobile-contact {position: absolute;z-index: 120;visibility: visible;float: left;background: #000;width: 100%;border-bottom: 2px solid #ae956b; height: auto;text-align: center; -webkit-transition: 0.5s ease all;-o-transition: 0.5s ease all;transition: 0.5s ease all; display: none; padding: 15px; top: -169px; padding-bottom: 45px; -webkit-transform: translateY(calc(100% - 169px););-ms-transform: translateY(calc(100% - 169px););-o-transform: translateY(calc(100% - 169px););transform: translateY(calc(100% - 169px););}
.mobile-contact .address-block, .mobile-contact .hours-block {width: 50%; float: left; display: block; height: auto; position: relative; text-align: center; padding-top: 20px; color: #f9efda;}
.mobile-contact .hours-block p strong {display: block;}
.mobile-contact .hours-block img {margin-bottom: 8px;}
.mobile-contact .address-block .phone-number{color: #ae956b;font-size: 16px;font-family: 'Roboto Condensed',sans-serif;font-weight: 700;letter-spacing: .17em;line-height: 18px; display: block; width: 100%; text-align: center; padding-left: 5px; margin-bottom: 12px;}
.mobile-contact .address-block .address-line {text-align: center; display: block; color: #f9efda;max-width: 200px;display: block;margin: 0 auto; font-size: 14px; font-family: 'Roboto Condensed',sans-serif; text-transform: uppercase; line-height: 18px;}

/* mobile contact open close button */
.mobile-contact .close-mobile-contact {position:absolute;visibility:visible;background:url(/images/site/X.png)no-repeat;background-position:left center;bottom:6px; left:45px;color:#ae956b;width:110px;height:25px;padding:10px 0 0;text-transform:uppercase;text-decoration:none;font-family:Courier,sans-serif;font-size:15px}
.mobile-contact .open-mobile-contact {width: 133px; height: 28px; display: block; background: url(/images/site/contact-us-btn.png) no-repeat center center; position: absolute; bottom: -28px; left:10px; background-size: contain !important;}
.mobile-contact.visible {/*bottom: calc(-100% + 63px);*/ top: 63px !important; -webkit-transform: translateY(0);-ms-transform: translateY(0);-o-transform: translateY(0);transform: translateY(0);}

/* 1. Mobile responsive css 767px
-----------------------------------*/
@media (max-width:767px) {

    /* default */
    body{min-width: inherit; width: 100%;}
    .container{width: 100%;padding-left: 13px;padding-right: 13px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; display: block;}
    h3 {font-size: 24px;}
    h5 {font-size: 20px;}
    p {font-size: 15px; line-height: 20px;}

    /*----   header   ----*/
    #header {height: auto;}
    #header .header-wrapper {height: auto;}
    #header .header-wrapper .container {max-width: 100%;}
    #header #header-left {display: none;}
    #header #header-right {display: none;}
    #header #header-center {width: 100%; padding: 0; margin: 0; height: auto; display: block; float: none; clear: both; text-align: center; border: none; padding-top: 10px;}
    #header #header-center a {position: relative; top: auto; left: auto; width: 100px; margin: auto;}
    #header #header-center a img {max-width: 100px;}

    /* footer */
    #footer {display: table;}

    /* book table dropdown */
    /*#book-table-drop { top: auto; bottom: calc(100% - 56px); }*/
    #book-table-drop {}
    #book-table-drop .container {max-width: 100%;}
    #OT_searchWrapper dl {text-align:left !important;}
    h2.book-header {width: 80%; font-size: 21px; padding: 5px 0 5px 0;}
    a#book-a-table {right: 10px; bottom: -30px; width: 150px ;height: 28px; background-size: 150px 56px;z-index:999}
    a#book-a-table:hover {background-position: 0 0;}
    a#close-book-a-table {bottom: 5px; right: 54px;z-index:5;}
    #book-table-drop {top: 0 !important;height: auto !important;-webkit-transform: translateY(calc(-100% + 64px));-ms-transform: translateY(calc(-100% + 64px));-o-transform: translateY(calc(-100% + 64px));transform: translateY(calc(-100% + 64px));visibility:visible !important;-webkit-transition: all 0.9s ease;-moz-transition: all 0.9s ease;-o-transition: all 0.9s ease;transition: all 0.9s ease;}
    #book-table-drop.visible {-webkit-transform: translateY(63px);-ms-transform: translateY(63px);-o-transform: translateY(63px);transform: translateY(63px); z-index: 121;}
    #book-table-content {margin-top: 12px; padding: 0 12px;}
    #book-table-content #book-table-select-menu {padding: 11px 0 8px;}
    #book-table-content #book-table-select-menu li .row-select {margin-right: 8px;}
    #OT_searchWrapper dl dt, #OT_searchWrapper dl dd:not(#OT_submitWrap) {float:left;}
    #book-table-drop .sbOptions {z-index:999;}
    #OT_submitWrap {z-index:1 !important;}
    #OT_searchWrapperAll {height:210px !important;display: block;float:left;}
    #OT_date {width: 103px !important;}
    #OT_timeLbl {display:block !important;clear:both;float:left;}
    #OT_time {margin-bottom:20px !important;}
    #OT_date input[type=text] {width:97px !important;}
    #OT_dateLbl, #OT_partySizeLbl, #OT_timeLbl { width: 37px !important; }
    #OT_searchWrapper dl {max-width:280px;width:100%;margin: 0 auto !important;}
    #OT_partySize .sbHolder {width:63px !important;}
    #OT_time .sbHolder {width:237px !important;}
    #OT_submitWrap {text-align: center;}

    /* mobile content */
    .mobile-contact {display: block;}
    #header #navigation {display: none;}

    /* mobile menu */
    #mobile-menu * {float: none;}
    #mobile-menu {height: auto;}
    #mobile-menu, #mobile-menu .menu-trigger{display: block;}
    #mobile-menu .shield{position: fixed; width: 100%;height: 100vh;background: rgba(0,0,0,0.6);top: 0;right: -200%;z-index: 99;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease; -webkit-transform: translateX(-100%);-ms-transform: translateX(-100%);-o-transform: translateX(-100%);transform: translateX(-100%); z-index:99998 }
    #mobile-menu .shield.open{right: 0; -webkit-transform: translateX(0);-ms-transform: translateX(0);-o-transform: translateX(0);transform: translateX(0);}
    #mobile-menu .menu-trigger{display: block;width: 40px;height: 63px;position: absolute;-ms-touch-action: manipulation;touch-action: manipulation;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-image: none;white-space: nowrap;z-index: 999999;left: 0;top: 0;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}
    #mobile-menu .menu-trigger.open{left: calc(100% - 40px);background:#A18355}
    #mobile-menu .menu-trigger span, #mobile-menu .menu-trigger span:after, #mobile-menu .menu-trigger span:before {background: #000;height: 2px; -webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}
    #mobile-menu .menu-trigger span{position: absolute;display: block;width: 20px;left: 50%;top: 50%;transform: translate(-50% , -50%);-webkit-transform: translate(-50% , -50%);-moz-transform: translate(-50% , -50%)}
    #mobile-menu .menu-trigger span:after, #mobile-menu .menu-trigger span:before{content: '';position: absolute;left: 0;width: 100%;}
    #mobile-menu .menu-trigger span:before{top: -6px;}
    #mobile-menu .menu-trigger span:after{bottom: -6px;}
    #mobile-menu .menu-trigger.open span{background-color: rgba(0,0,0,.0)}
    #mobile-menu .menu-trigger.open span:before{top: 0;transform: rotate(45deg);-webkit-transform: rotate(45deg);background: rgba(0, 0, 0, 1)}
    #mobile-menu .menu-trigger.open span:after{top: 0;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);background: rgba(0, 0, 0, 1)}
    #mobile-menu .navbar{padding-top: 60px;background:rgba(0, 0, 0, 0.6);position: fixed;top: 0;width: calc(100% - 40px);height: 100%;left: 0;box-sizing: border-box;z-index: 99999;overflow-y: auto;/*-webkit-overflow-scrolling: touch;*/-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;margin-right: 40px; -webkit-transform: translateX(-100%);-ms-transform: translateX(-100%);-o-transform: translateX(-100%);transform: translateX(-100%);}
    #mobile-menu .navbar.open{left: 0;-webkit-transform: translateX(0);-ms-transform: translateX(0);-o-transform: translateX(0);transform: translateX(0);}
    #mobile-menu  ul ul{display: none; background:rgba(0, 0, 0, 0.5);}
    #mobile-menu  ul ul ul{background:rgba(0, 0, 0, 0.5);}
    #mobile-menu  ul ul ul ul{background:rgba(0, 0, 0, 0.5);}
    #mobile-menu  li{border-bottom:1px solid rgba(161, 131, 85, 0.38);list-style: none;position: relative;display: block;margin: 0;}
    #mobile-menu  li:last-child{border-bottom-width: 0;padding-bottom: 0;}
    #mobile-menu  em{display: block;position: absolute;top: 0;right: 0;width: 30px;height: 39px;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}
    #mobile-menu  em:before, #mobile-menu  em:after{content: '';position: absolute;top:50%;margin-top: -1px;left: calc(50% - 8px);width: 16px;height: 2px;background: #fff;}
    #mobile-menu  em:after{transform: rotate(-90deg);-moz-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}
    #mobile-menu  em.toggled:after{transform: rotate(0);-moz-transform: rotate(0);-webkit-transform: rotate(0);}
    #mobile-menu  em.level-two:before{content: '';position: absolute;width: 0;height: 0;border-style: solid;border-width: 6px 6px 0 6px;border-color: #fff transparent transparent transparent;background-color: transparent;left: 50%;top: 50%;transform: translate(-50% , -50%);-webkit-transform: translate(-50% , -50%);-moz-transform: translate(-50% , -50%);margin: 0;}
    #mobile-menu  em.level-two:after{display: none;}
    #mobile-menu  em.level-two.toggled{transform: rotate(-180deg);-moz-transform: rotate(-180deg);-webkit-transform: rotate(-180deg)}
    #mobile-menu  li a{color: #ae926c;padding: 9px 0px 9px 15px;display: block;margin-right: 30px;text-transform: uppercase;line-height: 20px;font-size: 15px;font-weight: 700;letter-spacing: 0.09em;font-family: 'Montserrat', sans-serif; text-decoration: none;}
    #mobile-menu  li li{border-color: rgba(161, 131, 85, 0.38)}
    #mobile-menu  li li a{padding-left: 30px;}
    #mobile-menu  li li li a{padding-left: 25px;margin-right: 0;}
    #mobile-menu  li li li li a{padding-left: 30px;margin-right: 0;}
    #mobile-menu  li a.active{color:#af3206;}
    .scroll-hidden{overflow: hidden;height: 100%; position: fixed;}

    /* banner */
    #banner {height: 430px !important; }
    #banner .banner-slider {height: 430px !important; }
    #banner .banner-content img {max-width: 50%;}
    /*#page-banner img {width:auto !important;height:210px !important;max-width:initial !important;margin-left:-31%;}*/
    /* main content */
    #content {width: 100%; padding: 15px 12px; box-sizing: border-box;}

    /*tell me more */
    #content #tell-me-more {width: 100%;}
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title {width: 100%; height: auto; display: block; position: relative; text-align: center; border: none;padding-bottom: 10px;}
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title:after {content:"";width: 100px; height: 1px; display: block; position: absolute; bottom: 0; left: 50%; margin-left: -50px; background: #000; }
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title h3 {display: block; font-size: 26px;}
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title h4 {display: block; font-size: 22px;}
    #content #tell-me-more #tell-me-more-inner p {width: 100%; text-align: center; padding-left: 0; font-size: 15px; line-height: 20px;}
    #content #tell-me-more #tell-me-more-inner a#tell-more-btn {position: relative; display: block; margin: 0 auto; float: none; clear: both; margin-bottom: 5px; width: 150px; height: 63px; background-size: 150px 125px;}
    #content #tell-me-more #tell-me-more-inner a#tell-more-btn:hover {background-position: 0 0;}

    /* specials events press block */
    #specials-events-press {width: 100%; margin-bottom: 10px;}
    #specials-events-press li {max-width: 300px !important; width: 100% !important; display: block; margin: 0 auto !important; float: none; margin-bottom: 50px !important;}
    #specials-events-press li:last-child {margin-bottom: 0 !important;}
    #specials-events-press li a.title {font-size: 15px; line-height: 20px;}
    #specials-events-press li .excerpt {margin-bottom: 8px;}
    #specials-events-press li .date {margin: 7px 0;}
    #specials-events-press li a.read-more-link {position: relative; bottom: auto; margin-top: 7px; font-size: 15px;}
    a.read-more-link.heading:after, a.read-more-link.heading:before {margin: 5.5px 14px;}
    .blog-thumbnail  {margin-bottom: 0;}
    #specials-events-press li .blog-thumbnail {margin-bottom: 14px;}

    /*----- about page -----*/
    .double-column-text {padding: 20px 0; box-sizing: border-box; -webkit-columns: 1;-moz-columns: 1;-o-columns: 1; columns: 1; -webkit-column-gap: 0;-moz-column-gap: 0;-o-column-gap: 0;column-gap: 0;}
    #about-timeline img {max-width: 100%;}
    h1.page-header {font-size: 26px; padding: 7px 0;}

    /* bio page */
    /* bio menu filter */
    .filter-desktop {display: none;}
    .filter-mobile {display: block; padding-top: 22px; padding-bottom: 16px;}
    .filter-mobile .sbHolder {margin: 0 auto;  border-color: #000; background: #000; width: 220px;  }
    .filter-mobile .sbSelector {top: -2px; width: 200px;}
    .filter-mobile .sbToggle {pointer-events: none;}
    /*.filter-bio-mobile .sbToggle {background: none;}*/
    .filter-mobile .sbSelector:hover, .sbSelector:link, .sbSelector:visited {color: #a18e68; font-family: 'Roboto Condensed',sans-serif; text-transform: uppercase; font-weight: 700;}
    /*.filter-bio-mobile .sbToggleOpen:focus {background: url(../images/select-icons.png)0 -118px no-repeat;}*/

    /* bio menu content */
    #content ul#bios-menu { margin-bottom: 20px;}
    #content ul#bios-menu li {padding: 7px 20px;}
    #content #bios-content {width: 100%; height: auto; display: table; padding: 0; position: relative;}
    #content #bios-content #bios-profile-image {width: 100%; margin-right: 0; display: block; max-width: 320px; margin: 0 auto; margin-bottom: 20px; float: none;}
    #content #bios-content #bios-profile-content {width: 100%; display: block;}
    #content #bios-content #bios-profile-content h2 {margin-bottom: 7px; font-size: 22px;}
    #content #bios-content #bios-profile-content p {padding: 0;}
    #bios-navigation-previous {left: 0; top: 180px;}
    #bios-navigation-next {right: 0; top: 180px;}

    /*----- contact page -----*/
    #contact-columns {width: 100%; height: auto; display: block; padding: 0;}
    #contact-columns #contact, #contact-columns #visit, #contact-columns #connect {width: 100%; max-width: 420px; margin: 0 auto; padding: 0; border: none; position: relative; border-bottom: 1px solid #000; clear: both; float: none; padding: 20px;}
    #contact-columns #visit {padding-bottom: 40px; }
    #contact-columns #visit #parking {left: 50%; -webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);transform: translateX(-50%); padding-left: 30px; width: auto; background-position: 0 0; bottom: 10px;}
    #contact-columns #connect {border: none;}
    #contact-columns #connect a {display: inline-block !important; vertical-align: middle; text-align: center; float: none !important; margin: 0 6px !important;}
    #page-map, #map { height: 220px !important; }

    /*----- news page -----*/
    #news-featured #featured-image, #news-featured #featured-content, #news-feed .news-item, #press-feed {width: 100%; margin: 0; padding: 0; max-width: 300px; float: none; margin: 0 auto; margin-bottom: 50px; display: block;}
    #news-feed .news-item:nth-child(3n+3) {margin: 0 auto; margin-bottom: 50px;}
    #news-feed .read-more-btn {position: relative;}
    #news-feed .news-item .whatshapp-excerpt {margin: 0; padding: 0; padding: 5px 0 15px;}
    #news-feed {margin-top: 25px; float: none; text-align: center;}
    #news-feed .news-item .whatshapp-title {margin-bottom: 5px; line-height: 20px;}
    #news-feed .news-item .blog-thumbnail {margin-bottom: 14px;}
    #press-feed .press-item {width: 100%; height: auto; display: block; position: relative; margin-bottom: 50px;}
    #press-feed .press-item .press-meta {margin: 0; padding: 0; width: 100%; height: auto; display: block; max-width: 300px; margin: 0 auto;}
    #press-feed .press-item .press-thumbnail {width: 100%; float: none; margin-bottom: 15px; min-height: auto;}
    #press-feed .press-item .press-meta .press-title {margin-bottom: 5px;}
    #press-feed .press-item .press-meta .press-date {margin-bottom: 8px;}
    #press-feed .press-item .press-meta .press-excerpt {margin-bottom: 10px;}

    /*----- career page -----*/
    #apply-now .sbSelector:hover, #apply-now .sbSelector:link, #apply-now .sbSelector:visited, #apply-now .sbSelector {font-weight: 400; font-family: Courier,sans-serif; box-sizing: border-box;}

    /*----- downstairs page -----*/
    body.low-content #content {min-height: auto !important;}

}

/* 2. iPad responsive css 768px to 1024px
-----------------------------------------*/
@media (min-width:768px) and (max-width:1024px) {

    /* default  */
    body{min-width: inherit;}
    .container{width: 100%;padding-left: 13px;padding-right: 13px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; max-width: 100%; display: block;}

    /* header */
    #header {height: auto; padding-bottom: 2px;}
    #header .header-wrapper {height: auto;}
    #header .header-wrapper .container {width: 100%; padding: 10px 0;}
    #header #header-left, #header #header-center, #header #header-right {width: 32.5%; padding: 0; display: inline-block; vertical-align: middle; float: none; margin: 0;}
    #header #header-left .address {width: 100%; display: block; text-align: center;}
    #header #header-left .address-line-two {width: 100%; text-align: center; width: 100%; display: block; clear: both; margin: 0;}
    #header #header-center {text-align: center;}
    #header #header-center a {display: block; width: 100%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
    #header #header-center img {margin: 0 auto; max-width: 60%; width: 100%; }


    /* header navigation */
    #header #navigation {height: auto;}
    #header #navigation ul#menu {text-align: center;}
    #header #navigation ul#menu li {height: auto; }
    #header #navigation ul#menu li,#header #navigation ul#menu li.about,#header #navigation ul#menu li.fare-and-libations,#header #navigation ul#menu li.whats-happening,#header #navigation ul#menu li.gift-cards,#header #navigation ul#menu li.gallery {padding: 0; margin: 0;}
    #header #navigation ul#menu li a,#header #navigation ul#menu li.about a,#header #navigation ul#menu li.fare-and-libations a,#header #navigation ul#menu li.whats-happening a,#header #navigation ul#menu li.downstairs a,#header #navigation ul#menu li.gallery a {padding: 0;margin: 0; padding: 0 10px;}
    #header #navigation ul#menu li ul li {display: block;}
    #header #navigation ul#menu li .dropdown-menu {top: 29px;}
    #header #navigation ul#menu li .dropdown-menu li a {text-align: left; padding: 0 15px;}

    /* book table dropdown */
    h2.book-header {width: 100%;}
    a#book-a-table {right: 10px;}
    #book-table-drop {top: -118px;}
    #book-table-drop.visible {top: 160px;}
    h2.book-header {font-size: 31px;}

    /* banner */
    #banner .banner-content img {width: 50%;}

    /* main content */
    #content {width: 100%; padding: 15px 20px; box-sizing: border-box;}

    /* tell me more block */
    #content #tell-me-more {width: 100%; }
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title {padding: 0 13px 0 6px;}
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title h3 {font-size: 30px;}
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title h4 {font-size: 26px;}

    /* specials events press block */
    #specials-events-press {width: 100%; height: auto; display: block; position: relative; clear: both;}
    #specials-events-press li {width: 33%; }

    /*----- about page -----*/
    h1.page-header {font-size: 30px; padding: 7px 0;}
    .double-column-text {padding: 20px 0; box-sizing: border-box; -webkit-columns: 2;-moz-columns: 2;-o-columns: 2; columns: 2; -webkit-column-gap: 40px;-moz-column-gap: 40px;-o-column-gap: 40px;column-gap: 40px;}
    #about-timeline img {max-width: 100%;}

    /* bio page */
    #content ul#bios-menu { margin-bottom: 20px;}
    #content ul#bios-menu li {padding: 7px 20px;}
    #content #bios-content {width: 100%; height: auto; display: table; padding: 0 55px;}
    #content #bios-content #bios-profile-image {width: 30%; margin-right: 20px; margin-bottom: 20px;}
    #content #bios-content #bios-profile-content {width: 66%;}
    #content #bios-content #bios-profile-content h2 {margin-bottom: 7px;}
    #content #bios-content #bios-profile-content p {padding: 10px;}
    #bios-navigation-previous {left: 0;}
    #bios-navigation-next {right: 0;}
    #content ul.horizontal-menu, #sp_tabs {margin-bottom: 27px;}

    /*----- menu page -----*/
    #menu .menu-block {max-width: 700px;}
    #menu .menu-block .menu-item p {margin-top: 10px;}
    #menu .menu-block .menu-description {margin-bottom: 30px;}
    #menu .menu-block .menu-item {padding: 0 20px 20px;}
    #menu .menu-block .menu-item span.left {width: calc(100% - 90px);}
    #menu .menu-block .menu-item span.right {width: 90px; text-align: right;}

    /*----- contact page -----*/
    #contact-columns {padding: 20px 0; height: auto; width: 100%; display: table;}
    #contact-columns #contact {width: 30%; padding-right: 0; padding: 0 10px; margin-bottom: 0;}
    #contact-columns #visit {width:40%; padding: 0; position: relative;  padding: 0 10px;}
    #contact-columns #visit #parking {left: 50%; -webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);transform: translateX(-50%); padding-left: 30px; width: auto; background-position: 0 0;}
    #contact-columns #connect {text-align: center; width: 30%; padding-left: 0;}
    #contact-columns #connect a {display: inline-block !important; vertical-align: middle; text-align: center; float: none !important; margin: 0 6px !important;}

    /* happy hour callout */
    #happy-hour-and-specials-callout p {padding: 15px 25px 15px 0 ;}
    #happy-hour-and-specials-callout a#tell-more-btn, #happy-hour-and-specials-callout a#tell-more-btn:hover {width: 180px; background-size: 180px; height: 80px; background-position: 0 0 ;}

    /*----- news page -----*/
    #news-featured #featured-image {width: 48%;}
    #news-featured #featured-content {width: 48%; margin-left: 4%;}
    #news-feed {margin-top: 25px;}
    #news-feed .news-item {width: 31.66%; margin-right: 2.5%; margin-bottom: 30px;}
    #news-feed .news-item .blog-thumbnail {margin-bottom: 14px;}
    #press-feed .press-item {width: 100%; height: auto; display: block; position: relative; margin-bottom: 20px;}
    #press-feed .press-item .press-thumbnail {width: 35%; height: auto; display: block; margin-right: 20px; height: auto; min-height: auto; }
    .blog-thumbnail {height: auto; margin-bottom: 0;}
    #press-feed .press-item .press-meta {margin-left: 0;}
    #press-feed .press-item .press-meta .press-title {margin-bottom: 8px;}
    #press-feed .press-item .press-meta .press-date {margin-bottom: 8px;}
    #press-feed .press-item .press-meta .press-excerpt {margin-bottom: 15px;}

    /*----- career page -----*/
    #apply-now .sbSelector:hover, #apply-now .sbSelector:link, #apply-now .sbSelector:visited, #apply-now .sbSelector {box-sizing: border-box;}
}

/* 3. large desktop responsive css 1025px to 1200px
----------------------------------------------------*/
@media (min-width:1025px) and (max-width:1220px) {

    /* header */
    #header {height: auto; padding-bottom: 2px;}
    #header .header-wrapper {height: auto;}
    #header .header-wrapper .container {width: 100%; padding: 10px 0;}
    #header #header-left, #header #header-center, #header #header-right {width: 32.5%; padding: 0; display: inline-block; vertical-align: middle; float: none; margin: 0;}
    #header #header-left .address {width: 100%; display: block; text-align: center;}
    #header #header-left .address-line-two {width: 100%; text-align: center; width: 100%; display: block; clear: both; margin: 0;}
    #header #header-center {text-align: center;}
    #header #header-center a {display: block; width: 100%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
    #header #header-center img {margin: 0 auto; max-width: 60%; width: 100%; }

    /* header navigation */
    #header #navigation {height: auto;}
    #header #navigation ul#menu {text-align: center;}
    #header #navigation ul#menu li {height: auto; }
    #header #navigation ul#menu li,#header #navigation ul#menu li.about,#header #navigation ul#menu li.fare-and-libations,#header #navigation ul#menu li.whats-happening,#header #navigation ul#menu li.gift-cards,#header #navigation ul#menu li.gallery {padding: 0; margin: 0;}
    #header #navigation ul#menu li a,#header #navigation ul#menu li.about a,#header #navigation ul#menu li.fare-and-libations a,#header #navigation ul#menu li.whats-happening a,#header #navigation ul#menu li.downstairs a,#header #navigation ul#menu li.gallery a {padding: 0;margin: 0; padding: 0 10px;}
    #header #navigation ul#menu li ul li {display: block;}
    #header #navigation ul#menu li .dropdown-menu {top: 29px;}
    #header #navigation ul#menu li .dropdown-menu li a {text-align: left; padding: 0 15px;}

    /* book table dropdown */
    h2.book-header {width: 100%;}
    a#book-a-table {right: 10px;}
    #book-table-drop {top: -118px;}
    #book-table-drop.visible {top: 160px;}
    h2.book-header {font-size: 31px;}

    /* main content */
    #content {width: 100%; padding: 15px 20px; box-sizing: border-box;}

    /* tell me more block */
    #content #tell-me-more {width: 87%; }
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title {padding: 0 13px 0 6px;}
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title h3 {font-size: 30px;}
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title h4 {font-size: 26px;}

    /* specials events press block */
    #specials-events-press {width: 87%; height: auto; display: block; position: relative; clear: both;}
    #specials-events-press li {width: 33%; }

    /* bio page */
    #content ul#bios-menu { margin-bottom: 20px;}
    #content ul#bios-menu li {padding: 7px 20px;}
    #content #bios-content {width: 100%; height: auto; display: table; padding: 0 55px;}
    #content #bios-content #bios-profile-image {width: 30%; margin-right: 20px; margin-bottom: 20px;}
    #content #bios-content #bios-profile-content {width: 66%;}
    #content #bios-content #bios-profile-content h2 {margin-bottom: 7px;}
    #content #bios-content #bios-profile-content p {padding: 10px;}
    #bios-navigation-previous {left: 0;}
    #bios-navigation-next {right: 0;}
    #content ul.horizontal-menu, #sp_tabs {margin-bottom: 27px;}
}

/* 4. Other media-query ipad portrait menu
------------------------------------------------*/
@media (max-width:1020px){

    /* header menu */
    #header #navigation ul#menu li a,
    #header #navigation ul#menu li.about a,
    #header #navigation ul#menu li.fare-and-libations a,
    #header #navigation ul#menu li.whats-happening a,
    #header #navigation ul#menu li.downstairs a,
    #header #navigation ul#menu li.gallery a {padding: 0;margin: 0; padding: 0 5px; font-size: 13px;}

    /* banner */
    #banner {height: 400px;}
    #banner .banner-slider {height: 400px;}

    /*tell me more */
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title {width: 100%; height: auto; display: block; position: relative; text-align: center; border: none;padding-bottom: 10px;}
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title:after {content:"";width: 100px; height: 1px; display: block; position: absolute; bottom: 0; left: 50%; margin-left: -50px; background: #000; }
    #content #tell-me-more #tell-me-more-inner #oldest-bar-title h3 {display: block; }
    #content #tell-me-more #tell-me-more-inner p {width: 100%; text-align: center; padding-left: 0;}
    #content #tell-me-more #tell-me-more-inner a#tell-more-btn {position: relative; display: block; margin: 0 auto; float: none; clear: both; margin-bottom: 5px;}

    /* specials events press block */
    .blog-thumbnail .blog_thumb {min-height: 144px; }
    #specials-events-press li {width: 31%; margin: 0 1%;}
    #specials-events-press li .excerpt {padding: 0 5px;}

    /*----- about page -----*/
    /* bio page */
    #content ul#bios-menu li {padding: 4px 10px; height: 24px;}
    #content ul#bios-menu li a {font-size: 16px;}

    /*----- career page -----*/
    #apply-now {margin-top: 25px;}
    #apply-now form {width: 100%;}
    #apply-now p {padding-bottom: 0;}
    #apply-now a#submit {margin-top: 0;}
    #current-openings {padding-top: 30px; margin-bottom: 15px;}
    #current-openings ul li {padding: 10px 20px;}

    /*----- menu page -----*/
    #content ul.horizontal-menu, #sp_tabs {margin: 20px 0;}
    #content ul.horizontal-menu li, #sp_tabs li {padding: 2px 10px; height: 24px;}
    #menu .menu-block .menu-item p {margin-top: 10px;}
    #menu .menu-block .menu-description {margin-bottom: 30px;}
    #menu .menu-block .menu-item {padding: 0 20px 20px;}
    #menu .menu-block .menu-item span.left {width: calc(100% - 90px);}
    #menu .menu-block .menu-item span.right {width: 90px; text-align: right;}

    /* happy hour callout */
    #happy-hour-and-specials-callout {padding: 0 20px;}
    #happy-hour-and-specials-callout p {max-width: 100%; padding-right: 0;}
    #happy-hour-and-specials-callout a#tell-more-btn {float: none; margin: 0; padding: 0; display: block; clear: both; margin: 0 auto;}
    #happy-hour-and-specials-callout a#tell-more-btn, #happy-hour-and-specials-callout a#tell-more-btn:hover {width: 180px; background-size: 180px; height: 80px; background-position: 0 0 ;}

    /*----- news page -----*/
    #news-featured #featured-content h3 {margin-bottom: 15px;}
    .whatshapp-title {margin-bottom: 7px;}
    .whatshapp-date {margin-bottom: 13px;}
    .whatshapp-excerpt {margin-bottom: 20px;}

    /*----- news detail page -----*/
    #news-detail-side {width: 100%; height: auto; display: block; position: relative; margin: 0; margin-top: 20px;}
    #news-detail-side p {padding: 0; margin-bottom: 10px;}
    #news-detail-side strong {margin-bottom: 10px; display: block;}
    #news-detail-content {width: 100%; height: auto; display: block; position: relative; margin: 0; margin-top: 20px;}
    #news-detail-content p {margin-bottom: 12px;}

    /*----- downstairs page -----*/
    body.low-content #content {min-height: 536px;}
}

/* 5. Other media-query
------------------------------------------------*/
@media (max-width:680px){
    form.parties .dform_element{width: calc(100% - 20px)}
}
@media (max-width:480px){

    /* default */
    .wrapper{margin: 0 auto -112px; }
    .iphone .wrapper {margin: 0 auto -82px;}

    /* banner */
    #banner {height: 430px !important; }
    #banner .banner-slider {height: 430px !important;}
    #banner .banner-content img {max-width: 70%;}

    /* footer */
    #footer-navigation #footer-menu {margin: 0;}
    #footer-navigation a.footer-facebook {margin-left: 7px;}
    #footer-navigation a.footer-instagram {margin-right: 7px;}
    #footer-navigation #footer-menu li {padding-right: 10px; margin-right: 10px;}
    #footer-copyright {padding: 15px; box-sizing: border-box; margin: 0;}

    /* book table block */
    li.person .sbHolder {width: 147px !important;}
    #book-table-content #book-table-select-menu {display: table;}
    #book-table-content #book-table-select-menu li {width: 100%; display: block; clear: both; float: none; box-sizing: border-box;}
    #book-table-content #book-table-select-menu li .row-icon, #book-table-content #book-table-select-menu li .row-select {display: inline-block; float: none; }

    /* mobile contact informations */
    .mobile-contact {top: -255px;}
    .mobile-contact .address-block, .mobile-contact .hours-block {width: 100%;}

    /*----- about page -----*/
    /* bio page */
    #content #bios-content #bios-profile-image {width:56%; }
    #bios-navigation-previous {top: 90px; background-size: 50px 50px;width: 50px;height: 25px;}
    #bios-navigation-next {top: 90px; background-size: 50px 50px;width: 50px;height: 25px;}
    a#bios-navigation-previous:hover, a#bios-navigation-next:hover {background-position: 0 0;}

    /*----- contact page -----*/
    #page-map, #map { height: 350px !important; }

    /*----- career page -----*/
    #apply-now input {width: 100%;}
    #apply-now .sbHolder {width: 100%;}
    #apply-now .file-upload-button {margin: 0 auto 20px; float: none; width: 100%;}
    #current-openings ul {padding: 0;}
    #current-openings ul li {font-size: 14px;}

    /*----- gallery page -----*/
    #banner.gallery {min-height: calc(100vh - 170px) !important;}
    #banner.gallery .banner-slider {height: calc(100vh - 170px) !important; background-position: center center !important;}

    /*----- menu page -----*/
    #menu .menu-block .menu-item {width: 100%;}
    #menu .menu-block .menu-item.desk {display: none;}
    #menu .menu-block .menu-item.mobile {display: block;}

    /* happy hour callout */
    #happy-hour-and-specials-callout p {line-height: 20px; padding: 15px 0;}

    /*----- news page -----*/
    /* pagination */
    .pagination a, .pagination strong {padding: 0 4px; padding-bottom: 4px;}
}
