* {
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	margin: 0px;
	padding: 0px;
}

h1 {
	text-align: center;
	margin: 30px;
}

h2 {
	text-align: center;
	margin-bottom: 20px;
}

p, h3, form {
	text-align: center;
}

input {
	transition: 0.3s;
	text-align: center;
	font-size: 14px;
	padding: 3px;
	margin: 5px;
	border: 1px solid black;
	border-radius: 20px;
	background-color: white;
	box-shadow: 0px 0px 4px 0px black;
}

input:hover, input:focus {
	background-color: #E5E5E5;
}

.links {
	width: 500px;
	margin-left: 50px;
}

#game {
	position: absolute;
	max-width: 80vw;
	width: 500px;
	height: 500px;
	margin-left: 50px;
}

#game img {
	height: 480px;
	width: 480px;
	padding: 10px;
}

.f {
	position: absolute;
	opacity: 0;
	height: 40px;
	width: 40px;
	background-color: white;
	box-shadow: 0px 0px 3px 2px black;
	border-radius: 50%;
	margin: 5px;
	transition: 0.2s;
	cursor: pointer;
}

.hover:hover {
	opacity: 0.7;
}

.w {
	opacity: 1;
	background-color: white;
	box-shadow: 0px 0px 3px 2px black;
}

.b {
	opacity: 1;
	background-color: black;
	box-shadow: 0px 0px 3px 2px white;
}

.w:hover, .b:hover {
	opacity: 1;
}

.w .selected {
	background-color: #dddddd;
}

.b .selected {
	background-color: #444444;
}


#multi {
	margin-top: 550px;
}


@media (min-width: 900px) {
	#multi {
		position: absolute;
		right: 10px;
		width: calc(100% - 550px);
		margin-top: 0px;
		top: 100px;

	}
}








#game #f1, #game #f2, #game #f3 {
	top: -8px;
}

#game #f4, #game #f5, #game #f6 {
	top: 70px;
}

#game #f7, #game #f8, #game #f9 {
	top: 148px;
}


#game #f10, #game #f11, #game #f12, #game #f13, #game #f14, #game #f15 {
	top: 225px;
}


#game #f16, #game #f17, #game #f18 {
	bottom: 148px;
}

#game #f19, #game #f20, #game #f21 {
	bottom: 70px;
}

#game #f22, #game #f23, #game #f24 {
	bottom: -8px;
}




#game #f1, #game #f10, #game #f22 {
	left: -8px;
}

#game #f4, #game #f11, #game #f19 {
	left: 70px;
}

#game #f7, #game #f12, #game #f16 {
	left: 148px;
}


#game #f2, #game #f5, #game #f8, #game #f17, #game #f20, #game #f23 {
	left: 225px;
}


#game #f9, #game #f13, #game #f18 {
	right: 148px;
}

#game #f6, #game #f14, #game #f21 {
	right: 70px;
}

#game #f3, #game #f15, #game #f24 {
	right: -8px;
}