/****************************************************************************************
*                                                                                       * 
*                                                                                       *
*                                                                                       * 
*                                     RESPONSIVE MOBILE                                 *
*                                                                                       * 
*                                                                                       * 
*                                                                                       * 
****************************************************************************************/



:root {
	--img: url(https://i.imgur.com/HzgKKBp.jpg);
	
	
}






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


	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                         HEADER                                        *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/




	#homepage {
		position: relative;
/*				background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,5)), url(https://i.imgur.com/HzgKKBp.jpg);*/
		background-image: var(--img);
		background-position: top;
		background-size: 350vw;
		background-repeat: no-repeat;

	}


	.introText h1{
		position: absolute;
		display: block;
		color: #f2f2f2;
		text-decoration: none;
		text-align: center;
		font-size: 17vw;
		font-family: "XXII";
		letter-spacing: 0.5vw;
		top: 0;
		left: 0;
		right: 0;
		margin-left: 10%;
		margin-right: 10%;
		margin-top: 65vw;



	}
	

		.introText p {
    position: absolute;
    background-color: rgb(235, 69, 76);
    color: white;
    margin-left: 20%;
    margin-right: 20%;
    margin-top: 25vw;
    padding: 20px;
    border: none;
    font-size: 5vw;
    font-family: "SJM";
    -webkit-appearance: none;
    text-align: center;
	}


	.introText input[type=submit] {
		background-color: rgb(235,69,76);
		color: white;
		margin-left: 35.5%;
		margin-right: 35.5%;
		margin-bottom: 100%;
		padding: 2vw 10vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 5vw;
		font-family: "SJM";
		-webkit-appearance: none;
		margin-top: 100vw;
	}









	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                          MAIN                                         *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/	




	/*******drink&snack*******/


	.drinkSnackIcon{
		width: 50%;
		height: 50%;
		float: left;
	}

	.drinkSnackIcon img {
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;

	}

	.drinkSnackIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
	}


	/*******disco bowling*******/



	.discoBowlingIcon{
		width: 50%;
		height: 50%;
		float: left;
	}

	.discoBowlingIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.discoBowlingIcon p {
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
	}


	/*******biljart*******/




	.biljartIcon{
		width: 50%;
		height: 50%;
		float: left;
	}

	.biljartIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.biljartIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
	}


	/*******bowling*******/




	.bowlingIcon{
		width: 50%;
		height: 50%;
		float: left;
	}

	.bowlingIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.bowlingIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
	}


	/*******airhockey*******/



	.airhockeyIcon{
		width: 50%;
		height: 50%;
		float: left;
	}

	.airhockeyIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.airhockeyIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
	}


	/*******tafelvoetbal*******/


	.tafelvoetbalIcon{
		width: 50%;
		height: 50%;
		display: inline-block;
		margin-bottom: 30vw;
	}

	.tafelvoetbalIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.tafelvoetbalIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
	}



	/*******bowling container*******/





	.bowling{
		width: 90%;
		height: 90%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-left: 5%;
		margin-right: 2%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.bowling img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.bowling p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 5%;
		color: #6b717f;
	}


	.bowling input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 10vw;
		margin-left: 32.4%;
		margin-right: 32.4%;
		margin-bottom: 15%;
		padding: 2vw 10vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}





	/*******biljart container*******/



	.biljart{
		width: 90%;
		height: 90%;
		background-color: white;
		margin-left: 5%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.biljart img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.biljart p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 5%;
		color: #6b717f;
	}

	.biljart input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 10vw;
		margin-left: 32.4%;
		margin-right: 32.4%;
		margin-bottom: 15%;
		padding: 2vw 10vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}








	/*******verjaardag container*******/





	.verjaardag{
		width: 90%;
		height: 90%;
		background-color: white;
		margin-left: 5%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.verjaardag img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.verjaardag p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 5%;
		color: #6b717f;
	}


	.verjaardag input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 10vw;
		margin-left: 32.4%;
		margin-right: 32.4%;
		margin-bottom: 15%;
		padding: 2vw 10vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}



	/*******disco bowling container*******/



	.discoBowling{
		width: 90%;
		height: 90%;
		background-color: white;
		margin-left: 5%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.discoBowling img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.discoBowling p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 25%;
		color: #6b717f;
	}





	/*******wok xuri container*******/





	.wokCombi{
		width: 90%;
		height: 90%;
		background-color: white;
		margin-left: 5%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);

	}

	.wokCombi img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}


	.wokCombi p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 5%;
		color: #6b717f;
	}



	.wokCombi input[type=submit] {
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 10vw;
		margin-left: 32.4%;
		margin-right: 32.4%;
		margin-bottom: 15%;
		padding: 2vw 10vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}






	.evenementen p{
		text-align: center;
		font-family: "SJM";
		font-size: 5vw;
		color: #6b717f;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 15%;
	}





	.swiper-container {
		width: 90vw;
		height: 50vw;
		margin-left: 5vw;
		margin-right: 5vw;
		bottom: 5vw;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
		margin-bottom: 5vw;
		padding-bottom: 5vw;
		z-index: -1;
	}

	.swiper-slide {
		text-align: center;
		background-size: 100vw;
		background-repeat: no-repeat;

		/*		 Center slide text vertically */
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		align-items: center;
		z-index: -1;
	}





	.modal {
		z-index:2;
		display:none;
		padding-top:10px;
		position: fixed;
		left: 0;
		top: 0;
		width:100%;
		height:100%;
		background-color:rgba(0,0,0,0.95);


	}

	.modal-content{


		position: relative;
		background-color: #fefefe;
		margin: auto;
		padding: 0;
		width: 90%;
		max-width: 1200px;
		max-height: 200px;
		margin-top: 60vw;


	}


	.close {
		color: white;
		position: absolute;
		top: 1;
		right: 25px;
		font-size: 15vw;
		font-weight: bold;
	}

	.close:hover,
	.close:focus {
		color: #999;
		text-decoration: none;
		cursor: pointer;
	}

	.mySlides {
		display: none;
	}

	.cursor {
		cursor: pointer;
	}

	.prev,
	.next {
		cursor: pointer;
		position: absolute;
		top: 40%;
		width: auto;
		padding: 16px;
		color: white;
		font-weight: bold;
		font-size: 10vw;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
		-webkit-user-select: none;
	}

	.next {
		right: 0;
		border-radius: 3px 0 0 3px;
	}

	.prev:hover,
	.next:hover {
		background-color: rgba(0, 0, 0, 0.8);
	}


	.swiper-slide img{
		z-index: -1;
	}






}







