.warning-modal .modal-content {
	
/* 	height: 150px !important; */
	background-color: #f3f3f3 !important;
	margin-top: 5rem;
	width: 80%;
	margin-left: 4rem;
}

.modal-warning {
	color: red !important;
	margin-left: 15px;
}
.warning-table-range {
	margin-left: 14px !important;
}
.modal-warning-span {
	margin-left: 10px;
}
.modal-warning-info {
	display: block !important;
	margin-left: 27px !important;
}
.modal-warning-type, .modal-warning-typechange {
	color:red;
	margin-left: 14px !important;
	display: flex;
}
.modal-warning-range {
	color: red;
}
.modal-warning-range label {
  margin-bottom: 1rem !important;
  top: 0.5rem !important;
}



.monthpickerCustom {
	display:inline-block; 
	font-weight:bold;
}

.monthpickerCustom input {
	max-width: 150px !important;
	margin-left: 15px;
	margin-bottom: 15px;
}


.episodesTable .table-responsive {
    overflow-x: inherit !important;
}


.episode_color {
	display: block;	
	width: 1rem; 
   height: 1rem; 
}


.bootstrap-fs-modal .modal .modal-dialog .modal-content .modal-footer .btn[data-dismiss="modal"], .modal.modal-fullscreen .modal-dialog .modal-content .modal-footer .btn[data-dismiss="modal"] {
  display: flex !important;
}
.modal-content .modal-footer {
  		justify-content: space-between !important;
}
.modal-dialog .modal-footer .btn {
  font-size: 1.2rem !important;
}
.modal-content .modal-header {
  justify-content: center !important;
}


.modal-dialog .start-before-label {
	top: -10px;
	margin-bottom: 10px;
}
.modal-dialog .end-continues-label {
	top: -21px;
	margin-bottom: 1px;
}

.modal-dialog .start-before-label-table {
	top: -9px;
	margin-bottom: 10px;
}
.modal-dialog .end-continues-label-table {
	top: -10px;
	margin-bottom: 1px;
}
.modal-body .form-group:nth-child(4) {
	margin-top: 25px !important;
}

.monthpickerCustom input {
  font-size: 1.2rem !important;
}

@media ( min-width : 768px) { 
	
	.modal-content .modal-title {
	  font-family: "Open Sans",sans-serif !important;
	  font-weight: 400 !important;
	}
	
	.monthpickerStart {
		margin-top: 20px;
	}
	.modal-header .close {
		display: none !important;
	}
	
	.modal-dialog .custom-select, .modal-dialog input {
		font-size: 1.2rem !important;
	}

/* 	.modal-dialog .modal-footer .btn { */
/* 	  font-size: 1.2rem !important; */
/* 	} */
}

@media ( max-width : 767px) { 
	.modal-dialog {
/* 		color: yellow !important; */
/* 		border: 2pt solid red; */
		width: 90% !important;
		max-width: 90% !important;
		max-height: 70% !important;
		margin-left: 2rem !important;
		margin-top: 2rem !important;
		font-size: 1.2rem !important;
	}	
	.modal-content .modal-title {
	  font-family: "Open Sans",sans-serif !important;
	  font-weight: 400 !important;
	  font-size: 1.6rem !important;
	}
	.modal-dialog .custom-select {
		font-size: 1.2rem !important;
	}
/* 	.bootstrap-fs-modal .modal .modal-dialog .modal-content .modal-footer .btn, .modal.modal-fullscreen .modal-dialog .modal-content .modal-footer .btn { */
/* 	  font-size: 1.2rem !important; */
/* 	} */
/* 	.modal-dialog .modal-footer .btn { */
/*   font-size: 1.2rem !important; */
/* } */
	.modal-body .form-group:nth-child(4) {
		margin-top: 35px !important;
	}
	.modal-header .close {
		display: none !important;
	}
	.modal-header .modal-title {
		margin-left: 3rem;
	}
	.modal-content .modal-footer {
  		position: inherit !important;
  		background: none !important;
  		justify-content: space-between !important;
	}
	
	/******************/
	.modal-content .modal-footer .btn {
	  -moz-box-align: baseline !important;
	  align-items: baseline !important;
	  border-radius: 4px !important;
	  display: inline-flex !important;
	  white-space: initial !important;
	}
	.modal-content .modal-footer .btn-primary {
	  background-color: #006ab2 !important;
	  border-color: #006ab2 !important;
	  color: #fff !important;
	}
	.modal-content .modal-footer .btn-default {
	  background-color: #eeeeec!important;
	  color: #000000!important;
	}
	
	.modal-content .modal-footer .btn {
	  -moz-user-select: none !important;
	  border: 1px solid transparent !important;
	    border-top-color: transparent !important;
	    border-right-color: transparent !important;
	    border-bottom-color: transparent !important;
	    border-left-color: transparent !important;
	  display: inline-block !important;
	  font-size: 1.2rem !important;
	  font-weight: 400 !important;
	  line-height: 1.25 !important;
	  padding: 0.375rem 1rem !important;
	  text-align: center !important;
	  transition: all 0.2s ease-in-out 0s !important;
	  vertical-align: middle !important;
	  white-space: nowrap !important;
	}
	/******************/
}



.custom-calendar .calendar-table {
	display: block !important;
	width: 100% !important;
	margin-top: 2rem;
} 

.custom-calendar .calendar-table .row {
	width: 100% !important;
	margin-bottom: 1rem !important;
} 
.calendar-table .col-10 {
	display: grid !important;	
}
.calendar-table .col-2 {
	display: grid !important;	
}

.calendar-table .col-2 input {
/* 	background-color: transparent; */
/* 	border: none;	 */
}

.calendar-table .row {
/* 	border: 1px solid #f0f0f0;	 */
	border-bottom: 1px solid #f0f0f0;
}
.calendar-table .cal-button {
/* 	display: contents !important; */
/* 	color: red !important; */
}

.calendar-table .col-id {
	display: ruby;
}


.svg-edit {
/* 	background-color: #e5f0f7; */
	
}
.svg-delete {
/* 	background-color: #e5f0f7; */
}



.event-start-month, 
.event-end-month 
{
	width: 35% !important;
	margin-left: 2rem;
}
.event-start-year, .event-end-year {
	width: 30% !important;
}


.zo-tooltip {
	margin-left: 1.5rem;
}
.tooltip-inner {
  background-color: lightgrey;
  color: black;
  max-width: 180px;
  padding: 3px 8px;
  text-align: center;
  font-size: 1.0rem !important;
}
.zo-tooltip-image {
	width: 1.5rem;
}


.warning-modal .modal-content {
	
/* 	height: 150px !important; */
	background-color: #f3f3f3 !important;
	margin-top: 5rem;
	width: 80%;
	margin-left: 4rem;
}

.zo-episode-table-range {
	color: red !important;
	display: flex;
}



.modal-warning {
	color: red !important;
	margin-left: 15px;
}
.warning-table-range {
	margin-left: 14px !important;
}
.modal-warning-span {
	margin-left: 10px;
}
.modal-warning-info {
	display: block !important;
	margin-left: 27px !important;
}
.modal-warning-type, .modal-warning-typechange {
	color:red;
	margin-left: 14px !important;
	display: flex;
}
.modal-warning-range {
	color: red;
}
.modal-warning-range label {
  margin-bottom: 1rem !important;
  top: 0.5rem !important;
}

