/*
Theme Name: Bagel Street
Theme URI: http://designvi.co
Author: DesignViCo
Author URI: http://desginvi.co
Description: Bagel Street 2017 Website
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: Bagel Street
*/
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i");
@font-face {
  font-family: 'Eraser-Regular';
  src: url("fonts/eraser/Eraser-Regular.ttf.woff") format("woff"), url("fonts/eraser/Eraser-Regular.ttf.svg#Eraser-Regular") format("svg"), url("fonts/eraser/Eraser-Regular.ttf.eot"), url("fonts/eraser/Eraser-Regular.ttf.eot?#iefix") format("embedded-opentype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'kavoonregular';
  src: url("fonts/kavoon/kavoon-regular-webfont.woff2") format("woff2"), url("fonts/kavoon/kavoon-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

.m01breakfast h2, .m01breakfast h3 {
  color: #BBAC9B; }

.m02originals h2, .m02originals h3 {
  color: #C49B6C; }

.m03veggie h2, .m03veggie h3 {
  color: #0CA86C; }

.m04poultry h2, .m04poultry h3 {
  color: #E5ADCD; }

.m05carvivorous h2, .m05carnivorous h3 {
  color: #FF7B40; }

.m06italian h2, .m06italian h3 {
  color: #EF4E1D; }

.m07tofu h2, .m07tofu h3 {
  color: #BBAC9B; }

.m08salads h2, .m08salads h3 {
  color: #0CA86C; }

.m09sides h2, .m09sides h3 {
  color: #33D7FA; }

.m10dessert h2, .m10dessert h3 {
  color: #fff; }

.m11by0 h2, .m11byo h3 {
  color: #F6FF12; }

.hash {
  font-family: 'Open Sans', sans-serif; }

.anchor {
  display: block;
  position: relative;
  top: -140px;
  visibility: hidden; }

.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
  transition: none !important; }

html {
  font-family: 'Open Sans', sans-serif; }

img {
  max-width: 100%;
  height: auto; }

.inside {
  padding: 20px;
  box-sizing: border-box; }

.sub_inside {
  padding: 20px;
  box-sizing: border-box; }

h1 {
  font-family: "kavoonregular";
  font-weight: normal;
  font-size: 3.0em; }

h2 {
  font-weight: 300; }

h3, h4 {
  font-family: "Eraser-Regular";
  font-weight: normal; }

a:link, a:active, a:visited {
  color: gray; }

a:hover {
  color: #7C2121; }

a {
  transition: color 0.3s ease; }

.hide {
  opacity: 0 !important; }

.phone {
  color: #fff;
  font-size: .67em;
  padding-top: 10px; }

#background {
  height: 100vh;
  overflow: hidden;
  position: absolute; }
  #background .dynamic_img {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    height: 100vh;
    justify-content: center;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: -1; }
    #background .dynamic_img img {
      box-sizing: border-box;
      flex-shrink: 0;
      max-width: none;
      min-height: 100%;
      min-width: 100%; }
    #background .dynamic_img .overlay {
      background: rgba(0, 0, 0, 0.3);
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0; }

#main_header {
  background: transparent;
  transition: background 0.3s ease; }
  #main_header .logo {
    text-align: center; }
    #main_header .logo a {
      width: 240px; }
  #main_header #main_nav {
    font-family: 'Eraser-Regular'; }
    #main_header #main_nav ul {
      margin: 0;
      padding: 0;
      list-style: none; }
      #main_header #main_nav ul li a {
        display: block;
        text-decoration: none;
        position: relative; }
        #main_header #main_nav ul li a span {
          position: absolute;
          left: 0;
          width: 100%;
          top: 6px; }
        #main_header #main_nav ul li a span:first-child {
          -webkit-text-stroke: 6px #7C2121;
          text-stroke: 6px #7C2121;
          opacity: 0;
          transition: opacity 0.3s ease; }
      #main_header #main_nav ul li a:hover span:first-child {
        opacity: 1; }
      #main_header #main_nav ul li.social a {
        display: inline-block;
        padding: 0; }

.horizontal {
  width: 100%;
  height: 35px;
  background: url(img/wood_horizontal.jpg) repeat-x center center; }

.board {
  display: flex;
  justify-content: space-between;
  background: url(img/BSD-ChalkBoard.png) center top;
  font-family: "Eraser-Regular";
  position: relative; }
  .board .vertical {
    width: 35px;
    background: url(img/wood_vertical.jpg) repeat-y center center; }

.chalkboard {
  color: #fff;
  padding: 10px;
  box-sizing: border-box;
  width: 100%;
  overflow: scroll;
  /*height: 750px;*/
  position: relative; }

