@font-face{
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: local('Open Sans Regular'), local('OpenSans-Regular'), url('../fonts/open_sans/open_sans.woff2') format('woff2'), url('../fonts/open_sans/open_sans.woff') format('woff');
}

@font-face{
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	src: local('Open Sans Italic'), local('OpenSans-Italic'), url('../fonts/open_sans/open_sans_italic.woff2') format('woff2'), url('../fonts/open_sans/open_sans_italic.woff') format('woff');
}

@font-face{
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../fonts/open_sans/open_sans_700.woff2') format('woff2'), url('../fonts/open_sans/open_sans_700.woff') format('woff');
}

@font-face{
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 700;
	src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'), url('../fonts/open_sans/open_sans_700italic.woff2') format('woff2'), url('../fonts/open_sans/open_sans_700italic.woff') format('woff');
}


@font-face{
	font-family: 'Iceland';
	font-style: normal;
	font-weight: 400;
	src: local('Iceland Regular'), local('Iceland-Regular'), url('../fonts/iceland/Iceland-Regular.woff2') format('woff2'), url('../fonts/iceland/Iceland-Regular.woff') format('woff');
}



/* --- GENERAL --- */

html, body{
	background-color: #f2f2f2;
	font-family: 'Open Sans', sans-serif;
	height: 100%;
	color: #777;
}

body{
	padding-top: 63px;
}

a{
	color: #355a81;
	transition: color 0.3s ease;
}

a:hover{
	text-decoration: none;
	color: #2c3758;
}

input[type="text"],
input[type="password"],
input[type="email"],
select{
	background: #f2f2f2;
	border-radius: 6px;
	padding: 8px 12px;
	border: 0px;
	width: 100%;
	max-width: 400px;
	font-size: 16px;
	line-height: 22px;
	color: #333;
}

.checkboxwrap{
	display: inline-block;
	position: relative;
	padding-left: 35px;
	margin-bottom: 0px;
	cursor: pointer;
	font-size: 18px;
	line-height: 24px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	transition: color 0.3s ease;
}

.checkboxwrap:hover{
	color: #333;
}

.checkboxwrap input{
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

.checkboxwrap .checkmark{
	position: absolute;
	top: 2px;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: #f2f2f2;
	border-radius: 20px;
	border: solid 1px #ccc;
	transition: background-color 0.3s ease;
}

.checkboxwrap:hover input ~ .checkmark{
	background-color: #ccc;
}

.checkboxwrap .checkmark:after{
	content: '';
	position: absolute;
	display: none;
}

.checkboxwrap input:checked ~ .checkmark:after{
	display: block;
}

.checkboxwrap .checkmark:after{
	left: 9px;
	top: -2px;
	width: 10px;
	height: 18px;
	border-right: 5px solid #355a81;
	border-bottom: 5px solid #355a81;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.checkboxwrap input.invalid ~ .checkmark{
	box-shadow: 0px 0px 5px 0px rgba(255, 0, 0, 0.75);
}

/* RADIO CHECKBOX */

.radiowrap{
	display: block;
	position: relative;
	padding-left: 35px;
	margin-bottom: 12px;
	cursor: pointer;
	font-size: 22px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.radiowrap input{
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0 !important;
	width: 0 !important;
	left: 0px;
	top: 0px;
}

.radiowrap .checkmark{
	position: absolute;
	top: -2px;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: #fff;
	border-radius: 5px;
	border: 1px solid #bbb;
}

.radiowrap:hover input ~ .checkmark{
	background-color: #f8f8f8;
}


.radiowrap .checkmark:after{
	content: "";
	position: absolute;
	display: none;
}

.radiowrap input:checked ~ .checkmark:after{
	display: block;
}


.radiowrap .checkmark:after{
	left: 9px;
	top: -2px;
	width: 7px;
	height: 16px;
	border: solid #355a81;
	border-width: 0 4px 4px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}


.radiowrap .checkmark{
	border-radius: 20px;
}

.radiowrap .checkmark:after{
	width: 10px;
	height: 10px;
	border: 1px solid #355a81;
	background-color: #355a81;
	border-radius: 20px;
	left: calc(50% - 5px);
	top: calc(50% - 5px);
}

.radiowrap .title{
	font-size: 14px;
	line-height: 18px;
	font-family: Muli, Verdana, Arial, Helvetica, sans-serif;
	margin-bottom: 7px;
	display: block;
	font-weight: bold;
}

.radiowrap .subtitle{
	font-size: 10px;
	line-height: 14px;
	font-family: Muli, Verdana, Arial, Helvetica, sans-serif;
	display: block;
}

.zahlungsmethode img{
	margin-bottom: 16px;
}

.zahlungsmethode .title{
	font-family: Muli, Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 18px;
	font-weight: bold;
	margin-bottom: 7px;
}

.zahlungsmethode .subtitle{
	font-family: Muli, Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 16px;
}

/* RADIO CHECKBOX END */



p{
	font-size: 16px;
	line-height: 22px;
	margin-bottom: 20px;
}


div.slide-content p{
	margin-bottom: 10px;
}

h1, .h1{
	font-size: 26px;
	line-height: 32px;
	color: #355a81;
	font-weight: bold;
}

h2, .h2{
	font-size: 24px;
	line-height: 30px;
	color: #777;
	font-weight: bold;
}

h3, .h3{
	font-size: 22px;
	line-height: 28px;
	color: #355a81;
	font-weight: normal;
}

h4, .h4{
	font-size: 18px;
	line-height: 24px;
	color: #355a81;
	font-weight: bold;
}

h5, .h5{
	font-size: 16px;
	line-height: 22px;
	color: #777;
	font-weight: bold;
}

h6, .h6{
	font-size: 14px;
	line-height: 20px;
	color: #355a81;
	font-weight: normal;
}

table.table-default th,
table.table-default td{
	padding: 4px 8px;
}

table .nowrap{
	white-space: nowrap;
}


/*BITTE GENAUER NOCH MAL ÜBERPRÜFEN */
/*table:not(.slide-content table){
	border: 1px solid #dee2e6;
}*/
/*################################# */

table.table-relation th{
	background-color: #ffe58f;
	font-weight: bold;
}

table.table-relation.flieder th{
	background-color: #f3c6ff;
	font-weight: bold;
}

table.table-relation th,
table.table-relation td{
	padding: 6px 12px;
	border: 1px solid #dee2e6;
}

table.table-relation.flieder th,
table.table-relation.flieder td{
	padding: 6px 12px;
	border: 1px solid #e2d9e4;
}


table.table-relation th p,
table.table-relation td p,
table.table-relation th ol,
table.table-relation td ol,
table.table-relation th ul,
table.table-relation td ul{
	font-size:.75em;
	line-height: 1.2em;
}

table.table-relation tbody tr:nth-of-type(2n+1){
	background-color: rgba(0,0,0,.05);
}

table.table-relation.flieder tbody tr:nth-of-type(2n+1){
	background-color: #FEFAFF; /*rgb(250, 227, 255);*/
}


ol.gesetz {
	counter-reset: item;
	margin-left: 0;
	padding-left: 0;
}

ol.gesetz li {
	display: block;
	margin-bottom: .5em;
	margin-left: 2em;
}

ol.gesetz li::before {
	display: inline-block;
	content: "(" counter(item) ") ";
	counter-increment: item;
	width: 2em;
	margin-left: -2em;
}
ol[type="a"] {
	counter-reset: item;
	margin-left: 0;
	padding-left: 0;
}

ol[type="a"] li {
	display: block;
	margin-bottom: .5em;
	margin-left: 2em;
}

ol[type="a"] li::before {
	display: inline-block;
	content: counter(item, lower-alpha) ".) ";
	counter-increment: item;
	width: 2em;
	margin-left: -2em;
}





.box{
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	border-radius: 10px;
	background: #fff;
	overflow: hidden;
}

.box.withdropdown{
	overflow: unset;
}


.btn:not(.bsbtn,.btn-expand){
	background: #355a81;
	background: -moz-linear-gradient(left, #355a81 0%, #0a2541 100%);
	background: -webkit-linear-gradient(left, #355a81 0%, #0a2541 100%);
	background: linear-gradient(to right, #355a81 0%, #0a2541 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#355a81', endColorstr='#0a2541', GradientType=1);
	color: #fff;
	border: 0px;
	border-radius: 5px;
	white-space: nowrap;
	cursor: pointer;
	font-size: 14px;
	line-height: 20px;
	padding: 6px 12px;
	margin-top:5px;
}


.btn.bsbtn.btn-toggle.active{
	border:solid 1px #355a81;
	background-color:#0e90d2;
	color:#fff;
}
.btn.bsbtn.btn-toggle.inactive{
	border:solid 1px #355a81;
	background-color:#fff;
	color:#0e90d2;
}
.btn.bsbtn.btn-toggle.inactive:hover{
	border:solid 1px #355a81;
	background-color:#0e90d2;
	color:#fff;
}
#live-ticket .btn.bsbtn.btn-toggle{
	width:100%;
}

.nowrap{
	white-space: nowrap!important;
}

.btn:hover{
	color: #fff;
}

.btn.btn-submit{
	font-weight: bold;
	font-size: 16px;
	line-height: 22px;
	display: inline-block;
	padding: 10px 40px;
}

.btn.disabled,
.btn:disabled{
	background: #e1e1e1 !important;
	color: #fff !important;
	cursor: default !important;
}

.btn.btncertificate, .btn.btnordercertificate, .btn.btncertificate_onlinepruefung, .btn.btnordercertificate_onlinepruefung{
	background: #009c22;
	background: -moz-linear-gradient(left, #009c22 0%, #002e0c 100%);
	background: -webkit-linear-gradient(left, #009c22 0%, #002e0c 100%);
	background: linear-gradient(to right, #009c22 0%, #002e0c 100%);
	margin-top: 5px;
}

.btn.btnpwacertificate, .btn.btnpwacertificate_err, .btn.btnpwacertificate_onlinepruefung, .btn.btnpwacertificate_onlinepruefung_err{
	margin-top: 5px;
}

.pwa-hinweiskasten{
	padding: 15px;
	background: #ffeaea;
}


.blinkerror{
	animation-name: blinkred;
	animation-duration: 0.4s;
	animation-iteration-count: 3;
}

.blinkerror-unlimited{
	animation-name: blinkred;
	animation-duration: 0.4s;
	animation-iteration-count: infinite;
}

.blink{
	animation-name:blink;
	animation-duration: 2s;
	animation-iteration-count: infinite;
}

@keyframes blink{
	0%, 50%{
		opacity:1;
	}
	50.01%, 100%{
		opacity:0.05;
	}
}

@-webkit-keyframes blink{
	0%, 50%{
		opacity:1;
	}
	50.01%, 100%{
		opacity:0.05;
	}
}



@keyframes blinkred{
	0%, 50%{
		color: rgba(203, 28, 28, 1);
	}
	50.01%, 100%{
		color: rgba(222, 222, 222, 1);
	}
}

@-webkit-keyframes blinkred{
	0%, 50%{
		color: rgba(203, 28, 28, 1);
	}
	50.01%, 100%{
		color: rgba(222, 222, 222, 1);
	}
}


.errorMsg,.errorMsgZFU{
	color: #eb0000;
	margin-right: 10px !important;
	margin-bottom:10px !important;
	display:block;
}

ul.menu{
	padding: 0px;
	margin: 0px;
}

ul.menu li{
	list-style: none;
}

ul.topmenu li{
	display: inline-block;
}


.progress-bar{
	background: #355a81;
	background: -moz-linear-gradient(left, #355a81 0%, #0a2541 100%);
	background: -webkit-linear-gradient(left, #355a81 0%, #0a2541 100%);
	background: linear-gradient(to right, #355a81 0%, #0a2541 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#355a81', endColorstr='#0a2541', GradientType=1);
}

.progress-bar.haslabel{
	text-align: right;
	padding-right: 5px;
}

.progress.one-third .progress-bar{
	background: #e74c3c;
	background: -moz-linear-gradient(left, #e74c3c 0%, #c0392b 100%);
	background: -webkit-linear-gradient(left, #e74c3c 0%, #c0392b 100%);
	background: linear-gradient(to right, #e74c3c 0%, #c0392b 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e74c3c', endColorstr='#c0392b', GradientType=1);
}

.progress.two-third .progress-bar{
	background: #f1c40f;
	background: -moz-linear-gradient(left, #f1c40f 0%, #f39c12 100%);
	background: -webkit-linear-gradient(left, #f1c40f 0%, #f39c12 100%);
	background: linear-gradient(to right, #f1c40f 0%, #f39c12 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1c40f', endColorstr='#f39c12', GradientType=1);
}

.progress.three-third .progress-bar{
	background: #2ecc71;
	background: -moz-linear-gradient(left, #2ecc71 0%, #27ae60 100%);
	background: -webkit-linear-gradient(left, #2ecc71 0%, #27ae60 100%);
	background: linear-gradient(to right, #2ecc71 0%, #27ae60 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2ecc71', endColorstr='#27ae60', GradientType=1);
}


/* --- LOGIN --- */

#login{
	max-width: 768px;
	margin: auto;
}

#login .intro-image{
	height: 100%;
	width: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

#login .rightside{
	padding: 30px 30px 40px 60px;
}

#login .logowrap{
	text-align: right;
	margin-bottom: 30px;
}

#login .logowrap img{
	width: 182px;
}

#login .headline{
	margin-bottom: 25px;
}

#login .headline span{
	color: #355a81;
	font-size: 22px;
	line-height: 28px;
	font-weight: bold;
}

#login .controlwrap label{
	font-size: 16px;
	line-height: 22px;
	margin-bottom: 6px;
}

#login .controlwrap input{
	width: 100%;
	max-width: 300px;
}

#login .controlwrap{
	margin-bottom: 15px;
}

#login .controlwrap.password{
	margin-bottom: 10px;
}

#login .info p{
	font-size: 12px;
	line-height: 18px;
}

#login .btnwrap{
	margin-top: 35px;
}

#login .note{
	margin-bottom: 20px;
}

#login .note p{
	font-size: 14px;
	line-height: 20px;
}

/* Copyright */

#copyright{
	margin-top: 15px;
}

#copyright p{
	text-align: center;
	font-size: 12px;
	line-height: 18px;
	color: #c7c7c7;
}


/* --- HEADER --- */

#header{
	background: #fff;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	padding: 10px 20px;
	display: flex;
	align-items: center;
	width: 100%;
	/*position: relative;*/
	position: fixed;
	top: 0px;
	z-index: 991;
	left: 0px;
	right: 0px;
}

#logo{
	margin-right: 50px;
}

#logo img{
	width: 120px;
}

