/********************HOME*******************/
/*
@import url(/css/home.css?version=1);
*/
/********************FONTS******************/
@import url(fonts.css);
/*******************LEAGUE******************/
@import url(/css/league.css);
/*******************BILJART*****************/
@import url(/css/biljart.css);
/*******************BOWLING*****************/
@import url(/css/bowling.css);
/******************VERJAARDAG***************/
@import url(/css/verjaardag.css);
/*****************INFO&TARIEVEN*************/
@import url(/css/infoentarieven.css);
/****************SHAREBUTTONSTYLE***********/
@import url(/css/shareButtonStyle.css);
/*******************404*********************/
@import url(/css/error.css);





body{
	margin: 0;
	padding: 0;
	height: 0;
	max-width: 100%;
	overflow-x: hidden;
	background-color: rgb(23,31,67);
	-ms-touch-action: manipulation;
	touch-action: manipulation;

}




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

@media screen and (max-width:600px){
	
	
	.alert{
		background-color: red;
		color: white;
		margin-top: 25vw;
		
	}
	
	.alert p{
		
		margin: 2vw;
		font-size: 4vw;
	}
	
	
	
	
	header{
		position: absolute;
		background: transparent;
		width: 100%;
		height: 24vw;
		position: fixed;
		top: 0;
		transition: top 0.2s ease-in-out;
		text-align: center;
		z-index: 1;

	}

	.nav-down1 {
		position: absolute;
		background: rgb(23,31,67);
		width: 100%;
		height: 24vw;
		position: fixed;
		top: 0;
		transition: top 0.2s ease-in-out;
		text-align: center;

	}

	.nav-up {
		top: -24vw;
		background: transparent;
		width: 100%;
		height: 24vw;
		position: fixed;
		z-index: 2;
		transition: top 0.2s ease-in-out;
		text-align: center;
	}

	.openbtn{
		display: block;
		position: absolute;
		font-size: 11vw;
		float: right;
		color: white;
		padding: 3px 20px;
		top: 0;
		left: 0;
		margin-top: 3vw;
		margin-left: 2vw;
		z-index: 2;
	}

	.openbtn2{
		display: none;
	}





	.nav-down.scrolled {
		position: fixed;
		z-index: 2;
		background-color: rgb(23,31,67) !important;
		transition: background-color 200ms linear;

	}







	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                        SIDENAV                                        *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/

	.sidenav .closebtn{
		position: absolute;
		font-size: 16vw;
		float: right;
		color: white;
		padding: 3px 20px;
		top: 0;
		left: 0;
		margin-top: 1vw;
		margin-left: 80%;
		display: inline-block;
		z-index: 3;
	}




	.logo img{
		position: absolute;
		width: 80vw;
		height: auto;
		float: left;
		margin-top: 20%;
		margin-left: 10%;
		margin-right: 1%;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: inline-block;

	}

	.kegelnav img{
		position: absolute;
		width: 90vw;
		margin-top: 43vw;
		margin-left: -8vw;
		transform: rotate(328deg);
	}

	.kegelnav2 img{
		position: absolute;
		width: 100vw;
		margin-top: 30vw;
		margin-left: -5vw;
		transform: rotate(350deg);
	}



	.sidenav{
		height: 100%;
		widows: 50px;
		width: 0;
		position: fixed;
		top: 0;
		left: 0;
		background-color: rgb(23,31,67);

		overflow-x: hidden;
		transition: 0.5s;
		padding-top: 60px;
		text-align: center;
		z-index: 5;
	}

	.sidenav a{
		position: relative;
		display: block;
		color: #f2f2f2;
		text-align: left;
		font-family: "XXII";
		padding: 9px 16px;
		text-decoration: none;
		font-size: 6vw;
		margin-top: 5%;
		margin-left: 10%;
		margin-right: 10%;
		transition: 0.2s;
		z-index: 3;
		letter-spacing: 0.3vw;

	}

	.menu a:first-child{
		margin-top: 6em;
		z-index: 3;
	}





	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                          MAIN                                         *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/	
	
	
	
	h2{
		position: relative;
		color: black;
		display: block;
		text-align: center;
		top: 0;
		margin-top: 5%;
		padding-top: 20%;
		padding-bottom: 10%;
		font-family: "SJM";
		font-size: 8vw;
	}
	
	
	.img{
		width: 100vw;
		height: 50vw;
		background-position: 100% 45%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	
	
	
	
	section {	
		position: relative;
		display: block;
		background-color: rgb(245,245,245);

	}


	hr{
		width: 20vw;
		height: 1vw;
		background: rgb(235,69,76);
		border: none;
	}
	
	
	h3{
		position: relative;
		color: black;
		display: block;
		text-align: center;
		top: 0;
		margin-top: 10%;
		margin-bottom: 10%;
		font-family: "SJM";
		font-size: 8vw;
	}
	
	
	h4{
		position: relative;
		display: block;
		text-align: left;
		font-family: "SJM";
		font-size: 6vw;
		padding-left: 5vw;

	}
	









	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                         FOOTER                                        *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/





	h5{

		font-size: 4vw;
		color: rgb(235,69,76);
		text-align: center;

	}

	.gegevensFooter p {
		font-size: 4vw;
	}


	.gegevensFooter{
		position: relative;
		display: block;
		margin-bottom: 5%;

	}

	openingsurenFooter p{
		font-size: 4vw;
	}

	.openingsurenFooter{
		position: relative;
		margin-bottom: 5%;
		display: block;
		font-size: 4vw;
	}



	.telefoonFooter{
		margin-bottom: 5%;
		color: white;
		padding-bottom: 10vw;

	}

	.telefoonFooter a{
		color: inherit;
		text-decoration: none;
		-webkit-appearance: none;

	}
	footer {
		color: white;
		position: relative;
		padding: 1rem;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		text-align: center;
		font-family: "SJM";
		font-size: 4vw;
		z-index: -1;
	}

}


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



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



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


	
	.alert{
		background-color: red;
		color: white;
		margin-top: 10vw;
		
	}
	
	.alert p{
		
		margin: 2vw;
		font-size: 2vw;
	}


	header{
		background: transparent;
		width: 100%;
		height: 11vw;
		position: fixed;
		top: 0;
		transition: top 0.2s ease-in-out;
		text-align: center;
		z-index: 1;

	}

	.nav-down1 {
		background: rgb(23,31,67);
		width: 100%;
		height: 11vw;
		position: fixed;
		top: 0;
		transition: top 0.2s ease-in-out;
		text-align: center;

	}

	.nav-up {
		top: -24vw;
		background: transparent;
		width: 100%;
		height: 11vw;
		position: fixed;
		z-index: 2;
		transition: top 0.2s ease-in-out;
		text-align: center;
	}

	.openbtn2{
		display: block;
		position: absolute;
		font-size: 4vw;
		float: right;
		color: white;
		padding: 3px 20px;
		top: 0;
		left: 0;
		margin-top: 2vw;
		margin-left: 2vw;
		z-index: 2;
	}

	.openbtn{
		display: none;
	}






	.nav-down.scrolled {
		position: fixed;
		z-index: 2;
		background-color: rgb(23,31,67) !important;
		transition: background-color 200ms linear;

	}




	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                        SIDENAV                                        *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/

	.sidenav .closebtn{
		position: absolute;
		font-size: 8vw;
		float: right;
		color: white;
		padding: 3px 20px;
		top: 0;
		left: 0;
		margin-top: 1vw;
		margin-left: 70%;
		display: inline-block;
		z-index: 99;
	}



	.logo img{
		position: absolute;
		width: 30vw;
		height: auto;
		float: left;
		margin-top: 30%;
		margin-left: 6%;
		margin-right: 1%;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: inline-block;

	}


	.kegelnav {
		display: none;
	}

	.kegelnav2 {
		display: none;
	}



	.sidenav{
		height: 100%;
		widows: 50px;
		width: 0;
		position: fixed;
		top: 0;
		left: 0;
		background-color: rgb(23,31,67);

		overflow-x: hidden;
		transition: 0.5s;
		padding-top: 60px;
		text-align: center;
		z-index: 2;
	}

	.sidenav a{
		position: relative;
		display: block;
		color: #f2f2f2;
		text-align: left;
		font-family: "XXII";
		padding: 9px 16px;
		text-decoration: none;
		font-size: 3vw;
		margin-top: 5%;
		margin-left: 10%;
		margin-right: 10%;
		transition: 0.2s;
		z-index: 2;
		letter-spacing: 0.3vw;

	}

	.menu a:first-child{
		margin-top: 6em;
		z-index: 2;
	}




	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                          MAIN                                         *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/
	
	
	
	section{
		position: relative;
		display: block;
		background-color: rgb(245,245,245);
		padding-bottom:  1vw;
	}
	
	
	
	.img{
		width: 100vw;
		height: 20vw;
		background-position: 100% 45%;
		background-repeat: no-repeat;
		background-size: cover;
	}
	
	
	
	
	h2{
		position: relative;
		color: black;
		display: block;
		text-align: center;
		top: 0;
		padding-top: 8%;
		padding-bottom: 1%;
		font-family: "SJM";
		font-size: 3vw;
	}

	
	

	hr{
		width: 7vw;
		height: 0.4vw;
		background: rgb(235,69,76);
		border: none;
	}
	
	
	
	h3{
		position: relative;
		color: black;
		display: block;
		text-align: center;
		top: 0;
		margin-top: 10%;
		margin-bottom: 10%;
		font-family: "SJM";
		font-size: 2.5vw;
	}
	
	
	
	h4{
		position: relative;
		display: block;
		text-align: left;
		font-family: "SJM";
		font-size: 2.5vw;
		padding-left: 5vw;

	}




	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                         FOOTER                                        *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/



	h5{
		margin-top: 7vw;
		font-size: 2vw;
		color: rgb(235,69,76);
		text-align: center;

	}




	.gegevensFooter{
		position: relative;
		display: inline-block;
		text-align: left;
		margin-left: 14vw;
		margin-right: 2vw;
		margin-bottom: 5%;
		vertical-align: top;
		text-align: left;
		font-family: "SJM";
		color: white;

	}

	.gegevensFooter p{
		font-size: 2vw;
	}

	.openingsurenFooter{
		position: relative;
		margin-left: 5vw;
		margin-right: 2vw;
		margin-bottom: 5%;
		text-align: left;
		display: inline-block;
		vertical-align: top;
		font-family: "SJM";
		color: white;
	}

	.openingsurenFooter p{
		font-size: 2vw;
	}





	.telefoonFooter{
		position: relative;
		display: inline-block;
		margin-left: 5vw;
		margin-right: 2vw;
		margin-bottom: 5%;
		color: rgb(235,69,76);
		text-align: left;
		font-family: "SJM";

	}

	.telefoonFooter a{
		font-size: 2vw;
		color: white;
		text-decoration: none;
		-webkit-appearance: none;


	}


	.footer {
		color: white;
		position: relative;
		padding: 1rem;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		text-align: center;
		font-family: "SJM";
		font-size: 1.5vw;
		z-index: -1;
	}







}





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



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

	
	
	.alert{
		background-color: red;
		color: white;
		margin-top: 6vw;
		
	}
	
	.alert p{
		
		margin: 3vw;
		font-size: 1.5vw;
		text-align: center;
	}



	header{
		background: transparent;
		width: 100%;
		height: 5.5vw;
		position: fixed;
		top: 0;
		transition: top 0.2s ease-in-out;
		text-align: center;
		z-index: 5;

	}



	.nav-up {
		top: -24vw;
	}

	.openbtn2{
		display: none;
	}

	.openbtn{
		display: none;
	}

	.sidenav .closebtn{
		display: none;
	}

	
	.kegelnav {
		display: none;

	}

	.kegelnav2 {
		display: none;
	}
	



	.logo img{
		position: absolute;
		width: 21vw;
		height: auto;
		float: left;
		margin-left: 3%;
		margin-right: 1%;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: inline-block;
		z-index: 2;
	}



	.nav-down1 {
		background: rgb(23,31,67);
		width: 100%;
		position: fixed;
		top: 0;
		transition: top 0.2s ease-in-out;
		text-align: center;

	}



	.sidenav{

		display: block;
		position: absolute;
		font-size: 3.5vw;
		float: right;
		color: white;
		padding: 3px 20px;
		top: 0;
		left: 0;
		margin-left: 2vw;
		z-index: 2;
	}



	.sidenav a{
		position: relative;
		text-align: right;
		top: 0;
		margin: 1vw;
		left: 47%;
		right: 5vw;
		color: white;
		font-size: 1.5vw;
		z-index: 2;
		text-decoration: none;
		font-family: "XXII";
		letter-spacing: 0.1vw;




	}


	.menu a:last-child{
		margin-right: 10vw;
	}


	.nav-down.scrolled {
		position: fixed;
		z-index: 2;
		background-color: rgb(23,31,67) !important;
		transition: background-color 200ms linear;

	}
	
	
	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                          MAIN                                         *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/
	
	
	
	section {	
		position: relative;
		display: block;
		background-color: rgb(245,245,245);

	}

	h2{
		position: relative;
		color: black;
		display: block;
		text-align: center;
		top: 0;
		padding-top: 7%;
		font-family: "SJM";
		font-size: 2.5vw;
	}

	
	

	hr {
		width: 6vw;
		height: 0.3vw;
		background: rgb(235,69,76);
		border: none;
	}


	
	h3{
		position: relative;
		color: black;
		display: block;
		text-align: center;
		top: 0;
		margin-top: 10%;
		margin-bottom: 10%;
		font-family: "SJM";
		font-size: 2vw;
	}
	
	
	h4{
		position: relative;
		display: block;
		text-align: left;
		font-family: "SJM";
		font-size: 2vw;
		padding-left: 10vw;

	}



	/****************************************************************************************
	*                                                                                       * 
	*                                                                                       *
	*                                                                                       * 
	*                                         FOOTER                                        *
	*                                                                                       * 
	*                                                                                       * 
	*                                                                                       * 
	****************************************************************************************/







	h5{
		margin-top: 3vw;
		font-size: 1vw;
		color: rgb(235,69,76);
		text-align: center;

	}




	.gegevensFooter{
		position: relative;
		display: inline-block;
		text-align: left;
		margin-left: 27.5vw;
		margin-right: 2vw;
		margin-bottom: 2%;
		vertical-align: top;
		text-align: left;
		font-family: "SJM";
		color: white;

	}

	.gegevensFooter p{
		font-size: 1vw;
	}

	.openingsurenFooter{
		position: relative;
		margin-left: 5vw;
		margin-right: 2vw;
		text-align: left;
		display: inline-block;
		vertical-align: top;
		font-family: "SJM";
		color: white;
	}

	.openingsurenFooter p{
		font-size: 1vw;
	}





	.telefoonFooter{
		position: relative;
		display: inline-block;
		margin-left: 5vw;
		color: rgb(235,69,76);
		text-align: left;
		font-family: "SJM";

	}

	.telefoonFooter a{
		font-size: 1vw;
		color: white;
		margin-left: 1vw;
		text-decoration: none;
		-webkit-appearance: none;


	}


	.footer {
		color: white;
		position: relative;
		padding: 1rem;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		text-align: center;
		font-family: "SJM";
		font-size: 0.8vw;
		z-index: -1;
	}






}



