@charset "UTF-8";
/* CSS Document */

/*

---      ---  ________
\   \   /  / |_____   |  
 \   \ /  /       /  /
  \      /  hi!  /  /
   \    /       /  /
    |   ||ʘ‿ʘ)╯/  /
    |   |     /  /_____
    |   |    /_________|    
    |___|

*/
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@100&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@900&display=swap');

/*GENERAL STYLES*/
body {font-family: 'Lato', monospace; font-size:24px; margin-top:0; background-color:black; width:100vw; height:100vh; color:white;}

h1 {color:white; font-size:10vh;}
h2 {color:white; font-family:'Playfair Display'; font-size: 6vh;}
h3 {color:white; font-size: 6vh;}

* {
		margin: 0;
		color: #000;
		text-decoration: none;
	}

header {height:30vh; width:100vw;background-color:clear;}
logo {height:30vh; width: 30vw;margin-left:0vw; float:left;background-color:clear;}
nav {height:30vh; width:65vw; float:left; background-color:clear; margin-left:5vw;}
nav li {display:inline-block; background-color:clear; width:15vw; height:20vw; margin-top:10vh;}

nav li a:link {color:white; text-decoration:none;}
nav li a:hover {color:palevioletred; text-decoration:overline;}

button#hamburger-icon {margin-left:-5000px;}

.scale-times-two:hover {transform: scale(1.2);-ms-transform: scale(1.2);-webkit-transform: scale(1.2);}


/*menu*/
main {width:70vw; background-color:palevioletred; margin-top:10vh; text-align: center;margin-left:35vh; margin-right:10vh;}
aside {float:left; width:20vw;height:20vw; margin-left:5vw;background-color:clear;transition:2s;}
table {float:left; width:40vw; margin-left:25vw;height:30vh;}

/*order*/
article {transition:2s;}

/*contact*/
form {background-color:clear; width:75%; margin:0 auto; overflow: hidden;}
input,textarea {border: 1px solid #ccc; border-radius: 0.4vw; width:75%;}
label {color:white;}
fieldset {border:0;}

figure {width: 100vw; margin-left:10vw; padding-top:5vh;}

/*map*/
iframe {width:90%;}

/*covid popup*/
section {color: white; width:75vw; font-size: 5vh;background-color:black; float:right;padding:5%;}


/*footer*/
footer {height:10vh; width: 100vw; background-color:palevioletred; clear:both; text-align: center; color: white; font-size: 3vh;}
footer ul {margin-left:0; padding-left:0;background-color:clear;}
footer li {display:inline-block; width:100px; margin:0 auto; padding-top:12px; color: #fff9e3;}
footer li a:link {color:white; text-decoration:none;}
footer li a:visited {color:white; text-decoration:none;}
footer li a:hover {color:black; text-decoration:overline;}
footer li a:active {color:black; text-decoration:underline;}

/*phone*/
@media screen and (min-width: 480px) and (max-width: 511px) {

		figure#phablet {
			width: 480px;
			margin: 2vh auto 0 auto;
		}
	
	h1{font-size:5vh;}
	h2{font-size:4vh;}
	h3{font-size:4vh;}
	
	header {height:30vh; width:50vw;background-color:clear}
	logo {height:30vh; width: 40vw; margin-top: 0px; margin-left:1vw; float:left;background-color:clear;}
	
	nav {background-color:clear; margin-left: -1580px; transition: 1s; color: white; font-size: 3vh; width:2vw;height:2vh;margin-top:10vh;}
	nav li {background-color:clear; height:7vh; width:100vw; margin-top:0vh;margin-left:80vw;}
	
	/*button*/
	button#hamburger-icon {margin-top: 10px; margin-left:85vw; font-size:1em; line-height: 0; padding: 20px 10px 20px 10px; border: 4px solid #000; border-radius: 20%;}

	button#hamburger-icon:hover {background-color:palevioletred; color:white;}

	.slide-the-drawer{margin-left:-120px;}

	main {width:80vw; margin-top:1vh; margin-left:12%; justify-content: center; align-items: center;color:white;}
	figure {margin-left:15vw;}
	
	aside {float:left; width:30vw;height:20vw; margin-left:1vw; background-color:clear; margin-top:5vh;margin-bottom:5vh;}
	table {float:left; width:60vw; margin-left:22vw;height:30vh;}
	
	section {color: white; width:80vw; height:15vh; background-color:black; float:right;padding:5%; font-size: 4vw;}	
	}

/*tablet*/
@media screen and (min-width: 768px) and (max-width: 1365px) {

		figure#tablet {
			width: 768px;
			height: 1024px;
			margin: 2vh auto 0 auto;
		}
	
	h1 {font-size:8vh;}
	main {width:100vw; margin-top:1vh; margin-left:0%; justify-content: center; align-items: center;color:white;}
	figure {margin-left:27vw;}
	header {background-color:clear;}
	aside {float:left; width:30vw; margin-left:8vw;; background-color:clear; transition:2s; margin-top:5vh;margin-bottom:5vh;}
	table {float:left; width:60vw; margin-left:35vw;height:30vh;}
	
	}