/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}

blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* desktop size */

#container {
    background: #172428;
	max-width: 1600px;
    margin: auto;
}

img {
	width: 100%;
}

#header {
	display: flex;
    justify-content: space-between;
    /* justified content is right and left
    align-items is up and down */
    align-items: center;
}

#hero {
	display: flex;
}


#logo {
	width: 12.44%;
	padding-left: 100px;
}

nav {
	width: 61.92%;
	display: flex; 
	flex-wrap: wrap;
    justify-content: space-around;
}
a {
	color: #F7EBDA;
	text-align: center;
	font-family: Alice in Wonderland;
	font-size: 35px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 2.275px;
}

a:hover {
	color:#E2BD81;
}

#intro {
	display: flex;
    justify-content: space-around;
    align-items: center;
	background: #742926;
	padding-top: 80px;
	padding-bottom: 80px;
}

#leftpic1 {
	width: 35%;
}

#type1 {
	width: 38.42%;
}
#introh1 {
	width: 78.77%;
	justify-content: space-around;
	padding-bottom: 20px;
	
}

h1{
	color: #F7EBDA;
	text-align: center;
	font-family: Alice in Wonderland;
	font-size: 40px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 3.9px;
}

p {
	color: #F7EBDA;
	font-family: EB Garamond;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 1.625px;
}

#foodsection {
	background: #FFF3B0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	
}

#foodbox {
	width: 92.36%;
	display: flex;
    justify-content: space-around;
    /* justified content is right and left
    align-items is up and down */
    align-items: center;
	padding: 50px;
	/* outline: auto;
	outline-width: 8px;
	outline-color: #172428; */

	border: 8px solid #335C67;
    margin: 60px;
	
}

#foodtype {
	width: 38.42%;
	justify-content: space-around;
	#foodmenu {
		width: 60.39%;
		justify-content: center;
		padding: 40px;
	}
	
}

#foodtype p {
	color: #172428
}


#foodmenu.png {
	width: 23.2%;
}

#foodpics {
	width: 33.16%;
}



#drinksection{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	background: purple url(images/drinks.jpg);
	background-size:contain;
	height: 60vw;
}

#drinkbox {
	width: 30%;
	display: flex;
    justify-content: space-around;
    align-items: center;

}

#drinktype {
	#drinkmenu {
		width: 60.39%;
		justify-content: center;
		padding: 40px;
	}
}

#drinkmenu.png {
	width: 23.2%;
}

#eventssection {
	background: #4D1211;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	
}

#eventsbox {
	width: 92.36%;
	display: flex;
    justify-content: space-around;
    /* justified content is right and left
    align-items is up and down */
    align-items: center;
	padding: 50px;
	/* outline: auto;
	outline-width: 8px;
	outline-color: #172428; */

	border: 8px solid #F7EBDA;
    margin: 60px;
	
}

#eventstype {
	width: 38.42%;
	justify-content: space-around;
	#events {
		width: 60.39%;
		justify-content: center;
		padding: 40px;
	}
	
}


#eventpics {
	width: 43.575%
}

#footer {
	display: flex;
	flex-wrap: wrap;
	
	justify-content: space-around;
	padding: 50px
	
}

#footertype {
	width: 47.1%
}

#map {
	width: 37.15%;
}

#hero2 {
	display: none;
}

#hero3 {
	display: none;
}

#foodpics2 {
	display:none;
}

#foodpics3 {
	display: none;
}

#drinkpics {
	display: none;
}

#drinkpics2 {
	display: none;
}

#eventpics2 {
	display: none;
}

#eventpics3 {
	display: none;
}






















