@charset "utf-8";

body {
color: black;
background: #eeeeee url("img/rialto.gif") no-repeat fixed center;
font-size: 100%;
font-family: calibri, verdana, tahoma, futura lt, sans-serif;
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
margin: 0;
padding: 0;
left: 0;
top: 0;
border: 0;
}

div.gridcontainer {
width: 96%;
max-width: 1500px;
display: block;
position: relative;
float: left;
clear: both;
margin: 20px 2% 0 2%;
padding: 0;
left: 0;
top: 0;
border: 0;
background-color: transparent;
}


/* parallax */

.parallax{
background: url("img/klarinet6.jpg");

}

.parallax-fl{
background: url("img/fluit4.jpg");

}
.parallax-sx{
background: url("img/altsax5.jpg");

}

.parallax-ewi{
background: url("img/DigitalWindInstruments2.jpg");

}

.parallax-bl{
background: url("img/blokfluit8.jpg");

}


.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl{
height: 200px;
width: 100%;
background-position: center top;
background-attachment: fixed;
background-repeat: no-repeat;
background-size: 1000px 333px;
}





/* blokken */


header{
width: 100%;
height: 200px ;
max-width: 1500px;
display: block;
position: relative ;
float: left;
clear: both;
margin: 0;
padding: 0;
background-color: transparent;
overflow: visible;
}

nav{
width: 100%;
display: block;
position: relative;
float: left;
clear: both;
height: 30px;
margin: 0;
padding:50px 0 20px 0;
background-color: rgba(51,51,51,1);
border-radius: 10px 10px 0 0;
}


div.main{
width: 100%;
height: initial ;
display: inline-flex ;
position: relative;
float: left;
clear: both;
margin: 0 auto 0 auto;
padding: 40px 0 20px 0;
left: 0;
background-color: rgba(102,102,102,0.1);
}

section {
width: 55%;
height: initial ;
display: block;
position: relative;
float: left;
clear: none;
margin: 0 20px 0 20px;
padding: 0;

background-color: transparent;
}

aside {
width: 45%;
height: initial;
display: block;
position: relative;
float: right;
clear: none;
margin: 0 20px 0 0;
padding: 0;
background-color: transparent;
}


article {
width: 100%;
height: initial;
display: block;
position: relative;
float: left;
clear: both;
box-sizing: border-box;
margin: 0 0 20px 0;
padding: 40px;
background-color: transparent;
border-radius: 10px;
}



section article:nth-of-type(4n+1), aside article:nth-of-type(4n+3) {
background-color: rgba(102,153,255,0.9);
}
section article:nth-of-type(4n+2), aside article:nth-of-type(4n+0) {
background-color: rgba(153,102,255,0.9);
}

section article:nth-of-type(4n+3), aside article:nth-of-type(4n+1) {
background-color: rgba(255,102,153,0.9);
}
section article:nth-of-type(4n+0), aside article:nth-of-type(4n+2) {
background-color: rgba(255,153,102,0.9);
}

section.gal article, aside.gal article {
margin: 0 0 20px 0;
padding: 0;
background-color: transparent;
}



section.k article, aside.k article {
background-color: rgba(255,99,71,0.9);
}

section.canis article, aside.canis article {
background-color: rgba(0,159,227,0.9);
}

footer{
width: 100%;
height: initial;
display: block;
position: relative;
float: left;
clear: both;
margin: 0 0 20px 0;
padding: 20px 0 20px 0;
top: initial;
right: initial;
bottom: initial;
left: initial;
background: rgba(51,51,51,0.8);
color: rgba(255,255,255,1);
font-size: 16px;
font-style: italic;
text-align: center;
border-radius: 0 0 10px 10px;
}

footer p{
background: none;
}

address {
width: 100%;
height: initial;
display: block;
position: relative;
float: initial;
clear: initial;
margin: 0;
padding: 10px 0 0 0;
top: initial;
right: initial;
bottom: initial;
left: initial;
}

/* font */

h1 {
font-size: 30px;
color: rgba(255,255,255,1);
display: block;
position: relative;
margin: 0;
padding: 0 34px 0 0;
text-transform: uppercase;
letter-spacing: 0;
font-weight:600;
text-align: left;
background-color: transparent;
top: -70px;
left: 20px;
line-height: 0;
}

