/*
Welcome to Custom CSS!

To learn how this works, see http://wp.me/PEmnE-Bt
*/
.widget.widget_text {
	width: 25%;
}

#jetpack_widget_social_icons-3 {
	width: 25%;
}

.footer-information {
	display: none;
}

#header h1.site-title {
    display: none;
}

.section-blurb p,
.menu-wrapper > div > div > p {
  font-size: 9px;
}
@media screen and (min-width: 320px) {
  .section-blurb p,
  .menu-wrapper > div > div > p {
    font-size: calc(9px + 4 * ((100vw - 320px) / 960));
  }
}
@media screen and (min-width: 1280px) {
  .section-blurb p,
  .menu-wrapper > div > div > p {
    font-size: 12px;
  }
}

.outer-wrapper {
  margin: 1em;
}
.outer-wrapper .outer-border {
  border: 2px solid #e8a800;
  padding: 1em;
}
.outer-wrapper .outer-border h2 {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  font-size: 9px;
  margin: 1em auto;
  color: #e8a800;
  font-weight: bolder;
  text-transform: uppercase;
}
.outer-wrapper .outer-border .brand-logo {
  width: 100%;
  height: auto;
  min-width: 200px;
  max-width: 400px;
  margin: 0 auto;
  display: block;
}

.section-blurb {
  text-align: center;
  line-height: normal;
  font-size: 9px;
}
.section-blurb p {
  padding: 2px;
  text-align: center;
  line-height: normal;
  width: 100%;
  margin: 0 auto;
}

.menu-wrapper {
  display: flex;
  flex-wrap: wrap;
}
.menu-wrapper [class^="col-"] {
  width: 100%;
  margin: 0;
}
.menu-wrapper [class^="col-"] h2 .item-price {
  font-size: 9px;
  float: right;
  display: inline;
  text-align: right;
  font-weight: bolder;
  color: #000;
}
.menu-wrapper [class^="col-"] .menu-item {
  padding: 0;
  border-bottom: 2px dotted #eee;
}
.menu-wrapper [class^="col-"] .menu-item.add-on {
  padding: 0;
}
.menu-wrapper [class^="col-"] .menu-item span.item-price {
  float: right;
  display: inline;
  text-align: right;
  font-weight: bolder;
}
.menu-wrapper [class^="col-"] .menu-item p[class^="item"] {
  font-size: 9px;
}
.menu-wrapper [class^="col-"] .menu-item p.item-name {
  font-weight: bolder;
  text-transform: uppercase;
}
.menu-wrapper [class^="col-"] .menu-item p.item-desc {
  font-style: italic;
  font-size: 9px;
  line-height: normal;
  width: 90%;
}
.menu-wrapper [class^="col-"] .menu-item p.item-desc.bolded {
  font-weight: bolder;
}
.menu-wrapper [class^="col-"] .menu-item p {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  padding: 2px 0;
  margin: 0;
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
  /* For desktop: */
  .section-blurb h2 {
    font-size: 16px;
  }
  .section-blurb p {
    font-size: 12px;
    width: 95%;
  }

  .outer-wrapper {
    margin: 0;
  }
  .outer-wrapper .outer-border {
    padding: 1em;
  }
  .outer-wrapper .outer-border h2 {
    font-size: 16px;
  }
  .outer-wrapper .outer-border .menu-wrapper {
    flex-wrap: nowrap;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] {
    width: 45%;
    margin: 25px;
    flex-wrap: wrap;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] h2,
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] h2 .item-price {
    font-size: 16px;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] .menu-item {
    padding: 5px 0;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] .menu-item p[class^="item"] {
    font-size: 12px;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] .menu-item p.item-desc {
    font-size: 12px;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] .menu-item p {
    font-size: 12px;
  }
}
@media only screen and (min-width: 1024px) {
  /* For desktop: */
  .section-blurb h2 {
    font-size: 16px;
  }
  .section-blurb p {
    font-size: 12px;
    width: 95%;
  }

  .outer-wrapper {
    margin: 0;
  }
  .outer-wrapper .outer-border {
    padding: 0;
  }
  .outer-wrapper .outer-border h2 {
    font-size: 16px;
  }
  .outer-wrapper .outer-border .menu-wrapper {
    flex-wrap: nowrap;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] {
    width: 45%;
    margin: 25px;
    flex-wrap: wrap;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] h2,
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] h2 .item-price {
    font-size: 16px;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] .menu-item p[class^="item"] {
    font-size: 12px;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] .menu-item p.item-desc {
    font-size: 12px;
  }
  .outer-wrapper .outer-border .menu-wrapper [class^="col-"] .menu-item p {
    font-size: 12px;
  }
}