.navbar {
    width: 100%;
    box-shadow: 0 1px 4px rgb(146 161 176 / 15%);
  }
  
  .nav-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 62px;
  }
  
  .navbar .menu-items {
    display: flex;
  }
  
  .navbar .nav-container li {
    list-style: none;
  }
  
  .navbar .nav-container a {
    text-decoration: none;
    color: #0e2431;
    font-weight: 500;
    font-size: 1.2rem;
    padding: 0.7rem;
  }
  
  .navbar .nav-container a:hover{
      font-weight: bolder;
  }
  
  .nav-container {
    display: block;
    position: relative;
    height: 60px;
  }
  
  .nav-container .checkbox {
    position: absolute;
    display: block;
    height: 32px;
    width: 32px;
    top: 20px;
    left: 20px;
    z-index: 5;
    opacity: 0;
    cursor: pointer;
  }
  
  .nav-container .hamburger-lines {
    display: block;
    height: 26px;
    width: 32px;
    position: absolute;
    top: 17px;
    left: 20px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  
  .nav-container .hamburger-lines .line {
    display: block;
    height: 4px;
    width: 100%;
    border-radius: 10px;
    background: #F7EBDA;
  }
  
  .nav-container .hamburger-lines .line1 {
    transform-origin: 0% 0%;
    transition: transform 0.4s ease-in-out;
  }
  
  .nav-container .hamburger-lines .line2 {
    transition: transform 0.2s ease-in-out;
  }
  
  .nav-container .hamburger-lines .line3 {
    transform-origin: 0% 100%;
    transition: transform 0.4s ease-in-out;
  }
  
  .navbar .menu-items {
    padding-top: 120px;
    box-shadow: inset 0 0 2000px rgba(255, 255, 255, .5);
    height: 100vh;
    width: 100%;
    transform: translate(-150%);
    display: flex;
    flex-direction: column;
    margin-left: -40px;
    padding-left: 50px;
    transition: transform 0.5s ease-in-out;
    text-align: center;
  }
  
  .navbar .menu-items li {
    margin-bottom: 1.2rem;
    font-size: 1.5rem;
    font-weight: 500;
  }
  
  .logo {
    position: absolute;
    top: 5px;
    right: 15px;
    font-size: 1.2rem;
    color: #F7EBDA;
  }

.nav-container input[type="checkbox"]:checked ~ .menu-items {
    transform: translateX(0);
  }
  
  .nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line1 {
    transform: rotate(45deg);
  }
  
  .nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line2 {
    transform: scaleY(0);
  }
  
  .nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line3 {
    transform: rotate(-45deg);
  }
  
  .nav-container input[type="checkbox"]:checked ~ .logo{
    display: none;
  }

  .navbar {
    display: none;
  }


































b {
	font-weight: bold;
}

ul {
	padding-left: 20px;
	color: #4D1211;
	font-family: EB Garamond;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 1.625px;
}

#menuhero {
    display: flex;
}

#menuhero2 {
    display: none;
}

#menuhero3 {
    display: none;
}

#breakfastsection {
	background: #FDF4C6 url(images2/breakfastbg.png);
	background-size:contain;
	background-position: center;
	background-repeat: no-repeat;
    justify-content: space-around;
}

#breakfast h1{
	color: #4D1211;
	padding-top: 50px;
}

#bcolumns, #lcolumns {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	padding: 30px;
}

#b1, #b2, #b3 {
	width: 28.9%;
}

#pancakes,#eggs,#more {
	padding-bottom: 10px;
}

#platter {
	padding-top: 30px;
}

#b1 h3, #b2 h3, #b3 h3 {
	color: #4D1211;
	font-family: Alice in Wonderland;
	font-size: 30px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 3.9px;
}

#b1 p, #b2 p, #b3 p {
	color: #4D1211;
}

#lunchsection {
	background: #E2BD81 url(images2/lunchbg.png);
	background-size:contain;
	background-position: center;
	background-repeat: no-repeat;
	
}

#lunch h1{
	color: #4D1211;
	padding-top: 50px;
}

#lcolumns {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	padding: 30px;
}

#l1, #l2, #l3 {
	width: 28.9%;
}

#burgers,#salads,#sandwich {
	padding-bottom: 10px;
}

#l1 h3, #l2 h3, #l3 h3 {
	color: #4D1211;
	font-family: Alice in Wonderland;
	font-size: 30px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 3.9px;
}

