@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Belleza&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300&display=swap');

	@media (min-width: 0 && max-width: 759px) {
		.menu-panel {
			background-color: #e44e3a;
			height: 100px;
		}

		#logo-container {
			height: 100%;
		}

		#desktop-logo {
			display: none !important;
		}
	}

	@media (min-width: 760px) {
		.menu-panel {
			background-color: #e44e3a;
			height: 50px;
		}

		.main {
			background-color: #f1f1f1;
		}

		#logo-container {
			height: 40px;
		}

		#logo-container img {
			vertical-align: middle;
			height: 50px;
		}

		.header {
			background-color: #e44e3a;
		}

		.footer {
			#background-color: #ffffff;
		}

		#desktop-logo {
			font-family: 'Montserrat', sans-serif;
			font-size: 24px;
			color: #ffffff;
		}

		#desktop-logo-jessica {
			font-family: 'Montserrat', sans-serif;
			font-size: 32px;
			color: #e44e3a;
		}

		.login-container {
			border: 1px solid #000000; 
			max-width: 200px;
		}

		#login-form-row {
			width: 760px;
		}
	}

	.center-screen {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
		min-height: 100vh;
	}

	.center-keira {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		border: 5px solid #FFFF00;
		padding: 10px;
	}

	.centered {
		position: fixed;
		top: 50%;
		left: 50%;
		/* bring your own prefixes */
		transform: translate(-50%, -50%);
	  }

	.login-container-textbox, .login-container-button, .register-container-button {
		width:  100%;
		padding: 10px;
		margin: 10px;
	}

	.login-container-button, .register-container-button {
		background-color: #e44e3a;
		color: #ffffff;
		font-family: 'montserrat';
		font-size: 18px;
	}

	.register-container-button {
		background-color: #6dce80 !important;
	}

	.error-text {
		color: red;
		font-size: 14px;
		text-align: left;
		margin-left: 10px;
	}

	.modal-subheader {
		font-size: 12px;
		display: block;
	}