#telefonnummer{
	margin-left: auto;
	margin-right: auto;
}

#telefonnummer br{
	display: none;
}

#livecoaches{
	margin-right: 50px;
}

.image-circle{
	background-color: #a0a0a0;
	color: #fff;
	border: solid 1px #fff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	min-width: 40px;
	min-height: 40px;
	max-width: 40px;
	max-height: 40px;
	padding: 1px;
}


#usermenu{
	margin-right: 40px;
}

#usermenu:last-child{
	margin-right: 0px;
}

#usermenu .menu > li > a,
#usermenu .menu > li > span{
	color: #777;
	font-size: 16px;
	line-height: 22px;
	position: relative;
	padding-left: 30px;
	transition: color 0.3s ease;
	cursor: pointer;
}

#usermenu .menu > li > a:hover,
#usermenu .menu > li > span:hover{
	color: #355a81;
}

#usermenu .menu > li > a i,
#usermenu .menu > li > span i{
	position: absolute;
	left: 0px;
	top: 3px;

}

#userprofile .inner{
	border-radius: 40px;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
}

#userprofile .inner img{
	width: 40px;
	height: 40px;
}

.grey-transparent{
	filter: opacity(.4) grayscale(100%);
	-webkit-filter: opacity(.4) grayscale(100%);
	margin-left: 40px;
}

.grey-transparent:nth-child(1){
}

.dropdown-menu{
	top: 48px;
	right: -30px;
	left: unset;
	color: #777;
	border-top-color: #fff;
	border-top-left-radius: 0px;
}

.dropdown-item{
	color: #777;
}

.dropdown-toggle::after{
	display: none;
}


/* --- SIDEBAR --- */

#sidebar{
	background: #fff;
	padding-top: 35px;
	padding-bottom: 35px;

}

#sidebar .navbar{
	padding: 0px;
	position: sticky;
	top: 100px;
	flex-flow:column;
}

@media (min-width: 1200px){
	#sidebar{
		max-width: 375px;
	}
}

#navbar-btn{
	font: inherit;
	overflow: visible;
	padding: 5px;
	cursor: pointer;
	transition-timing-function: linear;
	transition-duration: .15s;
	transition-property: opacity, filter;
	text-transform: none;
	color: inherit;
	border: 0;
	margin: 5px auto 0px auto;

	line-height: 0px;
}

#navbar-btn.collapsed:hover,
#navbar-btn:hover{
	opacity: .7
}

#navbar-btn .inner,
#navbar-btn .inner:after,
#navbar-btn .inner:before{
	background-color: #2d5075
}

#navbar-btn .togglerbox{
	position: relative;
	display: inline-block;
	width: 30px;
	height: 20px;
}

#navbar-btn .inner{
	top: 50%;
	display: block;
	margin-top: -2px;
	transition-timing-function: cubic-bezier(.55, .055, .675, .19);
	transition-duration: 75ms
}

#navbar-btn .inner,
#navbar-btn .inner:after,
#navbar-btn .inner:before{
	position: absolute;
	width: 30px;
	height: 3px;
	transition-timing-function: ease;
	transition-duration: .15s;
	transition-property: transform;
	border-radius: 4px;
}

#navbar-btn .inner:after,
#navbar-btn .inner:before{
	display: block;
	content: ""
}

#navbar-btn .inner:before{
	top: -8px;
	transition: top 75ms ease .12s, opacity 75ms ease
}

#navbar-btn .inner:after{
	bottom: -8px;
	transition: bottom 75ms ease .12s, transform 75ms cubic-bezier(.55, .055, .675, .19)
}

#navbar-btn:not(.collapsed) .inner{
	transition-delay: .12s;
	transition-timing-function: cubic-bezier(.215, .61, .355, 1);
	transform: rotate(45deg)
}

#navbar-btn:not(.collapsed) .inner:before{
	top: 0;
	transition: top 75ms ease, opacity 75ms ease .12s;
	opacity: 0
}

#navbar-btn:not(.collapsed) .inner:after{
	bottom: 0;
	transition: bottom 75ms ease, transform 75ms cubic-bezier(.215, .61, .355, 1) .12s;
	transform: rotate(-90deg)
}

/* Mainmenu */

#mainmenu{
	width: 100%;
	max-width: 375px;

}

#mainmenu .lv-0{
	width: 100%;
}

#mainmenu .lv-0 > li{
	text-align: center;
	padding: 7px 0px;
	border-right: 8px solid #fff;
}

#mainmenu .lv-0 > li.active{
	border-right: 8px solid #355a81;
}

#mainmenu .lv-0 > li > a{
	display: block;
	position: relative;
	font-size: 16px;
	line-height: 22px;
	color: #777;
	transition: color 0.3s ease;
	width: 100%;
	max-width: 275px;
	text-align: left;
	padding: 6px 20px 6px 50px;
	margin: 0 auto;
}

#mainmenu .lv-0 > li > a:hover{
	color: #355a81;
}

#mainmenu .lv-0 > li.active > a{
	color: #355a81;
	font-weight: bold;
}

#mainmenu .lv-0 > li > a i{
	position: absolute;
	left: 15px;
	top: 10px;
}


/* --- CONTENT --- */

#content{
	padding: 50px 80px;
}

#content .page-title{
	margin-bottom: 20px;
}

#content .page-title span{
	font-size: 22px;
	line-height: 28px;
	color: #777;
	font-weight: bold;
	white-space: pre;
}

/* Default Boxes */

#content .box{
	margin-bottom: 80px;
	/*min-height:218px;*/
}

.box.box-blank{
	min-height: 218px;
}

/* Box - Lehrgang-Intro */

.box.box-lehrgang-intro .inner{
	background: #fff;
	padding: 20px;
}

.box.box-lehrgang-intro .headline{
	margin-bottom: 14px;
}

.box.box-lehrgang-intro .headline span{
	font-size: 16px;
	line-height: 22px;
	font-weight: bold;
	color: #777;
}

.box.box-lehrgang-intro .completion-label{
	font-size: 12px;
	line-height: 18px;
	color: #777;
	margin-bottom: 8px;
	white-space: pre;
}

.box.box-lehrgang-intro .completion{
	width: 100%;
	margin-right: 30px;
}

.box.box-lehrgang-intro .progress{
	height: 25px;
	text-align: right;
	font-size: 14px;
	line-height: 14px;
	width: 100%;
	max-width: 250px;
}

.box.box-lehrgang-intro .footer{
	display: flex;
	align-items: flex-end;
}

.box.box-lehrgang-intro .footer .btnwrap{
	margin-left: auto;
}

.box.box-lehrgang-intro .footer .btn{
	font-size: 14px;
	line-height: 20px;
}

/* Lehrgang-Teaser*/

.box.box-lehrgang-teaser .inner{
	background: #fff;
	padding: 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.box.box-lehrgang-teaser .headline{
	margin-right: 20px;
}

.box.box-lehrgang-teaser .headline span{
	font-size: 16px;
	line-height: 22px;
	font-weight: bold;
	color: #777;
}

.box.box-lehrgang-teaser .btnwrap{
	margin-left: auto;
}

/* Vorwort */

.box.box-vorwort{
	position: relative;
}

.box.box-vorwort .inner{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 100px 20px 25px;
}

.box.box-vorwort .profilepic{
	margin-right: 50px;
}

.box.box-vorwort .profilepic .imgwrap{
	border-radius: 120px;
	width: 120px;
	overflow: hidden;
}

.box.box-vorwort .profilepic img{
	width: 120px;
}

.box.box-vorwort .message{
	/*margin-right: 80px;*/
}

.box.box-vorwort .message p{
	font-size: 14px;
	line-height: 22px;
}

.box.box-vorwort .voice-message .icon{
	text-align: center;
	padding: 0px 5px 20px 5px;
}

.box.box-vorwort .voice-message i{
	color: #355a81;
	font-size: 30px;
	line-height: 30px;
}

.box.box-vorwort .closer{
	position: absolute;
	right: 15px;
	top: 15px;
	color: #e4e4e4;
	font-size: 26px;
	line-height: 26px;
	cursor: pointer;
	transition: color 0.3s ease;
}

.box.box-vorwort .closer:hover{
	color: #e74c3c;
}

/* Lehrgangsdata */

#content .box.box-lehrgangsdata{
	margin-bottom: 30px;
	max-width: 100%;
	height:95%;

}
#content .box.box-lehrgangsdata.preview{
	transition: all 0.8s ease-in-out;
	height:95%;
}

#content .box.box-lehrgangsdata.kachel{
	height:165px;
	max-width:100%;
	overflow: hidden;
	cursor: pointer;

}
#content .box.box-lehrgangsdata.kachel{
	position:relative;
}
#content .overlay-aktion{
	position: absolute;
	left: 15px;
	top: 0px;
	right:15px;
	height: 95%;
	background-color: rgba(37, 150, 249, 0.1);
	border: solid 0px aliceblue;
	border-radius: 10px;
	margin: 0 auto;
	pointer-events: none;
}

@media (max-width: 575px){
	#content .overlay-aktion{
		height:97%;

	}
}




.box.box-lehrgangsdata .intro-image img{
	width: 100%;
	min-width:500px;
}
.cbt-state{
	position: relative;
	right: 0px;
	top: 0px;
	width: 100%;
	height: auto;
}
.cbt-abgeschlossen{
	color: #ffffff;
	font-weight: bold;
	font-size: 11px;
	background-color: #59db95;
	padding: 8px 45px;
	display: block;
	position: absolute;
	width: auto;
	height: auto;
	right: -50px;
	top: 30px;
	text-transform: uppercase;
	transform: rotate(45deg);
}
.cbt-verfuegbar{
	color: #ffffff;
	font-weight: bold;
	font-size: 11px;
	background-color: #6a6a6a;
	padding: 8px 45px;
	display: block;
	position: absolute;
	width: auto;
	height: auto;
	right: -45px;
	top: 15px;
	text-transform: uppercase;
	transform: rotate(45deg);
	animation-name: blinkbackground;
	animation-duration: 2s;
	animation-iteration-count:infinite;
}


.cbt-new{
	color: #000000;
	font-weight: bold;
	font-size: 18px;
	background-color: #fff012;
	padding: 16px 61px;
	display: block;
	position: absolute;
	width: auto;
	height: auto;
	right: -57px;
	top: 29px;
	text-transform: uppercase;
	transform: rotate(45deg);
	animation-name: blinkyellowbackground;
	animation-duration: 2s;
	animation-iteration-count:infinite;
}

.cbt-campaign{
	color: #ffffff;
	font-weight: bold;
	font-size: 17px;
	background-color: #0077ff;
	padding: 14px 60px;
	display: block;
	position: absolute;
	width: auto;
	height: auto;
	right: -53px;
	top: 15px;
	text-transform: uppercase;
	transform: rotate(45deg);
	animation-name: blinkbluebackground;
	animation-duration: 2s;
	animation-iteration-count:infinite;
}


.cbt-sale{
	color: #ffffff;
	font-weight: bold;
	font-size: 22px;
	background-color: #ff0000;
	padding: 20px 84px;
	display: block;
	position: absolute;
	width: auto;
	height: auto;
	right: -61px;
	top: 15px;
	text-transform: uppercase;
	transform: rotate(45deg);
	animation-name: blinkredbackground;
	animation-duration: 2s;
	animation-iteration-count:infinite;
}


@keyframes blinkredbackground{
	0%, 50%{
		background-color: #ff0000;
		color:#ffffff;

	}
	50.01%, 100%{
		background-color: #ff0000;
		color:#ff0000;
	}
}

@-webkit-keyframes blinkredbackground{
	0%, 50%{
		background-color: #ff0000;
		color:#ffffff;
	}
	50.01%, 100%{
		background-color: #ff0000;
		color:#ff0000;
	}
}

@keyframes blinkbluebackground{
	0%, 50%{
		background-color: #0077ff;
		color:#ffffff;

	}
	50.01%, 100%{
		background-color: #6a6a6a;
		color:#ffffff;
	}
}

@-webkit-keyframes blinkbluebackground{
	0%, 50%{
		background-color: #0077ff;
		color:#ffffff;
	}
	50.01%, 100%{
		background-color: #6a6a6a;
		color:#ffffff;
	}
}



@keyframes blinkyellowbackground{
	0%, 50%{
		background-color: #fff012;
		color:#000000;

	}
	50.01%, 100%{
		background-color: #000000;
		color:#ffffff;
	}
}

@-webkit-keyframes blinkyellowbackground{
	0%, 50%{
		background-color: #fff012;
		color:#000000;
	}
	50.01%, 100%{
		background-color: #000000;
		color:#ffffff;
	}
}



@keyframes blinkbackground{
	0%, 50%{
		background-color: #80c670;
	}
	50.01%, 100%{
		background-color: #6a6a6a;
	}
}

