/*Algemeen*/

html{

	  background: url(../img/achtergrond/achtergrond1.jpg);"

	  background-repeat: no-repeat;
	  background-attachment: fixed;
	  background-position: center;
	  
  
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  
  font-family: basic_title_fontregular;
  
}



@font-face {
    font-family: 'basic_title_fontregular';
    src: url('../font/basictitlefont-webfont.eot');
    src: url('../font/basictitlefont-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/basictitlefont-webfont.woff2') format('woff2'),
         url('../font/basictitlefont-webfont.woff') format('woff'),
         url('../font/basictitlefont-webfont.ttf') format('truetype'),
         url('../font/basictitlefont-webfont.svg#basic_title_fontregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
margin: 0;
height: 100%;
font-weight: bold;
}

h1{
font-size: 4em;
font-weight: bold;
padding-top: 0.5em;
}

h2 {
font-size: 3em;
font-weight: bold;
padding-top: 0.5em;
}

h1{
font-size: 4em;
font-weight: bold;
}

h4 {
font-size: 2em;
font-weight: bold;
margin-bottom: 10px;
}

h5{
font-size: 1.5em;
font-weight: bold;
display: inline-block;
margin-top: 4px;
margin-bottom: 4px;
}

h6 {
font-size: 2.2em;
font-weight: bold;
margin-top: 35px;
margin-bottom: 0px;
}

/*Homepage*/

.thumbnail {
   color: #ffffff;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10%;
	
	
    width: 240px;
    height: 240px;
    
}


.image {
    width: 100%;
    height: 100%;    
}

.image img {
    -webkit-transition: all 1s ease; /* Safari and Chrome */
  	-moz-transition: all 1s ease; /* Firefox */
  	-o-transition: all 1s ease; /* IE 9 */
  	-ms-transition: all 1s ease; /* Opera */
  	transition: all 1s ease;
	
}

img {

margin-left: auto;
margin-right: auto;

}

.image:hover img {
    -webkit-transform:scale(1.25); /* Safari and Chrome */
    -moz-transform:scale(1.25); /* Firefox */
    -ms-transform:scale(1.25); /* IE 9 */
    -o-transform:scale(1.25); /* Opera */
     transform:scale(1.25);
	 
	 
}

span.text-content {
  background: url(../img/RAW_Zwart2.png) no-repeat center center;
  color: black;
  display: table;
  
  
  position: absolute;
  
  
  border-radius: 100%;
  
  
  opacity: 0;
  height: 100px;
  width: 100px;
 left: 65px;
 top: 65px;
  
    
    -webkit-transition: width 1s, height 1s, left 1s, top 1s, opacity 0.5s;
    -moz-transition: width 1s, height 1s,  left 1s, top 1s, opacity 0.5s;
    -ms-transition: width 1s, height 1s,  left 1s, top 1s, opacity 0.5s;
    transition: width 1s, height 1s,  left 1s, top 1s, opacity 0.5s;
  
  
}

span.text-content span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  font-size: 32px;
}

.image:hover span.text-content {
    opacity: 1;
  
  
    width: 655px;
    height: 655px;
    left: -207px;
	top: -207px;
	
	-webkit-transition: width 1s, height 1s, left 1s, top 1s, opacity 4s;
    -moz-transition: width 1s, height 1s,  left 1s, top 1s, opacity 4s;
    -ms-transition: width 1s, height 1s,  left 1s, top 1s, opacity 4s;
    transition: width 1s, height 1s,  left 1s, top 1s, opacity 4s;

}

.begintekst {
font-size:22px;

}





/*Header*/

.icons {
position: absolute;
top: 20px;
right: 15px;
}

.iconlogo {
display: inline-block;
width: 30px;
}

.homebutton {
position: absolute;
top: 20px;
left: 15px;
}

/*Navigation*/

.navwrapper {

width: 50%;
margin-left: auto;
margin-right: auto;
margin-bottom: 40px;
padding-top:15px;
text-shadow: 1px 1px 5px #000000, -1px -1px 2px #000000, 2px 2px 8px #000000, -2px -2px 10px #000000, 3px 3px 12px #000000, 4px 4px 20px #000000;
}