h2 {
font-size: 22px;
color: rgba(255,255,255,1);
background-color: transparent;
margin: 0;
padding: 0 0 20px 0;
text-transform: uppercase;
letter-spacing: 0;
font-weight: 600;
border-radius: 10px 10px 0 0;
}


h2.faq {
font-size: 16px;

}

h2.verder {
  text-align: center;
}
h4{
font-size: 24px;
color: rgba(255,255,255,1);
display: block;
position: relative;
margin: 0;
padding: 0;
text-transform: uppercase;
letter-spacing: 0;
font-weight:600;
text-align: right;
background: none;
top: 140px;
right: 20px;
line-height: 0;
}

h5{
font-size: 24px;
color: rgba(255,255,255,1);
display: block;
position: relative;
margin: 0;
padding: 0;
text-transform: uppercase;
letter-spacing: 0;
font-weight:600;
text-align: right;
background: none;
top: 170px;
right: 20px;
line-height: 0;
}

p {
font-size: 18px;
background-color: transparent;
color: rgba(255,255,255,1);
margin: 0;
padding: 10px 0 10px 0;
border-radius: 0;
}


p.footer {
color: rgba(255,255,255,1);

}


/* links*/

a:link {
background-color: transparent;
color: rgba(250,250,250,1);
text-decoration: none;
font-style: italic;

}

a:visited {
background-color: transparent;
color: rgba(250,250,250,1);
text-decoration: none;
font-style: normal;
}

a:hover {
background-color: transparent;
color: rgba(200,200,200,1);
text-decoration: none;
}

a:active {
background-color: transparent;
color: rgba(255,255,255,1);
text-decoration: none;
}




figure {
width: 100%;
height: initial;
display: none;
position: relative;
float: left;
clear: none;
margin: 0 0 20px 0;
padding: 0;
background: initial;
z-index:2;
-ms-transform: rotate(0deg); /* IE 9 */
-webkit-transform: rotate(0deg); /* Safari */
transform: rotate(0deg);
}

figure.second {
  display: block;
}
figure.third {
  display: none;
}
figure.fourth {
  display: block;
}


img {
width:150px;
height: 150px;
display: block;
margin: 0;
padding: 0;
border-radius: 10px;
}

img.ill {
width: 100%;
height: auto;
margin: 0 auto 0 auto;
display: block;
padding: 0;
}

img.gal
{
width: 100%;
height: 100%;
max-width: 100%;
padding: 0;
display: block;
margin: 0 auto 0 auto;
}

img.nav
{
width: 40px;
height: 40px;
max-width: 100%;
padding: 0;
display: block;
margin: 0;
border: 0;
border-radius: 0;
}

img.center {
display: block;
position: relative;
float: left;
clear: both;
margin: 20px 0 0 20px;
width: 70px;
height: 70px;
top: -105px;
border-radius: 5px;
}

img.icon {
width:70%;
height: 70%;
display: block;
margin: auto;
padding: 15%;
border-radius: 0;
}

img.icon2 {
width:24px;
height: 24px;
display: inline;
margin: 0 10px 0 0 ;
padding: 0;
border-radius: 12px;
background-color: none;
}

img.store {
width: auto;
height: 45px;
border-radius: 0;
display: inline-block;
}

img.studio1 {
width: 100%;
height: auto;
border-radius: 10px;
display: block;
margin: 0;
padding: 0;
}

img.studio2 {
width: auto;
height: 200px;
border-radius: 0;
display: inline-block;

}



/*  canis lupus img content */

img.pub {
width: 150px;
height: auto;
margin: 0 20px 20px 0;
display: block;
padding: 0;
position: relative;
float: none;
clear: none;
}

img.slide
{
width: 210px;
height: 297px;
border-radius: 0 0 0 0;
}
div.slide {
position: relative;
width: 230px;
height: 327px;
margin-left: 14px;
padding: 0px;
display: block;
bottom: 20px;

}
.mySlides1, .mySlides2 {
display: none;
}


/* Slideshow container */
.slideshow-container {
  max-width: 230px;
  position: relative;
  margin: auto;
  padding:10px;
  background-color: transparent;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 10px;
  margin-top: -22px;
  color: rgba(0,0,0,1);
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 50px;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 10px;
}

/* On hover, add a grey background color */
.prev:hover, .next:hover {
  background-color: rgba(0,159,227,1);
  color: black;
}