@-webkit-keyframes blinkbackground{
	0%, 50%{
		background-color: #80c670;
	}
	50.01%, 100%{
		background-color: #6a6a6a;
	}
}

.box.box-lehrgangsdata .inner{
	background: #fff;
	padding: 25px 35px;
	display: flex;
	align-items: flex-end;
}

.box.box-lehrgangsdata .leftside{
	width: 100%;
	margin-right: 30px;
}

.box.box-lehrgangsdata .rightside{
	margin-left: auto;
}

.box.box-lehrgangsdata .data{
	display: flex;
}

.box.box-lehrgangsdata .data{
	display: flex;
	margin-bottom: 15px;
}

.box.box-lehrgangsdata .data:last-child{
	margin-bottom: 0px;
}

.data-certificate .attribute{
	margin-top: 7px;
}

.box.box-lehrgangsdata .attribute{
	font-size: 18px;
	line-height: 24px;
	width: 100%;
	padding-left: 30px;
	position: relative;
	max-width: 260px;
}

.box.box-lehrgangsdata .data-certificate .attribute{
	margin-top: 0px;
}

.box.box-lehrgangsdata .attribute i{
	position: absolute;
	top: 3px;
	left: 0px;
}

.box.box-lehrgangsdata .attribute i.fa-calendar-alt{
	left: 1px;
}

.box.box-lehrgangsdata .attribute i.fa-file-alt{
	left: 3px;
}

.box.box-lehrgangsdata .value span{
	color: #355a81;
	font-size: 18px;
	line-height: 24px;
	font-weight: bold;
}

.box.box-lehrgangsdata .completion-label{
	font-size: 18px;
	line-height: 24px;
	color: #777;
	margin-bottom: 15px;
	text-align: left;
}

.box.box-lehrgangsdata .progress{
	height: 35px;
	text-align: right;
	font-size: 14px;
	line-height: 14px;
	width: 100vh;
	max-width: 350px;
}

.box.box-lehrgangsdata .progress-bar{
	font-size: 18px;
	line-height: 24px;
}


/* ZFU boxen content */

.innerzfu{
	padding:25px 35px;
}

.innerzfu .title{
	font-size:24px;
	font-weight:600;
}



.button-wrap-zfu{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: wrap;
}


.btnzfu{
	margin:5px 0px;
	padding:5px 10px;
	border:solid 2px #c9c9c9;
	border-radius: 5px;
	font-size:14px;
	font-weight:500;
	color:#c9c9c9;
	background-color: #FFFFFF;
	white-space: nowrap;
	cursor: pointer;
}

.btnzfu.active{
	border-color:#567392;
	color:#ffffff;
	background: #567392;
	background: -moz-linear-gradient(left, #567392 0%, #0a2541 100%);
	background: -webkit-linear-gradient(left, #567392 0%, #0a2541 100%);
	background: linear-gradient(to right, #567392 0%, #0a2541 100%);
}

.btnzfu.active a{
	color:#ffffff;
}

.btnzfu.active a:hover{
	color:#eeeeee;
}

.btnzfu.active a i{
	transition: all 0.3s ease-in-out;
	position: relative;
	left:0px;
	right:0px;
}

.btnzfu.active a:hover i{
	left:5px;

}

.btnzfu.active a:hover i:nth-child(2){
	left:-5px;
}

.btnzfu.btnlifetime{
	transition: all 0.3s ease-in-out;
	background:#fff;
	color:#666;
}

.btnzfu.btnlifetime:hover{
	background:#cb1c1c;
	color:#fff;
}
.btnzfu.btnlta{
	border-color:#567392;
	color:#567392;
	cursor: default;
}
.seminartermine-wrapper{
	place-content:center;
	margin-left:10px;
	margin-right:10px;
}
.seminartermine-wrapper.error{
	border:solid 1px #ff0000;
	color:#ff0000;
}
.vorname.error,.nachname.error{

	color:#ff0000;
}


.termin-entry{
	padding: 10px;
	border: solid 1px #ebebeb;
	margin: 5px;
	text-align: center;
	min-width:100px;
	cursor: pointer;
}
.termin-entry:hover{
	background:#ebebeb;
}
.termin-entry.active{
	background: #c2ffc2 !important;
}






/*########### ZFU PROGRESSBAR ###########*/


.progress-zfu-wrapper{
	display:flex;
	align-items: center;
	margin-top:40px;
	margin-bottom:40px;
}

.progress-zfu-wrapper #start span {
	position: absolute;
	width: 100%;
	height: 100%;
	text-align: center;
	display: grid;
	align-content: center;
	font-size:1.3vh;
}

.progress-zfu-wrapper #finish span {
	position: absolute;
	width: 100%;
	height: 100%;
	background: url('../img/finish_flag.png');
	background-size:32px 32px;
	background-repeat: no-repeat;
	display: block;
	background-position: center center;
}

.ldBar-label {
	color: #656565;
	font-size: 1.3vh;
	font-weight: 500;
}

.ldBar:nth-child(1) .ldBar-label,
.ldBar:last-child .ldBar-label,
.ldBar:nth-child(2n) .ldBar-label{
	display:none;
}


.ldBar path.mainline {
	stroke-width: 11;
	stroke: #3b587b;
}

.ldBar path.baseline {
	stroke-width: 11;
	stroke: #c9c9c9;
	stroke-linecap: square;
}

.stepBar-copy,.stepCircle-copy{
	width:100%;
	display:block;
	position: absolute;
	text-align: center;
	font-size:14px;
	line-height:18px;
}
.stepBar-copy-top{
	top: -40px;
}
.stepBar-copy-bottom{
	top:30px;
}

.stepCircle-copy-bottom{
	top:50px;
}

/*########### ZFU PROGRESSBAR ENDE ###########*/


/* Ticketdetails */

#content .box.box-ticketdetails{
	padding: 35px 35px 0px 0px;
	margin-bottom: 30px;
}

.box.box-ticketdetails .lehrgangs-section{
	position: relative;
	padding-left: 40px;
	padding-bottom: 25px;
	margin-bottom: 25px;
	border-bottom: 4px solid #e9e9e9;
	display: flex;
	justify-content: space-between;
}

.box.box-ticketdetails .lehrgangs-section:last-child{
	border-bottom: 0px solid #e9e9e9;
	margin-bottom: 0px;
}

.box.box-ticketdetails .lehrgangs-section .number{
	position: absolute;
	top: -1px;
	left: 0px;
}

.box.box-ticketdetails .lehrgangs-section .leftside{
	width: 100%;
}

.box.box-ticketdetails .headline span,
.box.box-ticketdetails .lehrgangs-section .number span{
	font-weight: bold;
	font-size: 20px;
	line-height: 26px;
	color: #355a81;
}

.box.box-ticketdetails .headline{
	margin-bottom: 15px;
}

.box.box-ticketdetails .details{
	margin-bottom: 20px;
}

.box.box-ticketdetails .dataset{
	display: flex;
	justify-content: space-between;
}

.box.box-ticketdetails .dataset .data{
	margin-right: 20px;
}

.box.box-ticketdetails .dataset .data:last-child{
	margin-right: 0px;
}

.box.box-ticketdetails .dataset .attribute{
	display: inline-block;
	margin-right: 20px;
}

.box.box-ticketdetails .data .value{
	display: inline-block;
	font-weight: bold;
}

.box.box-ticketdetails .data.iconed .value{
	position: relative;
	padding-left: 22px;
}

.box.box-ticketdetails .data.iconed .value i{
	position: absolute;
	left: 0px;
	top: 3px;
}

.box.box-ticketdetails .rightside{
	position: relative;
	height: auto;
	width: 180px;
	display: block;
}

.box.box-ticketdetails .rightside .btnwrap{
	position: absolute;
	left: 0px;
	right: 0px;
}

.box.box-ticketdetails .rightside .btnwrap.top{
	top: 0px;
}

.box.box-ticketdetails .rightside .btnwrap.bottom{
	bottom: 0px;
}

.box.box-ticketdetails .btn{
	width: 100%;
}

.box.box-ticketdetails .btn-iconed{
	position: relative;
	padding-left: 30px;
}

.box.box-ticketdetails .btn-iconed i{
	position: absolute;
	left: 10px;
	top: 10px;
}

.box.box-ticketdetails .btn-completed{
	background: #6be3a3;
}

.box.box-ticketdetails .btn-pending{
	background: #ff9b9b;
}

.box.box-ticketdetails .btn-closed{
	background: #b71310;
}

.box.box-ticketdetails .btn-open{
	background: #bfeeff;
}

.box.box-ticketdetails .bg-answer{
	color: #666;
	border-radius: 10px;
	background: #ebf7ff;
}

.box.box-ticketdetails .bg-question{
	color: #666;
	border-radius: 10px;
	background: #e9fff2;
}

.box.box-ticketdetails .bg-recordvoice{
	color: #666;
	border-radius: 10px;
	background: #e1e1e1;
}

.open-close{
	transition: all 0.5s ease-out;
	cursor: pointer;
}

.box.box-ticketdetails.box-closed{
	overflow: hidden;
	height: 92px;

}

.attachments{
	position: absolute;
	top: -8px;
}

.circleattachment{
	position: relative;
	display: inline-block;
	top: 0px;
	margin-left: 10px;
	border: solid 2px #ccc;
	border-radius: 50%;
	width: 46px;
	height: 46px;
	cursor: pointer;
	transition: all 0.2s ease-out;
	transform-origin: center;
	-webkit-transform-origin: center;
	/*clip-path: circle(18px at center);*/
	-webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
	-moz-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
	box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.15);

}

.circleattachment:hover{
	/*clip-path: circle(28px at center);*/
	transform: scale3d(1.2, 1.2, 1.2);
	-webkit-transform: scale3d(1.2, 1.2, 1.2);
	-webkit-box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.25);
	-moz-box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.25);
	box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.25);
}

/* Box-Content */

#content .box.box-content{
	padding: 35px;
	margin-bottom: 30px;
}


#content .box.box-content.box-content-cbtinfo{
	padding:10px 35px;
	background-color:#b6c1cc;
	color:#ffffff;
	font-size:14px;
}
#content .box.box-content.box-content-search{
	padding:5px 5px;
	background-color:#b6c1cc;
	color:#ffffff;
	font-size:14px;
	min-height:41px;
}
#content .box.box-content.box-content-search input{
	width:calc(100% - 20px);
	max-width: unset;
	font-size: 12px;
	padding:4px 12px;
}

#content .box.box-content.box-content-cbtquelle{
	transition: all 0.3s ease;
	padding:10px 35px;
	background-color: #e3e7ec;
	color: #8f8f8f;
	font-size:14px;
}


.box.box-content .title{
	margin-bottom: 40px;
	padding-bottom: 20px;
	border-bottom: 1px #ccc solid;
}

.box.box-content .title span{
	font-size: 26px;
	line-height: 32px;
	font-weight: bold;
	display: block;
}

.box.box-content .title span .smaller{
	font-size: 22px;
	line-height: 28px;
}

.box.box-content .subtitle{
	margin-top: 15px;
}

.box.box-content .subtitle span{
	font-size: 20px;
	line-height: 26px;
	font-weight: normal;
	display: block;
}

.box.box-content .content p{
	margin-bottom: 20px;
}

.box.box-content ul.lv-0{
	padding-left: 0px;
	margin-bottom: 20px;
}

.box.box-content ul.lv-1{
	padding-left: 0px;
}

.box.box-content ul.lv-0 > li,
.box.box-content ul.lv-1 > li{
	list-style: none;
	padding-left: 18px;
	position: relative;
	margin: 5px 0px;
}

.box.box-content ul.lv-0 > li::before,
.box.box-content ul.lv-1 > li::before{
	content: '';
	width: 6px;
	height: 6px;
	border-radius: 6px;
	background: #355a81;
	display: inline-block;
	position: absolute;
	left: 0px;
	top: 9px;
}

.box.box-content ul.lv-1 > li::before{
	background: #777;
}

/* Button Actions */

.box.box-content .btnwrap-actions{
	display: flex;
	padding-top: 40px;
}

.box.box-content .btnwrap-actions > div{
	margin-right: 15px;
}

.box.box-content .btnwrap-actions > div:last-child{
	margin-right: 0px;
}

.box.box-content .btn-prev{
	width: 100vw;
	max-width: 120px;
}

.box.box-content .btn-prev i{
	margin-right: 8px;
}

.box.box-content .btn-next{
	width: 100vw;
	max-width: 120px;
}

.box.box-content .btn-next i{
	margin-left: 8px;
}

/* Speechbubble */

.box.box-content .speechbubble, .glossar-content .speechbubble{
	margin: 40px 60px;
	display: flex;
	align-items: flex-end;
}

.box.box-content .speechbubble .storyteller, .glossar-content .speechbubble .storyteller{
	margin-right: 60px;
	display: flex;
}

.box.box-content .speechbubble.speechbubble-reverse .storyteller, .glossar-content .speechbubble.speechbubble-reverse .storyteller{
	margin-right: 0;
	margin-left: 60px;
	order: 2;
}

.box.box-content .speechbubble .storyteller .imgwrap, .glossar-content .speechbubble .storyteller .imgwrap{
	width: 120px;
	border-radius: 120px;
	overflow: hidden;
	display: inline-block;
}

.box.box-content .speechbubble .story, .glossar-content .speechbubble .story{
	/*width: 100%;
	background: #355a81;
	padding: 20px;
	color: #fff;
	border-radius: 10px;
	position: relative;
	display: flex;
	align-items: center;
	min-height: 120px;
	*/
	width: 100%;
	background: #355a81;
	padding: 20px;
	color: #fff;
	border-radius: 10px;
	position: relative;
	display: flex;
	align-items: flex-start;
	min-height: 120px;
	flex-direction: column;
	justify-content: center;
}


