/* CSS Document */

body{

}

a,
a:visited{
	color: #009486;
}

em{
	font-style: italic;
}

#main{
	background:url(../images/wood_background.jpg) center top fixed;
-webkit-box-shadow: 0px 1px 30px rgba(50, 50, 50, 0.92);
-moz-box-shadow:    0px 1px 30px rgba(50, 50, 50, 0.92);
box-shadow:         0px 1px 30px rgba(50, 50, 50, 0.92);
}

.contact{
	
}

header{
	top:0;
	left: 0;
	text-align:center;
	width: 100%;
		z-index: 1000;
}

footer{
background:url(../images/concrete_background.jpg) left top fixed;
}

.main-nav{
	background-color: #000;
	color: #FFF;
	margin: 0 auto;
	display: inline-block;
	width: 100%;
}

.main-nav a{
	color: #FFF;
	font-family: 'brassfieldplain', sans-serif;
	font-weight: bold;
	font-size: 16px;
	text-decoration: none;
	text-transform: uppercase;
	margin: 0 10px;
}

.main-nav a:hover{
	color: #009486;
}

h1.open-for-lunch{
	background-image: url(../images/open_for_lunch.png);
	background-repeat: no-repeat;
	text-indent: -99999px;
	overflow: hidden;
	margin-top: 25px;	
	background-size: 250px 71px;
	width: 250px;
	height: 71px;	
}

h1.now-taking-reservations{
	background-image: url(../images/now_taking_reservations.png);
	background-repeat: no-repeat;
	text-indent: -99999px;
	overflow: hidden;
	margin-top: 25px;	
	background-size: 203px 71px;
	width: 203px;
	height: 71px;	
}

h1.now-taking-reservations a{
	display: block;
	height: 100%;
	width: 100%;
}

h2.carry-out-dine-in{
	background-image: url(../images/carry_out.png);
	background-repeat: no-repeat;	
	width: 200px;
	height: 26px;	
	background-size: 200px 26px;
	text-indent: -99999px;
	overflow: hidden;
	margin-top: 10px;		
}

h1.logo{
	background: url(../images/QH-logoWeb.png) left top  no-repeat;
	background-size: 100% !important;
	width: 300px;
	height: 103px;
	text-indent: -99999px;
	overflow: hidden;	
	margin: 0 auto;

}

h3.logo{
	background: url(../images/logo_hapa.png) left top  no-repeat;
	width: 200px;
	height: 96px;
	text-indent: -99999px;
	overflow: hidden;	
	display: none;
}

.home{
	height: 400px;
	overflow: hidden;
	position: relative;

}


.home-background{
	
}


.social-media{
  background-color: #000;
	padding-bottom: 10px;
	padding-top: 10px;
}


.home-container{
	position: relative;
  z-index: 2;
	background: url(../images/hapa_cover_mobile.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
	height: 400px;
	background-attachment:scroll;
}
section.menu{
		background:url(../images/concrete_background.jpg) left top;
		z-index: 2;
		background-size: 1000px 1500px;
		position: relative;
		padding-bottom: 150px;
-webkit-box-shadow: 0px -3px 9px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0px -3px 9px rgba(50, 50, 50, 0.75);
box-shadow:         0px -3px 9px rgba(50, 50, 50, 0.75);
}

.menu-container{
	background-color: #FFF;
	margin: 0 auto;
	position: relative;
	top: 25px;
	padding: 10px;
	overflow: auto;
	-webkit-box-shadow: 0px -3px 9px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0px -3px 9px rgba(50, 50, 50, 0.75);
box-shadow:         0px -3px 9px rgba(50, 50, 50, 0.75);
}

.menu-header{
	background: url(../images/logo_hapa_on_white.png) left top no-repeat;
	width: 300px;
	height: 160px;
	text-align: center;
	margin: 0 auto;
}

.menu-container h2.menu-type{
	font-family: "brassfieldplain", sans-serif;
	font-weight: bold;
	margin-bottom: 50px;
	background-color: #fff;
	color: #009877;
}

.lunch-menu{
	margin-bottom: 50px;
}

.menu-container h2{
	color: #009877;
	font-family: 'brassfieldplain', sans-serif;
	font-size: 22px;
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 10px;
}

.menu-container h2 em {
	font-size: 14px;
}

.menu-container h3{
	color: #000;
	font-family: 'Raleway', sans-serif;
	font-size: 18px;
	margin-top: 35px;
	margin-bottom: 5px;
}

.menu-container h4{
	color: #009877;
	font-family: 'Raleway', sans-serif;
	font-size: 16px;
	font-weight: 700;
	text-transform:uppercase;
}

.menu-container ul {
  list-style-type: disc;
  margin-left: 20px;	
}

.menu-container p,
.menu-container li	{
	color: #6D6E71;
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	margin-bottom: 10px;
	text-transform: lowercase;
}

.menu-container p em {
	font-style: italic;
}

.menu-container .category{
	margin-top: 20px;
}

.menu-container .price{
	margin-left: 5px;
}

.menu-container .notes {
	clear: both;
}

section.ohapas{
		background:url(../images/web_background_ohapa.png) right bottom no-repeat;
		background-color: #97cb53;
		z-index: 2;
		position: relative;
		padding-bottom: 150px;
-webkit-box-shadow: 0px -3px 9px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0px -3px 9px rgba(50, 50, 50, 0.75);
box-shadow:         0px -3px 9px rgba(50, 50, 50, 0.75);
}

div.ohapas-container{
	text-align: center;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 35px;
    height: 0;
    overflow: hidden;
}

.video-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}