.warning-modal .modal-content {
	
/* 	height: 150px !important; */
	background-color: #f3f3f3 !important;
	margin-top: 5rem;
	width: 80%;
	margin-left: 4rem;
}

/*
	!!!!!!!!!!!!!!
	
	Bitte NUR in dem Fall weitere MEDIA QUERRIS definieren, wenn die gewünschte MIN/MAX-Width 
	noch NICHT vorhanden ist.
	Ansonsten bitte nur innerhalb der unten stehenden arbeiten
	 	
	!!!!! 
*/

@media ( max-width : 415px) { 
	

}
@media ( max-width : 767px) { 

	
}
@media ( min-width : 768px) { 
	
}

	

@media ( min-width : 1200px) { 

	
}
/*
	Monthpicker
*/

.monthpickerCustom {
	display:inline-block; 
	font-weight:bold;
}

.monthpickerCustom input {
	max-width: 150px !important;
	margin-left: 15px;
	margin-bottom: 15px;
}



input:focus {  outline: 4px solid #0081D6  }

select:focus {  outline: 4px solid #0081D6  }

textarea:focus {  outline: 4px solid #0081D6  }

a:focus {  outline: 3px solid  #0081D6  }

.img-fluid {
    max-width: 65%;
}

/* Start Accordion*/


.containerAcc {
	padding-bottom: 5px;
}

.containerAcc div {
	width: 100%;
	text-align: left;
}

.containerAcc .headerAcc {
	background-color: #e5f0f7 !important;
	cursor: pointer;
	font-weight: bold;
	border-left: 6px solid grey;
	padding: 10px;
}

 .headerAcc { 
  position: relative;
}

.headerAcc:after {
  content: "\25B6";
  color: #777;
  font-weight: bold;
  float: left;
  margin-left: 5px;
  margin-top: -2rem;
}

.containerAcc > .active:after {
  content: "\25BC";
}
.containerAcc .collapseDiv {
	display: none;
	padding: 10px;
}

.containerAcc .headerAcc .title-text 
{
    margin-left: 30px;
}

/*END Accordion*/


.logout-icon {
	padding-left: 2rem;
	/*width: 33.3333%;*/
}

.logout-icon img {
	height: 22px;
	max-width: initial !important;
}


/*CHECK: VD*/
/* Bugfix Overlapping long labels on small screens*/
@media ( max-width : 992px) {
	.form-horizontal .custom-form.custom-form.custom-form-radio .custom-control-description
	{
		top: -30px;
	}
}

/* Bugfix Overflowing highlight box before wrap in Carousel-Mode*/
@media ( max-width : 766px) {
	.custom-form.custom-form-radio.make-2-cols .custom-control-description {
		min-width: 25vw !important;
	}
}

/* Bugfix Overflowing highlight box before wrap in Carousel-Mode*/
@media ( min-width : 767px) {
	.custom-form.custom-form-radio.make-2-cols .custom-control-description {
		min-width: 5vw !important;
		font-size: 1vw;
	}
}

@media ( min-width : 1200px) {
	.custom-form.custom-form-radio.make-2-cols .custom-control-description {
		min-width: 10rem !important;
		font-size: 1.2rem;
	}
}




.openmatrix .row label input {
	max-width: 50px !important;
	margin-top: 5px;
}

@media ( max-width : 767px) {
	.openmatrix .carousel-item.active {
        display:table;
        margin: 0 auto;
     	width: 100px; 
	} 
	
	.openmatrix .carousel-item.active label {
        display:table-row;
	} 
	
	.openmatrix .carousel-item.active label .prefix{
        display:table-cell;
        padding-right : 10px;
        padding-left : 10px;
	} 
	
	.openmatrix .carousel-item.active label .column{
        display:table-cell;
        padding-right : 10px;
        padding-left : 10px;
	} 
	
	.openmatrix .carousel-item.active label input{
        display:table-cell;
        max-width: inherit !important;
        margin-right : 10px;
	} 
	
	.openmatrix .carousel-item.active  label:first-of-type{
        padding-top : 15px;
	} 
	
	.openmatrix .carousel-item.active label:last-of-type input{
        margin-bottom : 10px;
	} 
}

	.calendar .calendar-row-container .calendar-row .cover{
		position: absolute !important;
		z-index:5;
	}


.comparison .row:not(:nth-child(1) ) .custom-control label .custom-control-description .label
	{
	display: none;
}

@media ( min-width : 767px) {
	.comparison .row .custom-control label .custom-control-description
		{
 		margin-top: inherit !important;
	}
}

.comparison .row:not(:nth-child(1) ) .custom-control label .custom-control-description .label
	{
	display: none;
}


@media ( min-width : 768px) {
	.custom-form-checkbox .flex-wrapper .custom-checkbox .custom-control-description
	{
		top: 0px !important;
		padding-bottom: 50px;
	}
	.comparison .row .custom-control label .custom-control-description {
		margin-top: inherit !important;
	}
	
	.openmatrix .row label:not(:first-of-type) input{
		margin-left:5px;
	} 
	
	.openmatrix .row:first-of-type{
		margin-bottom:5px;
	} 
	
	.openmatrix .row:not(:first-of-type){
		margin-top:5px;
	} 
	
	.openmatrix .row label .column {
			position: absolute;
			-moz-transform: translate(25px, -25px);
			-ms-transform: translate(25px, -25px);
			-o-transform: translate(25px, -25px);
			-webkit-transform: translate(25px, -25px);
			transform: translate(25px, -25px);
		}
	
	.openmatrix .row label input {
		max-width: 6rem !important;
	}
	
	.openmatrix .row:not(:nth-child(1)) label input{

	}
	
	.openmatrix .row label .prefix {
		display : none !important;
	}
	
	.openmatrix .row:not(:nth-child(1)) label .column {
		display : none !important;
	}
	
	.zofar_openmatrix_error_tooltip .tooltip-inner{
		background-color: red !important;
		color: #fff;
		opacity: 0.75;
	}
	
	
	/*Bugfix misselected AnswerOption in first row of Matrix*/
 	 article:not(.openmatrix) .row label {
			position: absolute;
			width: 0px;
	}

	.calendar .calendar-row-container .calendar-row .calendar-slot{
		position: inherit !important;
	}
	
	
	article:not(.openmatrix) .row:first-of-type label .custom-control-description{
			position: absolute;
			-moz-transform:  translate(-55px, 10px);
			-ms-transform: translate(-55px, 10px);
			-o-transform: translate(-55px, 10px);
			-webkit-transform: translate(-55px, 10px);
			transform: translate(-55px, 10px);
	} 
	
	article:not(.openmatrix) .carousel .row .text-sub {
/* 	ToDo:  */
/* 		padding-top: 15px !important; */
	}
	.carousel .row .text-sub {
	    display: flex !important;
	}
	
	
	/* Textfields under AnswerLabel on small screens*/
	.attached {
		max-width: 70% !important;
	}
	.custom-control-description .attached {
		margin-left: 5px;
		margin-top: 0px;
	}
	.custom-control-description .attached input[type="text"] {
		width: auto;
		max-width: 70%;
		font-size: 1.2rem !important;
		line-height: 1.3 !important;
		flex-grow: 1;
	}

	.text-sub .attached {
		/* color: orange; */
		position: relative;
		top: 0px;
		margin-left: 5px;
		margin-top: 3px;
		width: 100%;
	}
	.text-subdropdown {
		/* color: orange; */
		position: relative;
		top: 0px;
		margin-left: 5px;
		margin-top: 3px;
		width: 100%;
	}

	/* Small Textfields on small screens*/
	.attached input[type="text"] {
		width: 100%;
	}

	/* No Breaks in Labels on small screens*/
	.custom-control-description br {
		display: inline;
	}

	/* Labels over Row Items */
	.row .custom-control-description {
		/*margin-bottom: 44px;*/
		/* margin-top: -42px !important; */
		$(
		this).parents('.row').css("property","value");
	}

	/* No Breaks in Matrix Labels on big screens*/
	.row .custom-control-description br {
		display: none;
	}
	.row .custom-control-description {
		word-wrap: break-word;
	}

}




/*
	ToDo:  genauer zu prüfen
*/
@media ( min-width : 0px) {
	fieldset {
		min-width: min-content !important;
	}
}

					
/*	
		TEMPLATES
*/
	.custom-PAGE article:not(.openmatrix) .row:first-of-type label .custom-control-description
	{
		position: relative !important;			
	} 


/*
	Header im Contentbereich einer Page absetzen
*/
	.custom-PAGE #form\:PAGE\:UID header {
		margin-bottom: 10px;
	}


/* 	Unit und Unit-Text ausblenden */
	.custom-PAGE fieldset 
	{
		border: none !important;
		background:inherit;
	}
	.custom-PAGE fieldset legend 
	{
		display: none;
	}	

/* 
	Verbindungslinien/Pipes transparent machen
*/
/* .custom-PAGEUID .add-pipe::before */
/* { */
/* 	background-color: transparent; */
/* } */

/*
	Breite von Unit in einfachen Singlechoice und Multiplechoice optimieren
*/
.custom-PAGE fieldset 
{
	min-width: min-content !important;
}

/*
	Zeilenhöhe verringer SingleChoice
*/
	.custom-PAGE .custom-form.custom-form-radio .custom-control
	{
	    height: 5px !important;
	}

/*
	ein BEISPIEL für die Optimierung von Title in Matrizen
*/
	@media ( min-width : 415px) {
		.custom-PAGE .survey-outer .question-main {
		    margin-bottom: -2.5rem;
		}
		.custom-PAGE .form-orientation:not(.form-vertical) .custom-form.custom-form-radio {
		    margin: 1.5rem auto;
		}
		.custom-PAGE .col-md-8 {
		    max-width: 50% !important;
		}
		.custom-PAGE .carousel {
		    padding-top: 20px;
		}
		.custom-PAGE .form-orientation:not(.form-vertical) .custom-form.custom-form-radio .custom-control-description {
		    top: -2.5rem;
		    margin-left: 0px;
		}
	}

/*Zeilenhöhe und "LUFTIG" verringern*/
@media ( min-width : 768px) {
	.custom-PAGE .survey-outer .question-main {
	    margin-bottom: 0rem;
	}
	.custom-PAGE .form-orientation:not(.form-vertical) .custom-form.custom-form-radio {
	    margin: 1.5rem auto;
	}
	.custom-PAGE .col-md-8 {
	    max-width: 50% !important;
	}
	.custom-C1_6 .carousel {
	    padding-top: 20px;
	}
	.custom-PAGE .form-orientation:not(.form-vertical) .custom-form.custom-form-radio .custom-control-description {
	    top: -2.5rem;
	    margin-left: 0px;
	}
}

/*
	ersten Text eines Types formatieren
*/
.custom-PAGE section .text-common:first-of-type
{
    font-size: 1.6rem !important;
    font-weight: 600 !important;
}

/*
	Itemlabel in Matrix linksbündig ausrichten
*/
	.custom-N_9b .form-inner .text-sub 
	{
	    justify-content: flex-start !important;
	    text-align: left !important;
	}


/*
	Länge des Inputfeldes ändern
*/
	.custom-PAGE input[type="text"]{
		max-width: 300px !important;
	}

/*
	ein BEISPIEL für die Optimierung der Title in einer MultipleChoiceMatrix
*/
	.custom-PAGE .question-instruction 
	{
		padding-bottom: 140px !important;
	}
	.custom-PAGE article:not(.openmatrix) .row:first-of-type label .custom-control-description {
	    position: absolute;
	    -moz-transform: translate(-45px, -130px) !important;
	    -ms-transform: translate(-45px, -130px) !important;
	    -o-transform: translate(-45px, -130px) !important;
	    -webkit-transform: translate(-45px, -130px) !important;
	    transform: translate(-45px, -130px) !important;
	}
	/*	NUR bei zu langen Itemlabel verwenden*/
	.custom-PAGE .row	 
	{
	    padding-bottom: 10px !important;
	}

/*
	erzwingt 2zeilige Label in SC Horizontal 
*/
	.custom-PAGE .form-horizontal .custom-form.custom-form-radio .custom-control-description
	{
	    min-width: 5rem !important;
	}

/*
	Optimierung für SC Horizontal
*/
	.custom-PAGE .form-horizontal .custom-form.custom-form-radio .custom-control-description  
	{
		min-width: 5rem !important;
	}
	.custom-PAGE  .form-horizontal .form-inner 
	{
	    margin-left: 2.5rem !important;
	    margin-right: 1rem !important;
	}

/*
	Fix für Matrix-Itemlabel mit Layoutproperties
*/
	.custom-PAGE .carousel .row .text-sub 
	{
	    display: inherit !important;
	}
	
/*
	Sonderfall: deaktivieren vom ersten Skalenitem in der ersten Row in einer Matrix
*/
	.custom-PAGE .row:nth-child(1) .custom-control:nth-child(1) .custom-control-indicator, 
	.custom-PAGE .row:nth-child(1) .custom-control:nth-child(1) input[type="text"]
	{
		display: none !important;
	}

/*
	eine kleine Optimierung für Accordion
*/
	.custom-PAGE .containerAcc .headerAcc div
	{
		margin-left: 30px;
	}

/*
	Sonderformatierung einer OpenMatrix	
*/
@media ( min-width : 1200px){
	.custom-PAGE .openmatrix .row .openmatrix-rdc label .prefix .xx{
 		font-size: 12px !important;
 	} 
 	.custom-PAGE .openmatrix .row .openmatrix-rdc label .column .text-common{
 		font-size: 12px !important;
 	}
 	.custom-PAGE .openmatrix .row .openmatrix-rdc label input{
 		max-width: inherit !important;
 		-moz-transform: translate(  25px, 0px);
		-ms-transform: translate(  25px, 0px);
	 	-o-transform: translate( 25px, 0px);
	 	-webkit-transform: translate( 25px, 0px);
	 	transform: translate( 25px, 0px); 
	} 
	.custom-PAGE .openmatrix .row .openmatrix-rdc label:first-of-type{
		margin-right:9vw !important;
	} 
}
@media ( min-width : 1000px) and ( max-width : 1199px){
	.custom-PAGE .openmatrix .row .openmatrix-rdc label .prefix .xx{
 		font-size: 1vw !important;
 	} 
 	.custom-PAGE .openmatrix .row .openmatrix-rdc label .column .text-common{
 		font-size: 1vw !important;
 	} 
 	.custom-PAGE .openmatrix .row .openmatrix-rdc label input{
 		max-width: 15vw !important;
 		-moz-transform: translate(  25px, 0px);
		-ms-transform: translate(  25px, 0px);
	 	-o-transform: translate(  25px, 0px);
	 	-webkit-transform: translate(  25px, 0px);
	 	transform: translate(  25px, 0px); 
	} 
 	.custom-PAGE .openmatrix .row .openmatrix-rdc label:first-of-type{
		margin-right:9vw !important;
	} 
}
@media ( min-width : 767px) and ( max-width : 999px){
	.custom-PAGE .openmatrix .row .openmatrix-rdc label .prefix .xx{
		font-size: 10px !important;
 	} 
 	.custom-PAGE .openmatrix .row .openmatrix-rdc label .column .text-common{
		font-size: 10px !important;
 	}
 	.custom-PAGE .openmatrix .row .openmatrix-rdc label input{
 		max-width: 15vw !important;
 		-moz-transform: translate(  25px, 0px);
		-ms-transform: translate(  25px, 0px);
	 	-o-transform: translate(  25px, 0px);
	 	-webkit-transform: translate(  25px, 0px);
	 	transform: translate(  25px, 0px); 
	} 
 	.custom-PAGE .openmatrix .row .openmatrix-rdc label:first-of-type{
		margin-right:9vw !important;
	} 
}


/*SingleChoice*/
/*
HIDE RADIO BUTTON in SingleChoice: 
Dies ist ein Beispiel, wo der Radiobutton in der ersten Answeroption versteckt wird und das Label ausgeblendet wird
*/
.custom-test_singlechoice2 .custom-radio:nth-child(1) label .custom-control-description span:nth-child(1), 
.custom-test_singlechoice2 .custom-radio:nth-child(1) label .custom-control-indicator, 
.custom-test_singlechoice2 .custom-radio:nth-child(1) label input[type="radio"] 
{
	display: none !important;
}
.custom-test_singlechoice2 .custom-radio:nth-child(1) label .custom-control-description span:nth-child(2) 
{
	margin-left: -26px !important;
	
}	


/*SingleChoice*/
/*
HIDE RADIO BUTTON in SingleChoice: 
Dies ist ein Beispiel, wo der Radiobutton in der ersten Answeroption versteckt wird, das Label aber bestehen bleibt
*/
.custom-test_singlechoice .custom-radio:nth-child(1) label .custom-control-indicator, 
.custom-test_singlechoice .custom-radio:nth-child(1) label input[type="radio"] 
{
    display: none !important;
}

.custom-test_singlechoice .custom-radio:nth-child(1) label .custom-control-description span:nth-child(1)
{
    margin-left: -15px !important;

}

/*MultipleChoice*/
/*
HIDE CHECKBOX in MultipleChoice: 
Dies ist ein Beispiel, wo der Radiobutton in der ersten Answeroption versteckt wird und das Label ausgeblendet wird
*/

.custom-test_multiplechoice2 .custom-checkbox:nth-child(1) label .custom-control-description span:nth-child(1), 
.custom-test_multiplechoice2 .custom-checkbox:nth-child(1) label .custom-control-indicator, 
.custom-test_multiplechoice2 .custom-checkbox:nth-child(1) label input[type="checkbox"] 
{
	display: none !important;
}
.custom-test_multiplechoice2 .custom-checkbox:nth-child(1) label .custom-control-description span:nth-child(2) 
{
	margin-left: -26px !important;
}

/*
HIDE CHECKBOX in MultipleChoice: 
Dies ist ein Beispiel, wo der Radiobutton in der ersten Answeroption versteckt wird, das Label aber bestehen bleibt
*/


.custom-test_multiplechoice .custom-checkbox:nth-child(1) label .custom-control-indicator, 
.custom-test_multiplechoice .custom-checkbox:nth-child(1) label input[type="checkbox"] 
{
	display: none !important;
}
.custom-test_multiplechoice .custom-checkbox:nth-child(1) label .custom-control-description span:nth-child(2) 
{
	margin-left: 5px !important;
}

.custom-test_multiplechoice .custom-checkbox:nth-child(1) label .custom-control-description span:nth-child(1) 

{
	margin-left: -25px !important;
}




/*
	TWO DROPDOWNS IN A ROW
*/
.custom-test_dropdown #form\:test_dropdown\:qsc2 {
    margin-top: -8.65rem;
    margin-left: 12rem;
}
@media (max-width: 767px) {
	.custom-test_dropdown #form\:test_dropdown\:qsc2 {
		margin-top: -7.8rem;
		margin-left: 12rem;
	}	
}

/*
	single choice visually demarcate missing category
*/

.custom-einfachauswahl_beispiel_ver #form\:einfachauswahl_beispiel_ver\:qsc5 .singlechoice-ismissing {
    height: 30px !important;
}

