/* General classes */
:root {
	--primary-color: #89cff0;
	--secondary-color: #f0aa89;
	--tertiary-color: #f089cf;
	
}
body {
	padding-bottom: 25px;
}
.nowrap {
	white-space: nowrap;
}
.tac {
	text-align: center;
}


/* Bootstrap overwrites */
.row {
	margin-bottom: 15px;
}
.btn-large {
	min-width: 70%;
	margin-bottom: 5px;
}
.btn-row {			/* centers it, makes it not too big */
	margin: 5px auto;
	display:block;
	max-width: 360px;
}	
	.btn-primary {
		background-color: var(--primary-color);
		border: 1px solid black;
	}
	.btn-primary:hover {        /* Invert colors on hover */
		font-style:italic;
		border-color: var(--primary-color);
		background-color: var(--bs-btn-color);
		color: var(--bs-btn-bg);
	}
	
.submit-btn {
	background-color: green;
	margin-top: 25px;
}


/* Navbar */
#navbar {
	margin-bottom: 25px;
}
	.navbar-brand {
		margin-left: 15px;
	}
	.nav-item {
		margin-right: 5px;
	}
	.navbar-toggler {
		margin-right: 5px;
	}
		.navbar-toggler:focus {
			box-shadow: 0 0 0 .1rem;		/* Bump down bootstrap's shadow from 25% */
		}


@media (width <= 720px) {
	
	.nav-item {
		text-align: center;
	}
	.nav-item > .btn {
		margin-top: 10px;
		min-width: 150px;
		width: 80%;

	}
}