/* HTML Semantic Tags */
.red {
	background-image: url(Images1/main_img.jpg);
	background-size: cover;
}

.orange {
	background-image: url(Images1/menu_img.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.yellow {
	background-image: url(images1/events_img.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}

.purple {
	background-color: #ebebeb;
	background-size: cover;
}
* {
	margin: 0;
	padding: 0;
}

/*Address Header*/
#address {
	position: fixed;
	width: 100vw;
	height: auto;
	background-color: #252525; 
	z-index: 100;
}

#address p{
	font-family: 'Roboto Condensed', sans-serif;
	color: #c7c7c7;
	font-weight: 300;
	letter-spacing: 1px;
	text-decoration: underline;
	text-align: center;
	font-size: 15px;  
}

#address p:hover {
	color: white;
}
nav.hamburger, .menu-on, .menu-off, #toggle-menu {
	display: none;
}

/*Img Header*/
header img {

	position: fixed;
	width: 10vw;
	top: 5vh;
	float: left;
	margin-left: 5%;
	z-index: 100;
}

	/*------Hamburger Menu--------*/


/*Main Nav*/

nav#top {
	width: 80%;
	position: relative;
	list-style-type: none;
	top: 9.3vh;
	float: left;
	left: 20vw;
}

nav#top li {
	list-style-type: none;
	float: left;
	margin-right: 3%;
	text-decoration: none;
}

nav#top li a {
	color: #bfbfbf;
	text-decoration: none;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
  	letter-spacing: 0.2vh;
  	font-size: 3vh;
}


/*nav hover*/
nav#top li a:hover {
	color: #5e5544;
}

/*form*/

#reservation {
	position: absolute;
	width: 50vw;
	top: 68vh;
	left: 5vw;
	float: left;
	background-color: rgba(255, 255, 255, .2);
	border-radius: 15px;
	padding: 1%;
	text-align: center;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	color: black;
	letter-spacing: 2px;
  	font-size: 4vh;
}

#reservation:hover {
	background-color: rgba(255, 255, 255, 1);
}

fieldset {
	border: none;
	padding-left: 1%;
}
#book img {
	width: 2vw;
	float: left;
	padding-top: 2.3vw;
}

select{
	float: left;
	margin-top: 4.5%;
	margin-left: 1%;
	margin-right: 4%;
	background-color: rgba(255, 255, 255, .0);
	border: none;
	width: 11.5vw;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	letter-spacing: 2px;
	font-size: 3vh;
	text-align: center;

}

select:hover {
	background-color: #464646;
	color: white;
	border: #d1d1d1 solid 1px;
}

#submit{
	position: static;
	margin-top: 4%;
	margin-right: 5vw;
	border: none;
	width: 21%;
	background-color: rgba(255, 255, 255, .6);
	border: #d1d1d1 solid 1px;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 3vh;
	color: black;
	border-radius: 10px;
}

#submit:hover {
	background-color: #464646;
	color: white;
}
/*About Page*/

#about {
	width: 100vw;
	height: 100vh;
}

#navcolor {
	width: 100vw;
	height: 20vh;
	background-color: #565656;
	box-shadow: 5px;
}

#slider {
	height: 10vh;
	width: 100vw;
	position: fixed;
	width: 400%;
	margin-top: 0px;
	margin-left: 0px;
	animation: 30s slidy infinite;
}

@keyframes slidy{
	0% {
		left: 0%;
	}

	10% {
		left: 0%;
	}

	20% {
		left: -100%;
	}

	30% {
		left: -100%;
	}

	40% {
		left: -200%;
	}

	50% {
		left: -200%;
	}

	60% {
		left: -300%;
	}

	70% {
		left: -300%;
	}

	80% {
		left: -200%;
	}

	90% {
		left: -100%;
	}

	100% {
		left: -0%;
	}

}

#slide {
	float: left;
	width: 25%;
	margin-left: 0px;
}

#slide img {
	width: 100%;
	float: left;
}

#story {
	width: 100vw;
	height: 30vh;
	top: 70vh;
	background-color: rgba(255, 255, 255, .5);
	z-index: 95;
	position: fixed;
}
#story h1 {
	z-index: 300;
	position: fixed;
	margin-top: 0vw;
	left: 5vw;
	letter-spacing: 0.5vw;
}

