@media (max-width: 991.98px) {
	/* styling for the "Welcome" content and the "How to Use" content */
	.main-content {
		display: flex;
		flex-direction: column;
	}

	.content-welcome-message,
	.content-how-to-use,
	.get-started {
		text-align: center;
	}

	.content-how-to-use h4 {
		margin-top: 1rem;
	}

	/* styling for the Search form */
	#search-form {
		flex-direction: column;
		align-items: center;
	}

	.search-button-container {
		margin-top: 0.8rem;
	}

	/* styling for the results area */
	.results-container {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.results-header {
		text-align: center;
	}

	.images-container {
		/* override the bootstrap justify-content:center class */
		justify-content: space-evenly !important;
	}
}

@media (max-width: 767.98px) {
	/* styling for the logo */
	.navbar {
		margin-bottom: 0;
	}

	/* #logo {
		width: 300px;
	} */

	/* styling for the "Welcome" content and the "How to Use" content */
	.main-content {
		display: flex;
		flex-direction: column;
	}

	.main-content p {
		text-align: center;
	}

	.content-how-to-use {
		text-align: center;
	}

	.get-started {
		text-align: center;
	}

	/* styling for the Search form */
	.row {
		margin-top: 2rem;
	}

	#search-form {
		flex-direction: column;
		align-items: center;
	}

	.search-field-container {
		width: 80%;
	}

	.search-button-container {
		width: 25%;
		margin-top: 0.5rem;
	}

	#tv-search-button {
		/* width: 100%; */
		height: 25px;
		line-height: 12.5px;
		text-align: center;
	}

	#tv-search-field {
		/* changes the font-size of the placeholder */
		font-size: 0.6rem;
	}

	/* styling the results area */
	.results-container {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: fit-content;
		margin: 0 auto;
	}

	.results-header {
		text-align: center;
	}

	.images-container {
		margin: 0 auto;
	}

	.front-card {
		width: fit-content;
	}

	.back-card {
		width: 250px;
	}
}

@media (max-width: 470.98px) {
	#logo {
	}

	.card-container {
		display: block;
	}

	.back-card {
		width: 211px;
	}
}