.wrapper {
			display: grid;
			grid-template-columns: 1fr 2fr 5fr 1fr;
			grid-auto-rows: minmax(100px, auto);
			grid-gap: 1em;
		}
		.wrapper > div {
			padding: 1em;
		}
		.wrapper > div:nth-child(odd) {
			padding: 1em;
		}
		#albums {
			display: grid;
			grid-template-rows: 2fr 2fr 2fr;
			grid-gap: 1em;
		}
		#multimedia {
			display: grid;
					background: rgb(131, 58, 180);
			background: linear-gradient(0deg, rgba(131, 58, 180, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(252, 176, 69, 1) 100%);
		}
		.pager a {
			font-size: 3rem;
			font-weight: bolder;
			text-decoration: none;
			border-radius: 50%;
			box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.8);
			padding-left: 10px;
			padding-right: 10px;
		}
		img {
			width: 100%;
			Height: auto;
		}
		video {
			width: 100%;
			Height: auto;
		}
		.pager a:hover {
			opacity: 0.7;
			filter: alpha(opacity=40);
			font-size: 3.2rem;
			background-image: linear-gradient(to bottom, hsl(0, 80%, 50%), #bada55);
		}
		#vorige {
			z-index: 1;
			margin-left: 10px;
			position: absolute;
			top: 45%;
			left: 4%;
			margin-right: 15px;
		}
		#volgende {
			z-index: 1;
			margin-right: 10px;
			position: absolute;
			top: 45%;
			right: 4%;
		}
		#album-cover1 {
			justify-self: center;
		}
		#album-cover2 {
			justify-self: center;
		}
		#album-cover3 {
			justify-self: center;
		}
		#album-1 {
			align-self: center;
			justify-self: center;
			
		}
		#album-2 {
			align-self: center;
			justify-self: center;
		
		}
		#album-3 {
			align-self: center;
			justify-self: center;
		
		}
		/* On screens that are 600px or less, set the background color to olive */
		
		@media screen and (max-width: 600px) {
			.wrapper {
				background-color:darkcyan;
			}
			#albums {
				grid-template-rows: none;
				display: grid;
				grid-area: 1 / 1 / span 1/ span 4;
				background-color: orangered;
			}
			#album-cover1 {
				display: grid;
				grid-area: 1 / 1 / span 1 / span 1;
			}
			#album-cover2 {
				display: grid;
				grid-area: 1 / 2 / span 1 / span 1;
			}
			#album-cover3 {
				display: grid;
				grid-area: 1 / 3 / span 1 / span 1;
			}
			.pager > #vorige {
				display: grid;
				grid-area: 2 / 1 / span 1 / span 1;
				margin-left: 0;
			}
			#multimedia {
				display: grid;
				grid-area: 2 / 2 / span 3 / span 2;
			
			}
			.pager > #volgende {
				grid-area: 2 / 4 / span 1 / span 1;
				margin-right: 0;
			}
			nav ul li a {
				font-size: 1rem;
				opacity: 0.5;
				filter: alpha(opacity=50);
			}
			nav ul li a:hover,
			nav ul li a:focus {
				color: firebrick;
				background-color: rgba(60, 255, 0, 0.2);
				letter-spacing: 1px;
			}
		}