.custom-mehrfachauswahl_beispiel .checkbox-exclusive {
    height: 30px !important;
}



	/* https://github.com/dzhw/zofar/issues/389 */
	.form-orientation:not(.zo-pipes) .add-pipe::before{
		background-color: inherit !important;
	}
	

		.attached {
		max-width: 70% !important;
	}
	.custom-control-description .attached {
		margin-left: 5px;
		margin-top: 0px;
	}
	
	.custom-mehrfachauswahl_beispiel #form\:mehrfachauswahl_beispiel\:mc_3 .custom-checkbox-exclusive
	 {
	height: 6rem !important;
	}
	
	
	.custom-comparison #form\:comparison\:comparison2\:rd > div > div:nth-child(n) {
	
    margin-left: 4em !important;
    
	}
	
	
@media ( min-width : 768px) {
	/*
		Mehr Abstand zwischen Questiontext und Matrix
	*/
	.custom-singlechoicematrix_1 #form\:singlechoicematrix_1\:matrix3 .question-main, 
	.custom-multiplechoicematrix_1 #form\:multiplechoicematrix_1\:matrix3 .question-main {
	    margin-bottom: 2rem !important;
	}
	/*
		
	*/
	.custom-singlechoicematrix_1 #form\:singlechoicematrix_1\:matrix3  .custom-form.custom-form-radio .custom-control-description,  
	.custom-multiplechoicematrix_1 #form\:multiplechoicematrix_1\:matrix3  .custom-form.custom-form-radio .custom-control-description  
	{
		min-width: 5rem !important;
	}	
	/*
		Für das Verschieben der Title bitte die PageUID anpassen 
		sowie die Koordinaten entsprechend des aktuellen Falls
	*/
	.custom-singlechoicematrix_1 #form\:singlechoicematrix_1\:matrix3 .row:first-of-type label .custom-control-description, 
	.custom-multiplechoicematrix_1 #form\:multiplechoicematrix_1\:matrix3 .row:first-of-type label .custom-control-description 
	{
		position: absolute !important;
	    -moz-transform: translate(-55px, 35px) !important;
	    -ms-transform: translate(-55px, 35px) !important;
	    -o-transform: translate(-55px, 35px) !important;
	    -webkit-transform: translate(-55px, 35px) !important;
	    transform: translate(-55px, 65px) !important;
	}

	#form\:multiplechoicematrix_1\:matrix2\:rd\:item1\:rdc > div > div:nth-child(3),
	#form\:multiplechoicematrix_1\:matrix2\:rd\:item2\:rdc > div > div:nth-child(3),
	#form\:multiplechoicematrix_1\:matrix2\:rd\:item3\:rdc > div > div:nth-child(3) {
		margin-right: 2rem;
	}

	#form\:multiplechoicematrix_1\:matrix2\:rd\:item1\:rdc > div > div:nth-child(4),
	#form\:multiplechoicematrix_1\:matrix2\:rd\:item2\:rdc > div > div:nth-child(4),
	#form\:multiplechoicematrix_1\:matrix2\:rd\:item3\:rdc > div > div:nth-child(4)
	 {
		margin-left: 0rem;
		transform: translate(10px, 0)
	}


	
}

