/* Import */
/* glory-regular - latin */
@font-face {
	font-family: 'Glory';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: local(''),
		url('../font/glory-v5-latin-regular.woff2') format('woff2'),
		url('../font/glory-v5-latin-regular.woff') format('woff');
} 
@font-face {
	font-family: 'Glory';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: local(''),
		url('../font/glory-v5-latin-500.woff2') format('woff2'),
		url('../font/glory-v5-latin-500.woff') format('woff');
}

@font-face {
	font-family: 'Glory';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: local(''),
		url('../font/glory-v5-latin-600.woff2') format('woff2'),
		url('../font/glory-v5-latin-600.woff') format('woff');
}

/* Global */
:root {
	--color-red: #B61320;
	--color-lightgrey: #555554;
	--color-black: #20201F;
	--color-bg-secondary: #f5f1e9;
}
html {
	scroll-behavior: smooth;
}
body {
	font-family: 'Glory', var(--bs-body-font-family);
	font-size: 1.25rem;
	-webkit-hyphens: auto;
	hyphens: auto;
	color: var(--color-black);
	letter-spacing: 0.025em;
	line-height: 1.4;
}
.hero {
	max-height: 650px;
	object-fit: cover;
}
.bg-secondary {
	background: var(--color-bg-secondary) !important;
}
.bg-red {
	background-color: var(--color-red);
}
#noscript {
	background: var(--color-red);
	z-index: 750;
}
.no-js noscript + img {
	display: none !important;
}
.fit-cover {
	object-fit: cover;
	}

/* Menu */
#menu li a {
	text-decoration: none;
	color:#fff;
	font-weight: 400;
	text-transform: uppercase;
	font-size: 2.5rem;
	text-align: center;
}
#menu img {
	max-width: 250px;
}

/* Headlines */
h1, .h1 {
	font-size: 2.25rem;
	color: var(--color-lightgrey);
	font-weight: 500;
	hyphens: auto;
}
h2, .h2 {
	font-size: 2rem;
	font-weight: 500;
	color: var(--color-black);
}
h3, .h3 {
	font-size: 1.75rem;
	font-weight: 500;
	color: var(--color-black);
}
h4, .h4 {
	font-size: 1.5rem;
	font-weight: 500;
	color: var(--color-black);
	text-transform: uppercase;
}
.display {
	font-size: 2.5rem;
	color: var(--color-lightgrey);
	text-transform: uppercase;
}
.subtitle {
	font-size: 1.25rem;
	font-weight: 400;
	color: var(--color-lightgrey);
}
a, a:hover, a:focus {
	text-decoration: none;
	color: inherit;
}
p a{
	border-bottom: 2px solid var(--color-red);
	transition: .1s;
}
p a:hover, p a:focus, p a:active{
	border-color: transparent;
}
p li a{
	border-bottom: 2px solid var(--color-red);
	transition: .1s;
}
p li a:hover, p li a:focus{
	border-color: transparent;
}
a.mehr-link {
	border-bottom: 2px solid transparent;
	transition: .1s;
}
a.mehr-link:hover, a.mehr-link:focus, a.mehr-link:active, a.mehr-link.active{
	border-color: var(--color-red);
}
.mehr-link span, #karriere .mehr-link {
	border-bottom: 2px solid transparent;
	transition: .1s;
}
.mehr-link span:hover, .mehr-link span:focus, #karriere .mehr-link:hover, #karriere .mehr-link:focus {
	border-color: var(--color-red);
}
footer ul li {
	list-style: none;
}
footer ul li a {
	border-bottom: 2px solid transparent;
	transition: border .1s;
	color: #fff !important;
	text-decoration: none;
}
footer ul li a:hover, footer ul li a:focus, footer ul li a:active, footer ul li a.active {
	border-color: #fff !important;
}
.no-hyphen a {
	hyphens: none;
}
/* Buttons */
.btn {
	font-weight: 500;
	font-size: 1.25rem;
	text-transform: uppercase;
	padding: 1rem 1.5rem;
	border-radius: 0;
	border: 2px solid var(--color-red);
	transition: .2s;
}
.btn svg {
	transition: .2s;
	height: 18px;
	margin-left: 0.5rem;
}

.btn-primary {	
	color: #fff;
	background: var(--color-red);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
	background-color: transparent;
	border: 2px solid var(--color-red);
	color: inherit;
}
.btn-primary:focus {
	box-shadow: 0 0 0 .25rem rgba(130,138,145,.5) !important;
}
.btn-primary svg {
	fill: #fff;
}
.btn-primary:hover svg, .btn-primary:focus svg, .btn-primary:active svg, .btn-primary.active svg{
	fill: var(--color-red);
}
.btn-secondary {
	color: var(--color-black);
	background: transparent;
}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active ,.btn-secondary.active {
	background: var(--color-red);
	color: #fff;
	border: 2px solid var(--color-red);
}
.btn-secondary svg {
	fill: var(--color-red);
}
.btn-secondary:hover svg ,.btn-secondary.active svg {
	fill: #fff;
}

/* Scale effect */
.effect-scale {
	transition: all .2s;
}
.effect-scale:hover, .effect-scale:focus {
	transform: scale(1.02);
}

