@supports ( grid-column: 1 / span 1 ) and ( display: flex ) and ( filter: blur(0) ) {

	.good_browser {
		display: block!important;
	}

	.old_browser {
	  	display: none!important;
		}
}


.twentyseventeen-front-page article:not(.has-post-thumbnail):not(:first-child) {
  border-top: none; 
}


#menu_frontpage.flex > * {
	margin-right: 2rem;
}

#menu_frontpage {
	position: sticky;
	top: -0.1rem;
	z-index: 999;
}

#menu_frontpage .button_container.ghost {
	background-color: #fff;
	box-shadow: 0 0.15rem 0.3rem rgba( 0, 0, 0, 0.3 );
}

#menu_frontpage .ghost button {
	margin-top: 0;
}

/*#smartpaper_frontpage .accordion {
	background-color: transparent;
	padding: 0;
}*/

/*#smartpaper_frontpage blockquote {
	margin-bottom: 3rem;
	padding-bottom: 1rem;
	color: #333;	
	padding: 1rem 1rem 2rem 1rem;
	box-shadow: 0 0.15rem 0.3rem rgba( 0, 0, 0, 0.3 );
	font-style: normal;
	background-color: #fff;
}*/



/*#smartpaper_frontpage blockquote p {
	border-left: 1rem solid hsl( 140, 80%, 50% );
	padding: 1rem 1rem 2rem 1rem;
	display: inline-block;
	background-color: #eee;
}*/

/*#smartpaper_frontpage blockquote::after {
  content: '';
  width: 0; 
  height: 0; 
  border-left: 2rem solid transparent;
  border-right: 2rem solid transparent;  
  border-top: 2rem solid hsl( 140, 80%, 60%);
  position: absolute;
  margin-top: -2rem;
  animation: slow_down 0.6s alternate infinite ease-out;
}*/


.wp-block-columns.layer1 {
	background-color: #fff;
	padding: 2rem;
}




#smartpaper_frontpage .c-accordion__content blockquote:last-of-type::after {
	content: none;
}

#smartpaper_frontpage p {
	max-width: 70ch;
	margin-bottom: 1rem;
}

#smartpaper_frontpage blockquote img {
	max-width: 70ch;
	height: auto;
	opacity: 1;
	margin-bottom: 4rem;
	width: 100%;
	height: auto;
}

#smartpaper_frontpage blockquote p {
	border-left: 1rem solid hsl( 140, 80%, 50% );
	padding: 1rem;
}

#smartpaper_frontpage .c-accordion__title {
	/*border-bottom: 1px solid #ccc;*/
	background-color: hsl( 140, 90%, 80%);
	padding: 1rem 2rem 1.33rem 2rem;
	transition: all 0.3s ease-out;
	margin-bottom: 0;
}

.c-accordion__title:after {
	right: 2rem;
	font-weight: bold;
	color: #376;
}

#smartpaper_frontpage .c-accordion__content {
	padding: 1rem 2rem 2rem 2rem;
	background-color: #eee;
}

#smartpaper_frontpage .c-accordion__title:hover {
	background-color: hsl( 140, 90%, 70%);
}

#smartpaper_frontpage .c-accordion__title.open {
	border-bottom: none;
	background-color: transparent;
}

#smartpaper_frontpage .wp-block-pb-accordion-item {
	font-size: 1rem;
	font-weight: normal;
	margin-bottom: 1rem;
	border: 1px solid #ccc;
}


@keyframes slow_down {
	100% { margin-top: -1rem }
}


label {
	color: #575;
}

label small {
	color: #000;
}


.ui-helper-hidden-accessible {
	display: none;
}


.small {
	font-size: 10px;
}

#chartjs-tooltip {
	background: rgba( 255, 255, 255, 0.9);
	padding: 2rem 2rem 3rem 2rem;

}

#chartjs-tooltip [class^="svg-empty"] {
	fill: #999;
}

#chartjs-tooltip .star_set {
	position: absolute;
	height: 1.2rem;
	width: auto;
}

.no_pad {
	padding: 0;
}


.flex {
	display: flex;
/*	align-items: center;*/
}

.flex.wrap {
	flex-wrap: wrap;
}

.flex.flex-start {
	align-items: flex-start;
}

.flex.justify-center {
	justify-content: center;
}

.flex .long {
	max-width: 42ch!important;
}

.flex .one-third {
	max-width: none;
	width: 33.3%
}

.flex .fullsize {
	max-width: none;
	width: 100%;
	margin-right: 0;
}

