body {
  width: 100%;
  zoom: 1; }
  body:before, body:after {
    content: "";
    display: table; }
  body:after {
    clear: both; }

/* grid */
/* breakpoints */
/* other stuff */
/* ---variables--- */
/* off-white */
/* gold */
/* darker gold */
/* dark grey */
/* wider grid */
.grid {
  max-width: 1200px; }

/* ---background colors/styles--- */
body, #header, #scroll, div.lbox {
  background: #333333 url("/images/bg_texture.png") top center repeat; }

#navbar {
  background: rgba(244, 242, 236, 0.9);
  /* background color with transparency */ }

#footer {
  background: none; }

/* shorter billboard img on desktop */
@media screen and (min-width: 1025px) {
  #billboard {
    height: 381px; }

  #scroll {
    margin-top: 380px; } }
/* ---typography--- */
body, p, h2 {
  font-family: "freight-text-pro", serif;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.3em;
  letter-spacing: 0;
  text-transform: none;
  padding-top: 0;
  margin-top: 0;
  color: #F4F2EC; }

h2 {
  padding-bottom: 1em; }

@media screen and (min-width: 668px) {
  h2 {
    font-size: 20px;
    line-height: 1.4em; } }
@media screen and (min-width: 1025px) {
  h2 {
    font-size: 23px; } }
h1 {
  font-family: "freight-sans-pro", sans-serif;
  display: inline-block;
  font-size: 1.5em;
  font-weight: 500;
  text-transform: capitalize;
  letter-spacing: 0;
  word-spacing: 5px;
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 10px;
  margin-bottom: 1em;
  border-bottom: 2px solid #9C7B2D;
  color: #9C7B2D; }

@media screen and (max-width: 667px) {
  h1 {
    padding-bottom: 5px;
    margin-bottom: 0.75em; } }
.fine-print {
  font-size: 0.9em;
  line-height: 1.4em; }

/*@media screen and (min-width: $desktop_min) {
  .fine-print {
    padding: 0 15%;;
  }
}*/
.employee .title, h3, form label, .dresscode-title {
  font-family: "freight-sans-pro", sans-serif;
  font-size: 0.65em;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding-right: 0; }

h3 {
  padding-top: 1.5em;
  padding-bottom: 0.25em; }

.employee {
  margin-bottom: 1em; }

a {
  color: #F4F2EC;
  border-bottom: 1px dotted #F4F2EC; }

a:hover, a:focus, a:active {
  color: #9C7B2D;
  border-bottom: 1px dotted #9C7B2D; }

/* ---navigation - desktop--- */
/* type styles */
#navbar .nav ul li {
  padding: 0 0 0 0.35em; }
  #navbar .nav ul li a, #navbar .nav ul li a:hover, #navbar .nav ul li a:focus {
    font-family: "freight-sans-pro", sans-serif;
    font-size: 0.8em;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0;
    color: #9C7B2D; }
  #navbar .nav ul li a:hover, #navbar .nav ul li a:focus {
    color: #79590C; }
  #navbar .nav ul li a.selected {
    color: #333333; }
#navbar .nav ul li.reservation a, #navbar .nav ul li.reservation a:hover, #navbar .nav ul li.reservation a:focus {
  font-family: "freight-text-pro", serif;
  font-size: 0.9em;
  font-weight: 600;
  font-style: italic;
  text-transform: none;
  letter-spacing: 0; }

/* shorter nav than usual */
@media screen and (min-width: 668px) {
  #navbar #logo {
    height: 55px;
    line-height: 55px; }
  #navbar .nav ul {
    height: 55px; }
    #navbar .nav ul li {
      line-height: 55px; } }
/* smaller nav at tablet */
@media screen and (max-width: 1049px) {
  #navbar .nav ul li {
    padding: 0 0 0 0.25em; }
    #navbar .nav ul li a, #navbar .nav ul li a:hover, #navbar .nav ul li a:focus {
      font-size: 0.75em; }
  #navbar .nav ul li.reservation a, #navbar .nav ul li.reservation a:hover, #navbar .nav ul li.reservation a:focus {
    font-size: 0.85em; } }