/* Sections */
.points {
	background: var(--color-lightgrey);
	width: 25px;
	height: 25px;
	border-radius: 50%;
}
.red-point {
	background: var(--color-red);
	width: 25px;
	height: 25px;
	border-radius: 50%;
}

/* Kontakt Formular */
.form-control:focus, .form-select:focus, .form-check-input:focus {
	border-color: var(--color-lightgrey);
	box-shadow: 0 0 0 .25rem rgba(95,95,94,.2);
}
.form-check-input:checked {
	background-color: var(--color-red);
	border: 0;
}
/* Border-Radius */
.rounded {
	border-radius: 20px !important;
}
.rounded-top {
	border-radius: 20px 20px 0 0 !important;
}
.rounded-start {
	border-radius: 20px 0 0 20px !important;
}
.rounded-end {
	border-radius: 0 20px 20px 0 !important;
}

/* Box-Shadow */
.shadow {
	box-shadow: 0 1rem 1rem -1rem hsl(200 50% 20% / 40%) !important;
}

/* Referenzen */
#referenzen img {
	object-fit: cover;
}
/* Leistungen */
.leistungen h2 {
	text-transform: uppercase;
}

/* Team */
#team figure, #allteam figure{
	position: relative;
}
#team figure::after, #allteam figure::after {
	transition: background .2s;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
	border-radius: 20px 20px 0 0 !important;
}
#team figure:hover::after, #allteam figure:hover::after {
	background: rgba(182, 19, 32, 0.8);
	}
#team figcaption, #allteam figcaption{
	opacity: 0;
	visibility: hidden;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
	color: #fff;
	padding: 1.5rem;
	transition: .3s;
}
#team figcaption h5, #allteam figcaption h5 {
	color: #fff;
}
#team figure:hover figcaption, #allteam figure:hover figcaption {
	opacity: 1;
	visibility: visible;
}
/* Leistungen - Rundum Service */
#service .nav-link {
	color: inherit;
	background-color: #fff;
	transition: .2s;
	border-radius: 0;
}


#service .nav-link svg {
	fill: var(--color-red);
	transition: .2s;
}
#service .nav-link:hover, #service .nav-link:active, #service .nav-link:focus, .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	background-color: var(--color-red) !important;
	color: #fff !important;
}

/* Footer Social Links */
.social-links svg {
	transition: .2s;
}
.social-links svg:hover, .social-links svg:focus {
	fill: var(--color-red);
}

/* ###### Lazy Load ##### */
.lazy {
	opacity: 0;
}
.entered {
	transition: opacity 1s, transform .2s;
	opacity: 1;
}

/* Rundum Service SVG */
#service .nav-link:hover svg, #service .nav-link.active svg, #service .nav-link:focus svg {
	fill: #fff;
}

/* Loader */
.no-js .preloader {
	display: none;
}
.no-js #preloader {
	display: none;
}
.preloader {
	width: 100%;
	height: 100%;
	top:0;
	position: fixed;
	background-color: #fff;
	z-index: 900;
}
.logo-loader {
	max-width: 250px;
}
.lorenz, .schneider, .dot-1, .dot-2, .dot-3, .dot-4, .dot-5, .dot-6, .dot-7 {
	fill: none;
}
.dot-1, .dot-2, .dot-3, .dot-4, .dot-6, .dot-7, .lorenz {
	animation: loader .5s forwards;
}
.dot-2 {
	animation-delay: .1s;
}
.dot-3 {
	animation-delay: .2s;
}
.dot-4 {
	animation-delay: .3s;
}
.dot-6 {
	animation-delay: 0.5s;
}
.dot-7 {
	animation-delay: 0.6s;
}
.schneider, .dot-5 {
	animation: loader-red .5s forwards;
}
.dot-5 {
	animation-delay: 0.4s;
}
.schneider {
	animation-delay: 0.7s;
}
.lorenz {
	animation-delay: 0.7s;
}
@keyframes loader {
	0%  {
		opacity: 0;
	}
	30% {
		opacity: .3;
	}
	100% {
		opacity: 1;
		fill: var(--color-lightgrey);
	}
}
@keyframes loader-red {
	0% {
		opacity: 0;
	}
	30% {
		opacity: .3;
	}
	100% {
		opacity: 1;
		fill: var(--color-red);
	}
}

