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;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* I am so sorry there are so many of these but I do not know of a different way to do this */

@media screen and (min-width:2000px) {

	#underpic{
		margin:550px 0px 70px 0px !important;
	}
}

@media screen and (min-width:830px) {
	#headh1{
		font-size:30px !important;
	}

	#mobiledisplay{
		display:none !important;
	}

	#hero2{
		display:none;
	}
}

@media screen and (min-width:1400px) and (max-width:1700px) {

	#overpic{
		margin:200px 0px 0px 6em !important;
	}
	
	#overpic h2{
		font-size:65px !important;
	}

	#hero{
		margin-top:3em !important;
	}

	#overpic p{
		font-size:22px !important;
	}
}

@media screen and (min-width:1200px) and (max-width:1399px){

	#overpic{
		margin:200px 0px 0px 6em !important;
	}

	#overpic h2{
		font-size:50px !important;
	}

	#hero{
		margin-top:7em !important;
	}

	#overpic p{
		font-size:20px !important;
	}

	.foodfig h4{
		font-size:30px !important;
	}

	#underpic{
		margin:270px 0px 70px 0px !important;
	}

	.hrefpic{
		padding:18px 28px !important;
		font-size:25px !important;
	}
}

@media screen and (min-width:1090px) and (max-width:1199px) {
	
	#overpic{
		margin:180px 0px 0px 6em !important;
	}

	#overpic h2{
		font-size:45px !important;
	}

	#hero{
		margin-top:7em !important;
	}

	#overpic p{
		font-size:18px !important;
	}

	.foodfig h4{
		font-size:30px !important;
	}

	#underpic{
		margin:270px 0px 70px 0px !important;
	}

	.hrefpic{
		padding:18px 28px !important;
		font-size:25px !important;
	}

	#hollister{
		font-size:20px !important;
	}

	#questions{
		padding:15px 30px !important;
		font-size:30px !important;
	}

	.foodfig p{
		padding: 0px 15px !important;
	}

	footer section{
		padding:0 80px !important;
	}
}

@media screen and (min-width:1000px) and (max-width:1089px) {
	
	#overpic{
		margin:150px 0px 0px 3em !important;
		width:54% !important;
	}

	#overpic h2{
		font-size:45px !important;
	}

	#hero{
		margin-top:7em !important;
	}

	#overpic p{
		font-size:18px !important;
		line-height:1.4em !important;
	}

	.foodfig h4{
		font-size:23px !important;
	}

	#underpic{
		margin:270px 0px 70px 0px !important;
	}

	.hrefpic{
		padding:18px 28px !important;
		font-size:25px !important;
	}

	#hollister{
		font-size:20px !important;
	}

	#questions{
		padding:15px 30px !important;
		font-size:30px !important;
	}

	.foodfig p{
		padding: 0px 15px !important;
	}

	#logo{
		width:8% !important;
	}

	footer section{
		padding:0 80px !important;
	}
}

@media screen and (min-width:900px) and (max-width:999px) {
	
	#overpic{
		margin:150px 0px 0px 3em !important;
		width:54% !important;
	}

	#overpic h2{
		font-size:45px !important;
	}

	#hero{
		margin-top:7em !important;
	}

	#overpic p{
		font-size:16px !important;
		line-height:1.4em !important;
		margin-top:30px !important;
	}

	.foodfig h4{
		font-size:23px !important;
	}

	#underpic{
		margin:220px 0px 70px 0px !important;
	}

	.hrefpic{
		padding:18px 15px !important;
		font-size:15px !important;
		margin-top:34px !important;
	}

	#hollister{
		font-size:20px !important;
	}

	#questions{
		padding:15px 30px !important;
		font-size:30px !important;
	}

	.foodfig{
		margin:50px 40px 0px 40px !important;
		width:30% !important;
	}

	.foodfig p{
		padding: 0px 10px !important;
	}

	#logo{
		width:8% !important;
	}

	footer section{
		padding:0 40px !important;
	}
}

