@import url('https://fonts.googleapis.com/css2?family=Momo+Trust+Display&family=Stack+Sans+Headline:wght@200..700&display=swap');

input,select {
	font-family: "Momo Trust Display", sans-serif;
	border: 2px solid hsl(0 0% 65%);
	outline: none;
	padding: 12px;
	font-size: 16px;
	border-radius: 10px;
	font-family: "Stack Sans Headline", sans-serif;
	color: hsl(0, 0%, 24%);
	font-weight: bold;

}
input:focus,select:focus{
	border: 2px solid #1f2936;

}

label {
	font-size: 22px;
	text-align: left;
	font-family: "Momo Trust Display", sans-serif;
	color: hsl(0, 0%, 24%);

}

button {
	width: 100%;
	padding: 10px;
	font-size: 22px;
	border-radius: 10px;
	border: none;
	background-color: hsl(0, 0%, 96%);
	border: 1px solid hsl(0 0% 65%);
	color: hsl(0, 0%, 24%);
	font-weight: bold;
	cursor: pointer;

}

button.bluebutton{
	background-color: #047cdf !important;
	border: 2px solid #047cdf !important;
	color:white;
}

button.redbutton{
	background-color: #d83d3e !important;
	border: 2px solid #d83d3e !important;
	color:white;
}
button:focus,
button:hover{
	outline: none;
	filter: brightness(90%);
	border: 2px solid hsl(0 0% 65%);
}

.inputsCont,.ButtonCont,.ButtonContside{
	display: flex;
	flex-direction: column;
	padding: 5px;
	gap:5px;
}
.ButtonCont{
	justify-content: end;
}

.ButtonContside{
	justify-content: end;
	gap:10px;
	flex-direction: row;

}

.inputsContGrid{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px,1fr));
	gap:10px;
	padding: 10px 20px;
}