body {
	background-image: url('images/WebsiteBackground.png');
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

nav {
	text-align: center;
	border: 2px solid white;
	background-color: black;
	border-radius: 5px;
	margin: 20px;
	padding: 20px;
	font-size: 2vw;
}


.intro {
	text-align: center;
	color: white;
	font-family: courier;
	border: 2px solid white;
	background-color: black;
	border-radius: 5px;
	margin: 20px;
	padding: 20px;
	
}

.intro-text {
	text-align: center;
	color: white;
	font-family: courier;
}

.btn-link {
  display: inline-block;
  gap: 10px;
  padding: 10px 20px;
  background-color: white;
  color: black;
  text-decoration: none; /* Removes the default underline */
  font-weight: bold;
  border-radius: 5px;
  border: 2px solid black;
  text-align: center;
  font-family: courier;
}


.btn-link:hover {
  background-color: gray; /* Darkens on hover */
}

img, video {
    max-width: 100%;
    height: auto;
}

/* Default styles for mobile */
body { font-size: 1rem; }

/* Adjustments for tablets and desktops */
@media screen and (min-width: 768px) {
    body { font-size: 1.1rem; }
}

.art {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 15px;
	flex-wrap: wrap;
	border: 2px solid white;
	background-color: black;
	border-radius: 5px;
	margin: 20px;
	padding: 20px;
	text-align: center;
	
	
}

.art-image {
	border: 2px solid white;
	border-radius: 5px;

}

.contact {
	border: 2px solid white;
	border-radius: 5px;
	margin: 20px;
	padding: 20px;
	background-color: black;
	font-family: courier;
	text-align: center;
	color: white;
	
}

footer {
	
	text-align: center;
	text-decoration: none;
	color: white;
	font-family: courier;
	border: 2px solid white;
	background-color: black;
	border-radius: 5px;
	margin: 20px;
	padding: 20px;
	
}


@media only screen and (width >= 800px) {
body {
	background-image: url('images/WebsiteBackground.png');
	background-position: center;
	background-size: cover;
	background-attachment: fixed;

}

}