div.iframe{
position: relative;
width: 100%;
margin: 10px 0 0 0;
padding: 56.25% 0 0 0; /* 4:3 Aspect Ratio */
background: rgba(0,0,0,1);
}

div.youtube {
width: 100%;
height: 100%;
max-width: 420px;
max-height: 325px;
display: block;
position: absolute;
margin: auto;
top: 0;
left: 0;
bottom: 0;
right: 0;
}

ul {
list-style-type: none;
margin: 0 0 0 110px;
padding: 0;
float: left;
overflow: hidden;
background-color: rgba(85,85,85,1);
color: rgba(255,255,255,1);
border-radius: 5px;
}

ul.navi{
}

/* verder */




ul.verder {
list-style-type: none;
font-size: 18px;
text-align: left;
width: 100%;
margin: 10px 0 0 0;
padding: 0;
overflow: hidden;
background-color: transparent;
color: rgba(0,0,0,1);

}

li.verder {
  display: block;
  float: left;
  clear: both;
  box-sizing: border-box;
  width: 100%;
  border-style: none;
  border-radius: 5px;
  margin: 0 0 10px 0;
  padding: 0px;
  color: rgba(255,255,255,1);
  text-align: left;
  font-size: 16px;
  text-transform: uppercase;

}


li.verder a:hover, li.verder a:hover:not(.active)  {
  display: block;
  float: left;
  clear: both;
  box-sizing: border-box;
  width: 100%;
  background-color: rgba(85,85,85,0.5);
  color: rgba(255,255,255,1);
}

li.verder a:link {
  display: block;
  float: left;
  clear: both;
  box-sizing: border-box;
  width: 100%;
  background-color: rgba(255,255,255,0.2);
  color: rgba(255,255,255,1);
  font-style: initial;
  font-size: 16px;
  line-height: 18px;
  border-radius: 5px;

}

div.verder p {
padding-left: 0px;
margin-top: 0px;
}


/* contact ul */

ul.contact {
list-style-type: none;
font-size: 18px;
text-align: left;
width: 100%;
margin: 10px 0 0 0;
padding: 0;
overflow: hidden;
background-color: transparent;
color: rgba(0,0,0,1);

}

li.contact {
  display: block;
  float: left;
  clear: both;
  box-sizing: border-box;
  width: 100%;
  border-style: none;
  border-radius: 5px;
  margin: 0 0 10px 0;
  padding: 0px;
  color: rgba(255,255,255,1);
  text-align: left;
  font-size: 16px;
  text-transform: inherit;

}


li.contact a:hover, li.contact a:hover:not(.active) {
  display: block;
  float: left;
  clear: both;
  box-sizing: border-box;
  width: 100%;
  background-color: rgba(85,85,85,0.5);
  color: rgba(255,255,255,1);
}

li.contact a:link{
  display: block;
  float: left;
  clear: both;
  box-sizing: border-box;
  width: 100%;
  background-color: rgba(255,255,255,0.2);
  color: rgba(255,255,255,1);
  font-style: initial;
  font-size: 16px;
  line-height: 18px;
  border-radius: 5px;

}


/*  table prijzen */


table.prijs {

  box-sizing: border-box;
  background-color: rgba(255,255,255,0.2);
  padding: 10px;
  margin: 10px 0 0 0;
  width: 100%;
  color: rgba(255,255,255,1);
  border-radius: 10px;

}


th {

text-align: left;
background-color: transparent;

}
td.prijs {
width: 90%;
font-size: 16px;
text-align: left;
background-color: transparent;
}
td.prijs-r {
width: 40%;
font-size: 16px;
text-align: right;
background-color: transparent;
}
td.prijs-1 {
width: 60%;
font-size: 16px;
text-align: left;
background-color: transparent;
}

tr {
background-color: transparent;
}



table.ex {
  box-sizing: border-box;
  background-color: transparent;
  padding: 0;
  margin: 0;
  width: 100%;
  color: rgba(255,255,255,1);
  border-radius: 10px;
}

table.ex tr {
 width: 100%;

}




li {
float:left;

}

li a:link {
color: rgba(255,255,255,1);
font-style: initial;
}

li a:visited {
color: rgba(255,255,255,1);
font-style: initial;
}

li a:hover {
background-color: rgba(85,85,85,1);
color: rgba(255,255,255,1);
}