#story p {
	padding-left: 33vw;
	padding-right: 2vw;
	padding-top: 3%;
	font-family: 'Roboto Condensed', sans-serif;
	text-align: left;
	font-style: italic;
	font-weight: 300;
	font-size: 1.3vw;
	letter-spacing: 1px;
	color: #232323;
}

/*main page content*/

#main {
	width: 100vw;
	height: 100vh;
}

#social_media {
	position: absolute;
	float: right;
	width: 20vw;
	top: 17vh;
	left: 70vw;
}

#social_media img {
	width: 20%;
	margin-right: 5%;
	opacity: 0.7;
}

/*menu page content*/

#menu {
	width: 100vw;
    height: 100vh;
}

h1 {
	font-family: 'Droid Serif', serif;
	font-size: 5vw;
	text-align: center;
	padding-top: 10vh;
	letter-spacing: 10px;
	color: #232323;
	font-size: 4vw;
}

#menu p {
	font-family: 'Roboto Condensed', sans-serif;
	text-align: center;
	padding-top: 5vh;
	padding-left: 16vw;
	padding-right: 16vw;
	padding-bottom: 2vw;
	font-style: italic;
	font-weight: 300;
	font-size: 1.6vw;
	letter-spacing: 2px;
	color: #232323;

}

h2 {
	font-family: 'Droid Serif', serif;
	font-size: 2.4vw;
	text-align: center;
	letter-spacing: 2px;
	color: #232323;
}

#menus {
	float: left;
	width: 11vw;
	border-top: #232323 solid 2px;
	border-bottom: #232323 solid 2px;
	margin-left: 11vw;
	margin-top: 5vh;
	text-align: center;
}

h2:hover {
	color: #232323;
	font-size: 2.5vw;

}
#menus:hover {
	width: 12vw;
	border-top: #232323 solid 2px;
	border-bottom: #232323 solid 2px;
	margin-top: 4.5vh;
	margin-left: 10vw;
}
#online {
	margin-top: 16vw;
	width: 60vw;
	height: 9vw;
	margin-left: 20vw;
	background-color: rgba(255, 255, 255, .6);
	border-radius: 15px;
}

#online:hover {
	background-color: rgba(255, 255, 255, .9);
	margin-top: 15.5vw;
	width: 61vw;
	margin-left: 19.7vw;
	height: 9.5vw;
}

#online img {
	width: 11vw;
	margin-right: 2vw;
}

#online h2 {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	letter-spacing: 2px;
  	font-size: 3.5vh;
  	text-align: left;
  	padding-left: 3vw;
  	padding-top: 7vh;
  	color: #474747;
}
#logo {
	width: 30%;
	float: left;
}

#logos {
	width: 23%;
	float: left;
	padding-top: 1vh;
}
/*events page content*/

#events {
	width: 100vw;
    height: 100vh;
}


#events h1 {
	font-family: 'Droid Serif', serif;
	font-size: 3.5vw;
	text-align: center;
	padding-top: 10vh;
	letter-spacing: 5px;
	color: white;
}

#firstevent {
	width: 30vw;
	text-align: center;
	margin-top: 23vh;
	margin-left: 7vw;
	float: left;
	background-color: rgba(255, 255, 255, .3);
	padding: 2vw;
	border-radius: 25px;
}

#secondevent {
	width: 30vw;
	text-align: center;
	margin-top: 8vh;
	margin-right: 22vw;
	float: right;
	background-color: rgba(255, 255, 255, .3);
	padding: 2vw;
	border-radius: 25px;
}

#secondevent h2, #firstevent h2 {
	font-family: 'Droid Serif', serif;
	font-size: 2.4vw;
	text-align: center;
	letter-spacing: 2px;
	color: #232323;
}

#secondevent h3, #firstevent h3 {
	font-family: 'Droid Serif', serif;
	font-size: 1.8vw;
	text-align: center;
	letter-spacing: 1px;
	color: #232323;
	margin-top: 0.6vw;
}

#secondevent p, #firstevent p {
	font-family: 'Roboto Condensed', sans-serif;
	text-align: center;
	padding-top: 2vh;
	line-height: 1.7;
	font-weight: 400;
	font-size: 1.2vw;
	letter-spacing: 1px;
	color: #232323;
}



/*footer page content*/
#footer {
	width: 100vw;
	height: 80vh;
	background-color: #252525;
}