#l1 p, #l2 p, #l3 p {
	color: #4D1211;
}


#dinnersection {
	background: #B06E6D url(images2/dinnerbg.png);
	background-size:contain;
	background-position: center;
	background-repeat: no-repeat;
}

#dinner h1{
	color: #F7EBDA;
	padding-top: 50px;
}

#dcolumns, #drinkcolumns {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	padding: 30px;
}

#d1, #d2, #d3 {
	width: 28.9%;
}

#d4 {
	width: 60%;
}

#stews,#bbq,#seafood,#sides, #pasta, #halflingmenu {
	padding-bottom: 10px;
}

#sides, #pasta, #halflingmenu {
	padding-top: 30px
}

#d1 h3, #d2 h3, #d3 h3, #d4 h3, #dr4 h3, #dr1 h3, #dr2 h3, #dr3 h3, #dr4 h3, #dr5 {
	color: #F7EBDA;
	font-family: Alice in Wonderland;
	font-size: 30px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 3.9px;
}

#d1 p, #d2 p, #d3 p {
	color: #F7EBDA;
}


#dessertsection {
	background: #805657 url(images2/dessertbg.png);
	background-size:contain;
	background-position: center;
	background-repeat: no-repeat;
}

#dessert h1{
	color: #F7EBDA;
	padding-top: 50px;
}

#descolumns {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	padding: 30px;
}

#des1, #des2, #des3 {
	width: 28.9%;
}

#des4 {
	width: 60%;
}

#cpm, #pastries, #specials{
	padding-bottom: 10px;
}

#des1 h3, #des2 h3, #des3 h3, #des4 h3 {
	color: #F7EBDA;
	font-family: Alice in Wonderland;
	font-size: 30px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 3.9px;
}

#des1 p, #des2 p, #des3 p {
	color: #F7EBDA;
}

#drinkmenusection {
	background: #335C67 url(images2/drinksbg.png);
	background-size:contain;
	background-position: center;
	background-repeat: no-repeat;
	padding-bottom: 30px;
}

#drinks, #drinkcolumns {
	padding-top: 30px;
}

#dr1, #dr2, #dr3 {
	width: 28.9%;
}

#ale, #cocktails, #specialdrinks, #wine, #non {
	padding-bottom: 10px;
}

#specialdrinks, #non {
	padding-top: 30px
}

#eventpage {
	background-color: #4D1211;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 100px
}

#etype {
	width: 100%;
	padding-bottom: 50px;
}

#etype2 {
	padding-bottom: 50px;
	width: 100%;
}

#etype3 {
	padding-bottom: 50px;
	width: 100%;
}

#etype2 p, #etype3 p{
	text-align: center;
}

#etype4 h1{
	font-size: 30px;
}

h4 {
	color: #F7EBDA;
	text-align: center;
	font-family: Alice in Wonderland;
	font-size: 60px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 3.9px;
}




















/* Tablet size stuff */