li a:active {
background-color: rgba(102,153,255,1);
color: white;
}
li a:hover:not(.active) {
background-color: rgba(85,85,85,1);
color: rgba(255,255,255,1);
}

li a, a.dropbtn {
display: inline-block;
font-size: 14px;
color: rgba(255,255,255,1);
line-height: 14px;
text-align: center;
padding: 10px 16px;
margin: 0;
text-decoration: none;
}


.dropdown:hover .dropbtn {
background-color: rgba(85,85,85,1);
color: rgba(255,255,255,1);
}

li.dropdown {
display: inline-block;

}

.dropdown-content a:link {
color: rgba(52,52,52,1);
background-color: rgba(238,238,238,1);
}

.dropdown-content a:visited {
color: rgba(52,52,52,1);
}

.dropdown-content a:hover {
background-color: rgba(238,238,238,1);
}

.dropdown-content a:active {

}


.dropdown-content {
display: none;
position: absolute;
background-color: #eeeeee;

min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 4;
}

.dropdown-content a {
    color: rgba(0,0,0,1);
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}


.dropdown:hover .dropdown-content {
display: block;
}


div.hidden {
visibility: hidden;
}



p.wit		{
font-size: 0pt;
margin: 0;
line-height: 0;
height: 0;
max-height: 0;
visibility: hidden;
}

button{
  cursor: pointer;
	-webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
	}

.button {
font-family: calibri, verdana, tahoma, futura lt, sans-serif;
width: 100%;
height: 60px;
border: none;
background: rgba(102,255,153,0.9);
color: rgba(102,102,102,1);
padding: 15px 14px;
margin: 0 0 20px 0;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 22px;
font-weight: 600;
text-transform: uppercase;
border-radius: 10px;
}

.button:hover {
background-color: rgba(102,153,255,0.9);
color: white;
}

.belme1, .belme2,.belme3  {
display: none;

}


.notmobile{

}
.onlymobile{
  display: none;
}


/* responsif */

@media only screen and (min-width: 901px) {
section {
width: 55%;
}
aside {
width: 45%;
}
}

@media only screen and (min-width: 951px) {
.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl{
background-size: 1050px 350px;
}
}

@media only screen and (min-width: 1001px) {
.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl{
background-size: 1100px 366px;
}
}

@media only screen and (min-width: 1051px) {
.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl{
background-size: 1200px 400px;
}
}

@media only screen and (min-width: 1151px) {

div.gridcontainer {

float: none;
margin: 20px auto 0 auto;
}

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl {
height: 240px;
background-size: 1250px 417px;
}

section {
width: 60%;
min-height: 600px;
margin: 0 20px 0 250px;
padding: 0;
}

section.canis {
  width: 70%;
  margin: 0 20px 0 20px;
}


aside {
width: 40%;
margin: 0 20px 0 0;
padding: 0;
}

aside.canis {
  width: 30%;
margin: 0 20px 0 0;
}

article {
width: 100%;
margin: 0 0 20px 0;
}

section article {
padding: 30px 45px 45px 45px;
}

aside article {
padding: 30px 45px 45px 45px;
}

header {
max-width: 1500px;
height: 240px;
}

h2 {
font-size: 30px;
padding: 0 0 20px 0;
}

h2.faq {
font-size: 18px;
}

h4 {
font-size: 30px;
top: 180px;

}

h5 {
font-size: 30px;
top: 210px;
}

p{
font-size: 20px;}

.button {
font-size: 26px;
 }

figure {
width: 200px;
max-height: initial;
display: block;
position: absolute;
float: left;
clear: none;
margin: 0px 0 10px 20px;
padding: 0;
left: -245px;
z-index:2;
-ms-transform: rotate(0deg); /* IE 9 */
-webkit-transform: rotate(0deg); /* Safari */
transform: rotate(0deg);
}

figure.second {
display: block;
margin: 240px 0 0 20px;
left: -240px;
-ms-transform: rotate(10deg); /* IE 9 */
-webkit-transform: rotate(10deg); /* Safari */
transform: rotate(10deg);
}

figure.third {
display: block;
margin: 470px 0 0 20px;
}

figure.fourth {
display: none;

}

img {
width:200px;
height: 200px;
}


li.contact a:link, li.verder a:link{
font-size: 18px;
}

.notmobile{

}
.onlymobile{
  display: none;
}

td.prijs, td.prijs-l, td.prijs-r, table.prijs th {
 font-size: 18px;

}

.button {
height: 80px;
font-size: 32px;

}

}