#hours {
	float: left;
	width: 20vw;
	padding-top: 4vw;
	padding-left: 20vw;
	letter-spacing: 0.1vw;
}
#footer h3 {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	text-decoration: underline;
	font-size: 2vw;
	color: white;
}

#hours h4 {
	font-family: 'Roboto Condensed', sans-serif;
	text-decoration: underline;
	font-weight: 300;
	font-size: 1.5vw;
	color: #cac5c1;
	padding-top: 1vw;
}

#hours p {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	font-size: 1.4vw;
	color: #cac5c1;
	padding-top: 0.3vw;
}
#location {
	float: left;
	width: 20vw;
	padding-top: 4vw;
	padding-left: 0vw;
}

#location h4 {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	font-size: 1.5vw;
	color: #cac5c1;
	padding-top: 1vw;
}

#location a {
	color: #cac5c1;
	text-decoration: none;
}

#location a:hover {
	color: #475440;
}

#direction_button {
	margin-top: 1vw;
	text-align: center;
	padding: 0.3vw;
	border: none;
	width: 10vw;
	background-color: #4c5f42;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 3vh;
	color: black;
	border-radius: 10px;
}

#newsletter {
	float: left;
	width: 20vw;
	padding-top: 4vw;
	padding-left: 0vw;
}

#newsletter h4 {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	font-size: 1.5vw;
	color: #cac5c1;
	padding-top: 1vw;
}

input#email {
	margin-top: 1vw;
	padding: 0.6vw;
	border: none;
	width: 12vw;
	background-color: white;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 2.4vh;
	font-style: italic;
	color: black;
	border-radius: 10px;
}

#subscribe {
	margin-top: 1vw;
	text-align: center;
	padding: 0.3vw;
	border: none;
	width: 10vw;
	background-color: #4c5f42;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 3vh;
	color: black;
	border-radius: 10px;
}

#subscribe:hover {
	background-color: #cac5c1;
}

#direction_button:hover {
	background-color: #cac5c1;
}
#social_media2 {
	float: left;
	width: 20vw;
	padding-top: 4vw;
	padding-left: 0vw;
}
#social_media2 img {
	width: 2.5vw;
	padding-top: 2vw;
	padding-left: 0vw;

}

/*---------------mobile desplay-----------------*/

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

/*-------Img Header----------*/
header img {

	position: absolute;
	width: 40vw;
	top: 5vh;
	float: left;
	margin-left: 3vw;
	z-index: 100;
}



/*-------------form--------------*/

#reservation {
	position: absolute;
	width: 60vw;
	top: 45vh;
	left: 16vw;
	height: 35vh;
	float: left;
	background-color: rgba(255, 255, 255, .7);
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	color: black;
	letter-spacing: 2px;
  	font-size: 3.5vh;
}

#reservation:hover {
	background-color: rgba(255, 255, 255, .7);
}

fieldset {
	padding: 2%;
}
#book img {
	width: 5vw;
	padding-top: 2.9vw;
	padding-left: 4vw;
}

select{
	margin-bottom: 4%;
	margin-right: 4%;
	width: 45vw;
	font-size: 2.8vh;
}

select:hover {
	background-color: rgba(255, 255, 255, .0);
	color: black;
	border: none;
}

#submit{
	width: 50%;
	background-color: rgba(255, 255, 255, .6);
}

#submit:hover {
	background-color: rgba(255, 255, 255, .6);
	color: black;
}

#social_media {
	position: absolute;
	float: right;
	width: 35vw;
	top: 40vh;
	left: 13vw;
}

/*-------------menu page content------------*/

h1 {
	font-size: 10vw;
	padding-top: 3vh;
	letter-spacing: 10px;
}

#menu p {
	padding-top: 4vh;
	padding-left: 10vw;
	padding-right: 10vw;
	padding-bottom: 2vw;
	font-size: 3.5vw;
}

h2 {
	font-family: 'Droid Serif', serif;
	font-size: 4vw;
	text-align: center;
	letter-spacing: 2px;
	color: #232323;
}

h2 span {
	font-size: 3.6vw !important;
}

#menus {
	float: left;
	width: 25vw;
	margin-left: 37vw;
	margin-top: 3vh;
	text-align: center;
}

h2:hover {
	font-size: 4vw;
}