/* ------- Media Queries min-width------ */
@media (min-width: 576px) {
	.rounded-sm-start {
		border-radius: 20px 0 0 20px !important;
	}
	#service .nav-link svg {
		height: 100%;
		width: 100%;
	}
}
@media (min-width: 768px) {
	#menu img, .logo-loader {
		max-width: 350px;
	}
	h1, .h1 {
		font-size: 2.75rem;
	}
	h2, .h2 {
		font-size: 2.25rem;
	}
	.display {
	font-size: 3rem;
	}
	#service .nav-link {
		font-size: 1.75rem;
	}
	.leistungen:nth-of-type(even) .img-col {
		order: 2;
	}
	.leistungen:nth-of-type(odd) .mehr-link {
		text-align: right !important;
	}
	.leistungen:nth-of-type(even) img.rounded-md-start {
		border-radius: 0 20px 20px 0 !important;
	}
	.rounded-md-start {
		border-radius: 20px 0 0 20px !important;
	}
	.rounded-md-end {
		border-radius: 0 20px 20px 0 !important;
	}
	img.float-img {
		max-width: 50%;
	}
}
@media (min-width: 992px) {
	h1, .h1 {
		font-size: 3.25rem;
	}
	h2, .h2 {
		font-size: 2.75rem;
	}
	h4, .h4 {
		font-size: 1.75rem;
	}
	.display {
		font-size: 3.5rem;
	}
	.subtitle {
		font-size: 1.5rem;
	}
	#menu img, .logo-loader {
		max-width: 450px;
	}
	#menu li a {
		transition: ease-in-out .3s;
		border-bottom: 3px solid transparent;
		font-size: 1.75rem;
		color: var(--color-lightgrey);
		line-height: 1.2;
	}
	#menu li a:hover, #menu li a:focus, #menu li a:active, #menu li a.active {
		border-color: var(--color-red);
	}
	/* Welcome-Text */
	.welcome-text {
		column-count: 2;
		column-gap: 2rem;
	}
	main figure.float-lg-start {
		max-width: calc(50% - 1rem);
		margin: .75rem 2rem 3rem 0;
	}
	main figure.float-lg-end {
		max-width: calc(50% - 1rem);
		margin: .75rem 0 3rem 2rem;
	}
	main figure.float-lg-start + figure.float-lg-end {
		margin-left: 0;
	}
	main .clear {
		clear: both;
	}
}

/* ------- Media Queries max-width------ */
@media (max-width: 992px) {
	#menu button {
		box-shadow: none;
		position: fixed;
		right:0;
		z-index: 700;
	}
	#menu .navbar-nav {
		opacity: 0;
		visibility: hidden;
		left: 0;
		top: 0;
		height: 100vh;
		position: fixed;
		width: 100%;
		z-index: 699;
		background: var(--color-red);
		transition: opacity .3s, visibility .3s;
	}
	#menu .is-active + div > .navbar-nav {
		opacity: 1;
		visibility: visible;
		color: #fff;
	}
}

/* Timeline Slider */
.timeline--horizontal .timeline__item {
	padding-right: .4rem !important;
	}
	.timeline--horizontal .timeline__item::after {
	left: 49% !important;
	}
.timeline__item::after {
	background-color: var(--color-red) !important;
	border: none !important;
	height: 25px !important;
	width: 25px !important;
}
.timeline__content p {
	font-size: 1.25rem !important;
	line-height: 1.4 !important;
	letter-spacing: 0;
	}
	.timeline-nav-button--next::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='18' viewBox='0 0 24 24' fill='%23B61320'%3E%3Cpath d='M5 3l3.057-3 11.943 12-11.943 12-3.057-3 9-9z'%3E%3C/path%3E%3C/svg%3E") !important;
	}
	.timeline-nav-button--prev::before {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='18' viewBox='0 0 24 24' fill='%23B61320'%3E%3Cpath d='M16.67 0l2.83 2.829-9.339 9.175 9.339 9.167-2.83 2.829-12.17-11.996z'%3E%3C/path%3E%3C/svg%3E") !important;
	}
/* Hamburger-Icon */
.hamburger {
	display: inline-block;
	cursor: pointer;
	transition-property: opacity, filter;
	transition-duration: 0.15s;
	transition-timing-function: linear;
	font: inherit;
	color: inherit;
	text-transform: none;
	background-color: transparent;
	border: 0;
	margin: 0;
	overflow: visible; }
.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after {
	background-color: white; }
.hamburger-box {
	width: 40px;
	height: 24px;
	display: inline-block;
	position: relative; }
.hamburger-inner {
	display: block;
	margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
	width: 40px;
	height: 4px;
	background-color: var(--color-red);
	border-radius: 4px;
	position: absolute;
	transition-property: transform;
	transition-duration: 0.15s;
	transition-timing-function: ease; }
.hamburger-inner::before, .hamburger-inner::after {
	content: "";
	display: block; }
.hamburger-inner::before {
	top: -10px; }
.hamburger-inner::after {
	bottom: -10px; }
.hamburger--spin .hamburger-inner {
	transition-duration: 0.22s;
	transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spin .hamburger-inner::before {
	transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
.hamburger--spin .hamburger-inner::after {
	transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spin.is-active .hamburger-inner {
	transform: rotate(225deg);
	transition-delay: 0.12s;
	transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--spin.is-active .hamburger-inner::before {
	top: 0;
	opacity: 0;
	transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
.hamburger--spin.is-active .hamburger-inner::after {
	bottom: 0;
	transform: rotate(-90deg);
	transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); 
	}
	
.content {
  display: none;
}
.noContent {
  color: #000 !important;
  background-color: transparent !important;
  pointer-events: none;
	display:none;
}

/* 2nd Preloader */

/* Loader */
#loader {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1234;
}
.no-js #loader {
	display: none;
}
.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: var(--color-lightgrey);
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
	background: var(--color-red);
}
.lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}