html,
body {
	height: 100%;
}

.navbar-nav li a {
	font-size: 18px;
}

@media (min-width: 768px) and (max-width: 991px) {
	.navbar-nav li a {
		font-size: 17px;
	}
}

.navbar-nav li.active a {
	text-decoration: underline;
}

.navbar-nav li a.last {
	padding-right: 0;
}


/*preloader*/
.no-js #loader {
	display: none;
}

.js #loader {
	display: block;
	position: absolute;
	left: 100px;
	top: 0;
}

.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(../preloader.gif) center no-repeat #fff;
}

/*navbar*/
.navbar {
	-webkit-box-shadow: 0px 4px 4px rgb(204, 204, 204);
	-moz-box-shadow: 0px 4px 4px rgb(204, 204, 204);
	box-shadow: 0px 4px 4px rgb(204, 204, 204);
}

@media (max-width: 767px) {
	.navbar-fixed-top {
		padding-top: 15px;
		padding-bottom: 15px;
		background-color: rgba(255, 255, 255);
		-webkit-transition: padding 0.3s ease-in-out;
		-moz-transition: padding 0.3s ease-in-out;
		transition: padding 0.3s ease-in-out;
	}

	.navbar-fixed-top.top-nav-collapse {
		padding-top: 5px;
		padding-bottom: 5px;
		background: #fff;
	}

	.logo {
		margin-left: 10px;
		width: 200px;
	}

	#willkommen {
		padding-top: 90px;
	}

	#oeffnungszeiten,
	#salon,
	#inspirationen,
	#aktuelles,
	#impressum,
	#datenschutz {
		padding-top: 60px;
	}

	#oeffnungszeiten {
		padding-bottom: 90px;
	}
}

@media (min-width: 768px) {
	.navbar-fixed-top {
		padding-top: 20px;
		padding-bottom: 20px;
		background-color: rgba(255, 255, 255);
		-webkit-transition: padding 0.3s ease-in-out;
		-moz-transition: padding 0.3s ease-in-out;
		transition: padding 0.3s ease-in-out;
	}

	.navbar-fixed-top.top-nav-collapse {
		padding-top: 5px;
		padding-bottom: 5px;
		background: #fff;
		border-bottom: 1px solid rgba(255, 255, 255, 0.3);
	}

	.logo {
		padding-top: 0;
		padding-bottom: 0;
		-webkit-transition: padding 0.3s ease-in-out, width 0.3s ease-in-out;
		-moz-transition: padding 0.3s ease-in-out, width 0.3s ease-in-out;
		transition: padding 0.3s ease-in-out, width 0.3s ease-in-out;
	}

	.top-nav-collapse .logo {
		width: 200px;
		padding-top: 5px;
		padding-bottom: 5px;
		-webkit-transition: padding 0.3s ease-in-out, width 0.3s ease-in-out;
		-moz-transition: padding 0.3s ease-in-out, width 0.3s ease-in-out;
		transition: padding 0.3s ease-in-out, width 0.5s ease-in-out;
	}

	.navbar-right {
		-webkit-transition: margin-top 0.3s ease-in-out;
		-moz-transition: margin-top 0.3s ease-in-out;
		transition: margin-top 0.3s ease-in-out;
	}

	.top-nav-collapse .navbar-right {
		margin-top: 5px;
		-webkit-transition: margin-top 0.3s ease-in-out;
		-moz-transition: margin-top 0.3s ease-in-out;
		transition: margin-top 0.3s ease-in-out;
	}

	#willkommen {
		padding-top: 180px;
	}

	#oeffnungszeiten,
	#salon,
	#inspirationen,
	#aktuelles,
	#impressum,
	#datenschutz {
		padding-top: 90px;
	}

	#oeffnungszeiten {
		padding-bottom: 120px;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.logo {
		width: 230px;
	}

	.navbar-right {
		margin-top: 5px;
	}
}

@media (min-width: 992px) and (max-width: 1099px) {
	.logo {
		width: 250px;
	}

	.navbar-right {
		margin-top: 15px;
	}
}

@media (min-width: 1100px) {
	.logo {
		width: 330px;
	}

	.navbar-right {
		margin-top: 15px;
	}
}

/*intro*/
#intro {
	position: relative;
	display: block;
	height: 100%;
	padding-bottom: 0;
}

.intro_bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@keyframes slideInDown {
	from {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}

	65% {
		-webkit-transform: translateY(11px);
		transform: translateY(11px);
	}

	to {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@-webkit-keyframes slideInDown {
	from {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}

	65% {
		-webkit-transform: translateY(11px);
		transform: translateY(11px);
	}

	to {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes zoomIn {
	from {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}

	50% {
		opacity: 1;
	}
}

@-webkit-keyframes zoomIn {
	from {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}

	50% {
		opacity: 1;
	}
}

.slogan-box {
	position: relative;
	display: table;
	width: 100%;
	height: 100%;
	text-align: center;
}

.slogan-text {
	display: table-cell;
	height: 100%;
	vertical-align: middle;
}

.scroll-section {
	margin-top: 20px;
	animation: slideInDown 4s infinite;
	-webkit-animation: slideInDown 4s infinite;
}

.scroll-section-link,
.scroll-section-link:hover,
.scroll-section-link:focus {
	color: #fff;
	font-size: 32px;
}

@media (max-width: 767px) {
	#slogan1 {
		margin-top: 100px;
	}

	#slogan2 {
		margin-bottom: 30px;
	}

	#slogan2 h2 {
		font-size: 26px;
	}

}

@media (min-width: 768px) {
	#slogan1 {
		margin-top: 170px;
	}

	#slogan2 {
		margin-bottom: 30px;
	}

	#slogan1 h1 {
		font-size: 55px;
	}

}

#slogan1 {
	margin-bottom: 8px;
}



#slogan1 h1,
#slogan2 h2 {
	color: #fff;
	margin: 0;
	-webkit-animation: zoomIn 1s both;
	animation: zoomIn 1s both;
}

#slogan1 h1,
#slogan2 h2 {
	text-shadow: 4px 4px 3px #000;
}

#slogan1 h1,
#slogan2 h2,
#slogan3 {
	-webkit-animation: zoomIn 1s both;
	animation: zoomIn 1s both;
}



/*section*/
#willkommen,
#oeffnungszeiten,
#salon,
#aktuelles,
#inspirationen,
#impressum,
#datenschutz {
	background: #fff;
}


/*Ende Intro*/

.footer {
	padding: 40px 0;
	color: #fff;
	background: #000000;
}

.footer a,
.footer a:hover,
.footer a:focus {
	text-decoration: none;
	color: #fff;
}

.footer a {
	text-decoration: none;
}

.footer a:hover,
.footer a:focus {
	text-decoration: underline;
}

.impressum.container {
	width: 97%;
	max-width: 1170px;
}

@media (min-width: 768px) {
	.hidden-md {
		display: none;
	}
}