@media ( min-width : 768px) { 
	.container
	{
		max-width: 100%;
		width: 90vw !important;
		margin-right: auto;
		margin-left: 2vw;
	}	
}
.container {
	margin-right: 0;
}


 .custom-special .footer {
	    margin-left: 0px !important;
	}


@media (min-width: 767px) {
.custom-paradaten .zo-display-table-body-item {
    display: table-cell !important;
    border: 1pt solid;
}
}

@media ( min-width : 767px) {
	
	.custom-paradaten .zo-display-table-body-item {
	    display: table-cell !important;
	    border: 0.5pt solid;
	}
	.custom-paradaten .zo-display-table-body-row .zo-display-table-body-item:first-of-type
	{
		color: grey !important;
		width: 5% !important;
	}
	
	.custom-paradaten .zo-display-table-body-row .zo-display-table-body-item:last-of-type
	{
		color: grey !important;
		width: 75% !important;
	}
	
	.custom-paradaten .zo-display-table-header-row .col-md-4:nth-child(1) {
		max-width: 20% !important;
	}
	.custom-paradaten .zo-display-table-header-row .col-md-4:nth-child(2) {
		max-width: 80% !important;
	}
	
	
/* 	.col-md-4 { */
/* 	    max-width: 0% !important; */
	    
/* 	} */
	
	
}