#classroom_login .flex > * {
	max-width: 23ch;
	margin-right: 2rem;
}

.flex .ghost {
	margin-right: 0;
}

.flex .ghost button.btn {
	margin-right: 0;
}



.flex > input {
	max-height: 3rem;
}


.ui-tooltip {
	padding: 1rem;	
	position: absolute;
	z-index: 9999;
	max-width: 20rem;
	background: #fff;
	box-shadow: 0 0.15rem 0.3rem rgba( 0, 0, 0, 0.3 );
	border-bottom: 1px solid rgba(0,0,0,0.1);
	border-left: 1rem solid hsl( 140, 80%, 60% );
	transform: translateY(1rem);
}

.ui-tooltip::before {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	left: -1rem;
	top: -0.4rem;
	border-style: solid;
	border-width: 0 0.5rem 0.5rem 0.5rem;
	border-color: transparent transparent hsl( 140, 80%, 60% ) transparent;
}


body {
	transition: background 0.4s ease-out;
}


body h1 {

	font-weight: normal
}


#main .margin_bottom {
	margin-bottom: 2rem;
}


#main .margin_bottom.little {
	margin-bottom: 0.5rem;
}


.margin_right {
	margin-right: 1rem
}


html.freeze {
  pointer-events: none!important;
  overflow-y: hidden!important;
}

body label {
	font-weight: bold;
}

.twentyseventeen-front-page .entry-title {
	display: none
}

button.full {
	width: 100%;
}

.ghost button {
	border: 1px solid #ccc;
	color: #333;
	margin-top: 2rem;
	background-color: transparent;
}

.save_area .ghost.flex_end {
	margin-left: auto;
}

button:disabled {
	background-color: #ccc;
	pointer-events: none;
}

button:disabled ,
.disabled label {
		color: #999;
}

.layer1:disabled {
	box-shadow: none;
}


.passiv {
	pointer-events: none;
}


.kmbtcnk_container #marksChart {
	margin-bottom: 4rem;
}


#naming_area  {
	margin-bottom: 2rem;
	margin-right: 1rem;
}

#naming_area form {
	display: flex;
	
}

#naming_area input {
	background-color: #fff;
	margin-right: 1rem;
	max-width: 22ch;	
	color: #000;
	font-weight: bold;
}

form input:disabled {
	background-color: rgba(0,0,0,0.08);
	color: rgba(0,0,0,0.5);
	pointer-events: none;
}

::placeholder {
	color: #bbb;
}

/*button:disabled .icons {
	display: none;
}*/


.ticket .icons.control {
	margin: 0;
	margin-left: 1rem;
}


.aufbau {
	color: hsl(140,100%,35%);
}

.ausgang {
	color: hsl(200,100%,35%);
}

.regular {
	font-size: 1rem;
	font-weight: normal;
}


button:disabled:hover {
	background-color: #ccc;
	color: #777;
}

button:disabled .spinner {
	display: none;
}


.disabled_icon {
	display: none;
} 

.disabled .disabled_icon {
	display: inline;
}

.disabled .active_icon {
	display: none;
}


#call_action_btn_container > .button_container {
  margin-left: 4rem;
  padding-bottom: 2rem;
}


#ticket_container .accordion-container {
	margin-bottom: 2rem;
}

#ticket_container {
	
	margin-bottom: 0;
	border-bottom: none;
	transition: all 0.2s ease-out;
}

#ticket_container .tickets {
	display: flex;
}

#ticket_container.open {
	margin-bottom: 2rem;
}

#ticket_container .title {
	display: none;
}

#ticket_container.open .title {
	display: block;
}

#ticket_container .sub-container .panel {
	background: #eee;
}

#ticket_container .ghost .btn {
	background: #fff;
	margin-right: 0;
	margin-top: 2rem;
}


#ticket_container .control {
	opacity: 0.8;
	transition: all 0.2s ease-out;
}

#ticket_container .control:hover {
	opacity: 1;
	transform: scale(0.8);
}

/*add und remove button in ticket*/
#ticket_container .dynamic_input_group div .add {
	display: none;
} 

#ticket_container .dynamic_input_group div .remove {
	display: block;
} 

#ticket_container .dynamic_input_group div:first-of-type .remove {
	display: none;
} 

#ticket_container .dynamic_input_group div:last-of-type .add {
	display: block;
} 

#ticket_container .dynamic_input img:last-of-type {
	margin-right: 0;
}