@media screen and (min-width:830px) and (max-width:899px) {

	#headernav{
		font-size:20px !important;
	}

	#contacthref{
		padding:14px 28px !important;
	}
	
	#overpic{
		margin:150px 0px 0px 3em !important;
		width:54% !important;
	}

	#overpic h2{
		font-size:45px !important;
	}

	#hero{
		margin-top:7em !important;
	}

	#overpic p{
		font-size:16px !important;
		line-height:1.4em !important;
		margin-top:30px !important;
	}

	.foodfig h4{
		font-size:23px !important;
	}

	#underpic{
		margin:160px 0px 70px 0px !important;
	}

	.hrefpic{
		padding:15px 12px !important;
		font-size:15px !important;
		margin-top:25px !important;
	}

	#hollister{
		font-size:20px !important;
	}

	#questions{
		padding:15px 30px !important;
		font-size:30px !important;
	}

	.foodfig{
		margin:50px 40px 0px 40px !important;
		width:30% !important;
	}

	.foodfig p{
		padding: 0px 10px !important;
	}

	#logo{
		width:10% !important;
	}

	footer section{
		padding:0 40px !important;
	}
}

/* This is where tablet/mobile design starts */

@media screen and (max-width:829px) {

	#desktopdisplay{
		display:none !important;
	}

	#hero{
		display:none !important;
	}

	#hero2{
		filter:brightness(0.4);
	}

	#overpic p{
		margin:auto;
	}
}

@media screen and (min-width:700px) and (max-width:829px) {

	#headernav{
		font-size:20px !important;
	}

	#contacthref{
		padding:14px 28px !important;
	}

	#overpic{
		margin:310px 0px 0px 0px !important;
		width:100% !important;
	}

	#overpic h2{
		font-size:60px !important;
	}

	#overpic p{
		font-size:29px !important;
		line-height:1.4em !important;
		margin-top:30px !important;
	}

	.foodfig h4{
		font-size:23px !important;
	}

	#underpic{
		margin:380px 0px 70px 0px !important;
	}

	.hrefpic{
		top: 15%;
		left: 50%;
		transform: translate(-50%,-50%);
		padding:18px 35px !important;
		font-size:18px !important;
		margin-top:100px !important;
	}

	#hollister{
		font-size:20px !important;
	}

	#questions{
		padding:15px 30px !important;
		font-size:30px !important;
	}

	.foodfig{
		margin:50px 20px 0px 20px !important;
		width:30% !important;
	}

	.foodfig p{
		padding: 0px 10px !important;
	}

	#logo{
		width:14% !important;
	}

	footer section{
		padding:0 40px !important;
	}

	#hero2{
		margin-top:110px;
	}
}

@media screen and (min-width:700px) {

	#headernav2{
		display:none;
	}

	#contacthref2{
		display:none;
	}

	footer{
		display:flex;
		justify-content:center;
	}
}

@media screen and (max-width:699px){

	#headernav{
		display:none !important;
	}

	#logo{
		position: absolute;
		margin-left:auto;
		margin-right:auto;
		left: 0;
		right: 0;
	}

	header{
		padding:0 !important;
	}

	.icon2{
		margin-right:20px;
	}

	footer{
		text-align:center;
		padding-top:1px !important;
	}

	footer h5{
		font-size:50px;
	}

	footer section{
		margin-top:50px;
	}

	#iconsflex{
		width:100%;
		margin-top:30px;
	}

	#iconsflex a{
		margin:auto;
	}
}