.comparison .form-inner .row {
  width: initial !important;
}


.custom-matrixdouble_1 #form\:matrixdouble_1 div > div > label > span.custom-control-description > span {
	margin-top: 2.4rem;
}


.zofar_episodes_disabled{
	display: none;
	
}


/* 2022-02-18 CF ToDo Remove both styles later!!*/
.custom-calendar .fas.fa-edit.fa-md {
	background-color: #76de76;
	}
.custom-calendar .fas.fa-trash-alt.fa-md {
	background-color: #de6a6a;
}

.zofar-btn-backward{
    max-height: 27px;
}

@media (min-width: 767px) {
    .custom-einfachauswahl_beispiel_hor #form\:einfachauswahl_beispiel_hor\:qsc1_2\:qsc1 .form-inner{
        /*min-height: 100px;*/
    }

    .custom-einfachauswahl_beispiel_hor #form\:einfachauswahl_beispiel_hor\:qsc1_2\:qsc1 .form-inner .custom-form{
        -moz-transform: translate(0px, 25px) !important;
        -ms-transform: translate(0px, 25px) !important;
        -o-transform: translate(0px, 25px) !important;
        -webkit-transform: translate(0px, 25px) !important;
        transform: translate(0px, 25px) !important;
    }

    .custom-einfachauswahl_beispiel_hor #form\:einfachauswahl_beispiel_hor\:qsc1_2\:qsc1 .form-inner .custom-form .custom-control-description {
        -moz-transform: translate(0px, -15px) !important;
        -ms-transform: translate(0px, -15px) !important;
        -o-transform: translate(0px, -15px) !important;
        -webkit-transform: translate(0px, -15px) !important;
        transform: translate(0px, -15px) !important;
    }
    
    .custom-einfachauswahl_beispiel_hor #form\:einfachauswahl_beispiel_hor\:qsc1_2\:qsc1 .form-inner .custom-form .custom-control-description span{

    }
    
    .custom-einfachauswahl_beispiel_hor #form\:einfachauswahl_beispiel_hor\:qsc3 .attached{
        -moz-transform: translate(0px, -6px) !important;
        -ms-transform: translate(0px, -6px) !important;
        -o-transform: translate(0px, -6px) !important;
        -webkit-transform: translate(0px, -6px) !important;
        transform: translate(0px, -6px) !important;
    }
    

}

@media (min-width: 767px) and ( max-width : 1450px){
    .custom-einfachauswahl_beispiel_hor #form\:einfachauswahl_beispiel_hor\:qsc1_2\:qsc1 .form-inner .custom-form .custom-control-description span{
        font-size: 8px !important;

    }
}

@media (min-width: 767px) {
    .custom-multiplechoicematrix_beispiel #form\:multiplechoicematrix_beispiel\:matrix1\:rd\:item1\:rdc .custom-control-description{
        -moz-transform: translate(-50px, 10px);
        -ms-transform: translate(-50px, 10px);
        -o-transform: translate(-50px, 10px);
        -webkit-transform: translate(-50px, 10px);
        transform: translate(-50px, 10px);
    } 
    
    .custom-multiplechoicematrix_beispiel #form\:multiplechoicematrix_beispiel\:matrix2\:rd\:item1\:rdc .custom-control-description{
        -moz-transform: translate(-50px, 10px);
        -ms-transform: translate(-50px, 10px);
        -o-transform: translate(-50px, 10px);
        -webkit-transform: translate(-50px, 10px);
        transform: translate(-50px, 10px);
    } 
    
  .custom-multiplechoicematrix_beispiel #form\:multiplechoicematrix_beispiel\:matrix4\:rd\:item1\:rdc .custom-control-description{
        -moz-transform: translate(-50px, 10px);
        -ms-transform: translate(-50px, 10px);
        -o-transform: translate(-50px, 10px);
        -webkit-transform: translate(-50px, 10px);
        transform: translate(-50px, 10px);
    }  
    
    .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_1\:response label {
        min-width: 80px;
    }
    
  .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_1\:response .column {
        -moz-transform: translate(11px, -50px);
        -ms-transform: translate(11px, -50px);
        -o-transform: translate(11px, -50px);
        -webkit-transform: translate(11px, -50px);
        transform: translate(11px, -50px);
        max-width: 10px;
    }
    
    .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_3\:response label {
        min-width: 80px;
    }
    
  .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_3\:response .column {
        -moz-transform: translate(11px, -50px);
        -ms-transform: translate(11px, -50px);
        -o-transform: translate(11px, -50px);
        -webkit-transform: translate(11px, -50px);
        transform: translate(11px, -50px);
        max-width: 10px;
    }
    
  .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_4\:response .row .col-md-4{
        max-width: 70px;
  }
    
  .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_4\:response label {
        min-width: 90px;
  }
  
  .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_4\:response label .postfix{
        font-size: 8px !important;
  }
    
  .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_4\:response .column {
        -moz-transform: translate(11px, -50px);
        -ms-transform: translate(11px, -50px);
        -o-transform: translate(11px, -50px);
        -webkit-transform: translate(11px, -50px);
        transform: translate(11px, -50px);
        max-width: 10px;
    }
    
  .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_5\:response label {
        min-width: 80px;
  }
    
  .custom-offenematrix_beispiel #form\:offenematrix_beispiel\:openmmatrix_5\:response .column {
        -moz-transform: translate(11px, -50px);
        -ms-transform: translate(11px, -50px);
        -o-transform: translate(11px, -50px);
        -webkit-transform: translate(11px, -50px);
        transform: translate(11px, -50px);
        max-width: 10px;
    }
    
}

   .custom-doppelmatrix_beispiel #form\:doppelmatrix_beispiel\:md\:rd .form-scroller .question-sub .container .row {
        width: 100% !important;
    }
    
    .zo-progressbar{
    	display:none;
    }
    
    .custom-funktionselemente_anzeige_befragungsfortschritt .zo-progressbar{
    	display:inherit !important;
    }
    
    .custom-calendar .calendar-table .row {
	  width: 100% !important;
	  margin-bottom: 1rem !important;
	}

