@charset "utf-8";

/* Copyright Michiel de Boer */

/* ALGEMENE OPMAAK 
__________________________________________________________________________________________________ */

/* Typekit font "skolar-sans-latin" 16px */
/* TEVENS Typekit font "Jaf Domus" - zelfde CSS blijkbaar vanwege project */
@import url("https://use.typekit.net/ned6wzy.css");

/* Google fonts "PT Sans" 15px */
/* @import url("https://fonts.googleapis.com/css?family=PT+Sans:400,400i,700&display=swap"); */

/* Google fonts "Alegreya Sans" 17px */
/* @import url("https://fonts.googleapis.com/css?family=Alegreya+Sans:400,400i,700,700i&display=swap"); */

/* Google fonts "Source Sans Pro" 16px line-height: 1.3;*/
/* @import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700&display=swap"); */

/* Chrome (3.0) heeft additionele p {margin: 0;}  benoemingen nodig */
{ 
	padding: 0px;
	margin: 0px;
}
html {
	height: 100%;
	margin: 0px;
}
a {
	text-decoration: none;
	color: #000
}
a img {
	border: 0;
}
::selection {
  background: #bfbfbf;
}
body {
	padding: 0px;
	margin: 0px;
	height: 100%;
	width: 100%;
	background-color: #fff;
	background-size: cover;
	font-family: "skolar-sans-latin", sans-serif;
	font-size: 16px ;
	/* line-height: 1.6; */
	color: #000;
}
#container {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    min-height: 100%;
}
.header {
	min-width: 677px; /* bepaald tevens minimumbreedte van de site... */
	height: 50px;
	background: url("michiel-de-boer-posy-v2.png") no-repeat 179px 16px;
	background-size: 990px 64px;
	padding-top: 47px;
	/*padding-left: 1090px;*/
	line-height: 15px;
	color: #bfbfbf;
}
@media only screen and (max-width: 1180px) {
.header {
	width: 499px; /* bepaald tevens minimumbreedte van de site... */
	height: 50px;
	background: url("michiel-de-boer-posy-v2-kort.png") no-repeat 179px 16px;
	background-size: 453px 64px;
	padding-top: 47px;
	line-height: 15px;
	color: #bfbfbf;
}
}
.header a {
	text-decoration: underline;
	color: #bfbfbf;
}
.header a:hover {
	text-decoration: none;
}
.nieuweregel {
	clear: both;
}
.onzichtbaar {
	display: none;
}
.ruimte {
	width: 37px;
	height: 37px;
	float: left;
	clear: both;
	border-radius: 5px;
}
.en { /* Engelstalig, aan/uit via php script en twee css's */
	display: none;
}
.nl { /* Nederlands */
}

/* MENU 
__________________________________________________________________________________________________ */

#menucontainer {
	float: left;
	margin: 0 auto; 
	position: fixed;
}

