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

/* grid */
/* breakpoints */
/* other stuff */
/* variables */
/*#403F42;*/
/* dark gray */
/*#403F42;*/
/* dark gray */
/*#69B9C9;*/
/* light blue */
/* dark blue */
/* off-white */
/* wider grid */
.grid {
  max-width: 1400px; }

/* background color/texture */
body, #header, #scroll, div.lbox {
  background: #141C21;
  /* dark blue */ }

#navbar {
  background: #F9F8F5;
  /* white */ }

#footer {
  background: none; }

/* ---typography defaults--- */
body, p {
  font-family: "calluna-sans", sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.5em;
  color: #BFB8AA;
  /* cream */ }

@media screen and (max-width: 667px) {
  body, p {
    font-size: 19px; } }
.italic {
  font-style: italic;
  line-height: 1.3em; }

hr {
  width: 30px;
  height: 4px;
  text-align: left;
  margin: 0 auto 0.75em auto;
  border: none;
  background: #C39C44;
  /* yellow */
  color: #C39C44;
  /* yellow */ }

body.index hr {
  margin-bottom: 1.5em;
  margin-left: 0;
  width: 60px; }

h1, h2, h3, h4, h5 {
  font-family: "calluna-sans", sans-serif;
  font-size: 1.3em;
  line-height: 1.3em;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: #BFB8AA;
  /* cream */
  padding: 0;
  margin-top: 0;
  margin-bottom: 0.75em;
  text-align: left; }

@media screen and (max-width: 667px) {
  h1 {
    font-size: 1.4em; } }
a {
  color: #C39C44;
  /* yellow */
  border-bottom: 1px dotted #C39C44;
  /* yellow */ }

a:hover, a:focus {
  color: #C39C44;
  /* yellow */
  border-bottom: 1px solid #C39C44;
  /* yellow */ }

.employee .title, h4, .dresscode-title {
  font-family: "calluna-sans", sans-serif;
  font-weight: 700;
  font-size: 0.65em;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  line-height: 1.2em;
  margin-bottom: 0.25em;
  color: #68717F; }

@media screen and (max-width: 667px) {
  .employee .title, h4, .dresscode-title {
    font-size: 0.75em; } }
.dresscode-title {
  margin-top: 1.5em; }

hr + h4 {
  margin-bottom: 2em; }

.fine-print {
  font-size: 0.85em;
  line-height: 1.3em; }

/* buttons */
a.button, a.button:hover, a.button:focus,
form input.button[type="submit"], form input.button[type="submit"]:hover,
form input.button[type="submit"]:focus {
  border-radius: 0;
  background: none;
  border: 1px solid #464A4E;
  /* mid grey */
  margin-right: 0.25em;
  font-family: "calluna-sans", sans-serif;
  font-size: 0.55em;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #BFB8AA;
  /* cream */
  padding: 0.3em 1.1em;
  line-height: 36px; }

a.button:hover, a.button:focus,
form input.button[type="submit"]:hover,
form input.button[type="submit"]:focus {
  color: #202A31;
  /* dark blue */
  background: #C39C44;
  /* yellow */
  border: 1px solid #C39C44;
  /* yellow */ }

@media screen and (max-width: 667px) {
  a.button, a.button:hover, a.button:focus {
    font-size: 0.8em;
    padding: 0.8em 1.1em;
    margin-bottom: 0.75em; }

  a.button {
    color: #202A31;
    /* dark blue */
    background: #C39C44;
    /* yellow */
    border: 1px solid #C39C44;
    /* yellow */ } }
.gc-links, ul.menus, .buttons-container {
  margin-top: 1em; }

@media screen and (max-width: 667px) {
  .gc-links, ul.menus, .buttons-container {
    margin-top: 2.5em; } }
ul.buttons {
  border-top: none; }

ul.buttons li {
  background: #C39C44;
  /* yellow */
  border: none;
  margin-bottom: 0.5em; }
  ul.buttons li a {
    color: #202A31;
    /* dark blue */
    padding: 1em 0;
    font-size: 0.8em;
    font-weight: 700;
    letter-spacing: 0.05em; }

ul.buttons li:hover, ul.buttons li:focus {
  opacity: 0.8; }

/* nav */
@media screen and (min-width: 668px) {
  #logo {
    display: inline;
    float: left;
    width: 21.2264150943%;
    margin: 0 1.8867924528%; }

  #navbar .nav ul {
    display: inline;
    float: left;
    width: 71.2264150943%;
    margin: 0 1.8867924528%; }

  #logo img {
    max-height: 60%;
    max-width: 100%; } }
#navbar .nav ul li a, #navbar .nav ul li a:hover, #navbar .nav ul li a:focus {
  font-family: "calluna-sans", sans-serif;
  font-weight: 600;
  font-size: 0.7em;
  letter-spacing: 0;
  text-transform: capitalize;
  color: #161919; }
#navbar .nav ul li a:hover, #navbar .nav ul li a:focus, #navbar .nav ul li a.selected {
  color: #6A7E9C; }

@media screen and (max-width: 780px) {
  #navbar .nav ul li {
    padding: 0 0.15em; }
    #navbar .nav ul li a, #navbar .nav ul li a:hover, #navbar .nav ul li a:focus {
      font-size: 0.62em; } }