@media only screen and (min-width: 1201px) {

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl{
background-size: 1300px 433px;
}
}


@media only screen and (min-width: 1251px) {

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl{
background-size: 1350px 450px;
}
}

@media only screen and (min-width: 1301px) {

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl{
background-size: 1400px 467px;
}
}

@media only screen and (min-width: 1350px) {
section {
width: 60%;
}
aside {
width: 40%;
}
.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl {
height: 300px;
background-size: 1500px 500px;
}
figure {
width: 250px;
margin: 0px 0 10px 20px;
left: -295px;
}
figure.second {
margin: 290px 0 0 20px;
left: -290px;
}

figure.third {
margin: 570px 0 0 20px;
}
section {
margin: 0 20px 0 300px;

}

header {
max-width: 1500px;
height: 300px;
}



h4 {
font-size: 30px;
top: 240px;

}

h5 {
font-size: 30px;
top: 270px;
}


}
@media only screen and (min-width: 1401px) {

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl{
background-size: 1500px 500px;
}
}


@media only screen and (min-width: 1501px) {

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl {
height: 300px;
background-size: 1500px 500px;
}

}



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

div.gridcontainer {
width: 100%;
margin: 0;
padding: 0;
}

div.main{
width: 92%;
display: block;
margin: 0;
padding: 0 4% 0 4%;

}
header{
width: 100%;
height: 220px ;
display: block;
position: relative;
float: left;
clear: none;
margin: 0 0 0 0;
padding: 0;
background-size: cover;
background-position: center center;
overflow: hidden ;
}


.parallax  {

background-position: right top;

}


.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl {
height: 220px;
background-position: right top;
background-size: 800px 267px;

}
section {
width: 100%;
position: relative;
margin: 20px 0 0 0;
padding: 0;
}

aside {
width: 100%;
position: relative;
margin: 0;
padding: 0;
}

article {
  background-color: transparent;
}

footer{
width: 100%;
display: block;
position: relative;
float: left;
clear: both;
margin: 0 0 50px 0;
padding: 10px 0 20px 0;
top: initial;
right: initial;
bottom: initial;
left: initial;
background: rgba(52,52,52,0.7);
color: rgba(255,255,255,1);
font-size: 16px;
font-style: italic;
text-align: center;
border-radius: 0;

}


address {
color: rgba(255,255,255,1);
}
p.footer {
color: rgba(255,255,255,1);

}

h1 {
float: left;
font-size: 24px;
text-align: left;
background-color: transparent;
top: 20px;
left: 60px;
writing-mode: horizontal-tb;
z-index: 5;
position: fixed;
}

h2 {
font-size: 18px;

background-color: transparent;
}

h2.faq {
font-size: 18px;
}

h4{
font-size: 18px;
color: rgba(255,255,255,1);
display: block;
position: relative;
margin: 0;
padding: 0;
text-transform: uppercase;
letter-spacing: 0;
font-weight:600;
top: 180px;
right: 4%;
line-height: 0;
z-index: 3;
}

h5{
font-size: 18px;
color: rgba(255,255,255,1);
display: block;
position: relative;
margin: 0;
padding: 0;
text-transform: uppercase;
letter-spacing: 0;
font-weight:600;
top: 200px;
right: 4%;
line-height: 0;
z-index: 3;
}




nav {
top: 0;
left: 0;
width: 100%;
height: 40px;
padding: 0;
float: left;
clear: both;
top: 0;
display: block;
position: fixed;
z-index: 4;
background: rgba(52,52,52,1);
border-radius: 0;
}


figure {
  display: none;
}

figure.second {
  display: block;
}
figure.third {
  display: none;
}

figure.fourth {
  display: block;

}

article, figure, img{
border-radius: 10px;
margin-top: 0;

}

img.center {
width: 28px;
height: 28px;
border-radius: 3px;
float: left;
background: none;
margin: 6px 0 0 0;
left: 20px;
top: 0;
z-index: 5;
position: fixed;
}



ul {
list-style-type: disc;
position: fixed;
height: 100%;
display: none;
margin: 0;
padding: 0;
left: 0;
overflow: initial;
background-color: rgba(52,52,52,1);
top: 40px;
border-radius: 0;
}

