/* roboto-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/roboto-v30-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/roboto-v30-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/roboto-v30-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/roboto-v30-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}


.yform {
width:100%;
height:auto;
padding:7px 0 15px 0;
margin:10px 0px 80px 0px;
display:block;
line-height:1.4em;
background-color:#fefefe;
min-height:370px;

position:relative;
z-index:10;
font-size:14px;
margin:0 auto;
}

.yform .radio {
width:20%;
display:inline-block;
position:relative;
}
.formcheckbox input {
width:30px !important;
display:inline-block;

}

.formcaptcha img {
width:200px !important;
height:auto !important;
position:relative;
}

.yform label {
width:100%;
display:block;
height:auto;
position:relative;
}

.yform div.form-group,
.yform div.yform-element,
.yform div.form-captcha  {
padding:5px 0 20px 0;
position:relative;
}
div.input-group span.input-group-addon {
margin-bottom:20px;
position:relative;
display:block;
}
.yform .form-group  input.form-control {
width:94%;
border:1px solid #999;
padding:1px 3%;
font-size:16px;
height:40px;
font-weight:normal;
position:relative;
display:block;
border-radius:0;

outline:0;
-webkit-appearance: none;
   -moz-appearance:    none;
   appearance:         none;
}

.radio input {
width:30px;
position:relative;
}

button, input.btn-primary {
width:100%;
height:auto;
color:#fff;
background-color:#2c67ac;
display:block;

border:1px solid #2c67ac;
padding:14px 5% 15px 5%;
border-radius:0px;
font-size: 18px;

text-decoration: none;

font-family:roboto, sans-serif;
margin-top:22px;
-webkit-appearance: none;
   -moz-appearance:    none;
   appearance:         none;
   position:relative;
font-weight: bold;
letter-spacing:1px;
}
.button {
width:90%;
height:auto;
color:#fff;
background-color:#a03042;
display:block;

border:1px solid #a03042;
padding:14px 5% 10px 5%;
border-radius:0px;
font-size: 18px;
font-weight: bold;
text-decoration: none;
letter-spacing: 0.1em;
margin-top:22px;
-webkit-appearance: none;
   -moz-appearance:    none;
   appearance:         none;
   position:relative;
       margin:0 auto;
}
.yform textarea {
border:1px solid #999;
width:96%;

padding:2%;
height:100px;
font-size:16px;
    outline:0;
    border-radius:0;
    -webkit-appearance: none;
   -moz-appearance:    none;
   appearance:         none;
}

.yform .formtextarea label.textarea {
width:auto;
display:block;
-webkit-appearance: none;
   -moz-appearance:    none;
   appearance:         none;
}

select {
-webkit-appearance: none;
   -moz-appearance:    none;
   appearance:         none;

   width:100%;
height:auto;
color:#000;
background-color:#fff;
display:block;
font-weight: 400;
border:1px solid #000000;
padding:12px 5% 10px 5%;
border-radius:0px;
font-size: 16px;
font-weight: bold;
text-decoration: none;
font-weight:200;
letter-spacing: 0.1em;
margin-top:0px;
margin:0;
outline:0;
}

iframe {
border:0;
}

form.nlform {
width:50%;
height:auto;
position:relative;
margin:0 auto;
}
form.nlform p {
margin:10px 0;
}

.nlformspec p,
.nlformspec h2  {
text-align:center;
}



@media all and (max-width:800px) {
.yform {
width:100%;
margin:0 auto;
}

form.nlform {
width:90%;
height:auto;
position:relative;
margin:0 auto;
}

form.nlform p {
margin:10px 0;
}

.nlformspec p,
.nlformspec h2  {
text-align:center;
}
}

/* ==========================================================
   Formulare im Dark Mode (YForm, XForm, Newsletter)
   ========================================================== */