/*custom back arrow */
@media screen and (max-width: 667px) {
  #back img {
    display: none; }

  #back {
    background-image: url("/images/back_navy.png"); } }
@media screen and (max-width: 667px) {
  .not-mobile {
    display: none !important; } }
/* footer */
#footer p, #footer a {
  font-size: 13px; }
#footer a {
  color: #BFB8AA;
  /* cream */
  border-bottom: 1px dotted #BFB8AA;
  /* cream */ }
#footer a:hover, #footer a:focus {
  color: #BFB8AA;
  /* cream */
  border-bottom: 1px solid #BFB8AA;
  /* cream */ }

@media screen and (max-width: 667px) {
  #scroll {
    padding-bottom: 170px; }

  #footer p {
    font-size: 0.75em; } }
/* page specific */
/* index page */
@media screen and (min-width: 668px) {
  body.index #scroll > #container > #about {
    background: none;
    /* dark blue */
    display: inline;
    float: left;
    width: 46.2264150943%;
    margin: 0 1.8867924528%;
    margin-left: 51.8867924528%;
    margin-right: 1.8867924528%;
    top: 0;
    margin-top: -1em;
    padding: 0 2em;
    font-size: 1em;
    text-shadow: none;
    opacity: 1;
    position: relative;
    top: 50%;
    transform: translateY(-50%); }

  body.index #container {
    height: 100%; } }
@media screen and (max-width: 1024px) and (min-width: 668px) {
  body.index #scroll > #container > #about {
    padding: 0;
    padding-left: 1em; } }
@media screen and (max-width: 667px) {
  body.index #billboard {
    background-size: 200%;
    background-position: bottom left; }

  body.index #scroll > #container > #about {
    display: inline;
    float: left;
    width: 96.2264150943%;
    margin: 0 1.8867924528%;
    margin-top: 1em;
    margin-bottom: 1em; } }
/* general layout */
@media screen and (max-width: 667px) {
  #container {
    padding-left: 0.5em;
    padding-right: 0.5em; } }
.left-col {
  display: inline;
  float: left;
  width: 37.893081761%;
  margin: 0 1.8867924528%;
  margin-left: 10.2201257862%; }

.right-col {
  display: inline;
  float: left;
  width: 37.893081761%;
  margin: 0 1.8867924528%;
  margin-right: 10.2201257862%; }

.left-col, .right-col {
  text-align: left;
  margin-top: 2em; }

@media screen and (min-width: 668px) {
  .left-col {
    border-right: 1px solid #464A4E;
    /* middle grey */
    padding-right: 2em; } }
@media screen and (max-width: 1024px) {
  .left-col, .right-col {
    display: inline;
    float: left;
    width: 46.2264150943%;
    margin: 0 1.8867924528%;
    margin-left: 1.8867924528%;
    margin-right: 1.8867924528%;
    margin-top: 2em; }

  .left-col {
    padding-right: 1em; } }
@media screen and (max-width: 667px) {
  .left-col, .right-col {
    display: inline;
    float: left;
    width: 96.2264150943%;
    margin: 0 1.8867924528%;
    margin-top: 1em; }

  .left-col {
    padding-right: 0; } }
@media screen and (min-width: 668px) and (max-width: 1024px) {
  #scroll {
    margin-top: 351px;
    /* hack, fix correctly in two.css */ } }
/* gallery */
.gallery {
  padding-top: 1em; }
  .gallery a {
    margin-bottom: 1em; }

@media screen and (max-width: 667px) {
  .gallery {
    padding-top: 0; } }
/* contact page */
.employee .title {
  display: inline;
  padding-right: 0.5em; }

.employee {
  margin-bottom: 0;
  line-height: 1.3em; }

.contact-container {
  margin-bottom: 1.5em; }

/*@media screen and (min-width: $desktop_min) {
  .contact-container, .hours-container {
    float: left;
    width: 50%;
  }
}*/
div.hours {
  margin-top: 0.25em; }

@media screen and (max-width: 667px) {
  .contact-container, .hours-container {
    width: 100%; } }
.employees-container, .buttons-container {
  clear: left; }

.address, .phone, .hours, .employee .name, .aside, .dresscode {
  font-size: 19px;
  line-height: 1.3em; }

@media screen and (max-width: 667px) {
  .address, .phone, .hours, .employee .name, .aside, .dresscode {
    font-size: 17px; } }
#map {
  max-width: 90%;
  padding: 1.5em;
  padding-left: 0; }

@media screen and (max-width: 667px) {
  #map {
    max-width: 100%;
    padding-right: 0; } }
/* gift card balance */
#balance.lbox {
  background: #141C21; }
  #balance.lbox label {
    font-family: "calluna-sans", sans-serif; }
  #balance.lbox #error-notice {
    font-size: 0.85em;
    line-height: 1.2em; }
  #balance.lbox form input[type="tel"] {
    border: solid 1px #6B757B;
    background-color: rgba(255, 255, 255, 0.2); }
  #balance.lbox form input[type="tel"]:active, #balance.lbox form input[type="tel"]:focus {
    background-color: rgba(255, 255, 255, 0.35); }

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

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

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

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

ul.social li a {
  opacity: 0.85; }

ul.social {
  margin-bottom: 0; }