/* Included Mix-Ins */
/* Grids */
/* Colors */
/* Typography */
/* Functions */
/* Mix-Ins */
/*
 * MICRO CLEARFIX

 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 * 3. For IE 6/7 only. Include this rule to trigger hasLayout and contain floats.
 */
.consumer .home h1 {
  font-weight: 700;
  font-size: 3em;
  font-family: "proxima-nova", "Proxima Nova", Helvetica, Arial, sans-serif; }
.consumer .home h2 {
  font-weight: 700;
  font-size: 2.125em;
  color: #393433; }
.consumer .home h3 {
  font-weight: 700;
  font-size: 1.375em;
  color: #393433;
  font-style: normal; }
.consumer .home h4 {
  color: #6D6E71;
  font-size: 1.125em;
  font-style: normal; }
.consumer .text {
  border-top: 1px solid #e2e2e2;
  border-bottom: 1px solid #e2e2e2;
  width: 80%;
  align-content: center;
  padding: 50px 0;
  margin: 0 auto; }
.consumer .store {
  cursor: pointer; }
.consumer .card {
  min-height: 0;
  width: 33.33%; }
  .consumer .card .fixed {
    height: 6em;
    margin-bottom: 2em;
    color: #8A8C8E; }
.consumer .step {
  color: #393433;
  line-height: 68px !important;
  background: #e2e2e2;
  width: 64px;
  height: 64px;
  border-style: none;
  font: 600 1.75em "proxima-nova-condensed", "Proxima Nova Condensed", "Helvetica Condensed Bold", Helvetica, "Arial Black", Arial, sans-serif; }
.consumer .header {
  padding-bottom: 40.277777778%; }
.consumer .headerMsg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  color: #fff;
  padding-top: 6em; }
  .consumer .headerMsg h2 {
    color: #fff; }
  .consumer .headerMsg img {
    width: 29.9305556%; }
.consumer .appStoreArea {
  padding-bottom: 2em; }
.consumer .textMsgArea img {
  padding-bottom: 2em;
  max-width: 100%; }
.consumer .smsInput {
  margin-top: 4em; }
  .consumer .smsInput input {
    line-height: 54px;
    padding: 0 20px;
    font-size: 18px;
    font-weight: 200;
    border: 0;
    border-radius: 8px 0 0 8px; }
  .consumer .smsInput .smsButton {
    line-height: 54px;
    font-size: 18px;
    font-weight: 600;
    color: #FFF;
    padding: 0 20px;
    background-color: #FFD440;
    border-radius: 0 8px 8px 0;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none; }
    .consumer .smsInput .smsButton:disabled {
      background-color: #CBCBCB; }
  .consumer .smsInput p.error {
    margin-top: 10px; }
  .consumer .smsInput input.error {
    color: #F66 !important; }
.consumer .navwrap {
  border-top: 5px solid #97d854;
  -moz-box-shadow: 0 0px 0px;
  -webkit-box-shadow: 0 0px 0px;
  box-shadow: 0 0px 0px; }
.consumer #nav {
  position: absolute;
  font-weight: 300;
  height: 100%;
  right: 1.66667%;
  font-size: 1.125em; }
  .consumer #nav ul {
    height: 100%;
    display: table; }
    .consumer #nav ul li {
      display: table-cell;
      vertical-align: middle;
      height: 100%;
      padding-right: 2.5em; }
      .consumer #nav ul li a {
        font-size: 1.125em;
        font-weight: 600;
        text-decoration: none;
        color: #fff;
        text-align: center;
        cursor: pointer;
        padding: .65em 1.85em .65em 1.2em;
        display: inline-block;
        float: right;
        background-color: #f2ca00;
        border-radius: 8px;
        -webkit-transition-duration: 0.2s;
        -moz-transition-duration: 0.2s;
        transition-duration: 0.2s; }
        .consumer #nav ul li a:hover {
          background: #ffd939; }
        .consumer #nav ul li a:active {
          background: #e0bf28; }
        .consumer #nav ul li a .icon {
          background-position: 0px;
          padding-left: 2.2em;
          padding-top: 0.4em; }
          .consumer #nav ul li a .icon.apple {
            background: url(../img/dining/apple_icon.png) no-repeat;
            background-size: contain; }
          .consumer #nav ul li a .icon.android {
            background: url(../img/dining/android_icon.png) no-repeat;
            background-size: contain;
            background-position-y: 2px; }