.box.box-content .speechbubble.speechbubble-reverse .story, .glossar-content .speechbubble.speechbubble-reverse .story{
	order: 1;
}

.box.box-content .speechbubble .story::before, .glossar-content .speechbubble .story::before{
	position: absolute;
	left: -34px;
	bottom: 20px;
	content: '';
	width: 48px;
	height: 25px;
	background-image: url(../img/arrow_speechbubble.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;

}

.box.box-content .speechbubble.speechbubble-reverse .story::before, .glossar-content .speechbubble.speechbubble-reverse .story::before{
	left: auto;
	right: -34px;
	background-image: url(../img/arrow_speechbubble_reverse.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.story a{
	color:#fff;
	text-decoration: underline;
	display:inline;
}
.story a:hover{
	color:#ccc;
}
.story a::before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content:"\f35d";
	padding-right:5px;
	padding-left:5px;
	text-decoration: none!important;
}



.textbaustein{
	width: 100%;
	position: relative;
}

.textbaustein .tb-head{
	padding: 15px 20px 15px 75px;
	background: #f2f2f2;
	color: #777;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	border-bottom:solid 1px #ffffff;
}

.textbaustein .tb-content{
	padding: 15px 20px;
	background: #f2f2f2;
	color: #777;
	-moz-border-radius-bottomleft: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	border-bottom-right-radius: 10px;
}


.textbaustein.tb_aufgabe .tb-head{
	padding: 25px 20px 15px 75px;
	color: #7e0091;
	border: solid 2px #ae1cce;
	background: #fdedff;
	border-bottom:none
}

.textbaustein.tb_aufgabe .tb-content{
	border: solid 2px #ae1cce;
	background: #fdedff;
	border-top:none;
	font-size:16px;
}



.textbaustein.tb_exkurs .tb-head{
	padding: 25px 20px 15px 75px;
	color: #00911e;
	border: solid 2px #22c64b;
	background: #edfff8;
	border-bottom:none
}


.textbaustein.tb_exkurs .tb-content{
	border: solid 2px #22c64b;
	background: #edfff8;
	border-top:none;
	font-size:16px;
}

/* create a dark yellow version for tb_beispiel */
.textbaustein.tb_beispiel .tb-head{
	padding: 25px 20px 15px 75px;
	color: #d07400;
	border: solid 2px #d07400;
	background: #ffecd1;
	border-bottom:none
}


.textbaustein.tb_beispiel .tb-content{
	border: solid 2px #d07400;
	background: #ffecd1;
	border-top:none;
	font-size:16px;
}
/* create a dark yellow version for tb_beispiel */
.textbaustein.tb_praxistipp .tb-head{
	padding: 25px 20px 15px 75px;
	color: #0099d0;
	border: solid 2px #0099d0;
	background: #d1efff;
	border-bottom:none
}


.textbaustein.tb_praxistipp .tb-content{
	border: solid 2px #0099d0;
	background: #d1efff;
	border-top:none;
	font-size:16px;
}

.textbaustein.tb_videocontent .tb-head{
	padding: 25px 20px 15px 75px;
	color: #0099d0;
	border: solid 2px #0099d0;
	background: #d1efff;
	border-bottom:none
}


.textbaustein.tb_videocontent .tb-content{
	border: solid 2px #0099d0;
	background: #d1efff;
	border-top:none;
	font-size:16px;
}


.textbaustein.tb_achtung .tb-head{
	padding: 25px 20px 15px 75px;
	color: #ff0000; /* red color */
	border: solid 2px #ff0000; /* red color */
	background: #ffe6e6; /* light red color */
	border-bottom:none;
}

.textbaustein.tb_achtung .tb-content{
	border: solid 2px #ff0000; /* red color */
	background: #ffe6e6; /* light red color */
	border-top:none;
	font-size:16px;
}


.textbaustein.tb_achtung .tb-head{
	padding: 25px 20px 15px 75px;
	color: #ff0000; /* red color */
	border: solid 2px #ff0000; /* red color */
	background: #ffe6e6; /* light red color */
	border-bottom:none;
}

.textbaustein.tb_achtung .tb-content{
	border: solid 2px #ff0000; /* red color */
	background: #ffe6e6; /* light red color */
	border-top:none;
	font-size:16px;
}


.textbaustein.tb_definition .tb-head{
	padding: 25px 20px 15px 75px;
	color: #dcb900; /* yellow color */
	border: solid 2px #ffd700; /* yellow color */
	background: #ffffe0; /* light yellow color */
	border-bottom:none;
}

.textbaustein.tb_definition .tb-content{
	border: solid 2px #ffd700; /* yellow color */
	background: #ffffe0; /* light yellow color */
	border-top:none;
	font-size:16px;
}








/*
.textbaustein.tb_beispiel .tb-head{
	padding: 25px 20px 15px 75px;
	border:solid 2px #355a81;
	border-bottom:none
}

.textbaustein.tb_beispiel .tb-content{
	border:solid 2px #355a81;
	border-top:none;
	font-size:16px;
}

 */




[class^="tb-icon-"]{
	border: none;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	left: 15px;
	top: 15px;
	width: 48px;
	height: 48px;
}

.tb-icon-lernziele{
	background-image: url(../img/icon_lernziele.png);
}

.tb-icon-zusammenfassung{
	background-image: url(../img/icon_zusammenfassung.png);
}

.tb-icon-praxistipp{
	background-image: url(../img/icon_praxistipp.png);
}
.tb-icon-exkurs{
	background-image: url(../img/icon_exkurs.png);
}
.tb-icon-exkurs2{
	background-image: url(../img/icon_exkurs2.png);
}

.tb-icon-beispiel{
	background-image: url(../img/icon_beispiel.png);
}

.tb-icon-video{
	background-image: url(../img/icon_video.png);
}

.tb-icon-aufgabe{
	background-image: url(../img/icon_aufgabe.png);
}


.tb-icon-achtung{
	background-image: url(../img/icon_achtung.png);
}

.tb-icon-definition{
	background-image: url(../img/icon_definition.png);
}






/* Image */

.box.box-content .image{
	margin: 20px 0px;
	display: inline-block;
}

.box.box-content .image.float-left{
	margin: 20px 40px 20px 0px;
}

.box.box-content .image.float-right{
	margin: 20px 0px 20px 40px;
}

.box.box-content .image .inner{
	display: table;
}

.box.box-content .image img{
	/*height: 100vh;
	max-height: 175px;*/
	width: auto;
	border-radius: 5px;
	display: inline-block;
}

.box.box-content .image .image-description{
	font-size: 14px;
	line-height: 20px;
	margin-top: 5px;
	color: #c5c5c5;
	display: table-caption;
	caption-side: bottom;
}

/* Video */

.box.box-content .videowrap{
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 0px;
	height: 0;
	overflow: hidden;
}

.box.box-content .videowrap iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

.box.box-content .videowrap .video-overlay{
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	background-color: #777;
}

.box.box-content .videowrap .video-overlay::after{
	position: absolute;
	content: '';
	display: inline-block;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-left: 100px solid #fff;
	border-bottom: 50px solid transparent;

	/* Optische Mitte */
	top: calc(50% - 40px);
	left: calc(50% - 40px);
}

/* Quiz */

.flipdown.small{
	height:40px;
	transform: scale3d(0.5,0.5,0.5);
	margin-top:-10px;
	margin-left:-125px;
}

@media (max-width:550px) {
	.flipdown.small {
		transform: scale3d(0.85,0.85,0.85);
		margin-left:-22px;
		margin-top:0px;
		margin-bottom:40px;
	}
}

.flipdown.small .rotor-group-heading{
	display:none;
}
.flipdown.small .rotor-group:nth-child(1){
	display:none;
}

.box.box-content .questionwrap .number{
	margin-bottom: 5px;
}

.box.box-content .questionwrap .number span{
	font-size: 16px;
	line-height: 22px;
	color: #c5c5c5;
}

.box.box-content .questionwrap .question{
	margin-bottom: 30px;
}

.box.box-content .questionwrap .question span{
	font-size: 20px;
	line-height: 26px;
	font-weight: bold;
}

.box.box-content .answers{
	margin-bottom: 40px;
}

.box.box-content .answers .answer{
	margin-bottom: 15px;
}

.box.box-content .answers .answer:last-child{
	margin-bottom: 0px;
}

.box.box-content .btnwrap-actions.btnwrap-actions-quiz .btn{
	max-width: 130px;
}

/* Einstellungen */

.box.box-content .einstellungen .userimage{
	margin-bottom: 30px;
}

.box.box-content .einstellungen .userimage .inner{
	border-radius: 75px;
	overflow: hidden;
	display: inline-block;
}

.box.box-content .einstellungen .userimage img{
	width: 150px;
	height: 150px;
}

.box.box-content .einstellungen .data{
	margin-bottom: 30px;
}

.box.box-content .einstellungen .datagroup{
	display: flex;
}

.box.box-content .einstellungen .data-firstname{
	margin-right: 40px;
}

.box.box-content .einstellungen .dataset .attribute{
	font-size: 14px;
	line-height: 20px;
	color: #ccc;
	margin-bottom: 5px;
}

.box.box-content .profile-edit .controlwrap{
	margin-bottom: 30px;
}



/* --- RETURNLINK --- */

.returnwrap{
	margin-top: 20px;
	margin-bottom: 80px;
}

.col-12:last-child > .returnwrap{
	margin-bottom: 0px;
}

.returnwrap a{
	font-size: 16px;
	line-height: 22px;
	position: relative;
	padding-left: 25px;
	color: #777;
	transition: color 0.3s ease;
}

.returnwrap a:hover{
	color: #355a81;
}

.returnwrap a i{
	position: absolute;
	lefT: 0px;
	top: 3px;
}

/* Inhaltsverzeichnis */

.box.box-index{
	padding: 15px;
	margin-bottom: 30px;
}

.box.box-index .title{
	margin-bottom: 20px;
}

.box.box-index .title span{
	font-size: 26px;
	line-height: 32px;
	font-weight: bold;
	display: block;
}

#chapter-index ul{
	padding-left: 0px;
	margin-bottom: 5px;
}

#chapter-index ul ul{
	padding-left: 15px;
	padding-top: 5px;
}

#chapter-index .lv-0{
	padding-left: 5px;
}

#chapter-index li{
	list-style: none;
	margin-top: 3px;
	margin-bottom: 3px;
	position: relative;

}

#chapter-index .lv-1{
	display: none;
	padding-left: 35px;
	margin-left: -10px;
}

#chapter-index .lv-2,
#chapter-index .lv-3,
#chapter-index .lv-4{
	display: none;
}


#chapter-index li::before{
	display: none;
}

#chapter-index li .chapter{
	padding: 3px 0px 3px 0px;
	display: inline;
	position: relative;
	font-size: 14px;
	line-height: 20px;
	color: #afafaf;
	transition: background 0.3s ease;
}

#chapter-index li .chapter.complete{
	color: #666666;
}

#chapter-index li .chapter.complete.activepage, #chapter-index li .chapter.activepage{
	color: #0b55c4 !important;
}

#chapter-index li .chapter.complete.newpage, #chapter-index li .chapter.newpage{
	color: #c4460b !important;
}

.newpagecolor{
	color: #c4460b;
}

#chapter-index li .chapter:hover,
#chapter-index li .chapter.current{
	cursor: pointer;
	background-color: #f8f8f8;
}


#chapter-index span.index-letter{
	width: 15px;
	display: inline-block;
	position: relative;
	padding-right: 6px;
	margin-right: 6px;
	text-align: center;
	box-sizing: content-box;
}

#chapter-index span.index-letter::after{
	position: absolute;
	right: 1px;
	top: 3px;
	height: 15px;
	width: 1px;
	background: #777;
	content: '';
	display: inline-block;
}


/*
#chapter-index li.parent > .chapter::after{
	position: absolute;
	right: 5px;
	top: 9px;
	content: '+';
	font-size: 16px;
	line-height: 16px;
	font-weight: normal;
	width: 16px;
	height: 16px;
	text-align: center;
}
*/

/*#chapter-index li.parent.alive > .chapter::after{
	content: '–';
}

#chapter-index li.parent > .chapter.alive::after{
	content: '–';
}*/


#chapter-index .lv-1 li.parent > .chapter::after{
	top: 5px;
}

.pageCheck::after{
	content: "\f00c";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	color: #6be3a3;
	font-size: 14px;
	line-height: 10px;
	margin-left: 10px;
}

a.complete span{
	display: inline;
	position: relative;
	top: 0px;
	white-space: nowrap;
}

.btn-expand{
	background: #ebebeb !important;
	background: -moz-linear-gradient(left, #ebebeb 0%, #ebebeb 100%) !important;
	background: -webkit-linear-gradient(left, #ebebeb 0%, #ebebeb 100%) !important;
	background: linear-gradient(to right, #dcdcdc 0%, #dcdcdc 100%) !important;
	position: absolute;
	display: inline-block;
	color: #888;
	border: 0px;
	border-radius: 3px;
	white-space: nowrap;
	cursor: pointer;
	line-height: 13px;
	padding-top: 1px;
	padding-bottom: 2px;
	padding-left: 5px;
	padding-right: 5px;
	left: -35px;
	margin-top: 5px;
}

.btn-expand.expandnew{
	background:#c4460b!important;
	color:#fff!important;
}

.btn-plus::before{
	content: "+";
	font-size: 13px;
	font-weight: bold;
}

.btn-minus::before{
	content: "-";
	font-size: 17px;
	font-weight: bold;
	padding-left: 1px;
	padding-right: 1px;
}


#chapter-index .lv-1 > li > .chapter{
	font-style: italic;
	text-decoration: underline;
	pointer-events: none;
	cursor: pointer;
}

#chapter-index .lv-0 > li > .chapter{
	font-weight: bold;
	border-bottom: 1px solid #efefef;
	padding: 3px 20px 6px 0px;
	color: #777;
	background: none !important;
	display: block;
	width: 100%;
	margin-left: -9px;

}

#chapter-index .lv-0 > li:last-child > .chapter{
	border-bottom: 1px solid #fff;
}