@media screen and (min-width:586px) and (max-width:699px) {

	.icon2{
		width:70px;
		height:70px;
	}

	#overpic{
		margin:310px 0px 0px 0px !important;
		width:100% !important;
	}

	#overpic h2{
		font-size:60px !important;
	}

	#overpic p{
		font-size:29px !important;
		line-height:1.4em !important;
		margin-top:30px !important;
	}

	.foodfig h4{
		font-size:23px !important;
	}

	#underpic{
		margin:280px 0px 70px 0px !important;
	}

	.hrefpic{
		top: 15%;
		left: 50%;
		transform: translate(-50%,-50%);
		padding:18px 35px !important;
		font-size:18px !important;
		margin-top:100px !important;
	}

	#hollister{
		font-size:20px !important;
	}

	#questions{
		padding:15px 30px !important;
		font-size:24px !important;
	}

	.foodfig{
		margin:50px 20px 0px 20px !important;
		width:30% !important;
	}

	.foodfig p{
		padding: 0px 10px !important;
	}

	#logo{
		width:16% !important;
	}

	footer section{
		padding:0 40px !important;
	}

	#hero2{
		margin-top:110px;
	}

	#underpic h3,#underpic2 h5{
		font-size:55px !important;
	}
}

@media screen and (min-width:586px) {

	#hero3{
		display:none;
	}
}

@media screen and (min-width:401px) and (max-width:585px) {

	.icon2{
		width:60px;
		height:60px;
	}

	.sidenav h1{
		padding-top:25px !important;
		font-size:50px !important; 
	}

	.closebtn{
		font-size:100px !important;
	}

	.sidenav .qwe{
		font-size:40px;
	}

	#contacthref2{
		display:none;
	}

	#hero2{
		display:none;
	}

	#hero3{
		filter:brightness(0.4);
		margin-top:110px;
	}

	#overpic{
		margin:300px 0px 0px 0px !important;
		width:100% !important;
	}

	#overpic h2{
		font-size:45px !important;
	}

	#overpic p{
		font-size:25px !important;
		line-height:1.4em !important;
		margin-top:30px !important;
	}

	#underpic{
		margin:120vw 0px 70px 0px !important;
	}

	.hrefpic{
		top:8.5%;
		left: 50%;
		transform: translate(-50%,-50%);
		padding:13px 28px !important;
		font-size:18px !important;
		margin-top:100px !important;
	}

	#hollister{
		font-size:20px !important;
	}

	#questions{
		padding:20px 50px !important;
		font-size:24px !important;
	}

	#logo{
		width:20% !important;
	}

	footer section{
		padding:0 40px !important;
	}

	#underpic h3,#underpic2 h5{
		font-size:45px !important;
	}

	#foodflex{
		flex-direction:column;
	}

	.foodfig{
		margin:auto !important;
		margin-top:40px !important;
		margin-bottom:40px !important;
		width:80% !important;
	}

	.foodfig h4{
		font-size:30px !important;
	}

	.foodfig p{
		padding: 0px 25px !important;
	}

	.boximgs{
		align-self:center;
		margin-left:10px;
		width:90% !important;
		height:100%;
	}

	.foodhr{
		display:none;
	}

}

@media screen and (max-width:400px) {

	.icon2{
		width:50px;
		height:50px;
	}

	.sidenav h1{
		padding-top:35px !important;
		font-size:35px !important; 
	}

	.closebtn{
		font-size:100px !important;
	}

	.sidenav .qwe{
		font-size:30px;
	}

	#contacthref2{
		display:none;
	}

	#hero2{
		display:none;
	}

	#hero3{
		filter:brightness(0.4);
		margin-top:110px;
	}

	#overpic{
		margin:300px 0px 0px 0px !important;
		width:100% !important;
	}

	#overpic h2{
		font-size:40px !important;
	}

	#overpic p{
		font-size:20px !important;
		line-height:1.4em !important;
		margin-top:30px !important;
	}

	#underpic{
		margin: 100vw 0px 70px 0px !important;
	}

	.hrefpic{
		top:8.5%;
		left: 50%;
		transform: translate(-50%,-50%);
		padding:13px 28px !important;
		font-size:15px !important;
		margin-top:100px !important;
	}

	#hollister{
		font-size:20px !important;
	}

	#questions{
		padding:15px 50px !important;
		font-size:24px !important;
	}

	#logo{
		width:25% !important;
	}

	footer section{
		padding:0 40px !important;
	}

	#underpic h3,#underpic2 h5{
		font-size:45px !important;
	}

	#foodflex{
		flex-direction:column;
	}

	.foodfig{
		margin:auto !important;
		margin-top:40px !important;
		margin-bottom:40px !important;
		width:80% !important;
	}

	.foodfig h4{
		font-size:30px !important;
	}

	.foodfig p{
		padding: 0px 25px !important;
	}

	.boximgs{
		align-self:center;
		margin-left:10px;
		width:90% !important;
		height:100%;
	}

	.foodhr{
		display:none;
	}
}

