@font-face {
  font-family: 'growler_scriptregular';
  src: url("../library/fonts/growlerscript-regular-webfont.eot");
  src: url("../library/fonts/growlerscript-regular-webfont.eot#iefix") format("embedded-opentype"), url("../library/fonts/growlerscript-regular-webfont.woff") format("woff"), url("../library/fonts/growlerscript-regular-webfont.svg#growler_scriptregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

body {
    margin-top: -15px;
}

/* 	==================================================
	top banner
======================================================  */
/* line 19, ../sass/base.scss */
.banner {
  width: 100%;
  height: 5.25em;
  padding: .5em 4em;
  background-color: #c43a31;
  position: absolute;
  text-align: center;
  font-size: 1em;
}

/* line 29, ../sass/base.scss */
.my-x {
  position: fixed;
  top: 1.25em;
  right: 1.5em;
  cursor: pointer;
}

/* 	==================================================
	body
======================================================  */
/* line 40, ../sass/base.scss */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* 	==================================================
	main wrapper
======================================================  */
/* line 52, ../sass/base.scss */
#wrapper {
  width: 100%;
  height: 100%;
  overflow: scroll;
  margin: 0 auto;
  transition: opacity .25s;
}

/* 	==================================================
	header
======================================================  */
/* line 67, ../sass/base.scss */
header {
  display: block;
}

/* 	==================================================
	eastside
======================================================  */
/* line 77, ../sass/base.scss */
.eastside {
  width: 100%;
  position: fixed;
  top: 30%;
  font-size: 5em;
  text-align: center;
  text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
}

/* 	==================================================
	sample menu
======================================================  */
/* line 92, ../sass/base.scss */
.sample-menu {
  display: block;
  background-color: #EFEEED;
  width: 100%;
  height: 100%;
  padding: 10px;
  text-align: center;
  letter-spacing: .1em;
  overflow: scroll;
}

/* line 104, ../sass/base.scss */
.styled-menu {
  display: block;
  color: #000;
  font-family: 'Montserrat', sans-serif;
}

/* line 111, ../sass/base.scss */
.menu-type {
  text-align: center;
  padding: 20px;
  margin: 0 auto;
}

/* 	==================================================
	flex container top
======================================================  */
/* line 124, ../sass/base.scss */
.flex-wrapper-top {
  position: fixed;
  padding: 0;
  width: 100%;
  margin-top: 15px;
/*   top: 5.25em; */
}

/* line 131, ../sass/base.scss */
.flex-container-top {
  padding: 1em;
  padding-bottom: 100px;
  margin: 0;
  list-style: none;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-align-content: stretch;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
/*background-color: #000000;*/
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.60)), to(rgba(0, 0, 0, 0.00)));
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.00));
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.00));
background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.00));
background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.00));
background-image: linear-gradient(top, rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.00));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#000000', EndColorStr='#000000');
}

/* line 163, ../sass/base.scss */
.flex-item {
  -webkit-order: 0;
  -ms-flex-order: 0;
  order: 0;
  -webkit-flex: 0 1 auto;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  -webkit-align-self: auto;
  -ms-flex-item-align: auto;
  align-self: auto;
  font-family: 'Montserrat', sans-serif;
  font-size: .5em;
  letter-spacing: .1em;
  text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.45);
  color: #fff;
  text-align: center;
}

/* line 181, ../sass/base.scss */
.flex-item a {
  display: inline-block;
  margin: .2em;
}

/* line 186, ../sass/base.scss */
.flex-item a img {
  height: 1.25em;
}

/* 	==================================================
	flex container bottom
======================================================  */
/* line 193, ../sass/base.scss */
.flex-wrapper-bottom {
  position: fixed;
  padding: 0;
  width: 100%;
  bottom: 0em;
}

/* line 200, ../sass/base.scss */
.flex-container-bottom {
  padding: 1em;
  padding-top: 100px;
  margin: 0;
  list-style: none;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-align-content: stretch;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  /*background-color: #000000;*/
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.00)), to(rgba(0, 0, 0, 0.60)));
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.60));
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.60));
background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.60));
background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.60));
background-image: linear-gradient(top, rgba(0, 0, 0, 0.00), rgba(0, 0, 0, 0.60));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#000000', EndColorStr='#000000');

}