#chapter-index .lv-0 > li > .chapter.complete{
	color: #6be3a3;
}

#chapter-index .lv-0 > li > .chapter.complete::before{
	display: none;
}


/* --- LIVE-TICKET --- */

#live-ticket.off{
	display: none;
}

#live-ticket{
	position: fixed;
	right: 20px;
	bottom: 20px;
	background-color: #fff;
	max-width: 375px;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	border-radius: 8px;
	z-index: 999;
}

#live-ticket .head{
	padding: 8px 35px 8px 15px;
	position: relative;
	color: #fff;
	border-radius: 8px 8px 0px 0px;
	background: #567392;
	background: -moz-linear-gradient(left, #567392 0%, #0a2541 100%);
	background: -webkit-linear-gradient(left, #567392 0%, #0a2541 100%);
	background: linear-gradient(to right, #567392 0%, #0a2541 100%);
}

#live-ticket .head i{
	margin-right: 5px;
}

#live-ticket .head .lt-closer{
	position: absolute;
	right: 10px;
	top: 4px;
	opacity: 0.7;
	cursor: pointer;
	transition: opacity 0.3s ease;
}

#live-ticket .head .lt-closer:hover{
	opacity: 1;
}

#live-ticket .chat{
	padding: 24px 15px 12px 15px;
}

#live-ticket p{
	font-size: 14px;
	line-height: 18px;
}

#live-ticket .chat .speechbubble{
	display: flex;
	align-items: flex-start;
	margin-bottom: 24px;
}

#live-ticket .chat .speechbubble .storyteller{
	display: flex;
	margin-right: 30px;
}

#live-ticket .chat .speechbubble .storyteller .imgwrap{
	width: 60px;
	border-radius: 120px;
	overflow: hidden;
	display: inline-block;
}

#live-ticket .chat .speechbubble .story{
	width: 100%;
	background: #777;
	padding: 12px;
	color: #fff;
	border-radius: 10px;
	position: relative;
	display: flex;
	align-items: center;
}

#live-ticket .chat .speechbubble .story::before{
	position: absolute;
	left: -16px;
	top: 20px;
	content: '';
	width: 24px;
	height: 12px;
	background-image: url(../img/arrow_speechbubble_grey.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

#live-ticket .chat label{
	font-weight: bold;
	font-size: 14px;
	line-height: 20px;
}

.liveticket .chat label{
	font-weight: bold;
	font-size: 14px;
	line-height: 20px;
}

#live-ticket .chat textarea{
	background: #f2f2f2;
	border-radius: 6px;
	padding: 8px 12px;
	border: 0px;
	width: 100%;
	max-width: 400px;
	font-size: 14px;
	line-height: 20px;
	color: #333;
	margin-bottom: 10px;
	resize: vertical;
	max-height: 500px;
}

.liveticket .chat textarea{
	display: block;
	background: #f2f2f2;
	border-radius: 6px;
	padding: 8px 12px;
	border: 0px;
	width: 100%;
	font-size: 14px;
	line-height: 20px;
	color: #333;
	margin-bottom: 10px;
	resize: vertical;
	height: 200px;
}

#live-ticket .btnticketwrap{
	text-align: right;
}

.liveticket .btnticketwrap{
	text-align: center;
}

.liveticket .btnticketwrap .btn-ticketsenden{
	width: 300px;
}

#live-ticket .filedrop{
	font-size: 12px;
	font-weight: normal;
	border: dashed 2px #ccc;
	border-radius: 5px;
	padding: 5px;
	text-align: center;
}


.liveticket .filedrop{
	font-size: 12px;
	font-weight: normal;
	border: dashed 2px #ccc;
	border-radius: 5px;
	padding: 5px;
	text-align: center;
	margin-bottom: 10px;
}


.filedrop.drophilit{
	border: dashed 2px #0b55c4;
}

.userimagefiledrop.filedrop{
	font-size: 12px;
	font-weight: normal;
	border: dashed 2px #ccc;
	border-radius: 5px;
	padding: 5px;
	text-align: center;
	margin-bottom: 10px;
}


.userimagefiledrop.drophilit{
	border: dashed 2px #0b55c4;
}


#live-ticket .filedrop_files{
	background: #ccc;
}

.liveticket .filedrop_files{
	background: #ccc;
}

.imagethumb{
	display: inline-flex;
}



.userimagefiledrop.filedrop{
	font-size: 12px;
	font-weight: normal;
	border: dashed 2px #ccc;
	border-radius: 5px;
	padding: 50px 5px;
	text-align: center;
	margin-bottom: 10px;
}

.userimagefiledrop.drophilit{
	border: dashed 2px #0b55c4;
}


.videouploadfiledrop.filedrop{
	font-size: 16px;
	font-weight: normal;
	border: dashed 2px #ccc;
	border-radius: 5px;
	padding: 25px;
	text-align: center;
	margin-bottom: 10px;
	cursor:pointer;
}


.videouploadfiledrop.drophilit{
	border: dashed 2px #0b55c4;
}

textarea[name="videouploadcomment"]{
	background: #f2f2f2;
	border-radius: 6px;
	padding: 8px 12px;
	border: 0px;
	width: 100%;
	font-size: 14px;
	line-height: 20px;
	color: #333;
	margin-bottom: 10px;
	resize: vertical;
	max-height: 500px;
	height:150px;

}


#overlay{
	display: none;
	position: fixed;
	left: 0px;
	right: 0px;
	bottom: 0px;
	top: 0px;
	background-color: rgba(0, 0, 0, 0.75);
	width: 100%;
	height: 100%;
	z-index: 998;
}

.slide-in-bottom{
	-webkit-animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	display: block;
}

.slide-out-bottom{
	-webkit-animation: slide-out-bottom 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	animation: slide-out-bottom 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

@-webkit-keyframes slide-in-bottom{
	0%{
		-webkit-transform: translateY(1000px);
		transform: translateY(1000px);
		opacity: 0;
	}
	100%{
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes slide-in-bottom{
	0%{
		-webkit-transform: translateY(1000px);
		transform: translateY(1000px);
		opacity: 0;
	}
	100%{
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}

@-webkit-keyframes slide-out-bottom{
	0%{
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
	100%{
		-webkit-transform: translateY(1000px);
		transform: translateY(1000px);
		opacity: 0;
	}
}

@keyframes slide-out-bottom{
	0%{
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
	100%{
		-webkit-transform: translateY(1000px);
		transform: translateY(1000px);
		opacity: 0;
	}
}


/* --- CONTENT EXTRAS --- */

#welcome-box .image{
	border-radius: 4px;
	display: inline-block;
	margin-top: 0px;
	overflow: hidden;
	margin-bottom: 0px;
}

#welcome-box .image img{
	max-width: 173px;
	width: 100%;
}

/* Widget-Tabs */

.min-width-455{
	min-width: 455px;
}

.tabset-widget .box{
	border-top-left-radius: 0px;
}

.tabset-widget .tabs{
	margin: 0px;
	padding: 0px;
	display: flex;
}

.tabset-widget .tabs li{
	list-style: none;
	displaY: inline-block;
	margin-right: 3px;
}

.tabset-widget .tabs a{
	background: #777777;
	color: #fff;
	border: 0px;
	border-radius: 8px 8px 0px 0px;
	white-space: nowrap;
	cursor: pointer;
	font-size: 16px;
	line-height: 20px;
	padding: 8px 14px;
	display: inline-block;
	margin-right: 2px;
}

.tabset-widget .ui-state-active a{
	background: #355a81;
	background: -moz-linear-gradient(left, #355a81 0%, #0a2541 100%);
	background: -webkit-linear-gradient(left, #355a81 0%, #0a2541 100%);
	background: linear-gradient(to right, #355a81 0%, #0a2541 100%);
}

.tabset-widget .tab-content{
	padding-top: 40px;
	padding-bottom: 40px;
}

.tabset-widget .singleslider{
	margin-bottom: 20px;
	min-height: 181px;
}

.tabset-widget .singleslider .slick-slide{
	padding-left: 20px;
	padding-right: 20px;
}

.tabset-widget .slick-dots{
	text-align: right;
	padding-right: 40px;
	padding-left: 10px;
	line-height: 0px;
	bottom: -30px;
}

.tabset-widget .slick-dots li{
	margin: 0px 0px 0px 5px;
	width: auto;
	height: auto;
}

.tabset-widget .slick-dots li button{
	padding: 0px;
	background-color: #f2f2f2;
	color: rgba(0, 0, 0, 0);
	font-size: 0px;
	line-height: 0px;
	border-radius: 20px;
	width: 14px;
	height: 14px;
}

.icon-pdf{
	display: block;
	width: 96px;
	height: 96px;
	background-image: url(../img/icon_pdf.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	background-size: 96px 96px;
	margin: 20px auto;


}


.tabset-widget .slick-dots li.slick-active button{
	background-color: #355a81;
}

.tabset-widget .slick-dots li button::before{
	display: none;
}

.tabset-widget .slide-content > .inner{
	display: flex;
}

.tabset-widget .slide-content .imgwrap{
	margin-right: 30px;
	max-height: 100px;
	min-width: 100px;
	width: 100px;
	border-radius: 100px;
	overflow: hidden;
	display: inline-block;
}


/* Special */
@media (min-width: 1200px) and (max-width: 1399.98px){

	.box.box-lehrgang-intro .footer{
		display: block;
	}

	.box.box-lehrgang-intro .footer .btnwrap{
		text-align: center;
		margin-top: 10px;
	}

	.box.box-lehrgang-teaser .inner{
		display: block;
	}

	.box.box-lehrgang-teaser .headline{
		margin-right: 0px;
		margin-bottom: 15px;
	}
}


@media (max-width: 1399.98px){

	#content{
		padding: 40px;
	}

	.box.box-vorwort .inner{
		padding-right: 50px;
	}

	.box.box-vorwort .message{
		margin-right: 40px;
	}

	.box.box-lehrgangsdata .progress{
		max-width: 250px;
	}

	.box.box-ticketdetails .rightside{
		width: 200px;
	}
}

@media (min-width: 1199.98px) and (max-width: 1399.98px){
	.box.box-content .speechbubble{
		margin-left: 0px;
		margin-right: 0px;
	}
}

@media (min-width: 991.98px) and (max-width: 1399.98px){
	.box.box-lehrgangsdata .attribute{
		font-size: 16px;
		line-height: 22px;
		max-width: 200px;
	}

	.box.box-lehrgangsdata .value span,
	.box.box-lehrgangsdata .completion-label{
		font-size: 16px;
		line-height: 22px;
	}

	.box.box-lehrgangsdata .progress{
		max-width: 240px;
	}

	#header .grey-transparent{
		margin-left: 20px !important;
	}

}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px){

	.box.box-content .videowrap{
		width: 100%;
		height: auto;
		min-height: 150px;
	}

	.box.box-content .videowrap .video-overlay::after{
		top: calc(50% - 48px);
	}

	.box.box-content .speechbubble{
		margin-left: 0px;
		margin-right: 0px;
	}
}


/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px){

	body{
		padding-top: 108px;
	}

	#header{
		box-shadow: none;
		padding-bottom: 0px;
		height: 65px;
	}

	#sidebar{
		padding-top: 0px;
		padding-bottom: 15px;
		position: fixed;
		top: 62px;
		left: 0px;
		right: 0px;
		z-index: 990;
		box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	}

	#navbar-btn{
		outline: none !important;
		padding-left: 0px;
		padding-right: 0px;
		margin: 5px auto -8px auto;
	}

	#mainmenu{
		max-width: none;
		width:unset;
		margin-top:15px;
	}

	#mainmenu .lv-0 > li > a{
		max-width: none;
	}

	#mainmenu .lv-0 > li{
		padding: 0px;
		border-right: 0px !important;
	}

	#content .box.box-ticketdetails{
		padding: 35px 35px 35px 35px;
		margin-bottom: 30px;
	}

	#content .box{
		margin-bottom: 40px;
	}

	#content .page-title span{
		font-size: 20px;
		line-height: 26px;
	}

	.box.box-lehrgangsdata .inner{
		display: block;
	}

	.box.box-lehrgangsdata .leftside{
		margin-right: 0px;
		padding-bottom: 20px;
		border-bottom: 4px solid #e9e9e9;
		margin-bottom: 20px;
	}

	.box.box-lehrgangsdata .progress{
		max-width: 100%;
	}

	.box.box-lehrgangsdata .progress{
		max-width: 100%;
	}

	/*++++++++++++++++++++++++++++++++++++++*/


	.progress-zfu-wrapper {
		display: block;
		margin-top: 40px;
		margin-bottom: 40px;
		margin-left: 41%;
	}

	.progress-zfu-wrapper #start span {
		position: absolute;
		width: 100%;
		height: 100%;
		text-align: center;
		display: grid;
		align-content: center;
		font-size:1.3vh;
		transform: unset;

	}

	.progress-zfu-wrapper #finish span {
		position: absolute;
		width: 100%;
		height: 100%;
		background: url('../img/finish_flag.png');
		background-size:32px 32px;
		background-repeat: no-repeat;
		display: block;
		background-position: center center;
	}

	.ldBar{
		margin-top: 43px;
	}
	.ldBar:first-child{
		margin-top:0px;

	}

	.ldBar.stepBar{
		transform: rotate(90deg) scaleX(0.5);
		left: -89px;
	}


	.ldBar-label {
		color: #656565;
		font-size: 1.3vh;
		font-weight: 500;


	}

	.ldBar:nth-child(1) .ldBar-label,
	.ldBar:last-child .ldBar-label,
	.ldBar:nth-child(2n) .ldBar-label{
		display:none;
	}


	.ldBar path.mainline {
		stroke-width: 11;
		stroke: #3b587b;
	}

	.ldBar path.baseline {
		stroke-width: 11;
		stroke: #c9c9c9;
		stroke-linecap: square;
	}

	.ldBar-label:after {

	}

	.stepBar-copy,.stepCircle-copy{
		width:100%;
		display:block;
		position: absolute;
		text-align: center;
		font-size:1.6vh;
		line-height:21px;
		transform: rotate(-90deg) scaleY(2);
	}
	.stepBar-copy-top{
		top: -100px;
	}
	.stepBar-copy-bottom{
		top:90px;
	}

	.stepCircle-copy-bottom{
		top:-50px;
	}




	/*++++++++++++++++++++++++++++++++++++++*/




	.box.box-ticketdetails .lehrgangs-section{
		flex-wrap: wrap;
		padding-left: 0px;
	}

	.box.box-ticketdetails .lehrgangs-section .leftside{
		margin-right: 0px;
	}

	.box.box-ticketdetails .rightside{
		flex-basis: 100%;
		margin-top: 20px;
		display: flex;
	}

	.box.box-ticketdetails .rightside .btnwrap{
		position: relative;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		bottom: auto !important;
	}

	.box.box-ticketdetails .btn{
		/*width: auto;*/
	}

	.box.box-ticketdetails .rightside .btnwrap:last-child{
		margin-left: auto;
	}

	.box.box-content .title span{
		font-size: 24px;
		line-height: 30px;
	}

	.box.box-content .subtitle span{
		font-size: 18px;
		line-height: 26px;
	}

	.grey-transparent{
		display: none;
	}
}