/****************************************************************************************
*                                                                                       * 
*                                                                                       *
*                                                                                       * 
*                                     RESPONSIVE TABLET                                 *
*                                                                                       * 
*                                                                                       * 
*                                                                                       * 
****************************************************************************************/



@media screen and (min-width:601px) and (max-width:1024px){

	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                         HEADER                                        *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/

	#homepage {
		position: relative;
		/*		background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,5)), url(/images/10.jpg);*/
		background-image: var(--img);
		background-position: top;
		background-size: 130vw;
		background-repeat: no-repeat;

	}



	.introText h1{
		position: absolute;
		display: block;
		color: #f2f2f2;
		text-decoration: none;
		text-align: center;
		font-size: 7vw;
		font-family: "XXII";
		letter-spacing: 0.4vw;
		top: 0;
		left: 0;
		right: 0;
		margin-top: 30vw;
	}

	.introText p {
	    position: absolute;
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 38vw;
		margin-left: 25%;
		margin-right: 20%;
		padding: 20px;
		font-size: 3vw;
		font-family: "SJM";
		-webkit-appearance: none;
		text-align:center;
	}


	.introText input[type=submit] {
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 60vw;
		margin-left: 44%;
		margin-bottom: 30%;
		padding: 1vw 4vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 2vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}




	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                          MAIN                                         *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/	


	/*******drink&snack*******/



	.drinkSnackIcon{
		width: 15%;
		height: 20%;
		margin-left: 5vw;
		float: left;
	}

	.drinkSnackIcon img {
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;

	}

	.drinkSnackIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}



	/*******disco bowling*******/





	.discoBowlingIcon{
		width: 15%;
		height: 20%;
		float: left;
	}

	.discoBowlingIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.discoBowlingIcon p {
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}



	/*******biljart*******/




	.biljartIcon{
		width: 15%;
		height: 20%;
		float: left;
	}

	.biljartIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.biljartIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}



	/*******bowling*******/




	.bowlingIcon{
		width: 15%;
		height: 20%;
		float: left;
	}

	.bowlingIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.bowlingIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}



	/*******airhockey*******/



	.airhockeyIcon{
		width: 15%;
		height: 20%;
		float: left;
	}

	.airhockeyIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.airhockeyIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}


	/*******tafelvoetbal*******/


	.tafelvoetbalIcon{
		width: 15%;
		height: 20%;
		display: inline-block;

	}

	.tafelvoetbalIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.tafelvoetbalIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}



	/*******bowling container*******/




	.bowling{
		width: 25%;
		height: 25%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-left: 21%;
		margin-right: 2%;
		margin-bottom: 5%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.bowling img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.bowling p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 12%;
		color: #6b717f;
	}


	.bowling input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 3vw;
		margin-left: 28%;

		margin-bottom: 15%;
		padding: 0.5vw 3vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 2vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}



	/*******biljart container*******/




	.biljart{
		width: 25%;
		height: 25%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-left: 5%;
		margin-right: 2%;
		margin-bottom: 5%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.biljart img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.biljart p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 5%;
		color: #6b717f;
	}


	.biljart input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 3vw;
		margin-left: 28%;

		margin-bottom: 15%;
		padding: 0.5vw 3vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 2vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}



	/*******verjaardag container*******/




	.verjaardag{
		width: 25%;
		height: 25%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-left: 5%;
		margin-right: 2%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.verjaardag img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.verjaardag p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 16%;
		color: #6b717f;
	}



	.verjaardag input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 1vw;
		margin-left: 28%;

		margin-bottom: 15%;
		padding: 0.5vw 3vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 2vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}



	/*******disco bowling container*******/




	.discoBowling{
		width: 25%;
		height: 25%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-top: 1px;
		margin-left: 5%;
		margin-right: 2%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.discoBowling img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.discoBowling p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 13%;
		color: #6b717f;
	}



	/*******wok xuri container*******/




	.wokCombi{
		width: 25%;
		height: 25%;
		background-color: white;
		display: inline-block;
		margin-left: 5%;

		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);

	}

	.wokCombi img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}





	.wokCombi p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 5%;
		color: #6b717f;
	}



	.wokCombi input[type=submit] {
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 1vw;
		margin-left: 28%;

		margin-bottom: 15%;
		padding: 0.5vw 3vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 2vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}











	.evenementen p{
		text-align: center;
		font-family: "SJM";
		font-size: 2vw;
		color: #6b717f;
		margin-left: 8%;
		margin-right: 8%;

	}





	.swiper-container {
		width: 90vw;
		height: 50vw;
		margin-top: 8vw;
		margin-left: 5vw;
		margin-right: 5vw;
		bottom: 5vw;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
		margin-bottom: 5vw;
		padding-bottom: 5vw;
		z-index: -1;
	}

	.swiper-slide {
		text-align: center;
		background-size: 100vw;
		background-repeat: no-repeat;

		/* Center slide text vertically */
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		align-items: center;
		z-index: -1;
	}







	.modal {
		z-index:2;
		display:none;
		padding-top:10px;
		position:fixed;
		left:0;
		top:0;
		width:100%;
		height:100%;
		overflow:auto;
		background-color:rgb(0,0,0);
		background-color:rgba(0,0,0,0.95);


	}

	.modal-content{



		position: relative;
		background-color: #fefefe;
		margin: auto;
		padding: 0;
		width: 90%;
		max-width: 1200px;
		max-height: 200px;
		margin-top: 15vw;


	}


	.close {
		color: white;
		position: absolute;
		top: 10px;
		right: 25px;
		font-size: 5vw;
		font-weight: bold;
	}

	.close:hover,
	.close:focus {
		color: #999;
		text-decoration: none;
		cursor: pointer;
	}

	.mySlides {
		display: none;
	}

	.cursor {
		cursor: pointer;
	}

	.prev,
	.next {
		cursor: pointer;
		position: absolute;
		top: 50%;
		width: auto;
		padding: 16px;
		margin-top: 15vw;
		color: white;
		font-weight: bold;
		font-size: 3vw;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
		-webkit-user-select: none;
	}

	.next {
		right: 0;
		border-radius: 3px 0 0 3px;
	}

	.prev:hover,
	.next:hover {
		background-color: rgba(0, 0, 0, 0.8);
	}


	.swiper-slide img{
		z-index: -1;
	}






}