#ticket_container .dynamic_input_group div {
	animation: drop_in 0.2s ease-out 1;	
	animation-fill-mode: forwards;
	transform: scale(0.3); }


/*.button_container:not(.ghost) button.btn.unloaded::before {
	animation: shadow-pulse 0.6s ease-out;
	animation-fill-mode: forwards;
}

#main .button_container:not(.ghost) button.btn.unloaded::after {
	animation: fade_out 0.6s ease-out;
	animation-fill-mode: forwards;
}*/







button.btn.unloaded {
	animation: drop_in 0.2s ease-out 1;	
	animation-fill-mode: forwards;
	transform: scale(0.3);
}


.fade_in {
	animation: fade_in 0.2s ease-out 1;	
	animation-fill-mode: forwards;
	opacity: 0;
}


/*button.btn.unloaded::before {
	position: absolute;
	width: 1rem;
	height: 1rem;
	z-index: -1;
	left: 40%;
	top: 0.6rem;
	border-radius: 50%;
	content: '';
}*/



@keyframes drop_in {

     100% { transform: scale(1); }
}

@keyframes fade_in {

     100% { opacity: 1 }
}

/*@keyframes shadow-pulse {
     0% { 	box-shadow: 0 0 0 0 hsla( 140, 100%, 60%, 0.75 ); }
     100% { box-shadow: 0 0 0 2rem hsla( 200, 60%, 90%, 0 ); }
}*/


/*@keyframes fade_out {
     100% {opacity: 0;
     }
}
*/


button.btn {
	display: flex;
  	align-items: center;
  	margin-right: 1rem;
  	position: relative;
  	transition: all 0.2s ease-out;
}

.flex {
	display: flex;
}

#prepress {
	border: 1px solid #bbb;
	padding: 1rem;
	margin-top: 1rem;
	width: 30ch;	
}


.fakeloader {
	height: 0.5rem;
	margin-top: 0.25rem;
	margin-bottom: 0.5rem;
	width: 0;
	background-color: hsl( 200, 20%, 60% );
	animation: fakeloader 1.8s 1 ease-out;
	animation-fill-mode: forwards;
}

@keyframes fakeloader {
	0% 	 {  background-color: hsl( 200, 0%, 60% ); }
	100% {  width: 100%; background-color: hsl( 140, 100%, 60% ); }
}


#stack_loading_animation .fakeloader {
	animation-duration: 3.3s;
	height: 1rem;
	margin-bottom: 1rem;
}

#stack_loading_animation {
	padding-bottom: 2rem;
}



.sekundary_nav {
	display: flex;
	flex-direction: row-reverse;
}


.button_container {
	margin-bottom: 2rem;
}

.KMBCTnK,
.frontpage {
  outline: none;
  border: 0 solid transparent;
  border-collapse: unset;
  border-spacing: 0;  
}


.frontpage .ls_id {
	display: none;
}


.frontpage .flex {
	justify-content: space-between;
}

.frontpage tr {
	transition: all 0.2s ease-out;
}




.frontpage tr:not(.offline):hover {
	background: #fff;
	box-shadow: 0 0 1.5rem 0.25rem rgba(255,255,255,0.4)
}

.frontpage .offline {
	color: #777;
}


.frontpage .offline p,
.offline .lerngruppe dl {
	display: none;
}


.app_info {
	max-width: calc( 44ch + 11rem);
	padding-left: 9.7rem;
	padding-top: 4rem;
	border: none!important;
}

.app_info p {
	margin-bottom: 1.5rem;
}



.frontpage .teaser {
	font-weight: bold;
	color: #000;
}

#herkules_silhouette {
	position: absolute;
	right: 0;
}

.layer1 {
	box-shadow: 0 0.15rem 0.3rem rgba( 0, 0, 0, 0.3 );
	border-bottom: 1px solid rgba(0,0,0,0.1);
}

.frontpage .lerngruppe small strong {
	margin-right: 0.5rem;
}

.border_right {
	border-right: 1px solid #000;
}

.KMBCTnK td {
	position: relative;
	padding: 1rem;
	border: none;
	border-top: none!important;
}


.frontpage dt {
	margin-top: 0.5rem
}

.frontpage dt:first-of-type {
	margin-top: 0;
}

.frontpage dd {
	display: inline-block;
}

.frontpage .level svg {
	width: 2rem;
	height: auto;
}

#profile_compare_output tbody td {
	position: relative;
}

#profile_compare_output tbody td[title]:hover::after {
	background-color: rgba( 0,0,0,0.2 );
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}