/* a small temporarily fix for carousel button */
/*
.fa-angle-left::before {
    content: "<" !important;
}
.fa-angle-right::before {
    content: ">" !important;
}
*/

.custom-funktionselemente_anzeige_befragungsfortschritt #form\:funktionselemente_anzeige_befragungsfortschritt\:t1 > img,
.custom-funktionselemente_befragungsfortschritt_beispiel #form\:funktionselemente_befragungsfortschritt_beispiel\:t2 > img {
    max-width: 800px;
	height: auto;
	width: 90%;
	margin-top: 2rem;
	}
	
	
/*
div[id$='autogen_nav_siblings'] {
    border-top: 1px solid #dfdfdf;
    padding-top: 2rem;
}
*/

div[id$='autogen_nav_siblings'] > p {
	margin-left: 0.4rem;
	margin-bottom: 0.3rem;
	font-size: 95%;
}

div[id$='autogen_nav_prev_next'] {
	margin-top: 1rem;
}


div[id$='autogen_breadcrumbs'] {
	margin-bottom: 0.3rem;
	font-size: 90%;
}



.custom-ablaeufe .controlls-outer > div,
.custom-ablaeufe_preloads .controlls-outer > div,
.custom-ablaeufe_pretest .controlls-outer > div,
.custom-ablaeufe_programmiervorlage .controlls-outer > div,
.custom-ablaeufe_tokenerstellung .controlls-outer > div,
.custom-ablaeufe_uebersetzung .controlls-outer > div,
.custom-ablaeufe_versand .controlls-outer > div,
.custom-ablaeufe_versand_allgemein .controlls-outer > div,
.custom-ablaeufe_versand_einladungen .controlls-outer > div,
.custom-ablaufe_layout .controlls-outer > div,
.custom-barrierefreiheit .controlls-outer > div,
.custom-barrierefreiheit_generelle_anforderungen .controlls-outer > div,
.custom-barrierefreiheit_zofar_befragungen .controlls-outer > div,
/* .custom-comparison_beispiel .controlls-outer > div, */
.custom-datenschutz .controlls-outer > div,
/* .custom-datenschutz_beispiel .controlls-outer > div,  */
/* .custom-differenzial_beispiel .controlls-outer > div, */
.custom-dokumentation .controlls-outer > div,
/* .custom-doppelmatrix_beispiel .controlls-outer > div, */
/* .custom-einfachauswahl_beispiel_dd .controlls-outer > div, */
/* .custom-einfachauswahl_beispiel_hor .controlls-outer > div, */
/* .custom-einfachauswahl_beispiel_ver .controlls-outer > div, */
.custom-end .controlls-outer > div,
.custom-fragebogensteuerung .controlls-outer > div,
.custom-fragebogensteuerung_antwortreferenzierung .controlls-outer > div,
.custom-fragebogensteuerung_bedingte_anzeige .controlls-outer > div,
.custom-fragebogensteuerung_filterfuehrung .controlls-outer > div,
.custom-fragebogensteuerung_rotation .controlls-outer > div,
/* .custom-fragebogensteuerung_rotation_beispiel .controlls-outer > div, */
.custom-fragebogensteuerung_zugang .controlls-outer > div,
.custom-fragetypen .controlls-outer > div,
.custom-fragetypen_differenzial .controlls-outer > div,
.custom-fragetypen_doppelmatrix .controlls-outer > div,
.custom-fragetypen_einfachauswahl .controlls-outer > div,
.custom-fragetypen_kalendarium .controlls-outer > div,
.custom-fragetypen_kommentarfeld .controlls-outer > div,
.custom-fragetypen_matrix .controlls-outer > div,
.custom-fragetypen_mehrfachauswahl .controlls-outer > div,
.custom-fragetypen_offene_frage .controlls-outer > div,
.custom-funktionselemente .controlls-outer > div,
.custom-funktionselemente_abgeleitete_variablen .controlls-outer > div,
.custom-funktionselemente_akkordion .controlls-outer > div,
/* .custom-funktionselemente_akkordion_beispiel .controlls-outer > div, */
.custom-funktionselemente_antwortgruppierung .controlls-outer > div,
.custom-funktionselemente_antwortvalidierung .controlls-outer > div,
.custom-funktionselemente_anzeige_befragungsfortschritt .controlls-outer > div,
/* .custom-funktionselemente_befragungsfortschritt_beispiel .controlls-outer > div, */
.custom-funktionselemente_preloads .controlls-outer > div,
.custom-funktionselemente_zufallsvariablen .controlls-outer > div,
.custom-index .controlls-outer > div,
.custom-index_hintergrundinformationen .controlls-outer > div,
/* .custom-kalendarium_beispiel .controlls-outer > div, */
/* .custom-kommentarfeld_beispiel .controlls-outer > div, */
.custom-layout .controlls-outer > div,
/* .custom-lhc_beispiel .controlls-outer > div, */
.custom-literaturverzeichnis .controlls-outer > div,
/* .custom-mehrfachauswahl_beispiel .controlls-outer > div, */
.custom-mehrsprachigkeit .controlls-outer > div,
.custom-monitoring .controlls-outer > div,
/* .custom-monthpicker_beispiel .controlls-outer > div, */
/* .custom-multiplechoicematrix_beispiel .controlls-outer > div, */
/* .custom-offene_frage_beispiel .controlls-outer > div, */
/* .custom-offenematrix_beispiel .controlls-outer > div, */
.custom-paradaten .controlls-outer > div,
/* .custom-singlechoicematrix_beispiel .controlls-outer > div, */
.custom-textsorten .controlls-outer > div,
.custom-textsorten_antwortkategorie .controlls-outer > div,
/* .custom-textsorten_beispiel_1 .controlls-outer > div, */
/* .custom-textsorten_beispiel_2 .controlls-outer > div, */
.custom-textsorten_einleitung .controlls-outer > div,
.custom-textsorten_frage .controlls-outer > div,
.custom-textsorten_instruktion .controlls-outer > div,
.custom-textsorten_item .controlls-outer > div,
.custom-textsorten_text .controlls-outer > div,
.custom-textsorten_ueberschrift .controlls-outer > div,
.custom-ueberschrift_beispiel .controlls-outer > div,
.custom-toc .controlls-outer > div {
	display: none;
}