@media screen and (max-width: 900px ){
	
	#menuhero {
		display: none;
	}

	#menuhero2 {
		display: flex;
		visibility: visible;
	}




	#logo {
		padding-left: 50px;
	}
	
	#hero2 {
		display: flex;
		visibility: visible;
	}

	#hero {
		display: none;
	}
	
	nav {
		width: 69.25%;
	}

	a {
		color: #F7EBDA;
		text-align: center;
		font-family: Alice in Wonderland;
		font-size: 25px;
		font-style: normal;
		font-weight: 400;
		line-height: normal;
		letter-spacing: 2.275px;
	}

	#introh1 {
		display: none;
	}

	#leftpic1 {
		width: 45%;
	}

	#foodbox {
		display: flex;
		flex-wrap: wrap;
	}
	
	#foodpics2 {
		display: flex;
		visibility: visible;
		padding-bottom: 50px;
	}

	#foodpics {
		display: none;
	}

	#foodtype {
		width: 61%;
	}

	#drinksection{
		background-image: none;
		background-color: #335C67;
		background-size: auto;
		height: auto;
	}

	#drinkpics {
		display:flex;
		visibility: visible;
		width: 70%;
		padding: 50px;
	}

	#drinktype {
		width: 80%;
	}

	#drinkbox {
		width: 50%;
		justify-content: center;
	}

	#eventsbox {
		display: flex;
		flex-wrap: wrap;
	}

	#eventpics2 {
		display: flex;
		visibility: visible;
		width: 1000%;
		padding-bottom: 50px;
	}

	#eventpics {
		display: none;
	}

	#eventsection {
		display: flex;
		
	}

	#eventstype {
		width: 61%;
	}

	#footer {
		align-items: center;
	}

	#footertype{
		width: 50%;
	}

	#map {
		width: 50%;
	}
	



	#breakfastsection{
		background-image: none;
		background-color: #FDF4C6;
		background-size: auto;
		height: auto;
	}

	#b1,#b2,#b3{
		width: 45%;
	}
	#more {
		padding: 30px;
	}

	#lunchsection{
		background-image: none;
		background-color:#E2BD81;
		background-size: auto;
		height: auto;
	}

	#l1,#l2,#l3{
		width: 45%;
	}
	#sandwiches{
		padding-top: 30px;
		padding-bottom: 10px;
	}

	#dinnersection{
		background-image: none;
		background-color:#B06E6D;
		background-size: auto;
		height: auto;
	}

	#d1,#d2,#d3,#d4{
		width: 45%;
	}

	#dessertsection{
		background-image: none;
		background-color:#805657;
		background-size: auto;
		height: auto;
	}

	#des1,#des2,#des3,#des4{
		width: 45%;
	}

	#specials {
		padding-top: 30px;
	}

	#drinkmenusection{
		background-image: none;
		background-color:#335C67;
		background-size: auto;
		height: auto;
	}

	#dr1,#dr2,#dr3{
		width: 45%;
	}

	#wine {
		padding-top: 30px;
	}

	#eventpage {
		padding: 70px;
	}
}




/* iphone size stuff */
@media screen and (max-width: 500px) {

	#menuhero2 {
		display: none;
	}

	#menuhero3 {
		display: flex;
		visibility: visible;
	}


	.navbar{
		display: block;
	}
	
	
	
	
	
	
	#hero3 {
		display: flex;
		visibility: visible;
	}

	#hero2 {
		display: none;
	}

	#header {
		display: none;
	}

	#type1{
		width: 62.5%;
	}

	#leftpic1 {
		display: none;
	}

	#introh1 {
		width: 100%;
		padding-bottom: 30px;
		display: flex;
		visibility: visible;
	}

	#introh1 h1 {
		font-size: 25px;
	}



	#foodbox{
    	margin: 10px;
	}

	#foodpics2 {
		display: none;
	}

	#foodpics3 {
		display: flex;
		visibility: visible;
	}

	#foodtype{
		width: 80%;
	}

	#drinkpics{
		display: none;
	}

	#drinkpics2{
		display: flex;
		visibility: visible;
		padding-top: 50px;
	}

	#drinkbox{
		width:75%;
	}

	#eventsbox{
    	margin: 10px;
	}

	#eventpics2 {
		display: none;
	}

	#eventpics3 {
		display: flex;
		visibility: visible;
	}

	#eventstype{
		width: 80%;
	}

	#footertype{
		width: 100%;
		padding-bottom: 50px;
	}

	#map {
		width: 100%;
	}

	#b1,#b2,#b3{
		width: 90%;
	}

	#eggs, #salads, #bbq, #seafood, #pastries, #cocktails {
		padding-top: 30px;
	}

	#l1,#l2,#l3{
		width: 90%;
	}


	#d1,#d2,#d3,#d4{
		width: 90%;
	}


	#des1,#des2,#des3{
		width: 90%;
	}

	#dr1,#dr2,#dr3{
		width: 90%;
	}

	#eventpage {
		padding: 50px;
	}



	
}