.menu_nav {
  text-align: center;
  width: 240px; }
  .menu_nav ul {
    padding: 20px 0 0;
    margin: 0;
    list-style: none; }
    .menu_nav ul a {
      text-decoration: none;
      display: block;
      padding: 2px 0; }
      .menu_nav ul a .big {
        font-size: 2.0em; }
      .menu_nav ul a .med {
        font-size: 1.4em; }
    .menu_nav ul .breakfast a {
      color: #BBAC9B; }
    .menu_nav ul .originals a {
      color: #C49B6C; }
    .menu_nav ul .veggie a {
      color: #0CA86C; }
    .menu_nav ul .poultry a {
      color: #E5ADCD; }
    .menu_nav ul .carnivorous a {
      color: #FF7B40; }
    .menu_nav ul .italian a {
      color: #EF4E1D; }
    .menu_nav ul .tofu a {
      color: #BBAC9B; }
    .menu_nav ul .dessert a {
      color: #BBAC9B; }
    .menu_nav ul .sides a {
      color: #33D7FA; }
    .menu_nav ul .byo a {
      color: #F6FF12; }

#the_menu {
  text-align: center;
  font-size: 1.2em; }
  #the_menu p {
    font-size: .9em; }
  #the_menu .items article {
    padding: 5px;
    box-sizing: border-box; }

#map {
  width: 100%;
  height: 500px; }

#widget {
  background: rgba(124, 33, 33, 0.9);
  color: #fff; }
  #widget input[type=text], #widget input[type=email], #widget input[type=button], #widget input[type=submit], #widget textarea {
    border: 0;
    box-sizing: border-box;
    color: #000 !important;
    border: none;
    padding: 4px;
    background: #fff; }

.nf-form-fields-required {
  display: none; }

.nf-field-container {
  margin-bottom: 8px !important; }

.firstHeading {
  font-size: 1.4em;
  color: #7C2121; }

.order {
  padding-bottom: 20px; }
  .order h2 {
    color: #33D7FA; }
  .order h3 {
    color: #F6FF12; }

@media only screen and (max-width: 767px) {
  .breakpoint1 {
    display: block; }
  #menu_out {
    display: none; }
  #main_header .logo a {
    display: inline-block; }
  #main_header #main_nav {
    font-size: 2em;
    letter-spacing: 0.0625em; }
    #main_header #main_nav ul {
      margin: 10px 0;
      text-align: center; }
      #main_header #main_nav ul li a {
        padding: 30px 0;
        color: #fff; }
      #main_header #main_nav ul li.social a {
        margin: 10px 0 0; }
  #callto {
    width: 100%;
    height: 600px;
    overflow: hidden;
    position: relative; }
    #callto img {
      max-width: none;
      width: 1400px;
      left: 50%;
      margin-left: -900px;
      position: absolute;
      margin-top: -200px; }
    #callto .inside {
      position: absolute;
      top: 40px;
      right: 40px;
      bottom: 40px;
      left: 40px;
      background: rgba(0, 0, 0, 0.4);
      color: #fff;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center; }
      #callto .inside h1 {
        margin: 0; }
  .menu_nav {
    margin-left: auto;
    margin-right: auto; } }

@media only screen and (min-width: 768px) {
  #menu_in {
    display: none; }
  #menu_out {
    z-index: 10; }
  #menu_out.sticky {
    position: fixed;
    top: -100px; }
  #menu_out.bottom {
    bottom: 10px; }
  #main_header {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 100; }
    #main_header .inside {
      position: relative; }
    #main_header .logo {
      width: 200px;
      float: left; }
    #main_header #main_nav {
      font-size: 1.8em;
      margin-left: 280px; }
      #main_header #main_nav ul {
        margin: 0; }
        #main_header #main_nav ul li {
          display: inline-block;
          width: 140px; }
          #main_header #main_nav ul li a {
            color: #fff; }
            #main_header #main_nav ul li a span {
              width: 100%; }
        #main_header #main_nav ul li.social {
          width: 570px;
          position: absolute;
          right: 0;
          top: 0; }
          #main_header #main_nav ul li.social .sub_social {
            display: inline-block;
            float: right; }
          #main_header #main_nav ul li.social a {
            width: 40px;
            padding: 3px;
            box-sizing: border-box; }
  #main_header.sticky {
    background: rgba(124, 33, 33, 0.9); }
  #sub_header {
    margin-top: 140px; }
  #callto {
    width: 100%;
    height: 500px;
    overflow: hidden;
    position: relative; }
    #callto img {
      max-width: none;
      width: 1400px;
      left: 50%;
      margin-left: -700px;
      position: absolute;
      margin-top: -200px; }
    #callto .inside {
      position: absolute;
      top: 100px;
      right: 60px;
      bottom: 100px;
      left: 60px;
      background: rgba(0, 0, 0, 0.4);
      color: #fff;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center; }
      #callto .inside h1 {
        margin: 0; }
  .menu_nav {
    position: absolute;
    margin-top: 10px;
    margin-left: 20px; } }

@media only screen and (min-width: 768px) and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
  .menu_nav {
    margin-left: 40px; } }

@media only screen and (min-width: 768px) {
  #the_menu {
    margin-left: 270px;
    padding-right: 10px;
    box-sizing: border-box; }
  #the_menu p {
    font-size: .9em; }
  #the_menu .items {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
    #the_menu .items article {
      width: 50%; }
  #site_footer {
    position: relative; }
    #site_footer #widget {
      position: absolute;
      top: 20px;
      bottom: 20px;
      left: 20px;
      width: 40%;
      z-index: 10; } }

@media only screen and (min-width: 1400px) {
  .inside {
    width: 1400px;
    margin-left: auto;
    margin-right: auto; } }

#main_header .st0 {
  fill: #7C2121;
  transition: fill 0.3s ease; }

#main_header .st1 {
  fill: #F9C112; }

#main_header .st2 {
  fill: #FFFFFF;
  transition: fill 0.3s ease; }

#main_header.sticky .st0 {
  fill: #FFFFFF; }

#main_header.sticky .st1 {
  fill: #F9C112; }

#main_header.sticky .st2 {
  fill: #7C2121; }