#profile_compare_output .done {
	color: hsl(140,100%,30%);
}

#profile_compare_output .cancel {
	color: hsl(180,90%,30%);
}

#profile_compare_output .level5 {
	background-color: hsla(140,100%,70%,0.6);
}

#profile_compare_output .level4 {
	background-color: hsla(140,95%,70%,0.4);
}

#profile_compare_output .level3 {
	background-color: hsla(160,90%,70%,0.4);
}

#profile_compare_output .level2 {
	background-color: hsla(180,80%,70%,0.4);
}

#profile_compare_output .level1 {
	background-color: hsla(200,80%,70%,0.3);
}

#profile_compare_output .center {
	text-align: center;
}

#profile_compare_output .sortable {
	transition: all 0.2s ease-out;
	cursor: pointer;
}
#profile_compare_output .sorting_asc,
#profile_compare_output .sorting_desc,
#profile_compare_output .sortable:hover {
	background: #555;
	color: hsl( 140, 100%, 80% );
}

#profile_compare_output .sortable:before {
	display: inline-block;
	display: inline-block;
	width: 0.6rem;
	height: auto;
	margin-left: -0.3rem;
	position: absolute;
	left: 50%;
}

#profile_compare_output th {
	text-align: center;
	position: relative;
}

.sorting_asc::before {
	content: url( "img/sort-up-solid-green.svg" );
		margin-top: 1.1rem;

}

.sorting_desc::before {
	content: url( "img/sort-down-solid-green.svg" );
	margin-top: 0.8rem;
}

#multi_profile_compar tbody tr:nth-of-type(odd) {
	background-color: #eee;
}

/*#multi_profile_compare .icons.small {
	
	width: 0.9rem;
}*/

#profile_compare_output .icons.small,
#profile_compare_output input[type="checkbox"] {
margin-right: 0;
}

#profile_compare_output select {
	margin-right: 2rem
}

#profile_compare_output .drop_in {
	animation: drop_in 0.2s ease-out 1;	
	animation-fill-mode: forwards;
	transform: scale(0.3); 
}

thead img {
	transition: filter 0.15s ease-out
}


.sorting_desc img,
.sorting_asc img,
thead th:hover img {
	filter: sepia(1) brightness(2) hue-rotate(60deg) saturate(2);
}

#profile_compare_output thead tr,
#profile_compare_output th {
	background-color: #ccc;
}



.frontpage caption,
#profile_compare_output caption {
	font-weight: bold;
	text-align: left;
}

#profile_compare_output table {
	border-collapse: collapse;
	width: auto;
	border: none;
	 border: 1px solid #999;
}


#profile_compare_output td,
#profile_compare_output th {
	border: 1px solid #999;
	border-collapse: unset;
	background-clip: padding-box;
}

#profile_compare_output .green {
	color: hsl(140, 80%, 40%);
}



.vcenter {
	vertical-align: middle!important;
}

.hcenter {
	text-align: center!important;
}

#profile_compare_output caption {
	margin-bottom: 0.5rem;
	clear: both;
}

#profile_compare_output caption .right {
	float: right;
}


#profile_compare_output .border_right {
	border-right: 0.33rem solid #aaa ;
}

#profile_compare_output tfoot td {
	background-color: #aaa;	
		padding: 2rem 3rem 1rem 3rem;
}



#profile_compare_output th.title {
	max-width: 10rem;
}

#profile_compare_output th,
#profile_compare_output td {
	padding: 0.5rem;
}

#profile_compare_output .stufen {
	max-width: 5ch
}

table.frontpage tfoot .green {
	color: hsl( 140, 100%, 70% );
}

.frontpage tfoot td {
	color: #fff;
	background: #555;

}


.frontpage .lernsituation p {
	font-weight: normal;
	max-width: 50ch;
	line-height: 1.5;
}

.single-kompetenzraster .entry-title {
	font-size: 5rem;
	
}

.ls_id {
	font-weight: bold;
}

.frontpage .preview_cell {
	width: 9rem;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	border: none;
}

/*.frontpage img.preview {
	width: 100%;
	height: auto;
	max-width: none;
}*/

.frontpage th {
	background: #ccc;
	text-align: left;
	color: #555;
}


.frontpage dd {
	opacity: 1;
	max-height: none;
	background: transparent;
	margin: 0;
	padding: 0;
}


.frontpage dl {
	margin-top: 0
}


.KMBCTnK td label::before {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: transparent;
	transition: background-color 0.3s ease-out;

}