.colorbox {
	background-color: #006ab214;
	padding: 0.3rem;
}


.textblock_header {
	background-color: #006ab214;
	font-weight: 600;
	margin-left: .7rem;
	margin-right: .7rem;
	margin-bottom: 0;
	margin-top: 1.5rem;
	padding: 0.7rem 0.7rem 0rem 0.7rem;	
	
}

.textblock_content {
	background-color: #006ab214;
	margin-left: .7rem;
	margin-right: .7rem;
	margin-top: 0;
	padding: 0rem 0.7rem 0.7rem 0.7rem;
}

h5 {
	margin-top: 1rem;
	margin-bottom: .8rem;
}

h6 {
	font-size: 1.8rem;
	margin-top: 1rem;
	margin-bottom: .4rem;
}


body > .container {
	display: flex;
	align-items: stretch;
}



#sidebar {
	font-size: 1.2rem;
	margin-right: 1.5rem;
	/*padding-right: 1rem;
	padding-left: 1rem;*/
	padding: .5rem 1.5rem 1rem 1rem;
	margin-bottom: 2rem;
	background: #EEEEEE;
	flex: 1 1 auto;
	transition: all .5s ease;
	min-width: 25rem;
	max-width: 30rem;
	/* height: 100%; */
	/* align-items: stretch !important; */
}

@media (min-width: 1128px) {
	body > .container > form {
		flex: 1 1 100%;
		max-width: calc(100% - 25rem);
	}
}

@media (max-width: 1127px) {
	body > .container {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	#sidebar {
		max-width: 100%;
		min-width: 100%;
	}
	
}



/* Basis Styling Hamburger */

.hamburger-icon-container {
	color:#3388C1;
	height: 2em;
	width: 2em;
	position: relative;
	cursor: pointer;
	background: currentColor;
	border: 10px solid currentColor;
	border-radius: 3px;
}

.hamburger-icon,
.hamburger-icon:before,
.hamburger-icon:after {
	content: '';
	position: absolute;
	height: 2px;
	width: 1.2em;
	background: white;
	transition: all .4s ease;
}

.hamburger-icon {
	top: 0.39em;
	left: -.16em;
}

.hamburger-icon:before {
	top: -0.5em;
	
}

.hamburger-icon:after {
	top: 0.5em
}

/* Darstellung wenn das Close-Icon angezeigt werden soll */

.hamburger-active .hamburger-icon-container {
  color:#4dadbf;
}

.hamburger-active .hamburger-icon {
  background: transparent;
  transform: rotate(-135deg)
}

.hamburger-active .hamburger-icon:before,
.hamburger-active .hamburger-icon:after {
  top: 0
}

.hamburger-active .hamburger-icon:before {
	transform: rotate(90deg)
}


.current_toc_item {
	font-weight: 800;
}

.toc {
	font-size: 1.1rem;
}
.toc.toc_level1 {
	margin-left: 1rem;
	font-size: 1rem;
}
.toc.toc_level2 {
	margin-left: 1.2rem;
	font-size: .9rem;
}

.custom-form.custom-form-radio.add-pipe {
	max-width: 70%;
}

.custom-datenschutz_beispiel #form\:datenschutz_beispiel\:s1 {
	padding: 2rem;
	border: 1px solid #1b95ad;
	background: #F4F6F7;
} 

.showroom_table {
	font-size: clamp(0.3rem, calc(0.875em + 0.005 * (100vw - 80em)), 1.3rem);
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}

.showroom_table {
	margin-bottom: 1.5rem;
}

.showroom_table_data {
	border-bottom: 1px solid #006ab242;
	background: #006ab208;
	padding-left: clamp(0px, calc(0.05 * (100vw - 80em)), 0.9rem);
}

.showroom_table_header {
	border-top: 1px solid #006ab287;
	border-bottom: 1px solid #006ab287;
	background: #006ab214;
	color: #004a7c;
	padding-left: clamp(0px, calc(0.05 * (100vw - 80em)), 0.9rem);
}


.custom-ablaeufe_programmiervorlage #form\:ablaeufe_programmiervorlage\:t3 {
	padding: 2rem;
	border: 1px solid #1b95ad;
	background: #F4F6F7;
} 

.custom-ablaeufe_programmiervorlage #form\:ablaeufe_programmiervorlage\:t3 h5 {
	font-weight: 600;
}

.custom-ablaeufe_programmiervorlage #form\:ablaeufe_programmiervorlage\:t3 h6 {
	font-weight: 500;
}


.custom-ablaeufe_preloads #form\:ablaeufe_preloads\:t2 table:nth-of-type(2) .showroom_table_data {
	border-bottom: 1px solid #95b20042;
	background: #90b20008;
	padding-left: clamp(0px, calc(0.05 * (100vw - 80em)), 0.9rem);
}

.custom-ablaeufe_preloads #form\:ablaeufe_preloads\:t2 table:nth-of-type(2) .showroom_table_header  {
	border-top: 1px solid #95b20042;
	border-bottom: 1px solid #95b20042;
	background: #006ab214;
	color: #787c00;
	padding-left: clamp(0px, calc(0.05 * (100vw - 80em)), 0.9rem);
}

.zo-sourcecode-block {
    background: #f4f4f4;
    border: 1px solid #ddd;
    border-left: 3px solid #f36d33;
    color: #666;
    font-family: monospace;
	font-style: normal !important;
    font-size: 1.4rem !important;
    line-height: 1.6;
    margin-bottom: 1.6em;
	margin-top: 1rem;
    max-width: 100%;
    padding: 1em 1.5em;
    word-wrap: break-word;
	page-break-inside: avoid;
    overflow: auto;
    display: block;
}


.zo-sourcecode {
    background: #f4f4f4;
    border: 1px solid #ddd;
    color: #666;
    font-family: monospace;
	font-style: normal !important;
    font-size: 1.4rem !important;
    line-height: 1.6;
    max-width: 100%;
    word-wrap: break-word;
    display: inline-block
}

.custom-dokumentation #form\:dokumentation\:t2 > p:nth-child(3),
.custom-dokumentation #form\:dokumentation\:t2 > p:nth-child(4)
 {
	display: block;
	max-width: 50vw;
	width: auto;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 3rem;
	text-align: center;
}

.custom-dokumentation #form\:dokumentation\:t2 > p:nth-child(3) img,
.custom-dokumentation #form\:dokumentation\:t2 > p:nth-child(4) img {
	max-width: inherit;
}



.flex-container {
	display: flex;
	flex-direction: row;
	min-height: 0;
	flex-wrap: wrap;
}