.consumer .hasColumns {
  width: 65%; }
.consumer .signupImg {
  max-width: 30%; }
.consumer .headerphone {
  max-width: 99.5%;
  margin: 0 auto;
  display: block; }
.consumer h1.script {
  font-size: 2.5em; }
.consumer .red {
  color: #F66 !important; }
.consumer .appstore {
  margin-top: 10px;
  display: block; }
.consumer #mixpanel {
  display: block;
  margin: 10px 2%;
  float: right; }

@media screen and (max-width: 1240px) {
  .consumer .headerMsg {
    padding-top: 4.5em; }
    .consumer .headerMsg h1 {
      font-size: 2.6em; }
  .consumer h2 {
    font-size: 2em; }
  .consumer .smsInput {
    margin-top: 2.5em; } }
@media screen and (max-width: 1023px) {
  .consumer .headerMsg {
    padding-top: 2em; }
    .consumer .headerMsg img {
      width: 20em; }
    .consumer .headerMsg h1 {
      font-size: 2em; }
  .consumer h2 {
    font-size: 1.5em; }
  .consumer #nav ul li {
    padding-right: .75em; }
  .consumer .smsInput {
    margin-top: 2em; }
    .consumer .smsInput input, .consumer .smsInput .smsButton {
      font-size: 16px;
      line-height: 46px; } }
@media screen and (max-width: 767px) {
  .consumer .card {
    width: 100%;
    min-height: 0; }
    .consumer .card .fixed {
      height: auto; }
  .consumer .home .header .stretch .featured {
    display: none; }
  .consumer .header, .consumer .stretch {
    height: auto;
    position: relative;
    padding: 0; }
  .consumer .headerMsg {
    padding: 2em 0 2em;
    background-image: url("/img/dining/guest_food_767.jpg");
    background-position: top center;
    position: relative; }
    .consumer .headerMsg img {
      display: none; }
    .consumer .headerMsg h1 {
      font-size: 2em; }
    .consumer .headerMsg h2 {
      font-size: 1.5em; }
  .consumer #nav ul li a {
    font-size: 0.75em; } }
@media screen and (max-width: 599px) {
  .consumer #mixpanel {
    float: none !important; }
  .consumer .headerMsg {
    padding-top: 1em; }
    .consumer .headerMsg h1 {
      font-size: 1.5em; }
    .consumer .headerMsg h2 {
      font-size: .9em; }
  .consumer .headerTitle {
    width: 85%;
    margin-left: auto;
    margin-right: auto; }
  .consumer .smsInput input, .consumer .smsInput .smsButton {
    font-size: 14px;
    line-height: 38px; }
  .consumer .navwrap {
    height: 7em; }
  .consumer #nav {
    padding-top: 3em;
    margin: 0 auto;
    width: 100%; }
    .consumer #nav ul {
      width: 100%;
      margin-top: 5px;
      text-align: center; }
      .consumer #nav ul li {
        padding: 0;
        display: inline-block;
        margin: 0 5px; }
        .consumer #nav ul li a {
          font-size: 0.875em; }
  .consumer .content .title .body {
    text-align: left; } }
@media screen and (max-width: 420px) {
  .consumer .smsInput input, .consumer .smsInput .smsButton {
    display: block;
    text-align: center;
    border-radius: 8px; }
  .consumer .smsInput input {
    margin: 0 auto;
    width: 80%; }
  .consumer .smsInput .smsButton {
    margin: 10px auto; }
  .consumer .headerTitle {
    width: 85%; } }
.hostbanner {
  background: #97d854;
  width: 100%;
  text-align: center;
  display: block; }
  .hostbanner a {
    font-weight: 700;
    padding: 15px;
    color: #fff;
    display: block;
    text-decoration: none; }

.legal p {
  text-align: center;
  color: #8A8C8E; }

.rule {
  height: 1px;
  color: #e2e2e2;
  display: block;
  clear: both;
  width: 94%;
  margin: 15px auto; }