body{
	background-color:#F5DDC1;
	overflow-x:hidden;
}

header{
	width:100%;
	display:flex;
	position:fixed;
	align-items: center;
	background-color:white;
	height: 7em;
	padding: 2em;
	box-shadow: 0px 0px 100px 0px rgb(0, 0, 0);
	z-index:6;
	box-sizing: border-box;
}

#headh1{
	font-family: 'Nanum Gothic', sans-serif;
	width:100%;
	font-size:40px;
	margin-left:10px;
	color:rgb(0, 0, 0);
}

#headernav{
	display:flex;
	font-family: 'Nanum Gothic', sans-serif;
	width:100%;
	justify-content:end;
	font-weight:500;
	font-size:30px;
}

#navlinks{
	display:flex;
	margin-top:15px;
}

#headernav a{
	text-align: center;
	text-decoration:none;
	margin: 0 1em;
}

#navlinks a{
	position:relative;
	color:rgb(216, 145, 59);
}

#navlinks a:after{
	content: '';
	position: absolute;
	width: 100%;
	transform: scaleX(0);
	height: 2px;
	bottom:0;
	left: 0;
	margin-bottom:15px;
	background-color: rgb(204, 136, 54);
	transform-origin: bottom right;
	transition: transform 0.25s ease-out;
}

#navlinks a:hover:after{
	transform: scaleX(1);
	transform-origin: bottom left;
}

#navlinks a:hover{
	transition:0.25s;
}

/* Mobile Navigation */

#headernav2{
	margin-left: auto;
}

.sidenav {
	height: 0;
	width: 100%;
	position: fixed;
	z-index: 10;
	top: 0;
	background-color:#F5DDC1;
	overflow-x: hidden;
	overflow-y:hidden;
	transition: 0.5s;
	text-align:center;
	font-family: 'Kalnia', serif;
}

.sidenav h1{
	background-color:rgb(54,54,54);
	color:rgb(226, 207, 183);
	padding:15px 0px 30px 0px;
	margin-bottom:30px;
	font-size:70px;
	font-weight:600;
}

.sidenav a {
	text-decoration: none;
	font-size: 60px;
	display: block;
	transition: 0.3s;
	color:rgb(54, 54, 54);
}

.sidenav a:hover {
	color: #af7a7a;
}

.sidenav hr{
	border:0;
	width:10%;
	height:5px;
	background-color:rgb(54,54,54);
}
  
.closebtn {
	color:rgb(226, 207, 183) !important;
	text-align:right;
	position: absolute;
	top: 0;
	right:0;
	margin-right:20px;
	font-size:100px !important;
}

.closebtn:hover{
	color:white !important;
}

.icon2{
	color:rgb(197, 169, 134);
	transition:.5s;
}

.icon2:hover{
	color:rgb(59, 59, 59);
}

#contacthref2{
	margin-left:20px;
	padding:15px 20px;
	position:relative;
	border: solid rgb(192, 120, 31) 2px;
	color:rgb(196, 123, 35);
	border-radius:1px;
	transition:.5s;
	overflow:hidden;
	text-decoration:none;
	font-family: 'Nanum Gothic', sans-serif;
	font-size:22px;
	font-weight:600;
	letter-spacing:1px;
}

#contacthref2 p {
	position: relative;
	z-index: 10;
}

#contacthref2:hover{
	color:rgb(255, 255, 255);
	background-color:rgb(196, 152, 99);
}

