body {
			background-color: white;
		}

		h1 {
			text-align: center;
			font-family: 'Gaegu', cursive;
		}

		h2 {
			text-align: center;
			font-family: 'Gaegu', cursive;
		}

		img {
			padding-bottom: 10px;
		}

		h3 {
			color: white;
			font-family: 'Gaegu', cursive;
			width: 100%;
		}

		p {
			text-align: center;
		}


		#header {
			font-family: 'Gaegu', cursive;
			margin-left: auto;
			margin-right: auto;
			text-align: center;
			background-image: url("https://static.lettersblogatory.com/wp-content/uploads/2019/12/sweet-james-scaled-e1577329722475-300x156.jpg");
			background-size: cover;
			background-position: center;
			height: 5%;
		}

		#nav {
			margin-left: auto;
			margin-right: auto;
			text-decoration: none;
			color: white;
			background-color: lightseagreen;
			font-family: 'Gaegu', cursive;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: flex-start;
			width: 93%;
			max-width: 900px;
			margin-bottom: 15px;
		}

		#nav a {
			text-decoration: none;
			text-align: center;
			color: white;
			background-color: lightseagreen;
			width: 25%;
			padding-top: 10px;
			padding-bottom: 10px;
		}

		#nav a:hover {
			background-color: lightseagreen;
			color: black;
		}

		#nav .active {
			background-color: lightcoral;
		}

		#footer {
			color: white;
			background-color: lightseagreen;
			text-align: center;
			margin-top: 15px;
			margin-bottom: 15px;
		}

		@media(max-width: 1024px) {

			#products-container {
				width: 80%;
			}

			.productsforsale {
				width: 21%;

			}

			#header h1 {
				color: black;
			}

			#footer {
				width: 100%;
			}
		}

		@media(max-width: 768px) {

			#products-container {
				max-width: 90%;
			}

			.productsforsale {
				background-color: lightcoral;
				width: 44%;
			}

			#header h1 {
				font-size: 32px; 
				color: navy;
			}

			body {
				background-color: #192845;
			}

			#footer {
				background-color: lightslategray;
				width: 100%;
			}

			#nav {
				display: flex;
				align-items: center;
				flex-direction: column;
				width: 93%;
				justify-content: space-between;

			}

			#nav a {
				width: 93%;
			}
		}

		.btn-cart {
			background-color: lightblue;
		}

		.card-info {
			color: black;
		}

		.alert-note {
			text-align: center;
			width: 50%;
			color: black;
			background-color: lightgray;
			font-family: 'Gaegu', cursive;

		}