#menus:hover {
	width: 25vw;
	margin-top: 2vh;
	margin-left: 37vw;
}

#online {
	margin-top: 67vw;
	width: 75vw;
	height: 20vw;
	margin-left: 12vw;
}

#online:hover {
	background-color: rgba(255, 255, 255, .6);
	margin-top: 67vw;
	width: 75vw;
	height: 20vw;
	margin-left: 12vw;
}

#online img {
	width: 25vw;
	margin-right: 3vw;
}

#online h2 {
	letter-spacing: 2px;
	font-weight: 400;
  	font-size: 2vh;
  	text-align: left;
  	padding-left: 5vw;
  	padding-top: 4vh;
  	color: #474747;
}
#logo {
	width: 20%;
	float: left;
}

#logos {
	width: 24%;
	float: left;
	padding-top: 1vh;
}
/*-------events page content----------*/

#events h1 {
	font-size: 6vw;
	letter-spacing: 3px;
}

#firstevent {
	width: 60vw;
	margin-top: 5vh;
	margin-left: 18vw;
	background-color: rgba(255, 255, 255, .5);
	padding: 3vw;
	border-radius: 25px;
}

#secondevent {
	width: 60vw;
	margin-top: 5vh;
	margin-right: 16.15vw;
	float: right;
	background-color: rgba(255, 255, 255, .3);
	padding: 3vw;
	border-radius: 25px;
}

#secondevent h2, #firstevent h2 {
	font-size: 4vw;
	letter-spacing: 1px;
}

#secondevent h3, #firstevent h3 {
	font-size: 3vw;
	letter-spacing: 0.6px;
	margin-top: 0.8vw;
}

#secondevent p, #firstevent p {
	padding-top: 1vh;
	line-height: 1.7;
	font-size: 2.5vw;
}
/*-----------footer page content----------*/
#hours {
	width: 40vw;
	padding-left: 10vw;
}
#footer h3 {
	font-size: 4.5vw;
}

#hours h4 {
	font-size: 3.3vw;
	padding-top: 1.5vw;
}

#hours p {
	font-size: 3vw;
	padding-top: 0.4vw;
}

#location {
	width: 40vw;
	padding-left: 5vw;
}

#location h4 {
	font-size: 3.3vw;
	padding-top: 1.5vw;
}

#location a:hover {
	color: #cac5c1;
}

#direction_button {
	margin-top: 3vw;
	padding: 1vw;
	width: 30vw;
	font-size: 2.5vh;
}

#newsletter {
	width: 90vw;
	padding-top: 4vw;
	padding-left: 5vw;
	text-align: center;
}

#newsletter h4 {
	font-size: 3.3vw;
	color: #cac5c1;
	padding-top: 1.5vw;
}

input#email {
	margin-top: 1.5vw;
	padding: 1vw;
	border: none;
	width: 30vw;
}

#subscribe {
	padding: 1vw;
	width: 30vw;
	font-size: 2.5vh;
}

#subscribe:hover {
	background-color: #4c5f42;
}

#direction_button:hover {
	background-color: #4c5f42;
}
#social_media2 {
	text-align: center;
	width: 90vw;
	padding-top: 4vw;
	padding-left: 5vw;
}
#social_media2 img {
	width: 6vw;
	padding-top: 2vw;
	padding-left: 0vw;
}

/*-----Hamburger Menu---*/
nav#top, nav#top li, nav#top li a {
	display: none;
}

nav.hamburger {
	background-color: rgba(255, 255, 255, .9);
	position: fixed;
	right: 5vw;
	top: 7vw;
	min-width: 200px;
	z-index: 1003;
	display: none;
	padding: 1vw;
	border-radius: 1vw;
}

nav.hamburger a {
	display: block;
	padding-right: 3vw;
	padding-left: 3vw;
	padding-top: 2vw;
	padding-bottom: 2vw;
	text-decoration: none;
	border-top: black solid 1px;
	color: #232323;
	text-decoration: none;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
  	letter-spacing: 2px;
  	font-size: 4vh;
}

.menu-on {
	position: fixed;
	z-index: 1002;
	width: 100vw;
	margin-right: 20vw;
	display: inline-block;
}
.menu-on img {
	width: 15%;
	margin-left: 77vw;
	margin-top: 6vw;
}

