* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
:root {
	--grape2f: #2f162a;
	--grape82: #82737f;
	--yellowffe7: #ffe795;
	--heading-font-family: "Times New Roman", serif;
	--text-font-family: Georgia, serif;
}
html {
	font-size: max(1.5vw, 18px);
	font-family: var(--text-font-family);
}
body {
	--body-background: #f7ece2;
	background-color: var(--body-background);
}
h1{
	font-family: var(--heading-font-family);
	text-align: center;
}

a {
	color: #000000;
	text-decoration: none;
}

p {
	padding: 0.3em;
}

.smallest {
	font-size: min(0.75rem, 3vw);
}

.heading-larger {
	font-size: min(2rem, 5.75vw);
	font-weight: 900;
}

header {
	width: 100%;
	background: linear-gradient(180deg, var(--yellowffe7), var(--grape2f));
	position: fixed;
	top: 0;
	z-index: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
img[src*="mylogo"] {
	width: min(70px, 12vw);
	height: auto;	
}

header h1 {
	padding: 0 0.2em;
}


.drop-menu {
	--fuschia84: #84325b;
	--grape2a: #2a1325;
	--grape43: #432d3f;
}
.menu-button {
	font-size: min(1.25rem, 4.5vw);
	font-weight: 600;
	padding: 0 min(1.75em, 4vw);
	transform: translate(-30%);
	background-color: var(--yellowffe7);
	border: none;
	border-radius: 1em;
}
.menu-content {
	background-color: var(--grape82);
	display: none;
	position: absolute;
	right: 1%;
	box-shadow: 0.5rem 0.5rem 0.25rem var(--grape2f);
	z-index: 1;
}
.menu-content a {
	color: var(--grape2a);
	padding: 0.2em;
	display: block;
}
.menu-content a:hover {
	font-size: 1.15em;
	background-color: var(--fuschia84);
}
.drop-menu:hover .menu-content{
	display: block;
}
.drop-menu:hover .menu-button {
	cursor: pointer;
	background-color: var(--grape43);
}

.privacy {
	min-width: 300px;
	max-width: 750px;
	padding: 1em;
	margin: min(5rem, 15vw) auto;
	background: linear-gradient(180deg, var(--yellowffe7), var(--grape2f));
}

footer {
	width: 100%;
	background: linear-gradient(180deg, var(--yellowffe7), var(--grape2f));
	display: flex;
	justify-content: space-around;
	align-items: center;
	position: fixed;
	bottom: 0;
}
	
small {
	font-size: clamp(10px, 1.5vw, 0.75rem);
}
footer button {
	font-family: var(--text-font-family);
	background-color: var(--yellowffe7);
	padding: 0.5em;
	border: none;
	border-radius: 1em;
}
footer button:hover {
	background-color: var(--grape82);
	border-radius: 1em;
}

@media only screen and (max-width: 768px) {
	.menu-button {
		transform: translate(0);
	}
	footer {
	position: relative;
	bottom: 0;
    }
}

@media print {
	header, footer {
		display: none;
	}
}