#contacthref2::after{
	content: '';
	position:absolute;
	height:1px;
	width:100%;
	bottom:0;
	left:0;
	background-color:rgb(255, 255, 255);
	transform:scaleY(150);
	transition:.5s;
}

#contacthref2:hover::after{
	transform:scaleY(0);
}

/* End of mobile navigation */

#logo{
	width:6%;
}

#hero{
	width:100%;
	z-index:4;
	margin-top:1em;
	position:absolute;
}

#hero2{
	width:100%;
	z-index:4;
	position:absolute;
}

#hero3{
	width:100%;
	z-index:4;
	position:absolute;
}

#contacthref{
	padding:15px 40px;
	position:relative;
	border: solid rgb(192, 120, 31) 2px;
	color:rgb(196, 123, 35);
	border-radius:1px;
	transition:.5s;
	overflow:hidden;
}

#contacthref p {
	position: relative;
	z-index: 10;
}

#contacthref:hover{
	color:rgb(255, 255, 255);
	background-color:rgb(196, 152, 99);
}

#contacthref::after{
	content: '';
	position:absolute;
	height:1px;
	width:100%;
	bottom:0;
	left:0;
	background-color:rgb(255, 255, 255);
	transform:scaleY(150);
	transition:.5s;
}

#contacthref:hover::after{
	transform:scaleY(0);
}

#maincontent{
	position:absolute;
	z-index:5;
	width:100%;
}

#overpic{
	margin:220px 0px 0px 8em;
	width:50%;
}

#overpic h2{
	color:white;
	font-size:90px;
	font-family: 'Noto Serif', serif;
}

#overpic p{
	color:rgb(226, 207, 183);
	font-family: 'Montserrat', sans-serif;
	font-size:25px;
	font-weight:400;
	margin-top:50px;
	width:95%;
	line-height:1.5em;
}

.hrefpic{
	background-color:rgb(196, 152, 99);
	position:absolute;
	margin-top:50px;
	padding:25px 50px;
	text-decoration:none;
	color:white;
	font-family: 'Montserrat', sans-serif;
	font-size:30px;
	border:solid white 3px;
	transition:.5s;
}

.hrefpic:hover{
	background-color:white;
	color:rgb(196, 152, 99);
	border-color:black;
}

#underpic{
	margin:350px 0px 70px 0px;
}

#underpic h3{
	color:rgb(54, 54, 54);
	font-family: 'Kalnia', serif;
	text-align:center;
	font-size:70px;
	font-weight:500;
}

#h3hr{
	border:0;
	background-color:rgb(54, 54, 54);
	height:4px;
	width:25%;
	margin-top:40px;
}

#foodflex{
	display:flex;
	justify-content:center;
}

.foodfig{
	background-color:rgb(255, 255, 255);
	width:20%;
	font-family: 'Montserrat', sans-serif;
	text-align:center;
	padding:20px 0px;
	border-radius:20px;
	margin:50px 60px 0px 60px;
	box-shadow:10px 12px black;
}

.foodfig h4{
	margin-top:10px;
	font-size:40px;
	font-weight:500;
}

.foodfig p{
	margin-top:15px;
	padding: 0px 30px;
	font-size:18px;
}

.foodhr{
	height:2px;
	background-color:black;
	width:86%;
}

.boximgs{
	width:90%;
	border-radius:20px;
	margin-bottom:5px;
}

#underpic2{
	background-color:rgb(43, 43, 43);
	padding-bottom:70px;
}

#underpic2 h5{
	color:white;
	padding-top:50px;
	font-family: 'Kalnia', serif;
	text-align:center;
	font-size:70px;
	font-weight:500;
}

#h5hr{
	border:0;
	background-color:rgb(223, 192, 108);
	height:4px;
	width:25%;
	margin-top:40px;
}

#hollister{
	color:rgb(226, 207, 183);
	font-family: 'Montserrat', sans-serif;
	font-size:25px;
	font-weight:400;
	width:85%;
	line-height:1.5em;
	margin:auto;
	margin-top:40px;
	text-align:center;
}

