html,
body {
  height: 100%;
  overflow: hidden;
  overscroll-behavior-x: none;
  overscroll-behavior-y: none;
}

.canteen-logo {
	max-width: 55%;
	position: fixed;
	margin: auto;
	left: 0;
	right: 0;
	text-align: center;
	top: 38%;
	width: 100%;
	z-index: 1;
}

.Loop {
  position: relative;
  height: 100%;
  overflow: auto;
}

section {
  position: relative;
  text-align: center;
  height: 100vh;
}

/*.scroll-panel {
	background-size: cover !important;
	height: 101vh;
	background-position: 50% 0 !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  overflow: hidden;
}*/

::scrollbar {
  display: none;
}

/*********menu toggle*********/

.navbar-header {
	width: 100%;
	background-color: transparent; 
  display: block;
  position: relative;
	height: 0; 
}

.bar {
	background-color: white !important;
}

#content-block {
	position: relative;
	overflow: hidden;
}

.parallax-slide {
	position: relative;
	height: 100vh;
}

.parallax-clip {
	height: 100%;
	position: absolute;
	width: 100%;
	left: 0px;
	top: 0px;
	/*clip: rect(auto, auto, auto, auto);*/
}

.fixed-parallax {
	background-size: cover !important;
	height: 101vh;
	background-position: 50% 0 !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  overflow: hidden;
	/* -webkit-transform: translateZ(0); /* necessary for iOS! */
}


@media only screen and (hover: none) and (pointer: coarse) and (max-width: 767px){
	html,
	body {
	  height: 100% !important;
	  overflow: hidden !important;
	  overscroll-behavior-x: none;
	  overscroll-behavior-y: none;
	}

.fixed-parallax {
	position: relative;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-size: cover !important;
	background-position: 50% 0 !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
	/* -webkit-transform: translateZ(0); /* necessary for iOS! */
}


	.canteen-logo {
		top: 40%;
		max-width: 85%;
	}

/*	.scroll-panel {
    background-attachment: scroll !important;
    background-position: center !important;
	}*/

	@supports (-webkit-touch-callout: none) {
		.parallax-clip {
			clip: rect(auto, auto, auto, auto) !important;
		}
		.fixed-parallax {
			position: fixed;
			background-attachment: unset !important;
			-webkit-transform: translateZ(0) !important; /* necessary for iOS! */
		}
		.Loop {
			overflow: scroll;
		  -webkit-overflow-scrolling: touch;
		}
	}

	@supports (-webkit-overflow-scrolling: touch) {
		.parallax-clip {
			clip: rect(auto, auto, auto, auto) !important;
		}
		.fixed-parallax {
			position: fixed;
			background-attachment: unset !important;
			-webkit-transform: translateZ(0) !important; /* necessary for iOS! */
		}

		.Loop {
			overflow: scroll;
		  -webkit-overflow-scrolling: touch;
		}
	}

}


@media only screen and (hover: none) and (pointer: coarse) and (min-width: 768px){
	html,
	body {
	  height: 100% !important;
	  overflow: hidden !important;
	  overscroll-behavior-x: none;
	  overscroll-behavior-y: none;
	}

.fixed-parallax {
	position: relative;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-size: cover !important;
	background-position: 50% 0 !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
	/* -webkit-transform: translateZ(0); /* necessary for iOS! */
}

	.canteen-logo {
		top: 35%;
		max-width: 79%;
	}

/*	.scroll-panel {
    background-attachment: scroll !important;
    background-position: center !important;
	}*/

	@supports (-webkit-touch-callout: none) {
		.parallax-clip {
			clip: rect(auto, auto, auto, auto) !important;
		}
		.fixed-parallax {
			position: fixed;
			background-attachment: unset !important;
			-webkit-transform: translateZ(0) !important; /* necessary for iOS! */
		}
		.Loop {
			overflow: scroll;
		  -webkit-overflow-scrolling: touch;
		}
	}

	@supports (-webkit-overflow-scrolling: touch) {
		.parallax-clip {
			clip: rect(auto, auto, auto, auto) !important;
		}
		.fixed-parallax {
			position: fixed;
			background-attachment: unset !important;
			-webkit-transform: translateZ(0) !important; /* necessary for iOS! */
		}

		.Loop {
			overflow: scroll;
		  -webkit-overflow-scrolling: touch;
		}
	}
}

@media only all and (max-width: 767px) { 
	html,
	body {
	  height: 100% !important;
	  overflow: hidden !important;
	  overscroll-behavior-x: none;
	  overscroll-behavior-y: none;
	}

.fixed-parallax {
	position: relative;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-size: cover !important;
	background-position: 50% 0 !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
	/* -webkit-transform: translateZ(0); /* necessary for iOS! */
}


	.canteen-logo {
		top: 40%;
		max-width: 85%;
	}

/*	.scroll-panel {
    background-attachment: scroll !important;
    background-position: center !important;
	}*/

	@supports (-webkit-touch-callout: none) {
		.parallax-clip {
			clip: rect(auto, auto, auto, auto) !important;
		}
		.fixed-parallax {
			position: fixed;
			background-attachment: unset !important;
			-webkit-transform: translateZ(0) !important; /* necessary for iOS! */
		}
		.Loop {
			overflow: scroll;
		  -webkit-overflow-scrolling: touch;
		}
	}

	@supports (-webkit-overflow-scrolling: touch) {
		.parallax-clip {
			clip: rect(auto, auto, auto, auto) !important;
		}
		.fixed-parallax {
			position: fixed;
			background-attachment: unset !important;
			-webkit-transform: translateZ(0) !important; /* necessary for iOS! */
		}

		.Loop {
			overflow: scroll;
		  -webkit-overflow-scrolling: touch;
		}
	}
}