/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px){

	#content{
		padding: 20px 15px;
	}

	#content .page-title span{
		white-space: normal;
	}

	.box.box-content .title{
		margin-bottom: 40px;
	}

	.box.box-lehrgang-intro .intro-image img,
	.box.box-lehrgang-teaser .intro-image img{
		width: 100%;
	}

	.box.box-content .profile-edit .controlwrap{
		margin-bottom: 18px;
	}

	.box.box-content .btnwrap-actions{
		padding-top: 20px;
	}

	.box.box-vorwort .inner{
		display: block;
	}

	.box.box-vorwort .inner > div{
		margin-bottom: 25px;
		margin-right: 0px;
		text-align: center;
	}

	.box.box-vorwort .inner > div:last-child{
		margin-bottom: 0px;
	}

	.box.box-vorwort .profilepic .imgwrap{
		margin: 0 auto;
	}

	.box.box-vorwort .voice-message .icon{
		padding-bottom: 10px;
	}

	.box.box-ticketdetails .dataset{
		display: block;
	}

	.box.box-ticketdetails .dataset .data{
		margin-right: 0px;
	}

	.box.box-ticketdetails .dataset .attribute{
		width: 100%;
		max-width: 125px;
	}

	.box.box-content .speechbubble,
	.glossar-content .speechbubble{
		flex-wrap: wrap;
	}

	.box.box-content .speechbubble .storyteller,
	.glossar-content .speechbubble .storyteller{
		order: 2;
		width: 100%;
		margin: 20px 0px 0px 0px !important;
	}

	.box.box-content .speechbubble .story,
	.glossar-content .speechbubble .story{
		order: 1;
	}

	.box.box-content .speechbubble .story::before,
	.glossar-content .speechbubble .story::before{
		transform: rotate(-45deg);
		left: 120px;
		bottom: -20px;
	}

	.box.box-content .speechbubble.speechbubble-reverse .storyteller .imgwrap,
	.glossar-content .speechbubble.speechbubble-reverse .storyteller .imgwrap{
		margin-left: auto;
	}

	.box.box-content .speechbubble.speechbubble-reverse .story::before,
	.glossar-content .speechbubble.speechbubble-reverse .story::before{
		transform: rotate(45deg);
		left: auto;
		right: 120px;
	}

	.tabset-widget .slide-content > .inner{
		display: block;
	}

	.tabset-widget .slide-content .imgwrap{
		margin: 0px auto 20px auto;
		max-height: none;
		min-width: 1px;
		width: 100%;
		border-radius: 0px;
		overflow: hidden;
		display: block;
		text-align: center;
	}

	.tabset-widget .slide-content .imgwrap img{
		margin: 0 auto;
		max-height: 100px;
		min-width: 100px;
		width: 100px;
		border-radius: 100px;
		display: inline-block;
	}

	#telefonnummer br{
		display: block;
	}

	table.table-relation,
	table.table-relation *:not(ul li){
		display: block;
		width: 100%;
		text-align: left;
	}

	table.table-relation th:first-child,
	table.table-relation td:first-child:not(table.table-relation tr:last-child td){
		border-bottom: 0px;
		padding-bottom: 2px;
	}
	table.table-relation th:first-child{
		font-weight: bold;
		/*border-bottom:solid 1px rgb(222, 226, 230);*/

	}
	table.table-relation th:last-child,
	table.table-relation td:last-child{
		border-top: 0px;
		padding-top: 2px;
		font-weight: 400 !important;
	}

}

@media (max-width: 680px){
	body{
		padding-top: 0px;
	}

	#header,
	#sidebar{
		position: relative;
		top: auto;
		left: auto;
		right: auto;
	}

	#header{
		display: block;
		height: auto;
	}

	#logo{
		text-align: center;
		margin: 0px 0px 10px 0px;
	}

	#logo > a{
		display: inline-block;
		margin: 0 auto 10px auto;
	}

	#telefonnummer{
		display: block;
		margin: -11px auto 4px auto;
		text-align: center;
	}

	#usermenu{
		display: inline-block;
		text-align: center;
		width: 100%;
	}

	#userprofile{
		clear: both;
		/*display: none;*/
		position:absolute;
		top: 15px;
		right: 15px;
	}

	.dropdown-menu{
		height: 110px;

	}

	#sidebar{
		clear: both;
	}

	#navbar-btn{
		margin: 15px auto -8px auto;
	}

}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px){

	#login{
		margin: 20px auto;
	}

	#login .rightside{
		padding-left: 30px;
	}

	#content .box.box-lehrgangsdata {
		height:97%;
	}


	.box.box-lehrgangsdata .inner{
		padding: 20px;
	}

	.box.box-lehrgangsdata .data{
		display: block;
	}

	.box.box-lehrgangsdata .attribute{
		margin-bottom: 5px;
	}

	.box.box-lehrgangsdata .value{
		padding-left: 30px;
	}

	.box.box-lehrgangsdata .attribute,
	.box.box-lehrgangsdata .value span,
	.box.box-lehrgangsdata .completion-label{
		font-size: 16px;
		line-height: 22px;
	}

	.box.box-lehrgangsdata .progress{
		height: 28px;
		font-size: 12px;
		line-height: 12px;
	}

	#content .box.box-ticketdetails,
	#content .box.box-content{
		padding: 20px;
	}

	.box.box-ticketdetails .dataset .attribute{
		width: 100%;
		max-width: none;
	}

	.box.box-ticketdetails .dataset .data{
		margin-bottom: 10px;
	}

	.box.box-content .image img{
		width: 100%;
		max-height: none;
		height: auto;
	}

	.box.box-content table{
		float: none !important;
	}

	#welcome-box .image{
		margin-bottom: 20px;
		text-align: center;
		display: block;
	}

	#live-ticket{
		position: fixed;
		left: 10px;
		right: 10px;
		top: 20px;
		bottom: auto;;
		max-width: 375px;
		margin: auto;
	}

	#live-ticket .storyteller,
	#live-ticket .story::before{
		display: none !important;
	}

	#usermenu .lt-printer{
		display: none;
	}

	.box.box-content .image,
	.box.box-content .image .inner,
	.box.box-content .image .image-description{
		display: block;
	}
}


@media (max-width: 479.98px){


	.box.box-lehrgang-teaser .inner{
		display: block;
	}

	.box.box-lehrgang-teaser .inner .headline{
		margin-bottom: 20px;
	}

	.box.box-lehrgang-intro .footer{
		display: block;
	}

	.box.box-lehrgang-intro .footer .completion{
		margin-right: 0px;
		margin-bottom: 20px;
	}

	.box.box-lehrgang-intro .progress{
		max-width: 100%;
	}

	.box.box-lehrgang-intro .footer .btnwrap{
		text-align: right;
	}

	.min-width-455{
		min-width: 1px;
	}

	#header{
		padding-left: 10px;
		padding-right: 10px;
	}

}


@media (max-width: 360px) {
	.box.box-content .btnwrap-actions {
		display: block;
	}
	.box.box-content .btnwrap-actions > div{
		width:100%;
	}
	.box.box-content .btn-prev, .box.box-content .btn-next {
		width:100%;
		margin:10px 0px 10px 0px;
		max-width: unset;
	}
	.box.box-content .btnwrap-actions > div:last-child{
		text-align: center;
	}
	h1{
		font-size:21px;
	}

}

#chk-wrapper{
	border: solid red 0px;
	width: 15px;
	height: 15px;
	margin: 0px;
	margin-top: 2px;
	margin-right: 5px;
	padding: 0px;
}

#chk-accept{
	margin-bottom: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-left: 0px;
}

.hidden{
	display: none !important;
}

.correctAnswer{
	color: #00b72c;
	font-size: 16px;
	font-weight: bold;
}

.wrongAnswer{
	color: #b71310;
	font-size: 16px;
	font-weight: bold;
}