.hbold{
	font-weight:bold;
}

#questions{
	display:flex;
	justify-content:center;
	margin:auto;
	padding:20px 50px;
	text-decoration:none;
	color:black;
	background-color:rgb(240, 207, 161);
	margin-top:20px;
	width:12%;
	border:solid white 3px;
	border-radius:5px;
	font-size:39px;
	font-family: 'Montserrat', sans-serif;
	transition:.5s;
}

#questions:hover{
	background-color:rgb(26, 26, 26);
	color:white;
	border: solid rgb(223, 192, 108) 3px;
}

footer{
	padding:100px 0px;
	background-color:rgb(26, 26, 26);
	color:white;
	font-family: 'Ubuntu', sans-serif;
	font-size:40px;
}

footer section{
	padding:0px 150px;
}

.footerul{
	letter-spacing:2px;
	line-height:30px;
	font-weight:300;
	margin-top:30px;
	font-size:20px;
}

.strongli{
	font-weight:700;
}

.icon{
	color:white;
	font-size:35px;
	transition:.5s;
}

.icon:hover{
	color:rgb(139, 139, 139);
}

#iconsflex{
	display:flex;
}

#mobiledisplay{
	text-align:center;
}

#mobiledisplay hr{
	border:0;
	background-color:white;
	height:2px;
	margin-top:20px;
	width:80%;
}

/* CONTACT PAGE CSS STARTS HERE DONT MISS THIS
*
*
*
*
*
*
*
*
*/

@media screen and (min-width:841px) {

	#emailsubmit{
		width:15% !important;
	}
}

@media screen and (max-width:840px) {

	#emailsubmit{
		width:50% !important;
	}

	#contactform p textarea{
		width:70% !important;
		height:100px !important;
	}
	
	#support p input{
		width:70% !important;
	}

	#contact1 h2{
		font-size:55px !important;
	}
}

#contactbody{
	background-color:rgb(43,43,43);
}

#map{
	width:100%;
	height:400px;
	margin-top:110px;
}

#contact1{
	background-color:rgb(43, 43, 43);
}

#contact1 h2{
	font-family: 'Kalnia', serif;
	color:white;
	text-align:center;
	font-size:90px;
	margin:40px 0px;
}

#contact1 hr{
	border:0;
	background-color:rgb(223, 192, 108);
	height:4px;
	width:20%;
	margin:auto;
}

#contactform{
	margin-top:40px;
	text-align:center;
}

#contactform p label{
	font-family: 'Kalnia', serif;
	font-size:40px;
	color:white;
}

#contactform p input,textarea{
	margin:20px 0px 30px 0px;
	font-family: 'Nanum Gothic', sans-serif;
	font-size:20px;
	border-radius:5px;
}

#contactform p textarea{
	height:150px;
	width:45%;
}

#support p input{
	height:45px;
	width:45%;
}

#address{
	display:none;
}

#contactform span{
	color:rgb(248, 135, 135);
	font-size:18px;
}

#emailsubmit{
	color:black !important;
	height:50px;
	text-align:center;
	background-color:#F5DDC1;
}

/* MENU PAGE CSS NOW
*
*
*
*
*
*
*
*
*/

@media screen and (min-width:460px) and (max-width:970px) {

	.flexfood{
		display:block !important;
	}

	.food{
		width:100% !important;
	}

	#menu1 h3{
		font-size:45px !important;
	}

	.menuimg{
		width:75%;
	}
}

@media screen and (max-width:459px) {

	.flexfood{
		display:block !important;
	}

	.food{
		width:100% !important;
	}

	#menu1 h3{
		font-size:45px !important;
	}

	.menuimg{
		width:90%;
	}
}

#menu1{
	background-color:rgb(54,54,54);
	padding-top:100px;
	text-align:center;
}

#menu1 h2{
	font-family: 'Kalnia', serif;
	color:white;
	font-size:90px;
	margin:40px 0px;
}