.homenav {
display: none !important;
}

   #nav {
      width: 100%;
      
      margin: 0 0 3em 0;
      padding: 0;
      list-style: none;
	  
	  text-align: center;

      /*border-bottom: 1px solid #ccc;*/ 
       }
   #nav li {
      display: inline-block;
      
	  }
   #nav li a {
      display: block;
      padding: 8px 15px;
      text-decoration: none;
      font-weight: bold;
      color: #ffffff;
	  font-size: 1.2em;
	  font-family: basic_title_fontregular;
	  border:1px solid transparent;
	
	  
	  -webkit-text-stroke-width: 2.5px white;
	  
	 
	  
      }
   #nav li a:hover {
      
      border: 1px solid #82FA58;
      /*color: #82FA58;*/	  
	  }


.show-nav {

    text-align: center;
	color: #ffffff;
	padding: 10px 0;
	display: none;


}

/*Hide checkbox*/
input[type=checkbox]{
    display: none;
	
}

/*Show nav when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #nav{
    display: block;
	
}


/*Homepage*/

	.verandertekst {
	
	width: 90%;
    position: relative;
	margin-left: auto;
	margin-right: auto;
	color: #ffffff;
	font-size: 4em;
	text-shadow: 2px 2px 4px #000000;
	text-align: center;
	margin-top: 5%;
	

}


.quote {
    opacity: 0;
	margin-top: -65px;
    position:relative;
	
	
  -webkit-animation: mymoveopacity 32s infinite; /* Safari 4+ */
  -moz-animation: mymoveopacity 32s infinite; /* Fx 5+ */
  -o-animation: mymoveopacity 32s infinite; /* Opera 12+ */
  animation: mymoveopacity 32s infinite; /* IE 10+, Fx 29+ */
  
  
} 


 .nummereen {
	margin-top: 0px !important;
 
 }
 
 .nummertwee {


  
 -webkit-animation-delay: 4s;
 -moz-animation-delay: 4s;
 -o-animation-delay: 4s;
 animation-delay: 4s;
 
 
 }
 
 .nummerdrie {


  
 -webkit-animation-delay: 8s;
 -moz-animation-delay: 8s;
 -o-animation-delay: 8s;
 animation-delay: 8s;
	
 }
 
  .nummervier {


  
 -webkit-animation-delay: 12s;
 -moz-animation-delay: 12s;
 -o-animation-delay: 12s;
 animation-delay: 12s;
	
 }
 
  .nummervijf {


  
 -webkit-animation-delay: 16s;
 -moz-animation-delay: 16s;
 -o-animation-delay: 16s;
 animation-delay: 16s;
	
 }
 
   .nummerzes{
  

  
 -webkit-animation-delay: 20s;
 -moz-animation-delay: 20s;
 -o-animation-delay: 20s;
 animation-delay: 20s;
	
 }
 
   .nummerzeven {


  
 -webkit-animation-delay: 24s;
 -moz-animation-delay: 24s;
 -o-animation-delay: 24s;
 animation-delay: 24s;
	
 }
 
   .nummeracht{

  
 -webkit-animation-delay: 28s;
 -moz-animation-delay: 28s;
 -o-animation-delay: 28s;
 animation-delay: 28s;
	
 }
 
 
	
@-webkit-keyframes mymoveopacity {
  0%   { opacity: 0; }
  10% { opacity: 1; }
  12% { opacity: 1; }
  13% { opacity: 0;}
  100%   { opacity: 0; }
}
@-moz-keyframes mymoveopacity {
  0%   { opacity: 0; }
  10% { opacity: 1; }
  12% { opacity: 1; }
  13% { opacity: 0;}
  100%   { opacity: 0; }
}
@-o-keyframes mymoveopacity {
  0%   { opacity: 0; }
  10% { opacity: 1; }
  12% { opacity: 1; }
  13% { opacity: 0;}
  100%   { opacity: 0; }
}
@keyframes mymoveopacity {
  0%   { opacity: 0; }
  10% { opacity: 1; }
  12% { opacity: 1; }
  13% { opacity: 0;}
  100%   { opacity: 0; }
}