/* 	==================================================
	about container
======================================================  */
/* line 237, ../sass/base.scss */
.about-container {
  width: 100%;
  margin: 0 auto;
  background-color: #000;
}

/* 	==================================================
	about
======================================================  */
/* line 250, ../sass/base.scss */
.about {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 4.5em;
  font-size: .75em;
  letter-spacing: .05em;
  overflow: scroll;
}

/* 	==================================================
	hours
======================================================  */
/* line 266, ../sass/base.scss */
.hours {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 3em 0 2em 0;
  text-align: center;
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  font-size: 1em;
  line-height: 1.5em;
}

/* 	==================================================
	contact
======================================================  */
/* line 285, ../sass/base.scss */
.contact {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 3em 0 2em 0;
  text-align: center;
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  font-size: 1em;
  line-height: 1.5em;
  background-color: #000;
}

/* 	==================================================
	e icon
======================================================  */
/* line 305, ../sass/base.scss */
.e-icon {
  text-align: center;
  padding: 1.6em;
  margin: 0 auto;
}

/* 	==================================================
	breaker
======================================================  */
/* line 317, ../sass/base.scss */
.breaker {
  color: #666;
  font-size: 2em;
  margin: 0;
  padding: 0;
  text-align: left;
}

.breaker2 {
  color: #666;
  font-size: 2em;
  margin: 0;
  padding: 0;
  text-align: left;
  text-indent: -9999px;
}

/* 	==================================================
	type
======================================================  */
/* 	==================================================
	links
======================================================  */
/* line 365, ../sass/base.scss */
a {
  text-decoration: none;
}

/* line 368, ../sass/base.scss */
a:link {
  color: #fff;
}

/* line 371, ../sass/base.scss */
a:visited {
  color: #fff;
}

/* 	==================================================
	social icons
======================================================  */
/* line 385, ../sass/base.scss */
.icons {
  display: inline;
  text-align: center;
}

/* line 390, ../sass/base.scss */
.icons a {
  padding: 1em;
}

/* line 395, ../sass/base.scss */
.icons img {
  width: .5em;
}

/* 	==================================================
	modal
======================================================  */
/* line 407, ../sass/base.scss */
.modal {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: -9999999;
  height: 100%;
  opacity: 0;
  transition: opacity .1s ease-in-out;
  -moz-transition: opacity .1s ease-in-out;
  -webkit-transition: opacity .1s ease-in-out;
}
/* line 418, ../sass/base.scss */
.modal.visible {
  z-index: 10;
  opacity: .9;
  transform: scale(1);
}
/* line 424, ../sass/base.scss */
.modal .close-modal {
  position: fixed;
  top: 1.5em;
  right: 1.5em;
  cursor: pointer;
}

/* line 433, ../sass/base.scss */
.shadow {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
  background: white;
  opacity: 0;
  transition: opacity .1s;
}
/* line 444, ../sass/base.scss */
.shadow.visible {
  z-index: 9;
  opacity: .8;
}

/* line 450, ../sass/base.scss */
#wrapper.modal-open {
  overflow: hidden;
}

/* 	==================================================
	breakpoints
======================================================  */
@media (min-width: 469px) {
  /* line 2, ../sass/_468AndUp.scss */
  .eastside {
    top: 25%;
  }

  /* line 5, ../sass/_468AndUp.scss */
  .about {
    padding: 4.5em 5em;
    font-size: .8em;
  }

  /* line 9, ../sass/_468AndUp.scss */
  .flex-item {
    font-size: .6em;
    letter-spacing: .2em;
  }

  /* line 13, ../sass/_468AndUp.scss */
  .banner {
    width: 100%;
    height: 4em;
    padding: .4em 4em;
    background-color: #c43a31;
    position: absolute;
    text-align: center;
    font-size: 1em;
  }

  /* line 23, ../sass/_468AndUp.scss */
  .my-x {
    position: fixed;
    top: 1em;
    right: 1.5em;
    cursor: pointer;
  }

  /* line 29, ../sass/_468AndUp.scss */
  .flex-wrapper-top {
/*     top: 4em; */
  }
}
@media (min-width: 601px) {
  /* line 2, ../sass/_600AndUp.scss */
  .about {
    font-size: .9em;
  }

  /* line 5, ../sass/_600AndUp.scss */
  .flex-item {
    font-size: .8em;
  }
}
@media (min-width: 769px) {
  /* line 2, ../sass/_768AndUp.scss */
  .eastside {
    font-size: 10em;
    top: 22%;
  }

  /* line 6, ../sass/_768AndUp.scss */
  .about {
    padding: 5.5em 7.5em;
    font-size: .95em;
  }
}
@media (min-width: 961px) {
  /* line 2, ../sass/_960AndUp.scss */
  .about {
    padding: 5.5em 8.5em;
    font-size: .95em;
  }
}
@media (min-width: 1101px) {
  /* line 2, ../sass/_1100AndUp.scss */
  .about {
    padding: 5em 15em;
  }
}
/* line 4, ../sass/_variables.scss */
.eastside-title, h1 {
  font-family: "growler_scriptregular";
  color: #fff;
  font-weight: normal;
  font-style: normal;
  -webkit-font-kerning: normal;
}