div > .flex-container:nth-child(5) .flex-item {
	flex: 0 1 40%;
	margin: 1rem;
	flex-wrap: wrap;
}

div > .flex-container:nth-child(7) .flex-item {
	flex: 0 1 27%;
	margin: 1rem;
	flex-wrap: wrap;
}



div > .flex-container:nth-child(5) .flex-item img {
	height: auto;
	width: 100%;
}

div > .flex-container:nth-child(7) .flex-item img  {
	height: auto;
	width: 90%;
}


.flex-item figure figcaption {
    text-align: center;
}


.custom-differenzial_beispiel .carousel-inner:not(:first-child) .custom-control.custom-radio.pipe-zofar-item-parent:first-child span.custom-control-description {
	display: block !important;
	transform: translate(-180px, 28px);
}

.custom-differenzial_beispiel .carousel-inner:not(:first-child) .custom-control.custom-radio.pipe-zofar-item-parent:not(:first-child) span.custom-control-description {
	display: block !important;
	transform: translate(80px, 28px);
}


.custom-differenzial_beispiel div.row.carousel-item.item > div:first-child {
	flex: 0 0 15%;
	max-width: 15%;
}



#form\:multiplechoicematrix_beispiel\:matrix1\:rd\:item1\:rdc > div:nth-child(1)  > div > div > label >span[data-label-type="description"] {
	transform: translate(-48px, -35px);
	
}

#form\:multiplechoicematrix_beispiel\:matrix2\:rd\:item1\:rdc > div > div > div > label > span[data-label-type="description"] {
	transform: translate(-48px, -35px) !important;
}

#form\:multiplechoicematrix_beispiel\:matrix3\:rd\:unit\:item1\:rdc > div > div > div > label > span.custom-control-description {
	transform: translate(-48px, 60px) !important;
}
	
#form\:multiplechoicematrix_beispiel\:matrix3\:rd\:item1\:rdc > div > div > div > label > span[data-label-type="description"] {
	transform: translate(-48px, -35px) !important;
}
#form\:multiplechoicematrix_beispiel\:matrix4\:rd\:item1\:rdc > div > div > div > label > span[data-label-type="description"] {
	transform: translate(-48px, -35px) !important;
}

#form\:lhc_beispiel\:tableCalendar_main .table-episodes{
    margin-top:30px;
    margin-left:95px;
}

#form\:lhc_beispiel\:tableCalendar_main div[data-episode-id]{
    margin-bottom:30px;
}

#form\:lhc_beispiel\:tableCalendar_main div[role="row"][data-episode-row="type"],
#form\:lhc_beispiel\:tableCalendar_main div[role="row"][data-episode-row="name"]{
    min-width: 500px;
}

#form\:lhc_beispiel\:tableCalendar_main div[role="row"][data-episode-row="name"],
#form\:lhc_beispiel\:tableCalendar_main div[role="row"][data-episode-row="name"] + div,
#form\:lhc_beispiel\:tableCalendar_main div.row.serverside .col-2
{
    margin-left: 20px;
}

#form\:lhc_beispiel\:tableCalendar_main .calendar-table .col-2{
    display: inherit !important;
}
    
    .slider-container {
      position: relative;
      width: 70%;
      max-width: 800px;
      margin-left: 25%;
    }
    .slider_field {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100%;
      position: relative;
    }
    .slider_field input[type="range"] {
      -webkit-appearance: none;
      width: 100%;
      height: 8px;
      background: #ddd;
      border-radius: 5px;
      outline: none;
      margin: 0;
      cursor: pointer;
    }
    .slider_field input[type="range"]::-webkit-slider-thumb {
      -webkit-appearance: none;
      appearance: none;
      width: 17px;
      height: 17px;
      background: #007bff;
      border-radius: 50%;
      cursor: pointer;
      position: relative;
      transform: translateX(-420%);
      transition: transform 0.3s ease;
      background: linear-gradient(45deg, #007bff, #00d4ff);
    }
    .slider_field input[type="range"].active::-webkit-slider-thumb {
      transform: translateX(0);
    }
    .slider_field input[type="range"]::-moz-range-thumb {
      width: 17px;
      height: 17px;
      background: #007bff;
      border-radius: 50%;
      cursor: pointer;
	  transform: translateX(-420%);
      transition: transform 0.3s ease;
    }
	.slider_field input[type="range"].active::-moz-range-thumb {
      transform: translateX(0);
    }

    .slider-park-button {
      position: absolute;
      left: -85px;
      width: 40px;
      height: 9px;
      border: solid 1px;
      border-radius: 5px;
      cursor: pointer;
    }
    .slider-labels {
      display: flex;
      justify-content: space-between;
      font-size: 12px;
      color: #666;
      flex-wrap: wrap;
	  padding: 5px 6px;
    }
	.slider-labels span {
        position: relative;
        display: flex;
        justify-content: center;
        text-align: center;
        width: 1px;
        background: #D3D3D3;
        height: 10px;
        line-height: 40px;
		white-space: nowrap;
    }
    .sliderMatrix-labels {
      display: flex;
      justify-content: space-between;
      font-size: 12px;
      color: #666;
      flex-wrap: wrap;
	  padding: 5px 6px;
    }
	.sliderMatrix-labels span {
        position: relative;
        display: flex;
        justify-content: center;
        text-align: center;
        width: 1px;
        background: #D3D3D3;
        height: 7px;
        line-height: 40px;
		white-space: nowrap;
		top: -4px;
		margin-top: 3px;
    }
    .slider-tooltip {
      position: absolute;
      width: 35px;
      height: 24px;
      line-height: 24px;
      text-align: center;
      color: #fff;
      font-size: 12px;
      transform-origin: bottom;
      transition: transform 4.3s ease-in-out;
      border-radius: 6px;
      top: -40px;
      z-index: 2;
      background: linear-gradient(45deg, #007bff, #00d4ff);
      margin-left: -9px;
    }
	.slider-tooltip::after {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-top: 10px solid #03a9f4;
		border-left: 5px solid transparent;
		border-right: 5px solid transparent;
		top: 100%;
		left: 50%;
		margin-left: -5px;
		margin-top: -1px;
		background: linear-gradient(45deg, #007bff, #00d4ff);
	}
	.sliderMatrix-tooltip {
      position: absolute;
      width: 33px;
      height: 18px;
      line-height: 18px;
      text-align: center;
      color: #fff;
      font-size: 12px;
      transform-origin: bottom;
      transition: transform 4.3s ease-in-out;
      border-radius: 6px;
      top: -28px;
      z-index: 2;
      background: linear-gradient(45deg, #007bff, #00d4ff);
      margin-left: -9px;
    }
	.sliderMatrix-tooltip::after {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-top: 6px solid #03a9f4;
		border-left: 4px solid transparent;
		border-right: 4px solid transparent;
		top: 100%;
		left: 50%;
		margin-left: -5px;
		margin-top: -1px;
		background: linear-gradient(45deg, #007bff, #00d4ff);
	}
	.slider_field .value {
      position: absolute;
      font-size: 16px;
      color: #b3b3b3;
      font-weight: 600;
    }
    .slider_field .value.left {
      left: -19px;
    }
    .slider_field .value.right {
      right: -39px;
    }