/*RESPONSIVE*/


@media screen and (max-width : 602px){
	/*Make dropdown links appear inline*/
	ul {
		position: static;
		display: none;
	}
	/*Create vertical spacing*/
	li {
		margin-bottom: 1px;
	}
	/*Make all nav links full width*/
	ul li, li a {
		width: 100%;
	}
	/*Display 'show nav' link*/
	.show-nav {
		display:block;
	}
	
	.navwrapper {
	width: 100%;
	
	margin-left: 0;
	margin-right: 0;
	padding-top: 0;
	margin-top: 50px;
	}
	
	.iconlogo {
	width: 50px;
	}
	
	.menulogo {
	width: 50px;
	}

	.thumbnail {
	margin-left: auto;
	margin-right: auto;
	
	position: relative;
  
    
    -webkit-transform: inherit; /* Safari and Chrome */
    -moz-transform: inherit; /* Firefox */
    -ms-transform: inherit; /* IE 9 */
    -o-transform: inherit; /* Opera */
    transform: inherit;
	
	top: initial;
	left: initial;
	
	margin-top: 20%;
	}
	
	
	/*Top Bar*/
	
	.homebutton {
		display: none;
	
	}
	
	.icons {
		top: 10px;
		width: 100%;
		right: initial;
		
	}
	
	.facebooklogo {
	float: left;
	margin-left: 10px;
	}
	
	.instagramlogo {
	float: right;
	margin-right: 10px;
	}
	
	
	/*dropdown*/
	
	#nav {
	background: #ffffff;
	}
	
	#nav li a {
	color: #000000;
	padding-left: 0;
	padding-right: 0;
	border: 0;
	}
	
	#nav li a:hover {
	border: 0;
	}
	
	.homenav {
	display: block !important;
	}
	
	
	
	/*catering*/
	
	.cateringh4 {
	font-size: 1.2em;
	}
	
	/*locaties*/
	
	.stadblok {
	width: inherit !important;
	}
	
	
	/*Homepage*/
	
	.nummereen {
	
	margin-top: 0px !important;
	opacity: 1 !important;
	
  -webkit-animation: none !important; /* Safari 4+ */
  -moz-animation: mymoveopacity 16s infinite; /* Fx 5+ */
  -o-animation: mymoveopacity 16s infinite; /* Opera 12+ */
  animation: none !important; /* IE 10+, Fx 29+ */
	
	}
	
	.nummertwee {
	display: none;
	}
	
	.nummerdrie {
	display: none;
	}
	
	
	.nummervier {
	display: none;
	}
	
	.nummervijf {
	display: none;
	}
	
	
	.nummerzes {
	display: none;
	}
	
	.nummerzeven {
	display: none;
	}
	
	.nummeracht {
	display: none;
	}
	
	
	.navwrapper{
	text-shadow: none;
	}
	
	
	
}


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

.fotoblokeigenkeuze {
width: 700px !important;
}

}

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

.fotoblokeigenkeuze {
width: inherit !important;
}

.menufototekst{
width: inherit !important;
display: block !important;
}

.menutekstsalade {
width: inherit !important;
}

.menutekst {
display: block !important;
}

/*Homepage*/

	.verandertekst {
	

	font-size: 3em;

	

}


.quote {
 
	margin-top: -49px;
}	  
	
}


	


/*menu*/


.menufototekst {
display: inline-block;
width: 400px;
margin-top: 40px;
}

.menufoto {
display: inline-block;
}

.menutekst {
display: inline-block;
}

.menutekstsalade {
width: 300px;
}

.menutitelsalade {
font-size: 25px;
margin-top: 10px;
}

.menutussentitel {
margin-top: 40px;
margin-bottom: 20px;
}

.mainmenu {
width: 100%;
background: white;
text-align: center;
min-height: 600px;
}

