@import url('https://fonts.googleapis.com/css2?family=Fredericka+the+Great&display=swap');

#site {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 2;
}

.card {
	--bs-card-bg: hsla(34, 22%, 90%, .33);
}

.card-body {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: column;
	gap: .5em;
	text-align: center;
}

.readmore {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: column;
	text-align: center;
}

.btn {
	font-size: 1.4em;
}

body {
	background-color: #cbbead;
	background-image: url("background.jpg");
	background-repeat: repeat-y;
	background-size: 100%;
	font-family: 'Fredericka the Great';
	text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
	font-size: 1.1em;
	padding-bottom: 5em;
}

.button-container, .project-container {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 1em;
}

.project-container {
	align-items: stretch;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 1em;
}

#video {
	text-align: center;
	width: 100%;
}

.topicImage {
	max-width: 600px;
}

p {
	margin-bottom: 0;
}

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

a:active,
a:visited {
	color: #141c54;
}

@media (max-width: 767.98px) {
  .w-25 {
    width: 80% !important;
  }
	.w-50 {
    width: 80% !important;
  }
}