.menu-off {
	background-color: rgba(0,0,0, 0.4);
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 1001;
	display: none;
}

#toggle-menu {
	display: none;
}
#toggle-menu:checked ~ nav.hamburger {
	display: block;
}

#toggle-menu:checked ~ .menu-off {
	display: block;
}

/*-----------------------About Page-------------------------*/
#navcolor {
	height: 25vh;
}	

#slider {
	margin-top: 37vh;
}

#story {
	height: 40vh;
	top: 75vh;
	background-color: rgba(255, 255, 255, .5);
}
#story h1 {
	top: 35vw;
	left: 30vw;
	font-size: 7vw;
}

#story p {
	padding-left: 5vw;
	padding-right: 5vw;
	padding-top: 2%;
	text-align: center;
	font-size: 2.6vw;
}

}
@media screen and (min-width: 480px) and (max-width: 767px) {

/*About Page*/

#slider {
	margin-top: 20vh;
}

#story {
	height: 40vh;
	top: 75vh;
	background-color: rgba(255, 255, 255, .5);
}
#story h1 {
	margin-top: 2vw;
	left: 3vw;
	font-size: 3.0vw;
}

#story p {
	padding-left: 23vw;
	padding-right: 2vw;
	padding-top: 2.5%;
	text-align: right;
	font-size: 1.8vw;
}


/*-------Img Header----------*/
header img {

	position: absolute;
	width: 20vw;
	top: 5vh;
	float: left;
	margin-left: 10vw;
	z-index: 100;
}

/*-------------form--------------*/

#reservation {
	position: absolute;
	width: 70vw;
	top: 64vh;
	left: 15vw;
	background-color: rgba(255, 255, 255, .5);
}

#reservation:hover {
	background-color: rgba(255, 255, 255, .5);
}

#book img {
	width: 4vw;
	padding-top: 2.5vw;
}

select{
	margin-left: 1%;
	margin-right: 4%;
	background-color: rgba(255, 255, 255, .0);
	width: 15vw;
}

select:hover {
	background-color: rgba(255, 255, 255, .0);
	color: black;
	border: none;
}

#submit{
	margin-top: 3%;
	margin-left: 5vw;
	width: 28%;
	object-position: center;
}

#submit:hover {
	background-color: rgba(255, 255, 255, .6);
	color: black;
}

/*main page content*/

#social_media {
	float: right;
	width: 20vw;
	top: 26vh;
	left: 26.5vw;
}

#social_media img {
	width: 20%;
	margin-right: 5%;
	opacity: 0.7;
}

/*-------------menu page content------------*/

h1 {
	font-size: 7vh;
	padding-top: 7vh;
	letter-spacing: 10px;
}

#menu p {
	padding-top: 4vh;
	padding-left: 12vw;
	padding-right: 12vw;
	padding-bottom: 2vw;
	font-size: 3vw;
}

h2 {
	font-family: 'Droid Serif', serif;
	font-size: 4vw;
	text-align: center;
	letter-spacing: 2px;
	color: #232323;
}

h2 span {
	font-size: 3.2vw !important;
}

#menus {
	float: left;
	width: 17vw;
	margin-left: 6.5vw;
	margin-top: 2vh;
	text-align: center;
}

h2:hover {
	font-size: 4vw;
}

#menus:hover {
	width: 17vw;
	margin-top: 2vh;
	margin-left: 6.5vw;
}

#online {
	margin-top: 26vw;
	width: 75vw;
	height: 18vw;
	margin-left: 14vw;
}

#online:hover {
	background-color: rgba(255, 255, 255, .6);
	margin-top: 26vw;
	width: 75vw;
	height: 18vw;
	margin-left: 14vw;
}

#online img {
	width: 20vw;
	margin-right: 3vw;
	margin-top: 2vh;
}

#online h2 {
	letter-spacing: 2px;
	font-weight: 400;
  	font-size: 3.5vh;
  	text-align: left;
  	padding-left: 5vw;
  	padding-top: 7vh;
  	color: #474747;
}
#logo {
	width: 20%;
	float: left;
}

#logos {
	width: 24%;
	float: left;
	padding-top: 1vh;
}
/*-------events page content----------*/

#events h1 {
	font-size: 6vw;
	letter-spacing: 3px;
	padding-top: 3vh;
}