.start_material .item {
	display: inline-block;
	padding: 1rem;
	margin-right: 1rem;
	max-width: 36ch;
}

.fazit_box select,
.fazit_box .quality-rating {
	width: 30ch;
}

.fazit_box .quality-rating {
	display: inline-block;
}


.KMBCTnK td:hover label::before {
	background-color: hsla( 130, 100%, 92%, 1 );
}

.KMBCTnK input:checked + label::before {
	background-color: hsla( 140, 100%, 85%, 1 );	
}

.KMBCTnK input:checked + label .text_wrap {
	font-weight: bold;
}

.KMBCTnK td:hover input:disabled + label::before {
	background-color: transparent;
}


#briefing_container {

}

.arnold_avatar { 
  width: 5rem;
  height: auto;
  margin-right: 2rem;
}


#intro_box {
  transform: translateX( -900px );
}

/*#intro_box .transport_avatar{
 transform: translateX( -600px );
}*/


/*.tube_container {
    position: relative;
    height: 0;
/*    padding-bottom: 56.25%;
    width: 40%;
}*/


.responsive.tube {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
/*    height: 100%;*/
}


#intro_box .avatar {
	width: 6rem;
	height: auto;
	display: block;
	transition: all 0.5s ease-out;
}

#intro_box .avatar.movein {
	transform: translateX( -9rem ) scale( 0.7 );
}


.licence_info {
	margin-top: 1rem;
}


.important_info {
	border-left: 1rem solid hsl( 140, 80%, 50% );
	padding: 1rem 1rem 2rem 1rem;
	display: inline-block;
	background-color: #eee;
	max-width: 46ch;
}


.licence_info img {
	width: 5rem
}

.spinner {
	width: 3rem;
	height: auto;
	margin-right: 1rem;
}


.KMBCTnK .text_wrap {
	position: relative;

}


.chose_destiny {
	margin-bottom: 2rem;
}


table


table td:nth-tof-type(1) {

}


.KMBCTnK th {
	background-color: #ccc;
	text-align: left;
	color: 999;
}

.KMBCTnK th, 
.KMBCTnK td {
	
}


.KMBCTnK td.thema {
	font-weight: bold;
	color: #999;
}

th.thema {
	min-width: 8rem
}


th.stufe {
	width: 18%
}


table {
	line-height: 1.2;
}


table tbody tr:nth-of-type(odd) {
	background-color: #eee;
}

table tbody tr:nth-of-type(even) {
	background-color: #f4f4f4;
}


table .block_max {
	max-width: 50ch;
	display: block;
}

.wasted_pic {
	position: fixed;
    bottom: 0;
    width: 72vw;
    left: 50%;
    transform: translateX(-50%);
    max-width: 50rem;
    z-index: 1;
   
}

.music_licence {
	position: fixed;
    bottom: 1rem;
    left: 1rem;
    color: #733;
    z-index: 5;
}

/*.work_check {
	transform: scale(1.8);
}
*/
#ticket_sort_container {
	transition: all 0.6s ease-out
}


#ticket_sort_container.big {
  background: #fff;
  padding: 2rem;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  font-size: 1.5rem!important;
  z-index: 9999999999999999;
}

#ticket_sort_container table {
	width: 100%
}

#ticket_sort_container table .bold {
	font-weight: bold;
}
/*.chatzone {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}*/

article.intro {
  max-width: 36ch;
  margin-bottom: 2rem;
  color: #777;
  background: #eee;
  padding: 1rem;  
  transition: all 0.3s ease-out;  
  font-weight: bold;
  border-left: 1rem solid hsla( 140, 80%, 50%, 0 );
}

article.intro.start {
	border-left: 1rem solid hsl( 140, 80%, 50% );
	font-size: 1.08rem;
	color: #000;

}




.check_block select {
	margin-right: 1rem;
	transition: background-color 0.2s ease-out;
}


.ticket .done,
.job_status.done,
#profile_compare_output .job_status.done {
	background-color: hsl( 140, 90%, 80% );
	color: #000;
}

.ticket .cancel,
.job_status.cancel,
#profile_compare_output .job_status.cancel {
	background-color: hsl(200, 78%, 85%);
		color: #000;
}


#chartjs-tooltip .done,
.done_list li::before {
	color: hsl( 140, 90%, 40% );
}

#chartjs-tooltip .cancel,
#chartjs-tooltip .undone_list li::before {
	color: hsl( 200, 70%, 40% );
}