ul.verder, li.verder, ul.contact, li.contact {
display: block;
float: left;
clear: both;
background-color: transparent;
box-sizing: border-box;
position: relative;
z-index: 1;
top: 0;
}

td.prijs {
 font-size: 16px;

}



li {
display: inline;
width: 100%;
float: none;
overflow-x: auto;
position: relative;
z-index: 2;

}

li a:link, li a:visited {
margin: 0;
padding: 10px 0 10px 0;
}


li a, .dropbtn {
display: inline-block;
width: 100%;
padding:10px 0 10px 0;
margin:0 ;
border-radius:0;
position: relative;
top: 0;
text-align: center;
border-right: none;
}

li a:hover, .dropdown:hover .dropbtn {
width: 100%;
margin: 0;
padding: 10px 0 10px 0;
}

li.dropdown {
display: block;
overflow: hidden;
padding: 0;
}

.dropdown-content {
display: none;
position: relative;
width: 100%;
margin: auto;
padding: 0;
box-shadow: none;
z-index: 4;
background-color: transparent;
}

.dropdown-content a {
margin: 0;
padding: 0;
text-decoration: none;
display: block;
text-align: center;
}

.dropdown-content a:hover{

}

.dropdown:hover .dropdown-content {
display: block;
width: 100%;
margin: 0;
padding: 0;

}

.nav-active {
display: block;
width: 100%;

}

.nav-mobile-open {
border-radius:0;
-webkit-border-radius:0;
-moz-border-radius: 0;
	}


/* Mobile Navigation */



.nav-mobile {
background:rgba(52,52,52,0) url(img/menu.gif) no-repeat center center;
display:block;	 /* Hide from browsers that don't support media queries */
cursor:pointer;
position: fixed;
top:-3px;
right:10px;
height:40px;
width:40px;
border-radius:0;
-webkit-border-radius:0;
-moz-border-radius:0;
}

.button {
  display: none;
}
img.icon-center {
  display: block;
	position: relative;
	float: none;
	clear: both;
  margin: 0 auto 0 auto;
  width: 40px;
	height: 40px;
  border-radius: 0;

}
div.belme {
  display: block;
	position: fixed;
	bottom: 0px;
  width: 100%;
	height: 50px;
	z-index: 6;
	background: rgba(52,52,52,1);
	}
div.driedrie {
  display: block;
  float: left;
	width: 30%;
	margin: 0;
}


div.driedrie:first-child {
 width: 31%;
 margin-left: 4%;
}
div.driedrie:last-child {
 width: 31%;
 margin-right: 4%;
}
button.belme1 {
  float: left;
  width: 100%;
	height: 50px;
	position: relative;

  border: none;
	border-radius: 0px;
	background: none;
  padding: 0;
	margin: 0 auto 0 auto;
  text-align: center;
  display: block;
	-webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
}
button.belme2 {
  float: left;
  width: 100%;
	height: 50px;
	position: relative;
  border: none;
	border-radius: 0px;
  background: none;
  padding: 0;
	margin: 0 auto;
  text-align: center;
  text-decoration: none;
  display: block;
  font-size: 20px;
	font-weight: 600;
	text-transform: uppercase;
	-webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
}
button.belme3 {
  float: right;
  width: 100%;
	height: 50px;
	position: relative;
  border: none;
	border-radius: 0px;
  background: none;
  padding: 0;
	margin: 0 auto 0 0;
  text-align: center;
  display: block;
	-webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
}
.belme1:hover, .belme2:hover, .belme3:hover {
  background-color: rgba(255,255,255,0.9);
}
.belme1, .belme2, .belme3 {

}
.notmobile{
  display: none;
}
.onlymobile{
  display: inherit;

}




}

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

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl {
background-size: 750px 250px;

}
}

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

header{
height: 200px ;
}
h4{
top: 160px;
}

h5{
top: 180px;
}

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl {
background-size: 700px 233px;

}
}

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

.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl {
background-size: 650px 217px;

}
}
@media only screen and (max-width: 600px) {

header{
height: 180px ;
}
h4{
top: 140px;
}

h5{
top: 160px;
}
.parallax, .parallax-fl, .parallax-sx, .parallax-ewi, .parallax-bl {

background-size: 600px 200px;

}
}