@font-face{font-family:"barghorn";font-style:normal;font-weight:normal;font-display:auto;src:url(/webfonts/barghorn.woff2) format("woff2"),url(/webfonts/barghorn.woff) format("woff"),url(/webfonts/barghorn.ttf) format("truetype");font-display:swap;}
@font-face{font-family:"content";font-style:normal;font-weight:normal;font-display:auto;src:url(/webfonts/SourceSansPro-Regular.woff2) format("woff2"),url(/webfonts/SourceSansPro-Regular.woff) format("woff"),url(/webfonts/SourceSansPro-Regular.ttf) format("truetype");font-display:swap;}
@font-face{font-family:"headline";font-style:normal;font-weight:normal;font-display:auto;src:url(/webfonts/3A4C1D_0_0.woff2) format("woff2"),url(/webfonts/3A4C1D_0_0.woff) format("woff"),url(/webfonts/3A4C1D_0_0.ttf) format("truetype");font-display:swap;}
body {
  	background-color: #fff; #435165;
	margin:0;
	padding:0;
	margin: 0 auto 0 auto; padding: 0;
	text-align: center;
	font-size: 100.01%;
	font-family:"content";
}
body, table, td, th, a, li, p, h1, h2 { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
h1,h2,h3,h4 {font-family:"headline";color:#b5113d;font-weight:normal;width:100%;clear:left;}
h4 {font-family:"content";color:#b5113d;font-weight:bold;font-size:18px;padding:0;margin:0;}
h4 ~ p {margin:0;}
p,label,td,th,li,input,select {font-family:"content";font-size:18px;color:#000;}
.icon {font-family:barghorn;}
a {text-decoration:none;}
.icon-barghorn:before{content:"\e001";}
.icon-logo:before{content:"\e002";}
.icon-regler:before{content:"\e003";}
.icon-kollegen:before{content:"\e010";}
.icon-ich:before{content:"\e011";}
.icon-firma:before{content:"\e012";}
.icon-gruppe:before{content:"\e013";}
.icon-ort:before{content:"\e014";}
.icon-navi:before{content:"\e018";}
.icon-nonavi:before{content:"\e019";}
.icon-zurueck:before{content:"\e020";}
.icon-vor:before{content:"\e021";}
.icon-login:before{content:"\e022";}
.icon-schloss:before{content:"\e023";}
.icon-logout:before{content:"\e024";}
.icon-pdf:before{content:"\e025";}
.icon-csv:before{content:"\e026";}
a, a:visited {color:#000;}
#rahmen{width:100%; margin:0; padding:0; text-align:left; float:left; max-width:100%;}
#seitenkopf {width:100%; background-color:#002851; color:#fff;position:fixed;z-index:100; float:left;margin: 0px 0 10px 0;width:100%; height:45px; }
#seitenkopf span {padding:10px 1rem 10px 1rem;position:relative;font-size:1.5rem;}
#seitenkopf span span {padding:10px 1rem 10px 1rem;}
#seitenkopf a {color:#fff; text-decoration:none;}

.zwei {font-size:1.5em;}
.violett {color:#b5113d;}
.grau {color:#c6c6c6;}
.links {float:left;}
.rechts {float:right;}
.bghellgrau {background-color:#e6e6e6;}
.bgweiss {background-color:#fff;}
.bggelbgruen {background-color:#ADFF2F;}
.bggruen {background-color:#29e65f;}
.bggelb {background-color:#d9ff2f;}
.bgextrem {background-color:#e5b3b3;}
.bgmittel {background-color:#97aff5;}



#content {color:#000;padding: 50px 1em 10px 1em;margin: 0 auto;max-width:1200px;background:#fff;}
table {border-collapse: collapse; border-spacing:0;}
th, td { padding:6px;}
form label {min-width:200px;float:left;border-bottom: 1px solid #eee;line-height:150%;clear:left;}
#content a, #content a:visited {color:#b5113d;}
#content a:hover {color:#002851;}
#content ul {position:relative;float:left;clear:left;width:100%;margin:0px 0 20px 0;padding:0;list-style-type: none;}
#content li {margin:0px 0 20px 0;}

#navigation {position:relative;float:left;clear:left;top:45px;margin-top:0px;left:0px;width:100%;background-color:#b5113d;font-family:"headline";color:#f00;}
#navigation ul {position:relative;float:left;clear:left;width:100%;margin:0;padding:0;}
#navigation ul li {position:relative;float:left;width:100%;line-height:2.5em;border-bottom:1px solid #fff;}
#navigation ul li ul li {position:relative;float:left;width:100%;line-height:2.5em;}
#navigation > ul li a {font-size:1.5em; font-weight:normal; color: #fff; padding-left:1em;text-decoration:none;}
#navigation > ul li ul li a {font-size:1em;}
#navigation {height:0;width:0;overflow:hidden;opacity:0;transition:opacity 0.9s;transition-timing-function: ease-out; } 
.menu-ein { text-decoration:none; float:right; position:relative; top:0px; right:10px; padding:0; color:#fff; }
.menu-aus { text-decoration:none; float:right; position:relative; top:0px; right:10px; padding:0; color:#fff; display:none; }
#rahmen:target #navigation { width:100%; height:auto; opacity:1; margin-bottom:20px; }
#rahmen:target .menu-aus { display: inline; }
#rahmen:target .menu-ein { display: none; }

button, .button {background-color: #eee; color:#000; border-radius:5px; padding:5px 15px; border:0;font-family:"headline";font-size:1.1em;cursor:pointer;}
button:hover, .button:hover{background-color: #b5113d; color:#fff !important;}

.button {margin-right:48px;}

summary {background-color: #eee; color:#000; border-radius:5px; padding:5px; border:0;font-family:"headline";font-size:1.1em;cursor:pointer; width:auto;}
summary:hover {background-color: #b5113d; color:#fff;}

hr { float:left; width:100%; clear:all; margin: 1rem 0 1rem 0; border: 2px solid #57698b;  border-radius: 4px;}

.login {
  	max-width: 400px;
	width:100%;
  	background-color: #ffffff;
  	box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.3);
  	margin: 100px auto;
	clear:left;
	
}
.login h1 {
  	text-align: center;
  	font-size: 24px;
  	padding: 20px 0 20px 0;
  	border-bottom: 1px solid #dee0e4;
}
.login form {
  	display: flex;
  	flex-wrap: wrap;
  	justify-content: center;
  	padding-top: 20px;
}
.login form label {
  	display: flex;
  	justify-content: center;
  	align-items: center;
  	width: 50px;
  	height: 50px;
  	background-color: #3274d6;
  	background-color: #002851;
  	color: #ffffff;
	min-width:50px;
}
.login form input[type="password"], .login form input[type="text"], .login form input[type="date"], .login form input[type="email"] {
  	width: 70%;
  	height: 50px;
  	border: 1px solid #dee0e4;
  	margin-bottom: 20px;
  	padding: 0 15px;
}
.login form input[type="submit"] {
  	width: 100%;
  	padding: 15px;
 	margin-top: 20px;
  	background-color: #3274d6;
  	background-color: #002851;
  	border: 0;
  	cursor: pointer;
  	font-weight: bold;
  	color: #ffffff;
  	transition: background-color 0.2s;
}
.login form input[type="submit"]:hover {
	background-color: #2868c7;
	background-color: #435165;
  	transition: background-color 0.2s;
}
#fragebogenkopf {width:100%;float:left;clear:left;border-bottom:8px solid #eee;border-radius: 4px;}
#fragebogenkopf p {width:100%;float:left;margin: 12px 0 -12px 0px;font-weight:bold;}
#fragebogenkopf span {float:right;margin: 5px 0 -5px 10px; font-size:1.5rem;}
#fragebogenfortschritt {clear:left;float:left;margin:0px 0 20px 0;border-top:4px solid #57698b;border-radius: 4px; width:100%;}
#fragebogen h4, #fragebogen p {float:left;}
.fragebogentabelle {width:100%;float:left;clear:left;margin: 1rem 0 1rem 0;}
.fragebogentabelle th,  .fragebogentabelle td {font-weight:normal;font-size:1rem;  min-width: 40px; max-width: 40px;   position: relative;text-align:center;padding: 8px 0 8px 0;}
.fragebogentabelle td:nth-child(1) {min-width:80px;}
.fragebogentabelle th span {text-align:center;width:100%;position:relative;}
.fragebogentabelle tr.oben td {border-bottom:8px solid #eee;padding-top:21px;text-align:center;}
.fragebogentabelle2 tr.oben td span {position:absolute;margin-top: -14px; padding-left:0px; font-size:1.9rem;}
.fragebogentabelle tr.oben td {position:relative;}
.fragebogentabelle tr.oben td a {padding:0; width:100px;}
.fragebogentabelle tr.oben td a span {position:absolute; margin: -14px 0 0 0; left:-10px; font-size:1.9rem;}
.fragebogentabelle tr.unten td {border-top:0px solid #eee;padding-left:8px;}
.fragebogentabelle tr.oben td.foto {border-bottom:0;width:70px;}
.fragebogentabelle td {padding:0; text-align:center;}
.fragebogentabelle tr.oben td:first-child {padding-bottom:4px;padding-top:0;}
.fragebogentabelle tr.unten td:first-child {text-align:left;padding-bottom:4px;padding-top:0px;padding-left:0px;}
.fragebogentabelle td:nth-child(8), .fragebogentabelle tr.unten td:nth-child(2) {border-left:4px solid #eee;}
#content .fragebogentabelle td a .icon:before{content:" ";}


#content .fragebogentabelle td a, #content .fragebogentabelle td a:visited {color:#c6c6c6;position:relative;padding:12px;}
#content .fragebogentabelle td a.grau {color:#c6c6c6;}
#content .fragebogentabelle td a.violett {color:#b5113d;}
#content .fragebogentabelle td a:hover {color:#57698b;}
#content .fragen {float:left; clear:left; padding:0;margin:0 0 2rem 0;}
#content .fragen span { float:left; display: block; height:1.5rem;padding:2px 2px 2px 0px;margin:3px 3px 3px 0;}
#content .fragen a { float:left; display: block; width:1.5rem; height:1.5rem;background-color: #ccc; border:0px solid #ccc; border-radius:3px;padding:2px;text-align:center;margin:3px;text-decoration:none;}
#content .fragen a.aktiv {background-color: #b5113d; color:#fff;}
#content .fragen a.beantwortet {background-color: #006E39; color:#fff;}
#content .fragen a.abschicken {background-color: #eee; color:#aaa;width:auto;cursor:not-allowed;}
#content #fragebogen .rechts {float:right; clear:right;margin:0;padding-top:0;}
#fragebogen button {background-color: #eee; color:#000; border-radius:5px; padding:5px; border:0;font-family:"headline";font-size:1.0em;cursor:pointer;}
#fragebogen button:hover {background-color: #b5113d; color:#fff;}
#fragebogen p {width:100%;}
#fehler {position:fixed; top:0; left:0; width:100%; height:100%; z-index:100; padding:0; background-color: #b5113d; color:#fff; margin:0; display:none;}
#fehler p {margin: 15% 20% 20% 20%; color:#fff; font-family:Headline;line-height:300%;}
#fehler p a {color:#fff; border:1px solid #fff; padding:8px 40px;;}
img.mitarbeiter {width:70px;height:70px;clip-path: circle(34px at 35px 35px);}
img.mitarbeiterklein {width:30px;height:30px;clip-path: circle(14px at 15px 15px);}
img.mitarbeitersehrklein {width:30px;height:30px;clip-path: circle(14px at 15px 15px);vertical-align:middle;}
.umbruch{clear:left;}
input[type="text"], input[type="email"] {width:500px;}
input[type="number"] {width:80px;}
textarea{width:500px;height:150px;font-family:"Content";font-size:1rem;}
textarea.gross{width:100%;height:250px;}
.kleiner {font-size:0.7em;}



.videowrapper {
    float: none;
    clear: both;
    width: 100%;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
}
.videowrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.kommentar {
	clear:left;float:left;width:100%;
}
.kommentar textarea {
	margin: 0px 0;
}
.kommentar button { margin: 8px 0 24px 0; width:100%;}


@media only screen and (max-width: 767px) {
	#content .fragebogentabelle td a:hover {color:#c6c6c6;}
	textarea {max-width:100%;}
}
@media only screen and (max-width: 414px) {
	.fragebogentabelle tr.oben td a span {margin-top: -13px; left:-15px;font-size:1.5rem;}
}

@media only screen and (max-width: 374px) {
	#seitenkopf span {padding: 10px 10px 10px 10px;}
	#seitenkopf span span {padding: 10px 10px 10px 10px;}
}




/*
@media only screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 414px) { 
	.fragebogentabelle tr.oben td a span {margin-top: -13px; left:8px;font-size:1.8rem;}
}
*/
@media not all and (min-resolution:.001dpcm) { @media only screen and (max-width: 768px) {
		.fragebogentabelle tr.oben td a span {margin-top: -13px; left:8px;font-size:1.5rem;}
	}
}	

	
table details {float:left;}
table summary {width:140px; float:left; margin-bottom:24px;}
table .button {font-size:0.975em;}
.auswertungsfeld {width:100%;min-width:60vh; margin: 24px 0;vertical-align:top;clear:left;}
#termine summary {width:120px; float:left;margin-bottom:24px;}
#termine {margin-bottom:60px; position:relative;}
#termine .auswertungsfeld { min-width:100%;}