.flow.flow0 {
	background-color: hsl( 200, 70%, 80% );
}

.flow.flow1 {
	background-color: hsl( 180, 70%, 80% );
}

.flow.flow2 {
	background-color: hsl( 160, 70%, 80% );
}

.flow.flow3 {
	background-color: hsl( 150, 80%, 80% );
}

.flow.flow4 {
	background-color: hsl( 140, 90%, 80% );
}

.check_judge p {
	margin-bottom: 0.5rem;
}


.check_judge label {
	display: flex;
	align-items: baseline;
}

.save_area {
	display: flex;
	
}

/*.save_area > * {
	padding: 1rem;
	font-size: 10px;
}*/


#checklisten_zusatz .check_judge {
	margin-bottom: 3rem;
}


.dropzone {
	margin: 0;
	width: 44%;
}

.save_status {
	background-color: #eee;
}

.check_judge table {
	width: auto;
	margin-top: 0;
	vertical-align: middle;
	background-color: #eee;
	box-shadow: none;
	border: none;
	/*margin-left: 2rem;*/
}

.check_judge table td {
	padding: 1rem;
}

.check_judge ul {
	margin: 0;
}

.frontpage dt {
	font-weight: normal;
}

.frontpage {
	line-height: 1.5!important
}

/*.check_judge .fazit {
	background-color: #eee;
	display: inline-block;
	padding: 1rem 2rem 1rem 1rem;
	border-left: 1rem solid hsl( 140, 100%, 70% );
}*/


.check_block .panel {
	background-color: #eee;
}

#download_stack ,
.check_judge .fazit select,
.fazit_box .quality-rating {
	margin-right: 1rem;
}

#colophon {
	transition: box-shadow 0.3s ease-out;
	z-index: 99;
}

#colophon.sticky {
	position: sticky;
	bottom: 0;
	box-shadow: 0 0 2rem rgba( 0, 0, 0, 0.3 );
	z-index: 99;
}


.source_container.loading {
	background: #eee;
	margin-bottom: 1rem;
	padding: 1rem;
}

.chatzone {
	display: grid;
	grid-template-columns: 1.5fr 1.5fr 1fr; 
	grid-template-rows: 1fr;
	grid-gap: 4rem;
}


#briefing_message {
	grid-column: 1 / span 1;
	grid-row: 2 / span 1;
}


#help_container {
	grid-column: 2 / span 2;
	grid-row: 1 / span 1;
}

#page h3,
#chartjs-tooltip h3 {

  font-weight: bold;
  font-size: 1.5rem;
  margin-bottom: 0.3rem;
  padding-top: 0;

}


#page #logo {
	margin: -1rem 0 0 1rem;
}


.grey {
	margin-bottom: 2rem;
}

.brown p,
.grey p {
	margin-bottom: 1rem;
	margin-top: 1rem;
}

/*#briefing_message p:hover::before {
	content: attr( data-stufe );
	position: absolute;
	margin-left: -2.5rem;
	margin-top: -0.5rem;
	background: hsl( 100, 100%, 90% );
	padding: 0.5rem;
}*/


.btn .icons {
	height: 2.2rem;
	width: auto;
}


/*#btn_briefing {
	margin-right: 2rem;
}*/

#load_status {
	background: #eee;
	padding: 1rem;
  	border: dashed 0.25rem transparent;
  	min-height: 10rem;
}

#compare_status {
	padding-top: 1rem;
}

#load_status.drop_hover {
	background-color: hsl( 140, 80%, 92% );
	border: dashed 0.25rem hsl( 140, 80%, 50% );
}

#load_status.ready {
	background: #eee;
	color: #555;
}

#load_status.ready .green {
	color: hsl( 140, 80%, 40% );
}

.material_message {
	max-width: 60ch;
	margin-bottom: 2rem
}

.source_container {
	margin-bottom: 2rem;
}

.source_container ul {
	list-style-type: none;}

#page .source_container ul li {
	list-style-type: none;}


.material_message p,
.check_message .grey {
  	padding: 1rem;
  	background: #eee;
  	
}

#briefing_message p {
	transition: background 0.15s ease-out;
}


#briefing_message_2 ol {
  counter-reset: item;
}

#briefing_message_2 ol > li,
#chartjs-tooltip li {
  margin: 0;
  margin-bottom: 0.5rem;
  padding: 0 0 0 0.75rem;
  text-indent: -0.75rem;
  list-style-type: none;
  counter-increment: item;
}

