@charset "UTF-8";
/* CSS Document */

li { display: list-item; list-style: none; padding: 0; }
body, html, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { border: 0; margin: 0; padding: 0; font-size: 100%; font-weight: normal; }
ol, ul { list-style: none; }
img, div { outline-style: none; border: none; }

/* html { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;
	background-size: cover; background-attachment: fixed; background-image: url(plaatjes/back01.jpg);
	background-repeat: no-repeat; background-position: center center; height: 100%; } */
body { font-family: Georgia, "Times New Roman", Times, serif; font-size: 18px; line-height: 26px; text-align: left; background: #000; }

div#content{ position: relative; width: 1024px; height: auto; margin: 0 auto; text-align: left; }
.pad70 { padding: 50px 0px 70px 0px; }

/* LOGO EN TITEL */
div#logo { position: relative; float: left; width: 300px; height: 108px; margin-bottom: 20px; }
div#fysiek { position: relative; float: left; width: 500px; height: 30px; margin: 50px 0 0 70px; }
div#fysiek p { font-size: 32px; font-style: italic; color:#FFF; text-shadow: 0.05em 0.05em #000; }

div#taal { position: relative; float: right; width: 70px; height: 40px; text-align: right; }
div#taal p { font-family: 'Mukta Vaani', sans-serif; font-size: 18px; text-transform: uppercase; color: #fff; text-shadow: 0.05em 0.05em #000; letter-spacing: 0.05em; }
a.taal { color: #fff; text-decoration: none; }
a.taal:hover { color: #666; text-decoration: none; color: #666; }
.taalact { color: #f2db27; text-decoration: none; }

/* MENU 1 en MENU 2 */
div#menu, div#menu2 { position: relative; float: left; width: 160px; height: auto; padding-top: 20px; margin-right: 20px; }
ul.menu li { position: relative; font-family: 'Mukta Vaani', sans-serif; font-size: 18px; padding-bottom: 18px; line-height: 22px; text-transform: uppercase; text-align: left; color: #fff; text-shadow: 0.05em 0.05em #000; letter-spacing: 0.05em; }
ul.menu { padding-bottom: 10px; }
a.menu { color: #fff; text-decoration: none; text-shadow: 0.05em 0.05em #000; }
a.menu:hover { color: #f2db27; }
.menuact { 	color: #f2db27; text-decoration: none; text-shadow: 0.05em 0.05em #000; }
a.menuact:hover { color: #f2db27; }
div#menu img { margin-right: 4px; }

/* SOCIAL */
div#social { visibility: hidden; }

/* TEKST */
div#tekst { position: relative; float: left; width: 480px; height: auto; padding-top: 20px; margin: 0 20px 30px 0; }
div#tekst img { padding-bottom: 10px;  }

div#geel { background-color: #f2db27; opacity: 0.90; filter: alpha(opacity=90); padding: 20px 20px 14px 20px; }
ul.geel { margin-left: 20px; }
ul.geel li { list-style-type: disc; }

div#sponsor { padding-top: 10px; }
div#sponsor img { padding-right: 20px; }

div#bestel { background-color: #41c0ec; border: none; color: #fff; width: 160px; padding: 10px; margin: 0 auto 0 auto; text-align: center; }
div#bestel a { width: 90px; font-size: 16px; color: #fff;}
div#bestel:hover { background-color: #d6261b; }
.bestel { font-size: 16px; color: #000000; font-style: italic; }

/* QUOTE */
div#quote { position: relative; float: left; width: 160px; height: auto; padding-top: 20px; }
div#grijs { background-color:rgba(51,51,51,0.8); padding: 20px 15px 10px 17px; z-index: 4; }
div#grijs p { font-size: 14px; font-style: italic; color: #fff; opacity: 1.0; line-height: 20px; padding-bottom: 5px;}
div#grijs a { color: #f2db27; text-decoration: none; }
div#grijs a:hover { color: #666; }

.frame { margin-top: 30px; }
.clearfix { display: block; }
.clearfix:after { content: "."; visibility: hidden; display: block; height: 0; clear: both; float: none; }
.lijn { border-top-width: 2px; border-top-style: solid; border-top-color: #f2db27; }

/* TYPOGRAFIE */
p { font-size: 18px; line-height: 26px; padding-bottom: 20px; }
a { text-decoration: underline; color: #000; }
a:hover { text-decoration: none; color: #666; }

h1 { font-size: 26px; padding-bottom: 26px; }
h2 { font-weight: bold; font-size: 20px; line-height: 28px; }
h3 { font-size: 10px; font-family: "Arial Black", Gadget, sans-serif; text-transform: uppercase; color: #fff; line-height: 16px; padding-bottom: 10px; } 

/* responsive dingen */
input[type=checkbox] { display: none; }
/* 
/* content { width: 90%; height: auto; top: initial; } */

@media screen and (max-width: 992px) {
div#content { width: 90%; }
.pad70 { padding: 20px 10px 20px 12px; }

div#logo { width: 60%; height: auto; margin: 0px 0 20px 53px; }
div#logo img { width: 100%; height: auto; }
div#fysiek { width: 100%; margin: 0 0 20px 0;  }
div#fysiek p { font-size: 22px; }
div#taal { width: 20%; margin-top: -10px; }
div#taal p { font-size: 14px; letter-spacing: none; }

div#social { float: left; visibility: visible; width: 80%; height: auto; padding: 20px 0 20px 0; }
div#social img { width: 10%; height: 10%; margin-right: 6px; }
div#social h4 { font-family: 'Mukta Vaani', sans-serif; font-size: 16px; text-transform: uppercase; color: #fff; text-shadow: 0.05em 0.05em #000; letter-spacing: 0.05em; }

div#soc { display: none; }
div#menu { display: none; }

div#tekst { width: 100%; margin: 10px 0 0 0; height: auto; padding-top: 12px; }
div#geel { width: 94%; padding: 14px 10px 20px 10px; }
div#geel img { width: 100%; height: auto; }
div#sponsor img { width: 30%; height: 30%; padding-right: 5px; }
iframe { width: 100%; height: 100px %; }

div#quote { width: 100%; margin: 30px 0 0 0; height: auto; padding-top: 12px;  }
div#grijs { width: 95%; padding: 14px 10px 20px 10px; }

label[for="verstop-menu"] { position: absolute; width: 40px; height: 40px; display: block; top: 14px; left: 12px; 
    background: url('../responsive/blokje5.png') no-repeat center center; margin-right: 10px; }

div#menu { position:relative; top: 0px; width: 30%; background-color:rgba(51,51,51,0.9); margin: 0 7px 0 0;
	z-index: 9999; padding: 10px 10px 0px 10px; }
div#menu img { width: 98%; height: auto; padding-bottom: 10px; }
ul.menu li { font-size: 16px; line-height: 20px; color: #000; text-shadow: none; padding-bottom: 6px;  }

input[type=checkbox]:checked ~ div#menu { display: table; }

h1 { font-size: 24px; line-height: 120%;  }
p { padding-top: 3px; font-size: 18px; line-height: 26px; }


}