/* wrap navigation to two lines */
@media screen and (max-width: 941px) {
  #navbar .nav ul {
    padding-top: 9.1666666667px;
    height: 15.7142857143px;
    line-height: 15.7142857143px; }
    #navbar .nav ul li {
      line-height: 15.7142857143px; } }
/* logo size */
@media screen and (min-width: 668px) {
  #logo img {
    max-height: 35%;
    max-width: 95%; } }
/* ---buttons--- */
/* typography for buttons (a.button and li containing nav a) */
a.button, a.button:hover, a.button:focus, ul.buttons li,
form input.button[type="submit"], form input.button[type="submit"]:hover,
form input.button[type="submit"]:focus,
button, button:hover, button:focus {
  font-family: "freight-sans-pro", sans-serif;
  font-size: 0.75em;
  line-height: 1.7em;
  font-weight: 700;
  background: none;
  border: 2px solid #9C7B2D;
  border-radius: 0; }

/* shift padding to the right side of buttons so left align works */
ul.menus li {
  padding-left: 0;
  padding-right: 0; }

/* set color and padding for buttons */
a.button, ul.buttons li a, form input.button[type="submit"], button {
  color: #9C7B2D;
  padding: 0.5em 1.3em;
  margin: 0.75em 0.25em 0 0.25em; }

/* thicker buttons om mobile */
@media screen and (max-width: 667px) {
  a.button, ul.buttons li a {
    padding: 0.8em 1em;
    margin-right: 0;
    margin-left: 0; } }
/* hover state */
a.button:hover, a.button:focus, a:active
ul.buttons li a:hover, ul.buttons li a:focus, ul.buttons li a:active,
form input.button[type="submit"]:hover, form input.button[type="submit"]:focus,
button:hover, button:focus {
  color: #333333;
  background: #9C7B2D; }

/* create button lists on mobile, for nav and menus */
@media screen and (max-width: 667px) {
  ul.buttons, ul.menus {
    border-top: 2px solid #9C7B2D;
    margin-top: 1em; }
    ul.buttons li, ul.menus li {
      margin-top: 0;
      margin-bottom: 0;
      padding-right: 0;
      border-top: none; }
      ul.buttons li a, ul.buttons li a:hover, ul.buttons li a:focus, ul.buttons li a:active, ul.menus li a, ul.menus li a:hover, ul.menus li a:focus, ul.menus li a:active {
        padding: 0.85em 2em;
        margin-top: 0;
        margin-bottom: 0;
        border-top: none; }

  /* priority-nav button */
  #priority-nav {
    color: #333333;
    background: #9C7B2D;
    font-family: "freight-text-pro", serif;
    font-weight: 600;
    font-size: 1.2em;
    font-style: italic;
    text-transform: none;
    letter-spacing: 0;
    word-spacing: 2px;
    padding: 0.4em 0; }

  #priority-nav:hover, #priority-nav:focus, #priority-nav:active {
    color: #333333;
    background: #79590C;
    border: 2px solid #79590C; } }
a.button + p, a.button + h2 {
  margin-top: 2em; }

/* ---site wide adjustments--- */
/* footer */
#footer p {
  font-size: 0.85em; }

@media screen and (max-width: 667px) {
  #scroll {
    padding-bottom: 200px; } }
/*custom back arrow */
@media screen and (max-width: 667px) {
  #back img {
    display: none; }

  #back {
    background-image: url("/images/back_gold.png"); } }
/* styling for inset-content */
@media screen and (min-width: 668px) {
  .inset-content {
    text-align: center;
    display: inline;
    float: left;
    width: 62.893081761%;
    margin: 0 1.8867924528%;
    margin-left: 18.5534591195%;
    margin-right: 18.5534591195%;
    margin-top: 1.5em; }

  .inset-content + .inset-content {
    margin-top: 1em; } }