.fotoeigenkeuze {
margin-left: auto;
margin-right: auto;
display: inline-block;

width: 200px;
}

.fotoblokeigenkeuze {
margin-top: 60px;
margin-bottom: 40px;
display: block;
width:1050px;
margin-left: auto;
margin-right: auto;

}
	
.container{margin-right:auto;margin-left:auto;}@media (min-width:768px){.container{width:100%}}@media (min-width:992px){.container{width:100%}}@media (min-width:1200px){.container{width:100%}}

.bottomline {
padding-bottom: 20px;
margin: 0;
}

.yoghurt {
margin-top: 1em;
margin-bottom: 1em;
}

.nummer {
height: 50px;
display: block;
}

.nummerblok {
display: inline-block;
}

.nummeruitleg {
display: inline-block;
height: 50px;
vertical-align: middle;
margin-right: 20px;
}


/*Over Ons*/

.smallcontainer{margin-right:auto;margin-left:auto;}@media (min-width:768px){.smallcontainer{width:600px}}@media (min-width:992px){.smallcontainer{width:800px}}@media (min-width:1200px){.smallcontainer{width:1000px}}


/*Catering*/


.cateringfoto {
display: inline-block;
margin-right: 25px;
margin-left: 25px;
padding-top: 30px;
padding-bottom: 30px;
}
	
.cateringh4 {

font-size: 1.2em;

}	

/*Galerij*/

.slidercontainer {

position: relative;
top: 0px;
width: 800px;
height: 600px;
margin-left: auto;
margin-right: auto;
background-color: rgba(255, 255, 255, 0.2);
padding-bottom: 60px;

}

.insideslider {
position: absolute;
left: 0px;
top: 0px;
width: 800px;
height: 600px;
overflow: hidden;
}

.sliderfotovert {
height: 100% !important;
position: initial !important;
width: initial !important;  

}

.sliderfotohori {
height: initial !important;
position: initial !important;
width: 100% !important;  

}

        /* jssor slider bullet navigator skin 05 css */
        /*
        .jssorb05 div           (normal)
        .jssorb05 div:hover     (normal mouseover)
        .jssorb05 .av           (active)
        .jssorb05 .av:hover     (active mouseover)
        .jssorb05 .dn           (mousedown)
        */
        .jssorb05 {
            position: absolute;
        }
        .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
            position: absolute;
            /* size of bullet elment */
            width: 16px;
            height: 16px;
            background: url('img/b05.png') no-repeat;
            overflow: hidden;
            cursor: pointer;
        }
        .jssorb05 div { background-position: -7px -7px; }
        .jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
        .jssorb05 .av { background-position: -67px -7px; }
        .jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }

        /* jssor slider arrow navigator skin 12 css */
        /*
        .jssora12l                  (normal)
        .jssora12r                  (normal)
        .jssora12l:hover            (normal mouseover)
        .jssora12r:hover            (normal mouseover)
        .jssora12l.jssora12ldn      (mousedown)
        .jssora12r.jssora12rdn      (mousedown)
        */
        .jssora12l, .jssora12r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 55px;
            height: 55px;
            cursor: pointer;
            
            overflow: hidden;
        }
        .jssora12l { background-position: -16px -37px; }
        .jssora12r { background-position: -75px -37px; }
        .jssora12l:hover { background-position: -136px -37px; }
        .jssora12r:hover { background-position: -195px -37px; }
        .jssora12l.jssora12ldn { background-position: -256px -37px; }
        .jssora12r.jssora12rdn { background-position: -315px -37px; }
	 
	  
/*Over ons*/

.overonsblok {

max-width: 800px;
margin-left: auto;
margin-right: auto;
}


/*Shops*/

.stadgegevens {

padding-left: 0px;
padding-right: 0px;
}

.vragentekst {
display: inline-block;
margin-top: 50px;
font-size: 1.2em;
}

.stadblok {
display: inline-block;
width: 350px;
}

.stadfoto {
padding-top: 40px;
padding-bottom: 0px;
}


/*Locaties*/

.websitelink {

text-decoration: none;
color: inherit;
}