#briefing_message_2 ol > li:before,
#chartjs-tooltip li::before {
  display: inline-block;
  width: 1rem;
  padding-right: 0.5rem;
  font-weight: bold;
  text-align: right;
  content: counter(item) ".";
}

#chartjs-tooltip li::before {
  content: "■"
}

#briefing_message_2 .star_set {
	display: inline-block;
	height: 1rem;
	width: auto;
}

#briefing_container .check_message p {
	padding: 0;
}

.check_message .grey .button_container {
margin-bottom: 0
}


.help_container .check_message {
	grid-template-columns: 1.5fr 1fr;
    grid-template-rows: 1fr;
    grid-gap: 4rem;
    display: grid;
}

#main #briefing_container_2 {
  border-left: 0 solid transparent;
  margin-bottom: 5rem;  
  transition: all 0.2s ease-out;

  /*background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 8%)*/;
}


#main #briefing_container_2.sticky {
  position: sticky;
  bottom: 5rem;
  margin-bottom: 0;
  border-left: 1rem solid hsl( 140, 60%, 50% );
  box-shadow: 0 -0.15rem 0.3rem rgba( 0, 0, 0, 0.4 );
  max-height: 20vh;
  overflow: hidden;
}

#main .big {
	font-size: 1.15rem;
	padding-bottom: 0!important;
}

 #main #briefing_container_2 p:last-of-type {
 	padding-bottom: 3rem;
 }


#main #briefing_message_2 p,
#main #briefing_message p {
	
	grid-column: 1 / span 1;
	
}


.brown {
	background: hsl( 20, 40%, 90% );
	padding: 1rem;
}



#briefing_container .arnold_avatar:not(.flipped) {
	filter: sepia(0.6) brightness(0.9) hue-rotate(-5deg) saturate(0.8);
}


#help_message {

}

.check_block label {
	font-weight: normal;
}


.check_block {
	margin-bottom: 2rem;
}

.flipped {
	transform: scaleX( -1 );
}


#page {
	transition: filter 0.3s ease-out
}

body.wasted {
	background-color: #100;
}

body.wasted #page {
	opacity: 0.3;
	filter: blur(2rem) brightness(50%);
}



body.wasted .wasted_message h1{
	position: fixed;
	top: 20vh;
	left: 0;
	right: 0;
	padding: 2rem;
	font-size: 5rem;
	color: #fff;
	font-weight: bold;
	border-top: 0.5rem solid red;
	border-bottom: 0.5rem solid red;
	text-align: center;
	background-color: rgba( 0, 0, 0, 0.5 );
	box-shadow: 0 0.5rem 3rem #000;
}


.chat_name {
	transform: translate( -1.8rem, -0.5rem );
  	display: inline-block;
}



.accordion_thema {
	margin-left: 3rem;
} 


.accordion-container .open_close {
	width: 2rem;
	margin-top: -0.2rem;
	height: auto;
	transform: rotate( -495deg );
	transition: transform 0.6s ease-out;
	position: absolute;
}


.accordion-container .open_close.edit {
	transform: unset;
	right: 1rem;
	height: 1.5rem;
	width: auto;
	margin-top: 0;
}


.accordion img {
	opacity: 0.33
}


.accordion-container {
	position: relative;
}



.edit_on .lock {
	display: none;
}

.edit_off .unlock {
	display: none;
}


a:hover .icons.download {
	animation: download 0.6s alternate infinite ease-in;
}

@keyframes download {
	  0% { transform: translateY( 0 ); }
	100% { transform: translateY( 0.2rem );}
}



.resp-tab-item .icons,
.ghost .btn img {
	width: auto;
	height: 1.7rem;
}

.ghost img {
	opacity: 0.6
}

.icons {
	width: 2rem;
	height: auto;
	margin-right: 0.5rem;
}

.icons.small {
	width: 1.3rem;
}


thead .icons.small {
	height: 1rem;
	width: auto;
}


.accordion-container.active .open_close {
	transform: rotate( 0 );
}


.preview_ressource_img {
	width: 7rem;
	height: auto;
	display: block;
	margin: 0 auto 1rem auto;
}

.ressource_container[data-material-type="code_url"] .clipper {
/*	overflow: hidden;
	width: 30rem;
	height: 18rem;
	background: #000;*/
	
}

iframe.unloaded {
	display: none;
}

.youtube_loading {
	
	color: hsl( 140, 100%, 90% );
}

.unloaded + .youtube_loading {
	display: block;
}

.ressource_container .link_title {
color: #000;
  max-width: 32ch;
}