#firstevent {
	width: 80vw;
	margin-top: 2vh;
	margin-left: 10vw;
	background-color: rgba(255, 255, 255, .5);
	padding: 1vw;
	border-radius: 25px;
}

#secondevent {
	width: 80vw;
	margin-top: 4vh;
	margin-right: 7.5vw;
	float: right;
	background-color: rgba(255, 255, 255, .3);
	padding: 1vw;
	border-radius: 25px;
}

#secondevent h2, #firstevent h2 {
	font-size: 3.2vw;
	letter-spacing: 1px;
}

#secondevent h3, #firstevent h3 {
	font-size: 2.5vw;
	letter-spacing: 0.6px;
	margin-top: 0.8vw;
}

#secondevent p, #firstevent p {
	padding-top: 1vh;
	line-height: 1.7;
	font-size: 2vw;
}
/*footer page content*/
#hours {
	float: left;
	width: 24vw;
	padding-top: 4vw;
	padding-left: 5vw;
	letter-spacing: 0.1vw;
}
#footer h3 {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	text-decoration: underline;
	font-size: 2.5vw;
	color: white;
}

#hours h4 {
	font-family: 'Roboto Condensed', sans-serif;
	text-decoration: underline;
	font-weight: 300;
	font-size: 2.5vw;
	color: #cac5c1;
	padding-top: 1vw;
}

#hours p {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	font-size: 2vw;
	color: #cac5c1;
	padding-top: 0.3vw;
}
#location {
	float: left;
	width: 24vw;
	padding-top: 4vw;
	padding-left: 0vw;
}

#location h4 {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	font-size: 2.5vw;
	color: #cac5c1;
	padding-top: 1vw;
}

#location a {
	color: #cac5c1;
	text-decoration: none;
}

#location a:hover {
	color: #cac5c1;
}

#direction_button {
	margin-top: 1vw;
	text-align: center;
	padding: 0.7vw;
	border: none;
	width: 20vw;
	background-color: #4c5f42;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 3vh;
	color: black;
	border-radius: 10px;
}

#newsletter {
	float: left;
	width: 24vw;
	padding-top: 4vw;
	padding-left: 0vw;
}

#newsletter h4 {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	font-size: 2.5vw;
	color: #cac5c1;
	padding-top: 1vw;
}

input#email {
	margin-top: 1vw;
	padding: 0.7vw;
	border: none;
	width: 20vw;
	background-color: white;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 2.4vh;
	font-style: italic;
	color: black;
	border-radius: 10px;
}

#subscribe {
	margin-top: 2vw;
	text-align: center;
	padding: 0.7vw;
	border: none;
	width: 20vw;
	background-color: #4c5f42;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 3vh;
	color: black;
	border-radius: 10px;
}

#subscribe:hover {
	background-color: #4c5f42;
}

#direction_button:hover {
	background-color: #4c5f42;
}
#social_media2 {
	float: left;
	width: 20vw;
	padding-top: 4vw;
	padding-left: 2vw;
}
#social_media2 img {
	width: 3.5vw;
	padding-top: 2vw;
	padding-left: 0vw;

}
nav#top, nav#top li, nav#top li a {
	display: none;
}

nav.hamburger {
	background-color: rgba(255, 255, 255, .9);
	position: fixed;
	right: 5vw;
	top: 5vw;
	min-width: 200px;
	z-index: 1003;
	display: none;
	padding: 1vw;
	border-radius: 1vw;
}

nav.hamburger a {
	display: block;
	padding-right: 3vw;
	padding-left: 3vw;
	padding-top: 2vw;
	padding-bottom: 2vw;
	text-decoration: none;
	border-top: black solid 1px;
	color: #232323;
	text-decoration: none;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
  	letter-spacing: 2px;
  	font-size: 4vh;
}

.menu-on {
	position: fixed;
	z-index: 1002;
	width: 100vw;
	margin-right: 20vw;
	display: inline-block;
}
.menu-on img {
	width: 10%;
	margin-left: 80vw;
	margin-top: 2vw;
}

.menu-off {
	background-color: rgba(0,0,0, 0.4);
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 1001;
	display: none;
}

#toggle-menu {
	display: none;
}
#toggle-menu:checked ~ nav.hamburger {
	display: block;
}

#toggle-menu:checked ~ .menu-off {
	display: block;
}
	


}