/****************************************************************************************
*                                                                                       * 
*                                                                                       *
*                                                                                       * 
*                                     RESPONSIVE DESKTOP                                 *
*                                                                                       * 
*                                                                                       * 
*                                                                                       * 
****************************************************************************************/



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

	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                         HEADER                                        *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/

	#homepage {
		position: relative;
				background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,5)), url(/images/10.jpg);
		background-image: var(--img);
		background-position: 100% -20%;
		background-size: 100vw;
		background-repeat: no-repeat;
		

	}

	
	.introText p{
		position: absolute;
		display: block;
		color: #f2f2f2;
		text-decoration: none;
		text-align: center;
		font-size: 1.5vw;
		font-family: "SJM";
		-webkit-appearance: none;
		top: 0;
		left: 0;
		right: 0;
		margin-left: 10%;
		margin-right: 10%;
		margin-top: 28vw;
		padding:20px;
	background-color: rgb(235,69,76);
	}



	.introText h1{
		position: absolute;
		display: block;
		color: #f2f2f2;
		text-decoration: none;
		text-align: center;
		font-size: 6vw;
		font-family: "XXII";
		top: 0;
		left: 0;
		right: 0;
		letter-spacing: 0.2vw;
		margin-left: 38%;
		margin-right: 60%;
		margin-top: 20vw;
	}

	.introText input[type=submit] {
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 40vw;
		margin-left: 45.5%;
		margin-bottom: 20%;
		padding: 0.5vw 3vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 1.5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}


	


	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                          MAIN                                         *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/	


	/*******drink&snack*******/


	.drinkSnackIcon{
		width: 15%;
		height: 20%;
		margin-left: 5vw;
		float: left;
	}

	.drinkSnackIcon img {
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;

	}

	.drinkSnackIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}

	
	/*******disco bowling*******/







	.discoBowlingIcon{
		width: 15%;
		height: 20%;
		float: left;
	}

	.discoBowlingIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.discoBowlingIcon p {
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}
	
	
	/*******biljart*******/





	.biljartIcon{
		width: 15%;
		height: 20%;
		float: left;
	}

	.biljartIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.biljartIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}


	/*******bowling*******/


	.bowlingIcon{
		width: 15%;
		height: 20%;
		float: left;
	}

	.bowlingIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.bowlingIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}


	/*******airhockey*******/



	.airhockeyIcon{
		width: 15%;
		height: 20%;
		float: left;
	}

	.airhockeyIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.airhockeyIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}
	
	
	/*******tafelvoetbal*******/


	.tafelvoetbalIcon{
		width: 15%;
		height: 20%;
		display: inline-block;

	}

	.tafelvoetbalIcon img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 25%;
		margin-left: 30%;
		width: 40%;
		height: auto;
	}

	.tafelvoetbalIcon p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
	}
	
	
	/*******bowling container*******/
	
	
	.bowling{
		width: 20%;
		height: 20%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-top: 5vw;
		margin-left: 26.5%;
		margin-right: 2%;
		margin-bottom: 5%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.bowling img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.bowling p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.2vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 12%;
		color: #6b717f;
	}


	.bowling input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 3vw;
		margin-left: 31.5%;
		margin-bottom: 15%;
		padding: 0.5vw 2vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 1.5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}
	
	
	/*******biljart container*******/
	
	
	
	.biljart{
		width: 20%;
		height: 20%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-left: 5%;
		margin-top: 5vw;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.biljart img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.biljart p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.2vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 5%;
		color: #6b717f;
	}

	.biljart p2{
		float: right;
		margin-right: 5%;
		font-family: "SJM";
		font-size: 2vw;
	}

	.biljart input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 3vw;
		margin-left: 31.5%;

		margin-bottom: 15%;
		padding: 0.5vw 2vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 1.5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}

	
	
	/*******verjaardag container*******/
	
	
	
	.verjaardag{
		width: 20%;
		height: 20%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-top: 5vw;
		margin-left: 12.5%;
		margin-right: 2%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.verjaardag img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.verjaardag p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.2vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 16%;
		color: #6b717f;
	}



	.verjaardag input[type=submit]{
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 1vw;
		margin-left: 31.5%;

		margin-bottom: 15%;
		padding: 0.5vw 2vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 1.5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}



	/*******disco bowling container*******/
	
	

	.discoBowling{
		width: 20%;
		height: 20%;
		background-color: white;
		display: inline-block;
		vertical-align: top;
		margin-top: 5vw;;
		margin-left: 5%;
		margin-right: 2%;
		margin-bottom: 15%;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
	}

	.discoBowling img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}

	.discoBowling p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.2vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom:15%;
		color: #6b717f;
	}


	
	/*******xuri wok container*******/
	

	
	
	
	

	.wokCombi{
		width: 20%;
		height: 20%;
		background-color: white;
		display: inline-block;
		margin-left: 5%;
		margin-top: 5vw;
		border-radius: 8%;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);

	}

	.wokCombi img{
		position: relative;
		display: inline-block;
		top: 0;
		margin-top: 0;
		margin-left: 0;
		width: 100%;
		height: auto;
		border-radius: 8% 8% 0 0;
	}


	


	.wokCombi p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.2vw;
		margin-left: 8%;
		margin-right: 8%;
		padding-bottom: 5%;
		color: #6b717f;
	}



	.wokCombi input[type=submit] {
		background-color: rgb(235,69,76);
		color: white;
		margin-top: 1vw;
		margin-left: 31.5%;

		margin-bottom: 15%;
		padding: 0.5vw 2vw;
		border: none;
		border-radius: 30px;
		cursor: pointer;
		font-size: 1.5vw;
		font-family: "SJM";
		-webkit-appearance: none;
	}



	


	.evenementen p{
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
		color: #6b717f;
		margin-top: 5vw;
		margin-left: 8%;
		margin-right: 8%;
	}






	.swiper-container {
		width: 80vw;
		height: 40vw;
		margin-top: 10vw;
		margin-left: 5vw;
		margin-right: 5vw;
		bottom: 5vw;
		box-shadow:  0 0 10px  rgba(0,0,0,0.4);
		margin-bottom: 1vw;
		padding-bottom: 5vw;
		z-index: -1;
	}



	.swiper-slide {
		text-align: center;
		background-size: 100vw;
		background-repeat: no-repeat;

		/* Center slide text vertically */
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		align-items: center;
		z-index: -1;
	}






	.modal {
		z-index:2;
		display:none;
		padding-top:10px;
		position:fixed;
		left:0;
		top:0;
		width:100%;
		height:100%;
		overflow:auto;
		background-color:rgb(0,0,0);
		background-color:rgba(0,0,0,0.95);


	}



	.modal-content{



		position: relative;
		background-color: #fefefe;
		margin: auto;
		padding: 0;
		width: 90%;
		max-width: 1200px;
		max-height: 200px;
		margin-top: 2.5vw;


	}







	.close {
		color: white;
		position: absolute;
		top: 10px;
		right: 25px;
		font-size: 5vw;
		font-weight: bold;
	}

	.close:hover,
	.close:focus {
		color: #999;
		text-decoration: none;
		cursor: pointer;
	}

	.mySlides {
		display: none;
	}

	.cursor {
		cursor: pointer;
	}

	.prev,
	.next {
		cursor: pointer;
		position: absolute;
		top: 50%;
		width: auto;
		padding: 16px;
		margin-top: 15vw;
		color: white;
		font-weight: bold;
		font-size: 3vw;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
		-webkit-user-select: none;
	}

	.next {
		right: 0;
		border-radius: 3px 0 0 3px;
	}

	.prev:hover,
	.next:hover {
		background-color: rgba(0, 0, 0, 0.8);
	}


	.swiper-slide img{
		z-index: -1;
	}




}


