@import url(../swiper/swiper-bundle.min.css);
@font-face {
	font-family: 'roboto';
	src: url('../fonts/robotocondensed-light.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'roboto';
	src: url('../fonts/robotocondensed-regular.woff') format('woff');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'roboto';
	src: url('../fonts/robotocondensed-bold.woff') format('woff');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
:root {
	--black: #141414;
	--gray: rgba(20, 20, 20, .8);
	--yellow: rgba(20, 20, 20, .5); 
}
body {
	font-family: roboto, sans-serif;
	line-height: 1.4;
	font-size: 20pt;
	font-weight: 300;
	color: var(--black);
}
a { color: var(--gray); }
header {
	background: url('../images/modeagentur-header2.jpg') no-repeat center center;
	background-size: cover;         /* Bild skaliert, um den Bereich auszufüllen */
	height: 100vh;                  /* Höhe: gesamte Höhe des Browserfensters */
	display: flex;                  /* So kann der Inhalt vertikal zentriert werden */
	flex-direction: column;
	justify-content: center;        /* Vertikale Zentrierung des Inhalts */
	align-items: center;            /* Horizontale Zentrierung des Inhalts */
	color: #fff;                    /* Textfarbe weiß, falls nötig */
	text-align: center;             /* Textzentrierung */
}
ul.navbar, footer ul { list-style: none; }
ul.navbar a { text-decoration: none; }
footer li { display: inline-block; margin: .5em 1em; }
footer a { color: #fff; font-size: .7em;  }
footer { padding-top: 1em;  }
h1, h2, h3, h4, h5 {
	font-weight: 400;
}
h1 { font-size: 2.5em; font-weight: 600; }
h2 { font-size: 1.5em; color: #ba853f; }
header h2 { color: #fff; }
.card {
	border: none;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	transition: transform 0.2s;
	margin: 1em 1em;
	padding-bottom: 1em;
	height: 100%;
}
.card-group3 .col-12 { margin-bottom: 2em; }
.card-group3 .card {
	margin: 1em 0;
	padding-bottom: 0;
}
.card-text { font-size: .9em; }
.bg-light {
	background-color: rgb(245 245 245) !important;
}
.bg-dark { background: var(--black); }
.bg-weiss { background: #fff; }
.alert { font-size: .8em; }
.alert.hide { display: none; }
.card .bg-dark,
.card .bg-weiss 
	{ height: 260px; overflow: hidden; display: flex; align-items: center; padding: 1em; margin-bottom: 1em; }
.card .bg-weiss.small 
	{ height: 130px; margin-bottom: 1em; }
.card-group2 .card {
	padding-top: 1em;
}
.card:hover {
	transform: scale(1.05);
}
.card-group2,
.card-group3 {
	justify-content: center;
}
.card-group3 h4,
.card-group2 h4 {
	display: block; height: 160px; margin-top: 1em; color: #ba853f
}
.card-group3 h4 { height: auto; }
.card-group3 h3 span { color: #ba853f; font-weight: 500; }
.card-group3 h3 { margin-bottom: 1em; }
.btn { background: #fff; color: #444; border: solid 1px #ccc; padding: 12px 20px; }
.btn:hover { background: var(--black); color: #fff; border: solid 1px var(--black); }
.btn-info {
	background: #ba853f; color: #fff; text-transform: uppercase;
}
footer {
	background: #222;
	color: #aaa;
	padding-bottom: 2em !important;
}

footer p {
	margin: 0;
	font-size: 0.9rem;
}
.fa { color: #ba853f; margin-right: 10px; }
.btn-danger { color: #ba853f !important; border: solid 1px #ba853f; }
.fashionlogo { max-height: 90px; max-width: 80%; }
.header { background: #ba853f; color: #fff; padding: 2em;
	background: url('../images/modeagentur-header3.jpg') no-repeat center center;
	background-size: cover;         /* Bild skaliert, um den Bereich auszufüllen */
 }
.text-right { text-align: right; }
h3 a { text-decoration: none; color: #ba853f; }
/* checkbox-rect */
.checkbox-rect input[type="checkbox"] {
  display: none;
}
.checkbox-rect input[type="checkbox"] + label {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 20px;
  line-height: 18px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.checkbox-rect input[type="checkbox"]:hover + label:hover {
  /* color: rgb(23, 86, 228); */
}
.checkbox-rect input[type="checkbox"]:hover + label:before {
  background: #999;
  /* box-shadow: inset 0px 0px 0px 1px #999; */
}
.checkbox-rect input[type="checkbox"] + label:last-child {
  margin-bottom: 0;
}
.checkbox-rect input[type="checkbox"] + label:before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  /* border: none; */
  border-radius: 0;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-transition: all 0.2s, background 0.2s ease-in-out;
  transition: all 0.2s, background 0.2s ease-in-out;
  background: #ddd;
}
.checkbox-rect input[type="checkbox"]:checked + label:before {
  width: 20px;
  height: 20px;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  background: #ba853f;
}
/* checkbox-rect end */

.form-control { border-radius: 0; padding: .75em; }
.form-group { margin: 0 0 .3em; }
label.lb, .pflicht { font-size: .6em; }

/* .sendform { float: right; } */

.breadcrumb-item.Informationen,
.breadcrumb-item.HI-Systems 
	{ display: none; }
	

.lds-ellipsis {
	display: none;
	position: relative;
	width: 80px;
	height: 33px;
}
.lds-ellipsis.show {
	display: inline-block;
}
.lds-ellipsis div {
	position: absolute;
	top: 33px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #ba853f;
	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;
}
.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);
	}
}

#loader {
	background-image: url("../images/logo.png");
	background-size: 80% auto;
	background-repeat: no-repeat;
	background-position: center 50%;
	background-color:#fff;
	border-radius: 50rem;
	box-shadow: 0px 1px 20px 0px rgba(112, 112, 112, 0.75);
	position: fixed;
	z-index: 99993;
	width: 80px;
	height: 80px;
	line-height: 80px;
	left: 50% !important;
	top: 50% !important;
	margin: -40px 0 0 -40px;
	vertical-align: top;
}
#loader .spinner-border {
	vertical-align: top;
	width: 100%;
	height: 100%;
	margin-top: 0;
	color:var(--color-primary,#999);
	border-width: 2px;
	animation-duration: 1s !important;
}

section { padding: 3em; }

@media (max-width: 600px) {
	body { font-size: 16px; }
	section { padding: 1em 0; }
	label.lb, .pflicht { font-size: .8em; }
	.kontakt { padding: 3em 15px; background: #fff; }
	.sendform { margin-bottom: 2em; }
}