/* line 13, ../sass/_variables.scss */
.menu-titles, h2 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  font-size: .85em;
  color: #000;
  padding: 1.5em;
}


h2 .smaller {
    font-size: .65em;
}


/* line 21, ../sass/_variables.scss */
.menu-items, p {
  font-family: 'Montserrat', sans-serif;
  padding-top: .25em;
  font-weight: 400;
  font-size: .69em;
  color: #000;
  line-height: 1.8em;
  padding: 1.5em;
}

/* line 32, ../sass/_variables.scss */
.about-text, h3 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  font-size: 1.5em;
  line-height: 1.5em;
  color: #fff;
  text-align: left;
}

/* line 42, ../sass/_variables.scss */
.menu-category, h5 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  font-size: 1em;
  margin: 2em;
}

/* line 50, ../sass/_variables.scss */
.navs, h4 {
  font-family: 'Montserrat', sans-serif;
  font-size: .8em;
  letter-spacing: .2em;
}

/* line 56, ../sass/_variables.scss */
.footer-links, h6 {
  font-family: 'Montserrat', sans-serif;
  color: #fff;
  font-size: .8em;
  letter-spacing: .1em;
}

.picgall .item {
    float: left;
    display: inline-block;
    width: 50%;
}

.picgall .item img {
    height: auto;
    padding: 5px;
    width: 100%;
}

.aligncenter {
	display: block;
    margin: 0 auto;
    margin-bottom: 40px;
}

ul.bulletwhite {
	margin: 30px 0;
	padding-left: 40px;
}

ul.bulletwhite li {
	color: #fff;
	font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 1.5em;
    line-height: 1.5em;
    color: #fff;
    text-align: left;
}

.imagegrid img {
	display: inline-block;
	margin: 0;
	width: 25%;
    height: auto;
}

/* Responsive Overrides */

/* Greater then tablets
-------------------------------------------------------------- */
@media only screen and (min-width: 768px) {

    
}


/* Tablet & Small Desktop Widths 768px - 1280px
--------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 1280px) {
    

}


/* All Devices under 960px
--------------------------------------------------------------*/
@media only screen and (max-width: 959px) {
    
}

/* Tablet Landscape
--------------------------------------------------------------*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
   
}

/* Tablet Portrait
--------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

}

/* Between Phone and Mobile
--------------------------------------------------------------*/
@media only screen and (max-width: 500px) {


}

/* Phone Portrait and Landscape
--------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
    .picgall .item {
        float: left;
        display: inline-block;
        width: 100%;
    }
    
    .imagegrid img {
		width: 50%;
	}

    
}

/* Phone Landscape
--------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.flex-item {
	    font-size: 9px;
    }
    
    .flex-item a {
	    margin: .4em;
    }
     
}

/* Phone Portrait
--------------------------------------------------------------*/
@media only screen and (max-width: 480px) {

    .flex-container-bottom {
        padding: 1em .5em;
    }

    .flex-container-bottom .flex-item {
        margin: .1em;
        font-size: 7px;
    }
    
    .flex-item {
	    font-size: 7px;
    }
    
    .flex-item a {
	    margin: .4em;
    }

}