#hrmenu{
	border:0;
	background-color:rgb(223, 192, 108);
	height:4px;
	width:60%;
	margin:auto;
}

#menu1 h3{
	font-family: 'Kalnia', serif;
	color:white;
	font-size:60px;
	margin:40px 0px 20px 0px;
}

.flexfood{
	display:flex;
	margin-top:30px;
}

.hrmenu2{
	border:0;
	background-color:rgb(255, 255, 255);
	height:4px;
	width:40%;
	margin:auto;
}

.food{
	width:50%;
}

#heromenu{
	filter:brightness(0.6);
	border-bottom:solid 5px white;
    width: 100%;
    object-fit: cover;
	min-height:300px;
	max-height:400px;
}

.menuimg{
	margin:40px 0px;
	width:60%;
	border:solid 4px #F5DDC1;
	border-radius:5px;
	height:70%;
}

/* EVENTS PAGE CSS NOW
*
*
*
*
*
*
*
*
*/

@media screen and (min-width:800px) and (max-width:1300px) {

	#events1 figure{
		display:block !important;
		text-align:center;
	}

	#cateringimg{
		margin-bottom:50px !important;
	}

	#events1 a{
		margin-left:0 !important;
	}
}

@media screen and (min-width:580px) and (max-width:799px) {

	#events1 h2{
		font-size:70px !important;
	}

	#events1 figure{
		display:block !important;
		text-align:center;
	}

	#cateringimg{
		margin-bottom:50px !important;
		width:80% !important;
		border:solid white 5px;
		border-radius:7px;
		min-width:0 !important;
	}

	#events1 a{
		margin-left:0 !important;
	}
}

@media screen and (min-width:100px) and (max-width:579px) {

	#events1 h2{
		font-size:45px !important;
	}

	#events1 figure{
		display:block !important;
		text-align:center;
		padding: 50px 10px !important;
	}

	#cateringimg{
		margin-bottom:50px !important;
		width:80% !important;
		border:solid white 5px;
		border-radius:7px;
		min-width:0 !important;
		margin:0px 0px 20px 0px !important;
	}

	#events1 a{
		margin-left:0 !important;
	}

	#events1 p{
		margin:0 !important;
		font-size:20px !important;
	}

	#events1 a{
		padding:10px 20px !important;
		font-size:20px !important;
	}
}

#events1 h2{
	font-family: 'Kalnia', serif;
	color:rgb(54,54,54);
	font-size:90px;
	padding-top:180px;
	text-align:center;
}

#events1 hr{
	border:0;
	background-color:rgb(54, 54, 54);
	height:4px;
	width:25%;
	margin-top:40px;
}

#events1 figure{
	display:flex;
	background-color:rgb(54,54,54);
	margin-top:60px;
	padding:50px 50px;
	color:white;
	font-family: 'Nanum Gothic', sans-serif;
	font-size:28px;
}

#events1 img, #events1 p{
	margin:0px 50px;
}

#cateringimg{
	width:50%;
	border:solid white 5px;
	border-radius:7px;
	max-height:400px;
	min-width:570px;
}

#events1 a{
	padding:15px 30px;
	text-decoration:none;
	color:black;
	background-color:rgb(240, 207, 161);
	border-radius:5px;
	transition:.5s;
	margin-left:50px;
}

#events1 a:hover{
	background-color:rgb(26, 26, 26);
	color:white;
}

/* font-family: 'Merriweather', serif; ehhhhh
font-family: 'Noto Serif', serif; used for overpic
font-family: 'Kalnia', serif; used for h3 at start of homepage content


^^^^ THIS IS FOR THE H2 OVER THE IMAGE

font-family: 'Kanit', sans-serif; ehhhh
font-family: 'Montserrat', sans-serif; ehhhhhh
font-family: 'Nanum Gothic', sans-serif; im using this one right now

^^^^ THIS IS FOR HEADER LINKS & POSSIBLY OTHERS

font-family: 'Ubuntu', sans-serif;

^^^^ THIS IS FOR FOOTER (maybe???) */