:root {
  --niebieski: #26A69A;
  --zielony: #A5D6A7;
  --brazowy: #8D6E63;
}


body
{
	background-image: url("paper.jpg");
	background-color: #ccc;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed; 
	background-size: cover;
	

	color: #fff;
	text-align: center;
	font-size: 50px;
	padding: 0px;
	margin: 0px;
}
#header
{
	background-color: var(--niebieski);
	color: #3f3f3f;
	padding: 10px;
	position: fixed;
    top: 0;
	width: 100%;
	z-index: 1000;
}
#main-content
{
	background-color: var(--niebieski);
	margin: 20px;
	padding: 30px;
	width: 800px;
	border-radius: 10px;
}
#content
{
	background-color: var(--niebieski);
	margin: 20px;
	padding: 30px;
	height: 715px;
}
#answer-box
{
	float: left;
	border-style: solid;
    border-width: 1px;
	border-color: grey;
	border-radius: 10px;
	margin: 2%;
	padding-top: 15%;
	padding-bottom: 15%;
	width: 45%;
}
#footer
{
	background-color: var(--niebieski);
	padding: 10px;
	font-size: 20px;
}
#afooter
{
	background-color: var(--niebieski);
	padding: 10px;
	font-size: 20px;
	position: fixed;
    bottom: 0;
	width: 100%;
}
#content-holder
{
	background-color: stateblue;
	 display: flex; 
	 justify-content: center; 
	 align-items: center;
	 margin-top: 80px;
}
#box
{
	background-color: white;
	color: black;
	padding: 10px;
	border-radius: 10px;
}
#box-title
{
	background: var(--zielony);
	padding: 10px;
	border-radius: 10px;
}
#box-content
{
	font-size: 30px;
	background-color: white;
	padding: 20px;
	background-color: stateblue;
}
.submit {
	margin-top: 50px;
	margin-bottom: 50px;
	padding: 1rem 0.75rem;
	width: 100%;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	border-radius: 3rem;
	border-color: lightgray;
	color: black;
	cursor: pointer;
	transition: all 300ms;
	font-weight: 600;
	font-size: 20px;
}

.submit:hover {
	background-color: var(--zielony);
	color: white;
}

	 display: flex; 
	 justify-content: center; 
	 align-items: center;