* {
margin:0;
padding:0;
}
html {
	background-color:#8888ff; 

}
#gra {
	background-color:#aaaaff;  
	margin:20px;
	padding:20px;
}


#rodzaj {
	background-color: #ddf;
	clear:both;
}
#rodzaj h2 {
	background-color: #dfd;
}
#rodzaj div {
	vertical-align: top;
	display: inline-block;
	margin: 5px 10px;
}
#rodzaj div button {
	font: normal 14pt monospace;
	width: 300px;

}
#kolory  {
	display:flex;
	background-color: #ffd;
}
#kolory div {
	padding:15px 30px;
	text-align: center;
}

#dajplik {
	margin: 20px;
	display:block;
	text-decoration: none;
	vertical-align: middle;
	color: black;
	font: normal 18pt monospace;
	border: 2px inset #ddf;
	background-color: #ddf;
	padding: 8px;
	border-radius: 5px;
	float:left;
}
#dajplik:hover {
	color: black;
	font: normal 18pt monospace;
	border: 2px outset #ddf;
}
#dajplik span {
	font: bold 2em monospace;
	vertical-align: middle;
}
#lupa {
	margin: 20px;
	width:300px;
	height:300px;
	border:1px solid green;
	border-radius: 30%;
	overflow: hidden;
	float:left;
}
#lupa img {
	position: relative;
	left: -9cm;
	top:-10cm;
}

#widok {
	margin: 20px;
	text-align: center;
	float: left;
}
footer {
	clear: both;
	text-align: center;
	font-size:8pt;
	background-color: #ddf;
}