@media screen and (min-width: 668px) and (max-width: 1024px) {
  .inset-content {
    display: inline;
    float: left;
    width: 79.5597484277%;
    margin: 0 1.8867924528%;
    margin-left: 10.2201257862%;
    margin-right: 10.2201257862%;
    margin-top: 2em; }

  .inset-content + .inset-content {
    display: inline;
    float: left;
    width: 87.893081761%;
    margin: 0 1.8867924528%;
    margin-left: 6.0534591195%;
    margin-right: 6.0534591195%;
    margin-top: 2em; } }
@media screen and (max-width: 667px) {
  .inset-content {
    display: inline;
    float: left;
    width: 96.2264150943%;
    margin: 0 1.8867924528%;
    margin-top: 0.5em; } }
/* ---page specific styling--- */
/* styling for about box on desktop, index page */
@media screen and (min-width: 668px) {
  body.index #container > #about {
    display: inline;
    float: left;
    width: 62.893081761%;
    margin: 0 1.8867924528%;
    margin-left: 18.5534591195%;
    margin-right: 18.5534591195%;
    padding: 2.5em 3em 3.5em 3em;
    top: 150px;
    background: rgba(35, 31, 29, 0.9);
    opacity: 1;
    text-align: center; }
    body.index #container > #about p, body.index #container > #about h4 {
      color: #F4F2EC; } }
@media screen and (min-width: 668px) and (max-width: 1024px) {
  body.index #container > #about {
    display: inline;
    float: left;
    width: 79.5597484277%;
    margin: 0 1.8867924528%;
    margin-left: 10.2201257862%;
    margin-right: 10.2201257862%;
    padding: 2em; } }
@media screen and (max-width: 667px) {
  body.index #container > #about {
    margin-top: 0.5em; } }
/*position billboard for index page on tablet/mobile */
@media screen and (max-width: 1024px) {
  body.index #billboard {
    background-size: 200%;
    background-position: left center; } }
/* styling for gallery page */
.gallery {
  padding-top: 2em; }

@media screen and (max-width: 1024px) {
  .gallery {
    padding-top: 1em; }
    .gallery a {
      margin-bottom: 1.5em; } }
@media screen and (max-width: 667px) {
  .gallery {
    padding-top: 0; }
    .gallery a {
      margin-bottom: 1em; } }
/* contact */
div.hours {
  margin-top: 0; }

table.hours {
  margin-bottom: 1em; }

.employees {
  margin-bottom: 1em; }

@media screen and (min-width: 668px) {
  .left {
    float: left;
    border-right: 1px solid #F4F2EC; }

  .right {
    float: right; }

  .left, .right {
    text-align: center;
    width: 50%; }

  table.hours {
    margin: 0 auto 1.5em auto; }

  #contact-links {
    padding: 0 1.3em; } }
table.hours th:first-child, table.hours td:first-child {
  text-align: right; }

/*neighbors */
a.neighbor-logo {
  border-bottom: none; }
  a.neighbor-logo img {
    height: 170px;
    padding: 1em;
    padding-top: 0;
    margin-bottom: 1em; }
  a.neighbor-logo img#honor-bar {
    padding: 2em;
    padding-top: 0.75em; }

@media screen and (max-width: 680px) {
  .logos {
    text-align: center; }

  a.neighbor-logo img {
    height: 150px;
    margin-bottom: 0; } }
/* gift card balance */
#balance.lbox h1 {
  width: auto; }
#balance.lbox #gc_balance_results h1 {
  padding-bottom: 10px; }

/* dark placeholder text */
::-webkit-input-placeholder {
  color: #333; }

:-moz-placeholder {
  color: #333; }

::-moz-placeholder {
  color: #333; }

:-ms-input-placeholder {
  color: #333; }

/* social */
ul.social {
  margin-bottom: 1.5em; }

.instagram a {
  background-image: url("/images/shared/instagram-icon-light.png"); }

.yelp a {
  background-image: url("/images/shared/yelp-icon-light.png"); }

.facebook a {
  background-image: url("/images/shared/facebook-icon-light.png"); }

.tripadvisor a {
  background-image: url("/images/shared/tripadvisor-icon-light.png"); }

ul.social li a:hover {
  opacity: 0.9; }