.produkt-img{
	height: 200px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.produkt{
	padding: 15px;
	padding-bottom: 50px;
	position: relative;
	height: 100%;
}

.produkt-description{
	margin: 15px 0px 30px 0px;
}

.produkt-readmore{
	position: absolute;
	bottom: 20px;
	left: 15px;
}


.select-field-wrapper{
	position: relative;
}

.select-field{
	position: relative;
	background: #ebebeb;
	border: solid 1px #aaaaaa;
	border-radius: 5px;
	padding: 5px;
	padding-left: 15px;
	padding-right: 30px;
	cursor: pointer;
	overflow-x: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	/*max-width: 400px;*/
}

.select-field-open{
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}

.select-field:hover{
	color: #333;
}

.select-field.arrowdown::after{
	position: absolute;
	right: 10px;
	top: 10px;
	font-family: "Font Awesome 5 Free";
	font-weight: bold;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	line-height: 1;
	content: "\f078";
	margin-left: 10px;
}

.select-field.arrowup::after{
	position: absolute;
	right: 10px;
	top: 10px;
	font-family: "Font Awesome 5 Free";
	font-weight: bold;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	line-height: 1;
	content: "\f077";
	margin-left: 10px;
}

.select-options-wrapper{
	position: absolute;
	top: 35px;
	left: 0px;
	background: #ebebeb;
	border: solid 1px #aaaaaa;
	border-radius: 5px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	padding: 5px 15px;
	cursor: pointer;
	width: 100%;
	z-index: 999;
	max-height:200px;
	overflow-y: auto;
}

.select-option{
	margin: 10px;
}

.select-option:hover{
	color: #333;
}

.modal-wide{
	max-width: 750px;
}

.onoffswitch{
	position: relative;
	width: 158px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	margin: 0 auto;
}

.onoffswitch-checkbox{
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.onoffswitch-label{
	display: block;
	overflow: hidden;
	cursor: pointer;
	border: 2px solid #999999;
	border-radius: 15px;
}

.onoffswitch-inner{
	display: block;
	width: 200%;
	margin-left: -100%;
	transition: margin 0.3s ease-in 0s;
}

.onoffswitch-inner:before, .onoffswitch-inner:after{
	display: block;
	float: left;
	width: 50%;
	height: 30px;
	padding: 0;
	line-height: 30px;
	font-size: 14px;
	color: white;
	font-family: Trebuchet, Arial, sans-serif;
	font-weight: bold;
	box-sizing: border-box;
}

.onoffswitch-inner:before{
	content: "Textnachricht";
	padding-left: 16px;
	background: #355a81;
	background: -moz-linear-gradient(left, #808080 0%, #4a4a4a 100%);
	background: -webkit-linear-gradient(left, #808080 0%, #4a4a4a 100%);
	background: linear-gradient(to right, #808080 0%, #4a4a4a 100%);
}

.onoffswitch-inner:after{
	content: "Sprachnachricht";
	padding-right: 10px;
	background: #355a81;
	background: -moz-linear-gradient(left, #355a81 0%, #0a2541 100%);
	background: -webkit-linear-gradient(left, #355a81 0%, #0a2541 100%);
	background: linear-gradient(to right, #355a81 0%, #0a2541 100%);
	text-align: right;
}


.onoffswitch-switch{
	display: block;
	width: 22px;
	margin: 6px;
	background: #ffffff;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 124px;
	border: 2px solid #999999;
	border-radius: 15px;
	transition: all 0.3s ease-in 0s;
}


.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner{
	margin-left: 0;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch{
	right: 0px;
}

.onoffswitch-label.zfu{
	border: solid 1px #999999;
}

.onoffswitch-inner.zfu:before{
	content: "Text Eingabe";
	padding-left: 16px;
	background: #ff5f5f;
	background: -moz-linear-gradient(left, #ff5f5f 0%, #26adb4 100%);
	background: -webkit-linear-gradient(left, #ff5f5f 0%, #26adb4 100%);
	background: linear-gradient(to right, #ff5f5f 0%, #26adb4 100%);
}
.onoffswitch-inner.zfu:after{
	content: "Video Upload";
	padding-right: 24px;
	background: #08d700;
	background: -moz-linear-gradient(left, #26adb4 0%, #08d700 100%);
	background: -webkit-linear-gradient(left, #26adb4 0%, #08d700 100%);
	background: linear-gradient(to right, #26adb4 0%, #08d700 100%);
	text-align: right;
}




.onoffswitch.anaus{
	width: 88px;
}

.onoffswitch-inner.anaus:before{
	content: "AN";
	padding-left: 16px;
	background: #3a8135;
	background: -moz-linear-gradient(left, #3a8135 0%, #10ff00 100%);
	background: -webkit-linear-gradient(left, #3a8135 0%, #10ff00 100%);
	background: linear-gradient(to right, #3a8135 0%, #10ff00 100%);
	text-align: right;
}

.onoffswitch-inner.anaus:after{

	content: "AUS";
	padding-right: 24px;
	background: #355a81;
	background: -moz-linear-gradient(left, #8c0d0d 0%, #ff0000 100%);
	background: -webkit-linear-gradient(left, #8c0d0d 0%, #ff0000 100%);
	background: linear-gradient(to right, #8c0d0d 0%, #ff0000 100%);
	text-align: right;
}

.onoffswitch-switch.anaus{
	right: 54px;
}


.onoffswitch.onoff{
	width: 88px;
}

.onoffswitch-inner.onoff:before{
	content: "ON";
	padding-left: 16px;
	background: #3a8135;
	background: -moz-linear-gradient(left, #3a8135 0%, #10ff00 100%);
	background: -webkit-linear-gradient(left, #3a8135 0%, #10ff00 100%);
	background: linear-gradient(to right, #3a8135 0%, #10ff00 100%);
	text-align: right;


}

.onoffswitch-inner.onoff:after{
	content: "OFF";
	padding-right: 24px;
	background: #8c0d0d;
	background: -moz-linear-gradient(left, #8c0d0d 0%, #ff0000 100%);
	background: -webkit-linear-gradient(left, #8c0d0d 0%, #ff0000 100%);
	background: linear-gradient(to right, #8c0d0d 0%, #ff0000 100%);
	text-align: right;
}

.onoffswitch-switch.onoff{
	right: 54px;
}

.onoffswitch.janein{
	width: 88px;
}

.onoffswitch-inner.janein:before{
	content: "JA";
	padding-left: 24px;
	background: #3a8135;
	background: -moz-linear-gradient(left, #3a8135 0%, #10ff00 100%);
	background: -webkit-linear-gradient(left, #3a8135 0%, #10ff00 100%);
	background: linear-gradient(to right, #3a8135 0%, #10ff00 100%);

}

.onoffswitch-inner.janein:after{
	content: "NEIN";
	padding-right: 16px;
	background: #8c0d0d;
	background: -moz-linear-gradient(left, #8c0d0d 0%, #ff0000 100%);
	background: -webkit-linear-gradient(left, #8c0d0d 0%, #ff0000 100%);
	background: linear-gradient(to right, #8c0d0d 0%, #ff0000 100%);
	text-align: right;
}



.onoffswitch-switch.janein{
	right: 54px;
}



/* Farben */
.turquoise			{color: #1abc9c!important;}
.bg-turquoise		{background-color: #1abc9c!important;}
.turquoise-dark		{color: #16a085!important;}
.bg-turquoise-dark	{background-color: #16a085!important;}
.bg-turquoise-light	{background-color: #9affde!important;}

.green				{color: #2ecc71!important;}
.bg-green			{background-color: #2ecc71!important;}
.green-dark			{color: #27ae60!important;}
.bg-green-dark		{background-color: #27ae60!important;}
.bg-green-light		{background-color: #abffcd!important;}

.blue				{color: #3498db!important;}
.bg-blue			{background-color: #3498db!important;}
.blue-dark			{color: #2980b9!important;}
.bg-blue-dark		{background-color: #2980b9!important;}
.bg-blue-light		{background-color: #addfff!important;}

.purple				{color: #9b59b6!important;}
.bg-purple			{background-color: #9b59b6!important;}
.purple-dark		{color: #8e44ad!important;}
.bg-purple-dark		{background-color: #8e44ad!important;}
.bg-purple-light	{background-color: #ebbcff!important;}

.black				{color: #34495e!important;}
.bg-black			{background-color: #34495e!important;}
.black-dark			{color: #2c3e50!important;}
.bg-black-dark		{background-color: #2c3e50!important;}

.yellow				{color: #f1c40f!important;}
.bg-yellow			{background-color: #f1c40f!important;}
.yellow-dark		{color: #f39c12!important;}
.bg-yellow-dark		{background-color: #f39c12!important;}
.bg-yellow-light	{background-color: #ffe7c1!important;}

.orange				{color: #e67e22!important;}
.bg-orange			{background-color: #e67e22!important;}
.orange-dark		{color: #d35400!important;}
.bg-orange-dark		{background-color: #d35400!important;}
.bg-orange-light	{background-color: #ffd0b3!important;}

.red				{color: #e74c3c!important;}
.bg-red				{background-color: #e74c3c!important;}
.red-dark			{color: #c0392b!important;}
.bg-red-dark		{background-color: #c0392b!important;}
.bg-red-light		{background-color: #ffb9b1!important;}

.white				{color: #ecf0f1!important;}
.bg-white			{background-color: #ecf0f1!important;}
.white-dark			{color: #bdc3c7!important;}
.bg-white-dark		{background-color: #bdc3c7!important;}
.bg-white-light		{background-color: #d8d8d8!important;}

.grey				{color: #95a5a6!important;}
.bg-grey			{background-color: #95a5a6!important;}
.grey-dark			{color: #7f8c8d!important;}
.bg-grey-dark		{background-color: #7f8c8d!important;}

.text-azf			{color: #31557c!important; }
.bg-azf				{background-color: #31557c!important;; }

.text-swav			{color: #31557c!important; }
.bg-swav			{background-color: #31557c!important; }

.text-whi			{color: #e89458!important; }
.bg-whi				{background-color: #e89458!important; }

.text-wip			{color: #8e2424!important; }
.bg-wip				{background-color: #8e2424!important; }

.text-dafmf			{color: #527d28!important; }
.bg-dafmf			{background-color: #527d28!important; }

.text-dafmp			{color: #f4784f!important; }
.bg-dafmp			{background-color: #f4784f!important; }


.btn-selectable{
	cursor:pointer;

}
.btn-selectable:hover{
	background:#2ecc71;
}


/*lightboxen*/

.lightbox-click-image{
	cursor: pointer;
}

.lightbox-wrapper{
	display:flex;
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	background:rgba(0,0,0,0.5);
	color:white;
	align-items: center;
	justify-content: center;
	z-index: 999999;
}

.lightbox-content{
	background: black;
	padding:1em;
	margin:1em;
	position: relative;
}
.lightbox-image{
	max-height:850px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.closelightbox{
	position: absolute;
	width:2em;
	height:2em;
	top:-1em;
	right:-1em;
	border-radius: 50%;
	text-decoration:none;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lightbox-image-description{
	margin-top:5px;
	font-size:13px;
	color:#cccccc;
}
.closelightbox{
	color:white;
	font-weight:bold;
}
.closelightbox:hover{
	color:#aaaaaa;
}
.closelightbox:after{
	content:'X';
}



/*quellenverzeichnis*/

.quellenverzeichniswrap{
	transition: all 0.8s ease;
	-moz-transition: all 0.8s ease;
	height:0px;
}
.quellenverzeichniswrap.active{
	transition: all 0.8s ease;
	height:auto;
}
.quellenverzeichniswrap div{
	font-size:12px!important;
}
.quellenverzeichniswrap div p{
	font-size:12px!important;
}

#btn_quelle{
	transition: all 0.3s ease;
	transform-origin: center center;
	float: right;
	margin-right:-20px;
	display:inline-block;
	width:20px;
	height:20px;
	cursor: pointer;
}
#btn_quelle i{
	font-size:20px;
}
#btn_quelle.active{
	transition: all 0.3s ease;
	transform: rotate(180deg);
}


/* GLOSSAR */

.glossar-wrap {
	position: absolute;
	background: rgba(255, 254, 243,0.96);
	color: black;
	padding: 5px 10px;
	border-radius: 10px;
	border-color: #ffab29;
	border-style: solid;
	border-width: 3px;
	font-size: 12px;
	z-index: 999999;
	width:800px;
	height:auto;
	max-height: 500px;
	opacity: 1;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
	overflow: hidden;
}

.glossar-header{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.glossar-header .glossar-title{
	font-size: 24px;
	font-weight: bold;
	font-style: italic;
	color: #ffab29;
	padding-left:4px;
	padding-top:11px;

}

.glossar-header .glossar-close{
	cursor: pointer;
	font-size: 16px;
	font-weight: bold;
	border-radius: 3px;
	border: solid 2px #ebebeb;
	padding: 0px 7px;

}

.glossar-header .glossar-close:hover{
	background: #ebebeb;
	color: #ffab29;
}

.glossar-content {
	margin-top: 20px;
	overflow-y: auto;
	height: auto;
	padding-right: 10px;
	max-height: 400px;
	margin-bottom: 20px;
	overflow-x: hidden;
}




.glossary-term {
	cursor: pointer;
	text-decoration: underline;
	text-decoration-style: dotted;
	font-style: italic;
	color: #ffab29;
}
.glossary-term:before {
	content: "\f02d";
	font-family: "Font Awesome 5 Free";
	font-weight: bold;
	font-style: italic;
	font-variant: normal;
	text-rendering: auto;
	line-height: 1;
	margin-right: 5px;

}

.glossary-term:hover {
	color: #2980b9;
}


ul.checkmark-list {
	list-style: none;
}
ul.checkmark-list li {
	position: relative;
	padding-left: 20px;
	margin-bottom: 5px;
	text-indent: -21px;
}
ul.checkmark-list li:before {
	content: "✔";
	color: green;
	margin-right: 0.5em;
}
ul.no-checkmark-list li:before {
	content: "";
}



ul.checkmark-listi li:after{
	content: "✔";
	color: green;
	position: absolute;
	top: 0;
	left: 40px;

	margin-right: -1em;
	margin-left: -1em;
}

ul.checkmark-list li:before {
	font-size: 16px;
}
/*
li::before {
  content: "✔";
  color: green;
  margin-right: 0.5em;
}

 */


@media (max-width: 1198.98px) {
	.glossar-wrap {
		position: fixed;
		background: rgba(255, 254, 243,0.96);
		color: black;
		padding: 5px 10px;
		border-radius: 10px;
		border-color: #ffab29;
		border-style: solid;
		border-width: 3px;
		font-size: 12px;
		z-index: 999999;
		width:95%;
		max-width:895px;
		height:auto;
		max-height: 500px;
		opacity: 1;
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
		overflow: hidden;
		/* top has to be the with the scrollposition of the page */

		top: 70px !important;
		left: 232px !important;

	}
}
@media (max-width: 991.98px) {
	.glossar-wrap {
		position: fixed;
		background: rgba(255, 254, 243,0.96);
		color: black;
		padding: 5px 10px;
		border-radius: 10px;
		border-color: #ffab29;
		border-style: solid;
		border-width: 3px;
		font-size: 12px;
		z-index: 999999;
		width:96%;
		max-width:890px;
		height:auto;
		max-height: 500px;
		opacity: 1;
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
		overflow: hidden;
		top: 110px !important;
		left: 2px !important;

	}
}

@media (max-width: 451px) {
	.glossar-wrap {
		position: fixed;
		background: rgba(255, 254, 243,0.96);
		color: black;
		padding: 5px 10px;
		border-radius: 10px;
		border-color: #ffab29;
		border-style: solid;
		border-width: 3px;
		font-size: 12px;
		z-index: 999999;
		width:92%;
		max-width:440px;
		height:auto;
		max-height: 670px;
		opacity: 1;
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
		overflow: hidden;
		top: 63px !important;
		left:0px !important;
	}

	.glossar-content {
		margin-top: 20px;
		overflow-y: auto;
		height: auto;
		padding-right: 10px;
		max-height: 700px;
		margin-bottom: 20px;
		overflow-x: hidden;
	}


}








/* ZFU-Aufgaben Bereich */

.rot45{
	position:relative;
	transform: rotate(-20deg);
	left: 0px;
	top: -8px;

}


.vc-controllerwrap{
	position:relative;
	display:block;
	width:100%;
	height:180px;
	border:solid 1px #ccc;
	background:#ececec;
	padding:15px;
	border-radius:5px;
}
.vc-timeline-complete{
	position: relative;
	display:block;
}
.vc-tl-hl{
	display:block;
	float:left;
	margin-left:10px;
}
.vc-tl-time{
	display:block;
	width:100%;
	text-align: right;
	margin-left:-10px;
}

.vc-tl-wrapper{
	position:relative;
	display:block;
	margin-top: 10px;
}
.vc-tl-bg{
	position: absolute;
	background:url('../img/vc_skala.jpg');
	background-repeat: repeat-x;
	background-size: auto;
	width:100%;
	height:54px;
	left:0px;
	top:0px;
	border: solid 1px #fff;
	border-radius: 30px;
}
.vc-tl-dragger{
	background:url('../img/vc_dragger.png');
	width:9px;
	height:55px;
	position: absolute;
	left:25px;
	top:0px;
	cursor: pointer;
}
.vc-tl-mask{
	width:100%;
	height:55px;
	position: absolute;
	left: 0px;
	top:0px;
	pointer-events: none;
	border: solid 2px #fff;
	border-radius: 30px;
	outline: solid 2px #fff;
}

.videocheck-button-wrap{
	top:70px;
	position:relative;
	display:flex;
	flex-direction: row;
	place-items: flex-start;
}

.videocheck-textinput-wrap{
	top:85px;
	position:relative;
}
.vc-ti-input{
	margin-right:15px;
}
.vc-ti-text{
	width:100%;
	max-width:750px;
	max-height:90px;
}

.vc-btn,.vc-btn-ctl{
	width:45px;
	height:45px;
	background: #ccd0d4;
	margin:3px;
	display:grid;
	place-items: center;
	cursor: pointer;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
	background-color:#ededed;
	border-radius:8px;
	border:1px solid #dcdcdc;
}
.vc-btn:hover,.vc-btn-ctl:hover{
	/*box-shadow: inset 0 0 35px 5px rgba(0, 0, 0, 0.25), inset 0 2px 1px 1px rgba(255, 255, 255, 0.9), inset 0 -2px 1px 0 rgba(0, 0, 0, 0.25);*/
	background:linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
	background-color:#dfdfdf;
}
.vc-btn:active,.vc-btn-ctl:active{
	position:relative;
	top:1px;
}

.vc-btn > span{
	pointer-events: none;
}

.videowrap{
	position:relative;
	margin-left: 0px;
	margin-bottom: 20px;

}
#vimeo-video{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.vc-btn:nth-child(1){
	margin-right:10px;
}
.vc-btn:nth-child(8){
	margin-left:20px;
}
.vc-ico-text{
	display:block;
	background: url("../img/vc_ico_text.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}

.vc-ico-thumbs-up{
	display:block;
	background: url("../img/vc_ico_thumbs_up.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}

.vc-ico-thumbs-down{
	display:block;
	background: url("../img/vc_ico_thumbs_down.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}

.vc-ico-applause{
	display:block;
	background: url("../img/vc_ico_applause.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}

.vc-ico-smiley{
	display:block;
	background: url("../img/vc_ico_smiley.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}

.vc-ico-sad{
	display:block;
	background: url("../img/vc_ico_sad.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}

.vc-ico-ohno{
	display:block;
	background: url("../img/vc_ico_ohno.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}
.vc-ico-delete{
	display:block;
	background: url("../img/vc_ico_delete.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}


.vc-player-controls-wrap{
	width:100%;
	display:flex;
	flex-direction: row;
	justify-content: center;

}
.vc-btn-ctl{
	width:42px;
	height:42px;
	display:grid;
	place-items: center;
	margin-top:4px;
}
.vc-ico-rew{
	display:block;
	background: url("../img/vc_ico_rew.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}
.vc-ico-rew.active{
	background: url("../img/vc_ico_rew_h.png");
}
.vc-ico-play{
	display:block;
	background: url("../img/vc_ico_play.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}

.vc-ico-play.active{
	background: url("../img/vc_ico_play_h.png");
}


.vc-ico-ff{
	display:block;
	background: url("../img/vc_ico_ff.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}

.vc-ico-ff.active{
	background: url("../img/vc_ico_ff_h.png");
}


.vc-ico-stop{
	display:block;
	background: url("../img/vc_ico_stop.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 39px 39px;
	width:39px;
	height:39px;
}
.vc-ico-stop.active{
	background: url("../img/vc_ico_stop_h.png");
}

.vc-tl-ico-small{
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;

	background-size: 15px 15px;
	width:15px;
	height:15px;
	top:15px;
	cursor:pointer;
}
.vc-tl-ico-small.selected{
	border:solid 1px #ff0000;

}

.responsecontainer{
	display:flex;
	position:absolute;
	right:0px;
	top:0px;
	width:60%;
	height:100%;
	flex-direction: column;
	justify-content: flex-end;
	overflow: hidden;
}

.responsewrap{
	display: block;
	position: absolute;
	right: 10px;
	bottom:0px;
	width: 90%;
	height: 40%;
	background: url('../img/rahmen.svg');
	background-repeat: no-repeat;
	background-position: left top;
	background-size: auto;
	opacity: 0;
	animation: fadeIn 1s 0s 1 normal forwards ease,
	fadeOut 1s 5s 1 normal forwards ease;
	-webkit-animation: fadeIn 1s 0s 1 normal forwards ease,
	fadeOut 1s 5s 1 normal forwards ease;
}
@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@-webkit-keyframes fadeIn{
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes fadeOut {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@-webkit-keyframes fadeOut{
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}


.res-ani-wrap{
	width: 8vw;
	height: 8vw;
	position: absolute;
	left: 1vw;
	top: 0.6vw;
	z-index: 9999;

	max-width: 100px;
	max-height: 110px;
}
.res-text-wrap{
	position: absolute;
	left: 9vw;
	top: 5vw;
	font-size: 1.5vw;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 1.9vw;
	padding-right:20px;
}

.btn-marker{/*dent around button*/
	display: inline-block;
	position: relative;
	text-decoration: none;
	color: rgba(3, 169, 244, 0.54);
	width: 40px;
	height: 40px;
	border-radius: 50%;
	text-align: center;
	background: #f7f7f7;
	box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.08);
	cursor:pointer;
}
.btn-marker .fa {/*Button itself*/
	position: absolute;
	content: '';
	width: 30px;
	height: 30px;
	line-height: 30px;
	vertical-align: middle;
	left: 5px;
	top: 2px;
	border-radius: 50%;
	font-size: 15px;
	background-image: -webkit-linear-gradient(#e8e8e8 0%, #d6d6d6 100%);
	background-image: linear-gradient(#e8e8e8 0%, #d6d6d6 100%);
	text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66);
	box-shadow: inset 0 2px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0, 0, 0, 0.19);
	border-bottom: solid 2px #b5b5b5;

}

.btn-marker .fa:active{
	background-image: -webkit-linear-gradient(#efefef 0%, #d6d6d6 100%);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0, 0, 0, 0.19);
	border-bottom: solid 2px #d8d8d8;
}

.btn-marker-border{
	border:solid 1px;
}
.btn-very-good{
	color: #06b900;
}
.btn-good{
	color: #8fd900;
}
.btn-satisfactory{
	color: #f7ff33;
}
.btn-sufficient{
	color: #ffb000;
}
.btn-poor{
	color: #ff6a00;
}
.btn-insufficient{
	color: #af0303;
}

.tablecell-center{
	display: table-cell;
	vertical-align: middle!important;
}
#loesung_text{
	height:700px;
	max-height:700px;
	overflow-y:scroll;
	border:solid 1px #ccc;
	border-radius:5px;
	padding:10px;
	background: #f8f8f8;
}


.btn-democourse{
	font-size: 20px !important;
	font-weight: bold;
	color: #fff !important;
	background: #ffa128 !important;
	background: -moz-linear-gradient(top, #d28c23 0%, #ffa128 100%) !important;
	background: -webkit-linear-gradient(top, #d28c23 0%, #ffa128 100%) !important;
	background: linear-gradient(to top, #d28c23 0%, #ffa128 100%) !important;
	display: flex;
	align-items: center;
	justify-content: center;
}

.btndemo{
	background: #ffa128 !important;
	background: -moz-linear-gradient(right, #d28c23 0%, #ffa128 100%) !important;
	background: -webkit-linear-gradient(right, #d28c23 0%, #ffa128 100%) !important;
	background: linear-gradient(to right, #d28c23 0%, #ffa128 100%) !important;
}

.demochapter{
	color:#ffa128!important;
}

#countdown-hint {
	border: 1px solid #007399;
	border-radius: 10px;
	margin-top: .5em;
}

#countdown-hint > p {
	font-size: .85em;
	padding: .65em;
}


/* flipboard */

.flipcard{
	width:100%;
}
.bp-flipcard{
	padding:4px;
}

.flip-card {
	background-color: transparent;
	width:100%;
	height:auto;
	/*border: 1px solid #f6e27a;*/
	perspective: 1000px; /* Remove this if you don't want the 3D effect */
	cursor: pointer;
}

/* This container is needed to position the front and back side */
.flip-card-inner {
	display:flex;
	align-items: center;
	border: 2px solid #f6e27a;
	position: relative;
	width:100%;
	height:auto;
	text-align: center;
	transition: transform 0.8s;
	transform-style: preserve-3d;
	box-shadow: 0 4px 8px 0 rgba(0,0,0,1);

}

/* Do an horizontal flip when you move the mouse over the flip box container */

.flip-card:hover .flip-card-inner:not(.visited) {
	transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
	display:grid;
	place-items: center;
	position: relative;
	width:100%;
	height:auto;
	-webkit-backface-visibility: hidden; /* Safari */
	backface-visibility: hidden;
}

.flip-card-front .flip-card-title, .flip-card-back .flip-card-title {
	position:absolute;
	font-size: 1.5em;
	font-weight: bold;
}

.gold {
	position: absolute;
	transform: translate(-50%,-50%) scalex(0.5);
	letter-spacing: 3px;
	font-family: Iceland; /* Replace with your preferred font */
	font-size: 45px; /* Adjust size as needed */
	/*
	background-image: linear-gradient(
			to right,
			#462523 0,
			#cb9b51 22%,
			#f6e27a 45%,
			#f6f2c0 50%,
			#f6e27a 55%,
			#cb9b51 78%,
			#462523 100%
	);
	color:transparent;
	-webkit-background-clip:text;

	*/
	color: #ffffff; /* Adjust color as needed */
	/* I need a glow effect */
	text-shadow: 0 0 5px #f6e27a, 0 0 10px #f6e27a, 0 0 15px #f6e27a, 0 0 20px #f6e27a, 0 0 25px #f6e27a, 0 0 30px #f6e27a, 0 0 35px #f6e27a;
	line-height: 45px;
}
.alttitle{
	color: #ffffff;
}

.flip-card-back{
	position:absolute;
	top:0px;
}



/* Style the front side (fallback if image is missing) */
.flip-card-front {
	background-color: #bbb;
	color: black;
}

/* Style the back side */
.flip-card-back {
	display:grid;
	place-items: center;
	background-color: dodgerblue;
	color: white;
	transform: rotateY(180deg);
}


.showhide-wrapper {
	display:block;
	position:fixed;
	right:-90px;
	top:360px;
	transform: rotate(90deg);
	text-transform: uppercase;
	padding: 10px;
	background: #fff;
	border: solid 0px #ccc;
	border-radius: 10px;
	letter-spacing: 2px;
	font-size: 10px;
	/* lets add a little shadow */
	box-shadow: 0 0 5px rgba(0,0,0,0.1);
	cursor: pointer;
	z-index: 999;


}
.showhide-wrapper.active {
	/*background: #a7f67a;*/
	right:-85px;
	top:355px;
	/* lets have this sticky */
	position: fixed;

}

.showhide-wrapper:hover {
	background: #f6e27a;
}

.showhide-text {
	margin:10px;
}

/* Media queries for responsive font size */
@media (max-width: 1880px) {
	.flip-card-front .flip-card-title, .flip-card-back .flip-card-title {
		font-size: 1.2em;
	}
	.gold {
		font-size: 28px;
	}
}

@media (max-width: 1580px) {
	.flip-card-front .flip-card-title, .flip-card-back .flip-card-title {
		font-size: 1em;
	}
	.gold {
		font-size: 28px;
	}
}

@media (max-width: 1300px) {
	.flip-card-front .flip-card-title, .flip-card-back .flip-card-title {
		font-size: 0.8em;
	}
	.gold {
		font-size: 26px;
	}
}

@media (max-width: 1198px) {
	.flip-card-front .flip-card-title, .flip-card-back .flip-card-title {
		font-size: 1.2em;
	}
	.gold {
		font-size: 32px;
	}


	.showhide-wrapper{
		display:none;
	}
}

@media (max-width: 992px) {
	.flip-card-front .flip-card-title, .flip-card-back .flip-card-title {
		font-size: 1.5em;
	}
	.gold {
		font-size: 45px;
	}
}

@media (max-width: 768px) {
	.flip-card-front .flip-card-title, .flip-card-back .flip-card-title {
		font-size: 1.2em;
	}
	.gold {
		font-size: 40px;
	}
}

@media (max-width: 420px) {
	.flip-card-front .flip-card-title, .flip-card-back .flip-card-title {
		font-size: 1em;
	}
	.gold {
		font-size: 30px;
	}
}




/* flipboard  end */





@media (max-width: 360px){
	.btn-democourse{
		font-size: 4vw !important;
	}
}

@media (max-width: 991.98px){
	.res-text-wrap{
		font-size: 2.1vw;
		line-height: 2.7vw;
		padding-right: 10px;

	}
}

@media print{
	body{
		font: 12pt Arial, Helvetica, sans-serif;
		line-height: 1.3;
	}

	a, a:visited{
		text-decoration: underline;
	}

	a[href]:after{
		content: " (" attr(href) ")";
	}

	abbr[title]:after{
		content: " (" attr(title) ")";
	}

	.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after{
		content: "";
	}

	/* Don't show links for images, or javascript/internal links */
	pre, blockquote{
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	thead{
		display: table-header-group;
	}

	/* h5bp.com/t */
	tr, img{
		page-break-inside: avoid;
	}

	img{
		max-width: 100% !important;
	}

	@page{
		margin: 0.5cm;
		margin-top: 1.5cm;
	}

	p, h2, h3{
		orphans: 3;
		widows: 3;
	}

	h2, h3{
		page-break-after: avoid;
	}

	.row{
		display: block;
	}

	#sidebar, #header, #cbtsitemap, .btnwrap.btnwrap-actions{
		display: none !important;
	}

	.showhide-wrapper{
		display:none;
	}

	#content{
		color-adjust: exact !important;
		-webkit-print-color-adjust: exact !important;
		print-color-adjust: exact !important;
	}

	.box.box-content .speechbubble .story::before{
		display: none;
	}

	.box.box-content .speechbubble .story{
		background: #91aac4;
	}

	@media print and (-webkit-min-device-pixel-ratio: 0){
		.box.box-content .speechbubble .story{
			color: #ccc;
			-webkit-print-color-adjust: exact;
		}
	}


}