.ressource_container h3 {
	margin: 0;
	padding: 0;
}

.ressource_container .code_logo {
 
  width: 2.5rem;
  margin-left: -0.75rem;
  margin-top: -0.75rem;
  position: absolute; 
}


.ressource_container[data-material-type="code_url"] .code_info {
	
}


.ressource_container {
	position: relative;
	background: #fff;
	padding: 1rem;
	margin: 1.5rem;
	text-align: left;
	align-self: flex-start;
}


.source_container .panel {
	background: #eee
}


.contact_area form {
	margin-left: 0;
	margin-right: 0;
}


.contact_area .wpcf7-submit {
	font-size: 1rem
}

.contact_area .wpcf7-list-item {
	margin-left: 0;
}


.contact_area small {
	font-weight: normal;
}

.contact_area {
	background: hsl(140,100%,80%);
	padding-bottom: 4rem;
}
/*.contact_area::before {
	position: absolute;
	content: '';
	height: 30vh;
	background: : red;
	left: 0;
	right: 0;
	z-index: 0
}*/







.abs_area {
	position: relative;
	height: 100vh;
	width: 100vw;
	box-shadow: inset 0 2rem 8rem rgba( 0, 0, 0, 0.7 );
	overflow: hidden;
}

.abs_area img {
	width: 5rem;
	height: auto;
	display: block;
}

.abs_area .fullsize_background {
	width: 100%;
	height: auto;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}


.abs_area blockquote {
	position: absolute;
	font-style: normal;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(255,255,255,0.98);
	padding: 4rem 3rem 3rem 3rem;
	text-align: center;
	border-left: 3rem solid hsl(160, 100%, 50%);
	border-top-right-radius: 5rem;
}


.ressource_container[data-material-type="youtube"] .info {
	position: absolute;
	margin-top: -1rem;
}


.info .datenschutz {
	margin-left: 1rem;
}


.ressource_container[data-material-type="youtube"] {
	background: #000;
	padding-bottom: 30%;
    width: 43%;
    height: 0;
    padding-top: 0;
    overflow: hidden;

}


#main select {
	max-width: none;
}

.ressource_container[data-material-type="code_url"] header {
	display: flex
}

.ressource_container p,
header .text_box {
	max-width: 38ch;
}

.ressource_container[data-material-type="code_url"] iframe {
/*	width: 1600px;
	height: 1100px;
	transform: scale(0.33) translateX( -5% );*/
	transform-origin: top left;
	max-width: none;
	pointer-events: none;
	margin-bottom: 0;
	max-height: 7rem;
	  padding: 0.5rem;
	  background: #eee;
	  border: none;
}



.ressource_container iframe.mobil_portrait {
	width: 7rem;
	height: 14rem;	
	position: absolute;
	right: 1rem;
	top: -0.25rem;
	transform: rotate( 2deg );
	max-height: 14rem;
	background: transparent;
}

.source_container .panel {
	display: flex;
	flex-wrap: wrap;
}

.ressource_container:first-of-type {
	margin-left: 0;
}



.ressource_container[data-material-type="buch"],
.ressource_container[data-material-type="pdf"] {
	padding: 1rem 1rem 1.5rem 1rem;
}

.ressource_container[data-material-type="buch"] {
	max-width: 50ch;
}


/*Yes / No Toggle*/


@media ( max-width: 30rem ) {
	.KMBCTnK thead{
		display: none; 
	}
	.KMBCTnK td{
		display: block; 
	}

	#logo svg{
		display: none;
	}
}


@media ( max-height: 900px ) {

	html {
		font-size: 12px;
	}

	#herkules_silhouette {
		top: -1rem;
	}

	.meta_qm_logo {
		width: 9rem;
		margin-left: -8rem;
		margin-top: -3rem;
	}

	header h1 .outline {
		font-size: 1.5rem;
		line-height: 1.5rem;
	}

	#page header h1 {
		font-size: 2rem;
		padding-top: 2rem;
	}

	#page .entry-title {
		font-size: 3rem
	}

	#page .site-header {
		height: 7rem;
	}

	#colophon #logo {
		max-width: 20rem;
		display: block;
	}

	#colophon svg {
		max-width: 20rem;
	}
	
	#colophon .details {
		margin-top: 0;
	}
}


@media (min-width: 782px) {
	.wp-block-column:not(:first-child) {
		margin-left: 4rem;
	}
}


#wpadminbar {
	z-index: 9999999999999999;
}