body {
   background-color: #22CCBB;
}

h1 {
	font-family: verdana;
	/*font-size: 26px;*/
}

h2 {
	font-family: "myriad pro", verdana;
}

p, li {
	font-family: verdana, "courier new";
}

a:link {
	text-decoration: none;
}

@media screen and (max-width: 619.99px) {

	#poster {
		min-width: 280px;
		width: 100%;
	}

	#poster img {
		min-width: 280px;
		width: 100%;
	}

	#uitslag {
		display: block;
		padding: 0px 10px 1px;
		clear: both;
		font-size: 30px;
		background: orange;
	}

	#intro {
		display: block;
		clear: both;
	}

	#vragen {
		display: block;
		max-width: 430px;
	}

	.vraag {
		margin-top: 24px;
	}

}

@media screen and (min-width: 620px) and (max-aspect-ratio: 15/9) {

	#poster {
		float: right;
		min-width: 280px;
		width: 40%;
	}

	#poster img {
		width: 100%;
		min-width: 280px;
		min-height: 396px;
	}

	#uitslag {
		display: block;
		padding: 1px 10px;
		/*clear: both;*/
		margin: 0px 8px;
		font-size: 16px;
		background: orange;
	}

	#intro	{
		display: block;
		max-width: 430px;
		/*clear: both;*/
		margin-left: 8px;
		}

	#vragen {
		display: block;
		max-width: 430px;
		margin-left: 8px;
	}


	.vraag {
		margin-top: 24px;
	}

}


/* and (min-aspect-ratio: 2/1)*/
@media screen and (min-width: 620px) and (min-aspect-ratio: 15/9) {

	#poster {
		float: right;
		min-width: 280px;
		width: 40%;
	}

	#poster img {
		height: 95%;
		min-width: 280px;
		min-height: 396px;
	}

	#uitslag {
		display: block;
		padding: 1px 10px;
		/*clear: both;*/
		margin: 0px 8px;
		font-size: 16px;
		background: orange;
	}

	#intro	{
		display: block;
		max-width: 440px;
		/* clear: both; */
		margin-left: 8px;
	}

	#vragen {
		display: block;
		max-width: 440px;
		margin-left: 8px;
	}

	.vraag {
		margin-top: 24px;
	}

}