@media screen and (max-height: 740px) {
#menucontainer {
	float: left;
	margin: 0 auto; 
	position: inherit;
}
}
.menu a {
	margin-left: 37px;
	margin-bottom: 3px;
	height: 70px;
	width: 86px;
	padding: 30px 9px 0px 9px;
	text-align: center;
	border-radius: 5px;
	float: left;
	clear: both;
	font-family: "skolar-sans-latin", sans-serif;
	font-size: 18px;
	font-weight: 700;
	opacity: 1;
	transition: 0.3s;
}
.taalknop a {
	margin-left: 55px;
	margin-bottom: 3px;
	height: 62px;
	width: 48px;
	padding: 4px 9px 0 9px;
	border-radius: 5px;
	float: left;
	clear: both;
	font-family: "skolar-sans-latin", sans-serif;
	font-weight: 700;
	background-color: #e3e3e3;
	transition: 0.3s;
}
.menu a:hover, 
.taalknop a:hover {
	opacity: 0.8;
	background-color: #000;
	color: #FFF;
}
.menu-alles a {	background-color: #bfbfbf;}
.menu-foto a { background-color: #e9d36e;}
.menu-design a { background-color: #e29373;}
.menu-audio a {	background-color: #8c94c7;}
.menu-muziek a { background-color: #8dc3b2;}
.menu-contact a {
	background-color: transparent !important;
	font-size: 40px !important;
	padding-top: 0px !important;
	color: #7C7C7C !important;
	margin-top: -17px;
}

/* ONDERWERPEN 
__________________________________________________________________________________________________ */

#contentcontainer {
	top: 0;
	text-align: left;
	padding-left: 178px;
}
.ruimte-beneden {
	clear: both;
	height: 40px;
	float: left;
}
.onderwerp {
	margin-right: 3px;
	margin-bottom: 3px;
	padding: 6px 9px 9px 11px;
	border-radius: 8px;
	height: 219px;
	width: 214px;
	float: left;
	background-repeat: no-repeat;
	background-size: 234px 156px, 17px;
	background-position: bottom, right top;
	transition: 0.3s;
}
.onderwerp:hover { 
	background-color: #000 !important; 
	filter: opacity(0.8);
	color: #FFF;
}
.onderwerp-foto {background-color: #e9d36e;}
.onderwerp-design {background-color: #e29373;}
.onderwerp-audio {background-color: #8c94c7;}
.onderwerp-muziek {background-color: #8dc3b2;}

.tekstklein {
	font-size: 15px;;
	line-height: 17px;
	padding-top: 3px;
}
.titel {
	font-family: "skolar-sans-latin", sans-serif;
	font-size: 22px;
	/* font: 15px "Trebuchet MS", sans-serif; */
	line-height: 22px;
	padding-top: 0px;
	margin-top: -6px; /* neg. padding gaat niet en tekst start anders te laag */
	padding-bottom: 0px
}
.menutitel {
	font-family: "skolar-sans-latin", sans-serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 22px;
}


/* GALERIJ 
__________________________________________________________________________________________________ */

.tekstvlak {
	padding-bottom: 10px;
	padding-left: 0px;
	max-width: 1024px;
	min-height: 58px;
	margin-right: 20px;
}
.tekst {
	padding-bottom: 0px;
}
.tekst a {
	text-decoration: underline;
}
.tekst a:hover {
	text-decoration: none;
}
.tekstfoto {
	width: 1024px;
	padding-bottom: 37px;
	padding-right: 37px;
	float: left;
}
.foto {
	/* width: 720px; */
	/*padding: 0px 37px 37px 0px;*/
	padding: 0;
	margin-right: 37px;
	margin-bottom: 37px;
	float: left;
	transition: 0.5s;
}
.foto:active, .fotoomschrijvinggeenlink:active {
	transform: scale(1.4);
	cursor:none;
	box-shadow: 0 0px 50px 1000px rgba(0, 0, 0, 0.6);
}
.fotoomschrijving, .fotoomschrijvinggeenlink {
	width: 670px;
	height: 480px;
	padding: 0px 25px;
	float: left;
	margin-right: 37px;
	margin-bottom: 37px;
	background-repeat: no-repeat;
	background-size: 720px 480px;
	transition: 0.3s;
}
.fotoomschrijving:hover {
	/* filter: opacity(0.8);*/ 
	border-radius: 36px;
}
.cursorplaatje {
	/* image-rendering: pixelated; */
	background-color: #DDD;
	height: 70px;
	width: 70px;
	margin: 6px 6px 0px 0px;
	float: left;
	border-radius: 50%;
	background-repeat: no-repeat;
	transition: 0.3s;
}
.cursorplaatje:hover {
	background-color: #4d4d4d;
}
.galerijknop:hover {
	background-color: #000 !important;
	color: #FFF;
	opacity: 0.7;
}
.galerijknop {
	background-color: #DDD;
	height: 50px;
	min-width: 161px;
	text-align: center; 
	margin: 6px 6px 0px 0px;
	float: left;
	border-radius: 35px;
	transition: 0.3s;
	padding: 20px 30px 0px 30px;
	font-weight: 700;
	font-size: 15px;
}

/* STARTPAGINA (test)
__________________________________________________________________________________________________ */

/*.start-inhoud {
	display: table-cell;
    vertical-align: middle;
	text-align: center;
	width: 570px;
	height: 758px;
	margin: 100px auto; 
}

.start-audio {
	margin-bottom: 2px;
	padding: 12px 27px 27px 27px;
	border-radius: 5px;
	width: 514px; 
	height: 529px;
	float: left;
	background-color: #8c94c7;
}
.start-audio:hover {
	background-color: #c6cae3;
}
.start-titel {
	font: 45px "Trebuchet MS", sans-serif;
	line-height: 48px;
	padding-top: 6px;
}
*/