body {
	padding: 0px;
	padding-bottom: 180px;
}

.container {
	display: block;
}

.text-container {
	font-size: .75em;
}

.sub-nav {
	display: flex;
	flex-direction: row;
}

.text-container h5 {
	font-size: 1em;
}

.credit-cards {
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-direction: column;
	/* flex-wrap: wrap; */
	margin-top: 30px;
}

/* CARD STUFFS */


.credit-person {
	width: 375px;
	padding: 0px;
	margin: 1em;
}

.card {
	--card-base: 510px;

	border: 0.5em solid white;
	border-bottom-width: 2.5em;
	width: 100%;
	height: var(--card-base);
	padding: 0px;
	background-color: white;
	position: relative;


	/* Animation stuff */
	transition: transform .6s;
	transform-style: preserve-3d;
	color: black;
}


.card .card-img-top {
	width: 100%;
	height: 100%;
}

.card .card-img-top img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.card-img-top .card-title {
	position: absolute;
	bottom: -3.2em;
	font-size: 20px;
}

.card-body .card-title,
.card-subtitle {
	font-size: 20px;
	margin: 0px;
}

.card-text {
	font-size: 18px;
}

.puzzle-list {
	margin-top: auto;
	font-size: 16px;
	line-height: 1.25;
}



/* Hover behavior */
.credit-person:hover .card {
	transform: rotateY(180deg);
	border-bottom-width: .5em;
	height: calc(var(--card-base) + 2em);
}

.credit-person .card-img-top {
	display: block;
}

.credit-person .card-body {
	display: none;
}

.credit-person:hover .card-img-top {
	display: none;
}

.credit-person:hover .card-body {
	display: block;
	transform: rotateY(180deg);
}



.paralaxbg{
    top: 0;

    z-index: -1;

    height: 100%;
    width: 100vw;

    background-image: url(../../assets/stars.webp);

    position: fixed;
}



@media screen and (max-width: 700px) {
	.credit-person {
		width: 300px;
	}

	.card {
		--card-base: 400px;
	}

}