.yform, .xform {
	background-color:#1e1d1c;
	color:#e2ded9;
	font-size:16px;
	padding:24px;
	box-sizing:border-box;
}
.yform label, .xform label, .formation label, form.nl-form label {
	color:#e2ded9;
	font-size:15px;
	margin-bottom:6px;
}
.yform .form-group input.form-control,
.yform input[type="text"], .yform input[type="email"], .yform input[type="tel"], .yform input[type="number"], .yform input[type="date"],
.yform textarea, .yform select,
.xform input, .xform textarea,
.formation input, .nl-form .formation input,
select {
	background-color:#2a2827;
	color:#f5f2ee;
	border:1px solid #4a4744;
	border-radius:0;
	font-weight:400;
	letter-spacing:.02em;
	transition:border-color .15s, box-shadow .15s;
}
.yform .form-group input.form-control:focus, .yform textarea:focus, .yform select:focus,
.xform input:focus, .xform textarea:focus, .formation input:focus, select:focus {
	outline:none;
	border-color:#8b63ff;
	box-shadow:0 0 0 3px rgba(139,99,255,.35);
}
.yform ::placeholder, .xform ::placeholder, .formation ::placeholder { color:#8f8a85; opacity:1; }
select {
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23cbb8ff' stroke-width='2'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 14px center;
	padding-right:40px;
}
/* Checkboxen & Radios in Markenfarbe */
.yform input[type="checkbox"], .yform input[type="radio"],
.formcheckbox input, .radio input { accent-color:#8b63ff; width:20px; height:20px; }
.formcheckbox label, .yform .checkbox label { color:#cfcac4; }
/* Pflichtfeld- & Fehlermeldungen */
.yform .has-error input, .yform .has-error textarea, .yform .has-error select { border-color:#ff6b6b; }
.yform .help-block, .yform .alert-danger, .yform .text-danger, .xform .form_warning { color:#ff8a8a; }
.yform .alert-danger { background:rgba(255,107,107,.08); border:1px solid rgba(255,107,107,.4); padding:12px 16px; }
.yform .alert-success { background:rgba(139,99,255,.12); border:1px solid #8b63ff; color:#e2ded9; padding:12px 16px; }
/* Captcha-Bild etwas abgesetzt */
.formcaptcha img, .form-captcha img { background:#ffffff; padding:4px; }
/* Buttons in Markenfarbe */
button, input.btn-primary, .button {
	background-color:#5b3fc4;
	border:1px solid #5b3fc4;
	color:#ffffff;
	font-weight:500;
	letter-spacing:.04em;
	min-height:52px;
	transition:background-color .15s;
}
button:hover, input.btn-primary:hover, .button:hover,
button:focus-visible, input.btn-primary:focus-visible, .button:focus-visible {
	background-color:#6d52d6;
	border-color:#6d52d6;
	outline:none;
	box-shadow:0 0 0 3px rgba(139,99,255,.35);
}
/* Menü-Button nicht wie Formular-Button einfärben */
.menuButton button, .menuButton button:hover, .menuButton button:focus-visible {
	background-color:transparent;
	border:0;
	box-shadow:none;
	min-height:0;
}
@media all and (max-width:800px) {
	.yform, .xform { padding:18px 16px; }
}

/* ==========================================================
   Formulare im HELLEN Modus (Betriebssystem/Browser auf „Hell“)
   ========================================================== */
@media (prefers-color-scheme: light) {
	.yform, .xform { background-color:#ffffff; color:#2a2826; box-shadow:0 0 0 1px #e0dbd5; }
	.yform label, .xform label, .formation label, form.nl-form label { color:#2a2826; }
	.yform .form-group input.form-control,
	.yform input[type="text"], .yform input[type="email"], .yform input[type="tel"], .yform input[type="number"], .yform input[type="date"],
	.yform textarea, .yform select,
	.xform input, .xform textarea,
	.formation input, .nl-form .formation input,
	select {
		background-color:#ffffff;
		color:#1b1918;
		border-color:#bdb6ae;
	}
	.yform ::placeholder, .xform ::placeholder, .formation ::placeholder { color:#8a847e; }
	select {
		background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235b3fc4' stroke-width='2'/%3E%3C/svg%3E");
	}
	.formcheckbox label, .yform .checkbox label { color:#3b3835; }
	.yform .has-error input, .yform .has-error textarea, .yform .has-error select { border-color:#d93030; }
	.yform .help-block, .yform .alert-danger, .yform .text-danger, .xform .form_warning { color:#b42318; }
	.yform .alert-danger { background:#fdeeee; border-color:#f2b8b5; }
	.yform .alert-success { background:#f1ecff; border-color:#8b63ff; color:#2a2826; }
	.formcaptcha img, .form-captcha img { box-shadow:0 0 0 1px #d9d3cc; }
}