div.ohapas-container p{
	font-family: "Comic Sans MS", cursive;
	font-size: 18px;
	line-height: 1.5;
  color: #2D5511;
	margin-top: 20px;
}

img.ohapas-logo{
	width: 200px;
	margin: 20px auto;
}


section.location{
	 position: relative;
	 z-index: 1;
	 padding-bottom: 150px;

}

.location-container{
	background-color: #000;
	background-color: rgba(0,0,0,.5);
	margin: 0 auto;
	position: relative;
	top: 75px;
	padding: 10px;
	overflow: auto;
}

.location-container h1{
	font-family: 'brassfieldplain', sans-serif;
	font-size: 24px;
	color: #fff;
	text-transform: uppercase;
	background-color: #000;
	padding: 5px 15px;
	margin-left: -15px;
	margin-bottom: 10px;
	font-weight: bold;
}

.location-container h2{
	color: #FFF;
	font-family: 'Raleway', sans-serif;
	font-size: 18px;
	text-transform: uppercase;
	margin-top: 25px;	
	margin-bottom: 10px;
}


.location-container p{
	color: #FFF;
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	margin-bottom: 10px;
}

.map{
	height: 550px;
}

.map h2{
	color: #000;
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	margin: 0;
}

.map p{
	color: #6D6E71;
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	margin: 0 0 10px;
}


section.contact{
	 position: relative;
	 z-index: 1;
  background-color: #FFF;
-webkit-box-shadow: 0px -3px 9px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0px -3px 9px rgba(50, 50, 50, 0.75);
box-shadow:         0px -3px 9px rgba(50, 50, 50, 0.75);	
}

.contact-container{
	color: #000;
  padding-top: 25px;
}


.contact-container h1{
	font-family: 'brassfieldplain', sans-serif;
	font-weight: bold;
	font-size: 24px;
	color: #fff;
	text-transform: uppercase;
	background-color: #000;
	margin-top: 25px;	
	margin-bottom: 10px;
	text-align: center;	
}


.contact-container h2,
#mc_embed_signup h2{

	font-family: 'Raleway', sans-serif;
	font-size: 18px;
	margin-bottom: 10px;
	font-weight: normal;
}

.contact-container p{
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	margin-bottom: 10px;
	text-align: center;	
}


.contact-container label,
.indicates-required,
.input-group{
	color: #000;
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
	margin: 0 0 10px;
}

.input-group label{
	margin-left: 8px;
}
#mc_embed_signup .button{
	background-color: #5fc5ba;
}

a.facebook,
a.twitter,
a.instagram{
	width: 30px;
	height: 30px;
  text-indent: -9999px;
	overflow: hidden;
	background: url(../images/icon_social.png) left top no-repeat;
	display: inline-block;
	margin-right: 3px;
}

a.twitter{
	background-position: -36px 0;
}

a.instagram{
	background-position: -72px 0;
}

.vertical-center-container {
	display: table;
  height: 100%;
  width: 100%;
}

.vertical-center-content {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

ul.add-ons {
  margin-top: 10px;
  margin-left: 0;
  list-style-type: none;
}

.add-on-price {
	color: #009877;
	font-family: 'Raleway', sans-serif;
	font-style: italic;
	display: block;
}