/***************** Diel am 25.07.2024/09.10.2024 *********************/


@import url("/css/x22/bootstrap-icons.min.css");
/* main div.container {
	margin: 0;
	padding: 0;
}  */

/* Selektor um alte und neue Formularseiten zu unterscheiden und Schriftgröße von Standardtext-Elementen zu beeinflussen, die über dem Formular stehen */

body#body.tpl-2013_standard_formdesigner div.schritte ul li.nav-item[style="width:33%;"]:last-of-type {
/* right: -6px; */
width: 34%!important;
}


body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .tinyblock p
/* , body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .col-form-label*/
 { 
font-size: 1.125rem;
}

body#body.tpl-2013_standard_formdesigner main .tab-content#myTabContent a.standardlink {
	font-size: 1.125rem;

}

body#body.tpl-2013_standard_formdesigner main a.linkextern.standardlink,
body#body.tpl-2013_standard_formdesigner main a.linkintern.standardlink
  {
    display: inline-block;
	font-size: 1.125rem;
	position: relative;
    /* margin-top: 1rem; */
    margin-bottom: 1rem;
    width: fit-content;
	background-image: none;
	text-decoration: none;
	padding-left: 0;
	border-bottom: 1px solid var(--gray-link);
}

body#body.tpl-2013_standard_formdesigner .tinyblock table caption {
	padding: 10px 0px;
}

body#body.tpl-2013_standard_formdesigner main a.linkextern.standardlink::before {
	 content: '';
	 background-position: 0 0;
	 background-repeat: no-repeat;
	 background-image: url(/images/x22/icons/box-arrow-up-right-red.svg);
	 padding-right: 0.25rem;
	 background-size: 1rem 1rem;
	 height: 1rem;
	 width: 1rem;
	 display: inline-block;
	 margin-right: .5rem;
}

/* body#body.tpl-2013_standard_formdesigner main a.linkextern.standardlink::after {
	background-image: url(/images/x22/icons/box-arrow-up-right-red.svg);
	border-bottom: 1px solid var(--gray-link);
    content: attr(data-text);
    position: absolute;
    left: 20px;
    bottom: 0;
    width: calc(100% - 20px);
} */

/** Weiter Button ausblenden, wenn man auf der Vorschau ist **/
main .tab-pane:has(table) a.btn.btn-primary {
	display: none;
}

main button[type="submit"] {
	margin: 2rem auto;
}

main .tab-pane:has(table) div:has(a.linkzurueck) {
	margin-top: 0;
}

/* Navtabs überlagern Datepicker */
div.ui-datepicker-div {
	z-index: 2!important;
}



/*** Modal Layer für Diaologe ***/
.modal-dialog button.btn-primary {
	width: 100%;
}

.modal-dialog button.btn-secondary {
    color: #2d2d2d;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    font-family: 'ApproachKoelnSemiBold', Arial;
    font-size: 1.25rem !important;
    padding: 0.5rem 2rem 0.5rem 2rem !important;
    border-radius: 1.4rem !important;
    /* border-color: var(--red);
    background-color: var(--red); */
    line-height: 145%;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    justify-self: flex-end;
    width: 100%;
}

.grid_3 {
	width: 100%;
	margin: 0px;
}

span.wcircle.erfolg + div.title-line:hover {
	/* border-bottom: 2px solid #5A616C; */
	color: #2d2d2d;
	
}

span.wcircle.erfolg + div.title-line {
	border-bottom: 2px solid transparent;
}

/* WW 30.01.2025 Linie unabhängig von title-line */

select.fdesigner {
	background-color: #1E84D7 ;
	color: #3EB052;
}

.nav-tabs li .wcircle::after
	{
		content: '';
		width: 100%;	
		height: 2px;
		background: #ced4da;
		position: absolute;
		left: 53%; /* 57*/ 
		z-index: -5; 
	}

.nav-tabs li button .wcircle.erfolg::after {
	background: #3EB052;
}

/* verhindert, dass sich die Linien zwischen den Schritten bei Mouse-over über die Schritte gelegt wird */
.nav-tabs .nav-link:hover {
	isolation: unset;
}

/* navbox */
.wcircle {
	border: 2px solid #E9EFF3;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 130%;
	height: 1.5rem;
	color: #2D2D2D;
	margin: 0 auto;
	outline: 6px white solid;
  }
 
  #body .nav-link .wcircle p {
	  position: relative;
	  top: 1px;
	  left: 0px;
	
  }

  #body .nav-link.active .wcircle p {
	color:#3EB052;
	left: 0px;
  }

  #body .nav-link .erfolg.wcircle p {
	  display: none
  }

  #body .nav-link[name="vorschau"] .erfolg.wcircle p {
	/* display: block; */
	display: none;
  }

  .nav-tabs .wcircle p {
	  margin-bottom: 0;
	  font-size: 0.875rem;
	  color: #3E8052 ;
	  margin: 0;
	  /* transform: translateX(1px) translateY(1px); Ausrichtung Zahl manuell ausgleichen, z. B. 1–2px */
  }


/**** Farbe/Grosse fuer allg. Navigation Button ****/

	.nav-tabs li button.nav-link span
	{
		font-size: 1.5rem;
		width: 1.5rem;
		background: #E9EFF3;
		margin: 0 auto 10px auto;
	}


	/* Selektor für aktiven Tab */
	.nav-tabs .nav-link.active span {
		background-color: #ffff;
		border: 2px solid #3EB052;
		color: #3EB052;
	}

/*Validierungsmeldungen */
[id^="error"] {
	/* margin-top: -1.25rem; */
	margin-bottom: 0rem;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 140%; /* 22.4px */
	padding-top: 0.25%;
}

/* Checkbox */

.form-check-input[type="checkbox"] {
	height: 1rem;
	width:  1rem;
	padding: 0.5rem;
	border-color: #2d2d2d;
}

.form-check-input[type="checkbox"]:checked, .form-check-input:checked {
	background-color: #2d2d2d;
}



/* Label */

input, .form-control {
	color: #2d2d2d;
}

body input + .col-form-label:not(label), body select + .col-form-label:not(label), body a + .col-form-label, body div.drop-down + .col-form-label  {
	margin-top: 3rem;
}

input[type="checkbox"] + .form-check-label {
	display: flex;
	padding-top: 0.25rem;
	line-height: 1.4rem;

}

#body .col-form-label, #body h4 {
	font-size: 1.125rem;
	font-style: normal;
	line-height: 145%; /* 29px */
	margin-bottom: calc(0.5rem - (.375rem + 1px));
}

#body .freitext.col-form-label p {
	font-size: 1.125rem;
	font-style: normal;
	line-height: 145%; /* 29px */
}

.col-form-label {
	margin-bottom: 1.5rem;
}

.form-group .col-form-label:not(label) {
	margin-bottom: 0.5rem;
	/* padding-left: 1.5rem; */
}

.form-check input[type="radio"] {
	font-size: 1.5rem!important;
}

.form-check:has(input[type="radio"]) label {
	font-size: 1.125rem;
	margin-top: 0.4rem;
}

.form-floating label {
	font-size: 1.125rem;
	font-style: normal;
	font-weight: 400;
	line-height: 140%;
	color: #262626;
	padding-left: 1rem;
	min-width: 327px;
	width: 100%;
	display: block;

	}

.form-floating>.form-control:focus~label {
	transform: scale(.8889) translateY(-.5rem) translateX(.15rem);
	font-size: 1rem;
	line-height: 1rem;

}

main#inhalt div.grid_3 {
	width: 100%;
	margin: 0px;

}

.form-check .form-check-input {
	margin: 0.4rem 0.625rem 0 -1.5rem;
}

/* .form-check-input:checked[type=radio] {
	background-image: none;
	border: 8px solid #2d2d2d; 
	background-color:#ffffff;
	box-shadow: 0 0 0 1px #0d6efd;
 } */

 .form-select:focus-visible
{
    border-color: #1E84D7;;
    outline: 0;
    box-shadow: 0 0 0 2px #1E84D7;
}


.form-check .form-check-input:focus-visible {
	box-shadow: 0 0 0 2px #1E84D7;
}


.form-check .form-check-input[type=checkbox]:focus-visible {
	border: 2px solid #ffffff;
	border-radius: 4px;
}

.form-check .form-check-input[type=radio]:focus-visible {
	border: 2px solid #ffffff;
	box-shadow: 0 0 0 2px #1E84D7;
}

.form-check .form-check-input[type=radio]:checked:not(:focus-visible) {
	border: none;
}

/* Überschrift */

h2.col-form-label {
	font-size: 1.375rem;
}

/* falls eine h2 mitten im Formular ist, z.B. service/onlinedienste/kontakt-einbuergerung/index.html */
div.col-sm-12 + div.mt-3:has(h2) {
	margin-top: -1rem!important;
}


/* Eingabe */

body input[type="text"],
body .form-select,
body select
body .form-floating textarea
body .form-control {
	height: 4rem!important;
	padding-left: 1rem!important;
	font-size: 1.125rem!important;
	border: 1px solid #5A616C;

}

body .form-select option {
  	overflow-wrap: break-word; /* Textumbruch */
}

body input:disabled,
body .form-select:disabled {
	background-color: #FAF7F5;
	color: #5A616C;
	border: none!important;
	background-image: none;
	display: flex;
	align-items: center;
	padding-top: 16px;
	padding-bottom: 16px;
}

body input:disabled + label,
body .form-select:disabled + label {
	display: none;
}


/*** Auto Complete ***/

body#body .ui-autocomplete .ui-menu-item .ui-state-focus {
	background-color: #ffffff;
	border: 3px solid #1E84D7!important;
}

/* tabbar */
.nav-tabs#myTab {
	margin-top: 2rem;
}

.form-floating>.form-control:not(:placeholder-shown) {
	padding-left: 1rem;
}

body input.form-control,
ul.ui-autocomplete {
	font-size: 1.125rem;
	font-family: 'ApproachKoelnRegular', 'Arial';
}



body input[type="radio"] {
	padding: 0;
}

.form-floating input:last-child {
	margin-bottom: 3rem;
}

body:not(.moderncss) .wrapper {
	max-width: unset;
}

/* Spacing */
.textfeld + .freitext {
	/* margin-top: 3rem; */
}

.freitext.col-form-label {
	margin-bottom: 1.5rem;
}

div.col-sm-12:has(a[id^="#tabbox"]) {
	margin-top: 2.5rem;
}

div.col-sm-12:has(.form-floating) {
	margin-bottom: 1.5rem;
}

/* *****   DATE PICKER **** */
.ui-datepicker-header,
.ui-datepicker-div,
.ui-datepicker {
	background-color: unset;
	background: #ffffff;
}
.ui-datepicker,
.ui-datepicker td span, 
.ui-datepicker td a,
.ui-datepicker th,
.ui-datepicker-header {
font-family: 'ApproachKoelnRegular', Arial, sans-serif;
}

.ui-datepicker table {
border: none;
border-collapse: collapse;
margin: 5px 0 0 0;
width: 100%;
}
.ui-datepicker thead,
.ui-datepicker table td, 
.ui-datepicker td,
.ui-datepicker tbody tr
 {
border: none;
}

.ui-datepicker {
border: 1px solid #2d2d2d;
border-radius: 2px 2px 0 2px;
}

.ui-datepicker-calendar .ui-state-active:first-of-type {
background-color: #2d2d2d;
width: 2rem;

}

.ui-datepicker-calendar td a.ui-state-hover:not(.ui-state-active) {
/* background-color:#E9EEF3 ;  */
background-color: #ffffff; 
color: #2d2d2d;
border-radius: 2rem;
border: 2px solid #ee0000;
}

.ui-datepicker-calendar td a {
	border-radius: 2rem;
	border: 2px solid transparent;
}

div#ui-datepicker-div {
padding: 0.5rem 0.75rem;
z-index: 2!important;
}

.ui-datepicker-prev, .ui-datepicker-next {
	background-image: none;
}

.ui-datepicker-prev:before {
	content: '<';
	color: rgb(239, 0, 0);
	background-repeat: no-repeat;
    cursor: pointer;
    display: inline-block;
    line-height: 600%;
    width: 30px;
	position: absolute;
	top: -14px;
	font-size: 1rem;
}

.ui-datepicker-next:after {
	content: '>';
	color: rgb(239, 0, 0);
	background-repeat: no-repeat;
    cursor: pointer;
    display: inline-block;
    line-height: 600%;
    width: 30px;
	position: absolute;
	top: -14px;
	font-size: 1rem;
	right: 0;
}

.ui-datepicker-header {
border-bottom: 1px solid #bbb;
padding: 10px 0;
margin: 0 -0.75rem;
}

#ui-datepicker-div {
	padding: 10px 0;
}

.ui-datepicker table tr th {
	text-align: center;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 28px; /* 200% */

}

/* Zusammenfassung Tabelle */
.tinyblock div.responsive-tables table caption {
	background-color: #fff;
	color: #2d2d2d;
	font-family: 'ApproachKoelnSemiBold', Arial;
	border: none;
}

/* Tabellenkopf */
.tinyblock div.responsive-tables table thead,
.tinyblock div.responsive-tables table thead tr th {
	background-color: #FAF7F5;
	font-size: 1rem;
	font-weight: 600;
	line-height: 140%;
	font-family: 'ApproachKoeln', Arial;
	color: #2d2d2d;
}
.tinyblock div.responsive-tables table tr td {
	font-size: 1rem;
	font-weight: 400;
	line-height: 140%;
	font-family: 'ApproachKoeln', Arial;
	color: #2d2d2d;
}





/* relevante Dienstleistungen ausblenden */
aside.grid_1 {
	display: none;
}

/* Hinweistexte */	
[id^="helpBlock"] {
	margin-top: -1.5rem;
	margin-bottom: 1.5rem;
	color:  #5A616C;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 140%; /* 22.4px */
	padding-left: 2px;
	position: relative;
	top: 28px;
}

div[id^="file-upload"] + [id^="helpBlock"] {
	top: 5px;
}

#rs_ganzeseite.wrapper {
	margin: 0 1.5rem;
}

div.form-group {
	margin-bottom: 2rem;
}

/** Reihenfolge Vor- und Zurück auf Mobil umkehren **/
div.col-sm-12:has(a.linkzurueck) {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	margin-bottom: 5rem;
	}




/* Vor- und Zurück */

textarea.form-control, 
.form-floating>textarea.form-control {
	height: 6rem;
	display: flex;
	padding: 1rem;
	align-self: stretch;	
	align-items: flex-start;
	border-radius: 0.5rem;
	border: 1px solid #5A616C;
	}
	
	/**** Diel am 28.03.2025 A HREF & INPUT als BUTTON ****/
	
	button.btn.btn-primary, 
	a.btn.btn-primary, input.btn.btn-primary	
	{
		color: #fff;
		font-style: normal;
		font-weight: normal;
		text-decoration: none;
		font-family: 'ApproachKoelnSemiBold', Arial;
		font-size: 1.25rem!important;
		padding: 0.5rem 2rem 0.5rem 2rem!important;
		border-radius: 1.4rem!important;
		border-color: var(--red);
		background-color: var(--red);
		line-height: 145%;
		margin-top: 1.5rem;
		margin-bottom: 1.5rem;
		justify-self: flex-end;
		width: 100%;
	}

	button.btn.btn-primary[type="submit"] {
		width: 50%;
		align-self: flex-end;
	}


	a.btn.btn-primary a:after {
	content: '';
    background-repeat: no-repeat;
    background-image: url(/images/x22/icons/arrow-right-red.svg);
    background-size: 1rem 1rem;
    height: 1rem;
    width: 1rem;
    display: inline-block;
    background-position-y: 0.2rem;
    padding-right: 0.1rem!important;
    padding-left: 0.1rem;
    margin-right: 0.5rem;
	color: #ffffff;
	}
	
	.linkzurueck {
		text-decoration: none;
		color: #2d2d2d;
		font-size: 1rem;
		display: inline-flex !important;
		padding: 0.5rem;
		font-weight: 600;
		border-bottom: 2px solid transparent;
		width: 50%;
	}

	.linktext {
		border-bottom: 2px solid transparent;
	}

	.linktext:hover {
		border-bottom: 2px solid #2d2d2d ;
		color: #2d2d2d;
		display: inline-flex;
		
	}

	a.linkzurueck:hover {
		color: inherit;

	}

	a.linkzurueck:focus-visible {
		padding: 0.5rem;	
		padding-top: 0.625rem;
		outline: 2px solid #1E84D7;
	
	}

	
	.linkzurueck::before {
		content: '';
		display: inline-block;
		width: 1rem;
		height: 1rem;
		background-image: url(/images/x22/icons/arrow-left-red.svg);
		background-size: 1rem 1rem;
		height: 1rem;
		width: 1rem;
		background-position: 0 2px;
		background-repeat: no-repeat;
		margin-right: 	0.5rem;
	}


.form-row {
	display: flex;
	flex-direction: column;

}

div.board {
	padding: 0;
}

/*** Bootstrap Snippets Navigation Test ***/

/*** Allgemein ***/
/*** Navigation Position ***/

.board .nav-tabs
{
    position: relative;
    box-sizing: border-box;
	border-bottom: 0px none;
	z-index: 2;	
    overflow: hidden;
}

/*** Rahmen fuer Tab ***/

.board .nav-tabs .nav-link
{
	/* border: 0px none; */
	color: #ced4da;
	border: 3px solid transparent;
}

/*** Button in Tabs Position ***/

.board .nav-tabs .nav-link
{
	display: inline;
}

.board .nav-tabs .nav-link.active
{
	background: transparent !important;
}

/*** Text Nav Item pos ***/

.nav-tabs li
{
	text-align: center;
	position: relative;	
}



/*** Response ***/

.title-line
{
	font-size: 1rem;
	color: #5A616C;
}

button.active .title-line
{
	font-weight: 600;
	color: #262626;
	line-height: 140%;
}

.title-step
{
	font-size: 0.85rem;
	margin-bottom: 3rem;
	padding-bottom: 0.5rem;
}

	/*********Hilfe-Link*******/
	div.schritte	{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}

	div.schritte #myTab {
		flex-basis: 100%;
	}

	div.schritte #hilfe {
		text-decoration: none;
		color: 	#2d2d2d;
		/* border-bottom: 1px solid #2d2d2d !important; */
		padding-left: 20px; /* Platz fürs Icon */
		position: relative;
		display: inline-block;
		margin-left: 0px;
		transform: translatey(100%);

	}

	div.schritte a#hilfe:hover
		{
		background-color: #E0DED9;
		outline: 1px solid #ffffff;
	}

	div.schritte #hilfe::before {
		content:'';
		background: url('/images/x22/icons/SK_VM_Icon_0196_Info_RGB.svg') no-repeat center/contain;
		content: "";
		position: absolute;
		left: 0px;
		top: 50%;
		width: 18px;
		height: 18px;
		transform: translateY(-58%);
	}


	div.schritte #hilfe::after {
		border-bottom: 1px solid var(--gray-link);
		content: attr(data-text); /* nimmt denselben Text wie im Link */
		position: absolute;
		left: 20px;               /* startet nach dem Icon */
		bottom: 0;
		width: calc(100% - 20px); /* nur Textbreite unterstreichen */
	}


	div.schritte a#hilfe  {
		padding-bottom: 4px;
	}

	#myTabContent .file-list [class*=" bi-"] + div {
		left: 6px;
	}

	.nav-tabs li button.active span
{
	color: #3EB052;
}

.nav-tabs li button span.erfolg 
{
   color: #3EB052;
}

#myTabContent .form-control:focus-visible, .btn-primary:focus-visible, *:focus-visible
{
	border: 3px solid #1E84D7!important;
	box-shadow: none;
	outline: none;
	border-radius: 8px;

}

#myTabContent .is_valid
{
	/*** border-color: ##3EB052; ***/
	border-color: rgba(var(--bs-success-rgb),1) !important;
	border-width: 2px !important;
    padding-right: calc(1.5em + .75rem);
	
    /*** RUN background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); ***/
	
	/*** RUN background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23198754' d='M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425z'/%3e%3c/svg%3e"); ***/	
	
	/* background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgba(var(--bs-success-rgb),1)' viewBox='0 0 16 16'%3e%3cpath d='M2.5 8a5.5 5.5 0 0 1 8.25-4.764.5.5 0 0 0 .5-.866A6.5 6.5 0 1 0 14.5 8a.5.5 0 0 0-1 0 5.5 5.5 0 1 1-11 0'/%3e%3cpath d='M15.354 3.354a.5.5 0 0 0-.708-.708L8 9.293 5.354 6.646a.5.5 0 1 0-.708.708l3 3a.5.5 0 0 0 .708 0z'/%3e%3c/svg%3e"); */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 192 192'%3E%3Cpath fill='none' stroke='%233EB052' stroke-width='12' d='M83.7 135c-1.1 0-2.1-.4-2.8-1.2l-29.7-29.7 5.7-5.7 26.9 26.9 56.6-56.6 5.7 5.7-59.4 59.4c-.8.8-1.8 1.2-2.8 1.2z'/%3E%3Cpath fill='none' stroke='%233EB052' stroke-width='12' d='M96 184c-48.5 0-88-39.5-88-88S47.5 8 96 8s88 39.5 88 88-39.5 88-88 88zm0-168c-44.1 0-80 35.9-80 80s35.9 80 80 80 80-35.9 80-80-35.9-80-80-80z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
	background-size: calc(.75em + .375rem) calc(.75em + .375rem);
	color: #3EB052;
}

#myTabContent .is_invalid:not(:disabled)
{
	/*** border-color: rgb(204, 0, 0, 1); ***/
	border-color: #ee0000 !important;
	border-width: 3px !important;
    padding-right: calc(1.5em + .75rem);
    /* background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 192 192'%3E%3Cpath fill='none' stroke='%232d2d2d' stroke-width='12' d='M51,56.64l90,90M141,56.64l-90,90'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
	background-size: calc(.75em + .375rem) calc(.75em + .375rem);
	margin-bottom: 0.25rem;
	color: #ee0000;
}

#body a.linkextern.standardlink[title="Allgemeine Datenschutzerklärung"],
#body a.linkextern.standardlink[title="EU-Datenschutzgrundverordnung"] {

	border-bottom: 1px solid var(--gray-link) !important;
    text-indent: calc(var(--font-size)* -1.5);
    margin-left: calc(var(--font-size)* 1.5);
	padding: 0.5rem 0.5rem 0.25rem 0rem;
	background-image: unset!important;
	font-size: 1.125rem;
	display: block;
	width: fit-content	;
	margin-bottom: 1.375rem;
}

#body a.linkextern.standardlink[title="Allgemeine Datenschutzerklärung"]:hover, 
#body a.linkextern.standardlink[title="EU-Datenschutzgrundverordnung"]:hover  {
	border-bottom: 1px solid var(--red) !important;
	background-color: var(--gray-background-light);	
	
}


a.linkextern.standardlink[title="Allgemeine Datenschutzerklärung"]:before, 
#body a.linkextern.standardlink[title="EU-Datenschutzgrundverordnung"]:before  {
    content: '';
    display: inline-block;
    background-image: url(/images/x22/icons/download-red.svg) !important;
    height: 1rem;
    width: 1.25rem;
    background-position: 0 1px;
    background-repeat: no-repeat;
    margin-right: .25rem;
}

#myTabContent .is_invalid + label {
	color: #ee0000;
}

#myTabContent .fehlermeldung
{
	color: rgba(var(--bs-danger-rgb),1);
}

.nav-tabs li:last-child .wcircle::after
{
	 display: none;
}

.board .nav-tabs li.nav-item.active::after
{
	border: 0px none;
	background: #3EB052;
}

/*** Farbe: Blau fuer Checkbox aktivieren ***/

input[type=checkbox]
{
    -webkit-appearance: none;
}

/*** Farbe: Blau fuer Radiobutton aktivieren ***/

input[type=radio]
{
    -webkit-appearance: none;
}

.tpl-2013_standard_formdesigner input[type=text]:read-only, div[id^="bundid"]  {
	background-color: #E9EEF3!important;
}	

.tpl-2013_standard_formdesigner div[id^="bundid"] {
	padding: 1rem!important;
}

.tpl-2013_standard_formdesigner div[id^="bundid"] img {
	padding-right: 0.5rem;
}

.tpl-2013_standard_formdesigne .tpl-2013_standard_formdesigner div[id^="bundid"] span {
	color: #2d2d2d!important;
		padding: 1rem!important;
}




/*** Upload Box Block Div ***/

#myTabContent .file-upload-box {
	display:block; 
	border: dashed 1px;
	border-radius: 0.5rem;
	height: 6rem; 
	line-height: 1.25;	
	margin-bottom: 1.5rem;
	padding: 1rem;
}

#myTabContent .file-upload-box:hover, 
#myTabContent .file-upload-box:focus-within
{
	display:block; 
	border: dashed 2px #1E84D7!important;
	height: 6rem; 
	line-height: 135%;	
	margin-bottom: 1.5rem;
	background-color:#E9EEF3;
	padding: calc(1rem - 1px);
}

#myTabContent .file-list [class*=" bi-"]::before {
	font-size: 3rem;
	padding-left: 1rem;
	padding-right: 0.5rem;
}

#myTabContent .file-list [class*=" bi-"] {
	font-size: 1rem;
	line-height: 1rem;
}

#myTabContent .file-list [class*=" bi-"] {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

#myTabContent .file-list .bi-filetype-pdf:before,
#myTabContent .file-list .bi-filetype-jpg:before,
#myTabContent .file-list .bi-filetype-png:before
 {
	content: ' ';
	background: url(/images/x22/icons/filetype-pdf.svg) no-repeat center / contain;
	position: relative;
	left: 32px;
	width: 32px;
	height: 32px;
	top: 50%;
	transform: translateY(-50%); 

}

#myTabContent .file-list .bi-filetype-jpg:before {
	background: url(/images/x22/icons/filetype-jpg.svg) no-repeat center / contain;
}

#myTabContent .file-list .bi-filetype-png:before {
	background: url(/images/x22/icons/filetype-png.svg) no-repeat center / contain;
}

#myTabContent .file-list .bi-filetype-tif:before {
	background: url(/images/x22/icons/filetype-jpg.svg) no-repeat center / contain;
}

body#body #myTabContent .file-list .container[id*="file"] {
background-color: #E9EEF3;
border-radius: 8px;
margin-bottom: 24px!important;
}

#myTabContent .file-list .bi-trash3:before {
	content: ' ';
	background: url(/images/x22/icons/trash.svg) no-repeat center / contain;
	position: relative;
	left: 16px;
	width: 24px;
	height: 24px;
	top: 50%;
	transform: translateY(-50%); 
}

#myTabContent .file-list [class*=" bi-"] + div {
	font-family: "ApproachKoelnRegular";
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 100%; /* 16px */
	align-content: center;
	position: relative;
	left: -6px;
}

/*** Upload Input Feld ***/

#myTabContent .file-upload-input
{
	position: absolute; 
	width: 100%; 
	height:100%; 
	outline: none; 
	opacity: 0; 
	cursor: pointer;
	min-height: 4rem;
}

/*** Text mit Icon fuer Upload Button ***/

#myTabContent .file-upload-title
{
	background-repeat: no-repeat;
    background-position: center bottom;
	background-size: 18px 18px;
	font-size: 1.125rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	text-align: center;
	min-height: 36px; /* damit Platz für Text + Icon da ist */
	line-height: 135%;
	white-space: nowrap;

}

#myTabContent .file-upload-title:after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3e%3cpath d='M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5'/%3e%3cpath d='M7.646 1.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 2.707V11.5a.5.5 0 0 1-1 0V2.707L5.354 4.854a.5.5 0 1 1-.708-.708z'/%3e%3c/svg%3e");
	content: '';
	position: relative;
	background-size: 1.5rem 1.5rem;
	width: 1.5rem;
	height: 1.5rem;
	transform: translateY(50%);

}

#myTabContent .file-upload-wait
{
	background-repeat: no-repeat;
    background-position: center bottom;
	background-size: 18px 18px;
	font-size: 1.125rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	text-align: center;
	min-height: 36px; /* damit Platz für Text + Icon da ist */
	line-height: 135%;
	white-space: nowrap;

} 

#myTabContent .file-upload-wait:after {
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 192 192'%3E%3Ctitle%3EDigitales%3C/title%3E%3Cdesc%3EFehlend / Gesperrt%3C/desc%3E%3Cmetadata%3E%3C%3Fxpacket begin='' id='W5M0MpCehiHzreSzNTczkc9d'%3F%3E%3Cx:xmpmeta xmlns:x='adobe:ns:meta/' x:xmptk='Adobe XMP Core 9.1-c002 165.59ab891, 2024/09/18-09:57:10 '%3E%3Crdf:RDF xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23'%3E%3Crdf:Description rdf:about='' xmlns:photoshop='http://ns.adobe.com/photoshop/1.0/' xmlns:xmp='http://ns.adobe.com/xap/1.0/' xmlns:xmpMM='http://ns.adobe.com/xap/1.0/mm/' xmlns:stEvt='http://ns.adobe.com/xap/1.0/sType/ResourceEvent%23' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:xmpRights='http://ns.adobe.com/xap/1.0/rights/'%3E%3Cphotoshop:Headline%3ESK_VM_Icon_0118_Fehlend%3C/photoshop:Headline%3E%3Cphotoshop:Source%3E%3C/photoshop:Source%3E%3Cxmp:MetadataDate%3E2024-11-12T17:55:56+01:00%3C/xmp:MetadataDate%3E%3CxmpMM:InstanceID%3Exmp.iid:e4ea2572-93be-4c55-a493-c44d06b6cf50%3C/xmpMM:InstanceID%3E%3CxmpMM:DocumentID%3Exmp.did:d106f55b-61d1-4654-bf0a-578b0bf11b96%3C/xmpMM:DocumentID%3E%3CxmpMM:OriginalDocumentID%3Exmp.did:d106f55b-61d1-4654-bf0a-578b0bf11b96%3C/xmpMM:OriginalDocumentID%3E%3CxmpMM:History%3E%3Crdf:Seq%3E%3Crdf:li%3E%3Crdf:Description%3E%3CstEvt:action%3Esaved%3C/stEvt:action%3E%3CstEvt:instanceID%3Exmp.iid:d106f55b-61d1-4654-bf0a-578b0bf11b96%3C/stEvt:instanceID%3E%3CstEvt:when%3E2023-05-30T14:44:05+02:00%3C/stEvt:when%3E%3CstEvt:softwareAgent%3EAdobe Bridge 2022 (Macintosh)%3C/stEvt:softwareAgent%3E%3CstEvt:changed%3E/metadata%3C/stEvt:changed%3E%3C/rdf:Description%3E%3C/rdf:li%3E%3Crdf:li%3E%3Crdf:Description%3E%3CstEvt:action%3Esaved%3C/stEvt:action%3E%3CstEvt:instanceID%3Exmp.iid:e4ea2572-93be-4c55-a493-c44d06b6cf50%3C/stEvt:instanceID%3E%3CstEvt:when%3E2024-11-12T17:55:56+01:00%3C/stEvt:when%3E%3CstEvt:softwareAgent%3EAdobe Bridge 2025%3C/stEvt:softwareAgent%3E%3CstEvt:changed%3E/metadata%3C/stEvt:changed%3E%3C/rdf:Description%3E%3C/rdf:li%3E%3C/rdf:Seq%3E%3C/xmpMM:History%3E%3Cdc:description%3E%3Crdf:Alt%3E%3Crdf:li xml:lang='x-default'%3EFehlend / Gesperrt%3C/rdf:li%3E%3C/rdf:Alt%3E%3C/dc:description%3E%3Cdc:subject%3E%3Crdf:Bag%3E%3Crdf:li%3E0118%3C/rdf:li%3E%3C/rdf:Bag%3E%3C/dc:subject%3E%3Cdc:creator%3E%3Crdf:Seq%3E%3Crdf:li%3EBOROS GmbH / Design Studio d_bilk / Amt für Presse- und Öffentlichkeitsarbeit%3C/rdf:li%3E%3C/rdf:Seq%3E%3C/dc:creator%3E%3Cdc:title%3E%3Crdf:Alt%3E%3Crdf:li xml:lang='x-default'%3EDigitales%3C/rdf:li%3E%3C/rdf:Alt%3E%3C/dc:title%3E%3Cdc:rights%3E%3Crdf:Alt%3E%3Crdf:li xml:lang='x-default'%3EStadt Köln%3C/rdf:li%3E%3C/rdf:Alt%3E%3C/dc:rights%3E%3CxmpRights:Marked%3ETrue%3C/xmpRights:Marked%3E%3C/rdf:Description%3E%3C/rdf:RDF%3E%3C/x:xmpmeta%3E%3C%3Fxpacket end='w'%3F%3E%3C/metadata%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;%7D.cls-2%7Bfill:%232d2d2d;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M96,16c-44.11,0-80,35.89-80,80,0,20.61,7.84,39.42,20.68,53.62L149.62,36.68c-14.2-12.84-33.01-20.68-53.62-20.68Z'/%3E%3Cpath class='cls-1' d='M96,176c44.11,0,80-35.89,80-80,0-20.63-7.85-39.46-20.72-53.67L42.33,155.28c14.2,12.87,33.03,20.72,53.67,20.72Z'/%3E%3Cpath class='cls-2' d='M96,8C47.48,8,8,47.48,8,96s39.48,88,88,88,88-39.48,88-88S144.52,8,96,8Zm0,8c20.61,0,39.42,7.84,53.62,20.68L36.68,149.62c-12.84-14.2-20.68-33.01-20.68-53.62,0-44.11,35.89-80,80-80Zm0,160c-20.63,0-39.46-7.85-53.67-20.72L155.28,42.33c12.87,14.2,20.72,33.03,20.72,53.67,0,44.11-35.89,80-80,80Z'/%3E%3C/svg%3E");
	content: '';
	position: relative;
	background-size: 1.5rem 1.5rem;
	width: 1.5rem;
	height: 1.5rem;
	transform: translateY(50%);

}

#myTabContent .file-list [class*=" bi-"] + div {
	left: 32px;
}

#myTabContent .file-list .bi-trash3:before {
	left: -16px;
}

@media (min-width: 576px) and (max-width: 992px) {
	div.container {
		max-width: none;
	}

	h1.articlehead {
		font-size: 2.5rem;
	}

}

/*** Extra small devices (portrait phones, less than 576px) ***/

@media (max-width: 575.98px)
{
	h1.articlehead {
		font-size: 2rem;
	}

	h2#vorschau {
		font-size: 1.75rem;
	}

	div.board {
		padding: 0;
	}

	/*** Optimierung Filelist bei Datei-Uploads***/
	#myTabContent .file-list [class*=" bi-"] + div {
		left: 28px;
	}

	#myTabContent .file-list .bi-filetype-pdf:before, 
	#myTabContent .file-list .bi-filetype-jpg:before, 
	#myTabContent .file-list .bi-filetype-png:before {
		left: 16px;

	}

	/*** Titel fuer Punktnavi ausblenden ***/
	
	.title-line
	{
		display:none;
	}
	
	/*** Titel fuer allg. einblenden ***/
	
	.title-step
	{
		display:block;
	}

	.linkzurueck {
		width: 100%;
		justify-content: center;
	}

	body#body div.freitext ul {
		margin-bottom: 3rem;
		list-style-type: disc;
		padding-left: 2rem;

	}
}

/*** Small devices (landscape phones, 576px and up) ***/

@media (min-width: 576px) and (max-width: 767.98px)
{
	
	div.board {
		padding: 0;
	}
	
	button.btn.btn-primary, 
	a.btn.btn-primary, input.btn.btn-primary	{
		width: 50%;
	}
	
	/*** Progress nachbilden ***/
	/*** Wird ueber li Tag Laenge umgesetzt ***/

	.nav-tabs li.wcircle::after
	{
		content: '';
		width: 100%;	
		height: 2px;
		background: #ced4da;
		position: absolute;
		left: 50%;
		top: 36%;
		z-index: -5; 
	}
	
	/*** Titel fuer Punktnavi ausblenden ***/
	
	.title-line
	{
		display:none;
	}
	
	/*** Titel fuer allg. einblenden ***/
	
	.title-step
	{
		display:block;
	}

	/* body#body.tpl-2013_standard_formdesigner div.schritte ul li.nav-item[style="width:33%;"] + li.nav-item[style="width:33%;"]:last-of-type {
		width: 34%!important;
		background-color: yellow;
		} */

		body#body div.freitext ul {
			margin-bottom: 3rem;
			list-style-type: disc;
			padding-left: 2rem;
	
		}
}

/*** Medium devices (tablets, 768px and up) ***/

@media (min-width: 768px) and (max-width: 991.98px)
	
{	
	
	h1.articlehead {
		font-size: 2.5rem;
	}

	div.board {
		padding: 0;
	}

	button.btn.btn-primary, 
	a.btn.btn-primary, input.btn.btn-primary	{
		width: 50%;
	}


	div.col-sm-12:has(a.linkzurueck) {
		flex-direction:row;
		display: flex;
		max-width: 100%;
	}

	div.col-sm-12:has(a.linkzurueck) .btn.btn-primary {
		margin-right: 0;
		width: 50%;	
	}

	div.form-group {
		margin-bottom: 2.5rem;
	}

	body#body div.freitext ul {
		margin-bottom: 3rem;
		list-style-type: disc;
		padding-left: 2rem;

	}
	
	/*** Progress nachbilden ***/
	/*** Wird ueber li Tag Laenge umgesetzt ***/

	.nav-tabs li.wcircle::after
	{
		content: '';
		width: 100%;	
		height: 2px;
		background: #ced4da;
		position: absolute;
		left: 50%;
		top: 27%;
		z-index: -5; 
	}
	
	/*** Titel fuer Punktnavi ausblenden ***/
	
	.title-line
	{
		display:block;
	}
	
	/*** Titel fuer allg. einblenden ***/
	
	.title-step
	{
		display:none;
	}

	.grid_3.artikel  {
		width: 100%;
		float: unset;
		margin: 0;
		padding: 0 0;
	}

	.grid_3 .grid_3 {
		margin: 0;
	}

	aside .servicesuche, 
	aside .sectionhead {
		display: none;
	}

	#myTabContent .file-list [class*=" bi-"] + div {
		left: 12px;
	}

	#myTabContent .file-list .bi-trash3:before {
		left: 6px;
	}

	h1.articlehead {
		font-size: 2.5rem!important;
	}
}

/*** Large devices (desktops, 992px and up) ***/

@media (min-width: 992px) and (max-width: 1199.98px)
{
	
	
	h1.articlehead {
		font-size: 2.5rem;
	}

	div.board {
		padding: 0;
	}
	
	/* Selektor um alte und neue Formularseiten zu unterscheiden und Schriftgröße von Standardtext-Elementen zu beeinflussen */

	button.btn.btn-primary, 
	a.btn.btn-primary, input.btn.btn-primary	{
		width: 50%;
	}

	body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .tinyblock p {
	font-size: 1.125rem;
	}

	body div.schritte #hilfe{
		/* margin-left: 12px; */
		font-size: 1.125rem;
	}


	/* Abstand navtabs zum Formular */
	form#formulardesigner ul {
		margin-bottom: 4rem;
	}

	body#body div.freitext ul {
		list-style-type: disc;
		padding-left: 2rem;
		padding-bottom: 0;

	}
	
	body:not(.moderncss) .wrapper, 
	#rs_ganzeseite.wrapper {
		max-width: 872px;
		margin-left: 18%;
		margin-right: 18%;
	}

	div.col-sm-12:has(a.linkzurueck) .btn.btn-primary {
		margin-right: 0;
		width: 50%;
	}

	div.col-sm-12:has(a.linkzurueck) {
		flex-direction:row;
		display: flex;
		max-width: 100%;	
	}
	
	.grid_3.artikel, 
	.grid_3  {
		width: 100%;
		float: unset;
		margin: 0;
		padding: 0 0;
	}

	/*** Progress nachbilden ***/
	/*** Wird ueber li Tag Laenge umgesetzt ***/

	.nav-tabs li.wcircle::after
	{
		content: '';
		width: 100%;	
		height: 2px;
		background: #ced4da;
		position: absolute;
		left: 50%;
		top: 26%;
		z-index: -5; 
	}
	
	/*** Titel fuer Punktnavi einblenden ***/
	
	.title-line
	{
		display:block;
	}	
	
	/*** Titel fuer allg. ausblenden ***/
	
	.title-step
	{
		display:none;
	}

	#myTabContent .file-list [class*=" bi-"] + div {
		left: 16px;
	}

	#myTabContent .file-list .bi-trash3:before {
		left: -2px;
	}

	div.schritte {
		font-size: 1.125rem;
	}

	h1.articlehead {
		font-size: 2.5rem;
	}

}

/*** Extra large devices (large desktops, 1200px and up) ***/

@media (min-width: 1200px)
{
	
	div.board {
		padding: 0;
	}

	div.schritte {
		font-size: 1.25rem;
	}

	/* Selektor um alte und neue Formularseiten zu unterscheiden und Schriftgröße von Standardtext-Elementen zu beeinflussen */

	body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .tinyblock p
	/* , body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .col-form-label    */
	{
	font-size: 1.25rem;
	}

	body#body.tpl-2013_standard_formdesigner main a.linkextern.standardlink,
	body#body.tpl-2013_standard_formdesigner main a.linkintern.standardlink {
	font-size: 1.25rem;
	}

	
	button.btn.btn-primary, 
	a.btn.btn-primary, input.btn.btn-primary, .modal .btn.btn-secondary	{
		width: 50%;
	}

	/* Abstand Nav-Tabs Formular */
	form#formulardesigner ul {
		margin-bottom: 4rem;
	}

	body#body div.freitext ul {
		list-style-type: disc;
		padding-left: 2rem;
		padding-bottom: 0;

	}
	
	body:not(.moderncss) .wrapper, 
	#rs_ganzeseite.wrapper {
		max-width: 872px;
		margin-left: 18%;
		margin-right: 18%;
	}

	.grid_3.artikel  {
		width: 100%;
		float: unset;
		margin: 0;
		padding: 0 0;
	}

	div.col-sm-12:has(a.linkzurueck) {
		flex-direction:row;
		display: flex;
	}

	div.col-sm-12:has(a.linkzurueck) .btn.btn-primary {
		margin-right: 0;
		max-width: 500px;
	}
	
	div.schritte #hilfe{
		margin-left: 0;
	}

	/*** Progress nachbilden ***/
	/*** Wird ueber li Tag Laenge umgesetzt ***/

	.nav-tabs li.wcircle::after
	{
		content: '';
		width: 100%;	
		height: 2px;
		background: #ced4da;
		position: absolute;
		left: 50%;
		top: 27%;
		z-index: -5; 
	}

	/*** Titel fuer Punktnavi einblenden ***/
	
	.title-line
	{
		display:block;
	}
	
	/*** Titel fuer allg. ausblenden ***/
	
	.title-step
	{
		display:none;
	}

	#myTabContent .file-list [class*=" bi-"] + div {
		left: 8px;
	}

	#myTabContent .file-list .bi-trash3:before {
		left: 8px;
	}

	h1.articlehead {
		font-size: 2.5rem;
	}
}
 
@media (min-width: 1440px) {

	#myTabContent .file-list [class*=" bi-"] + div {
		left: -6px;
	}
	
	div.schritte #hilfe {
		font-size: 1rem;
	}


	h1.articlehead {
		font-size: 2.5rem;
	}


	body#body.tpl-2013_standard_formdesigner main a.linkextern.standardlink {
		font-size: 1.375rem;
	}

	body#body.tpl-2013_standard_formdesigner main .tab-content#myTabContent a.standardlink {
		font-size: 1.375rem!important;
	}
	

	body#body.tpl-2013_standard_formdesigner main div:not(.tab-content) a.standardlink {
		font-size: 1.375rem;
	}

	/*** Modal Layer stylen ***/
	.modal-footer button.btn.btn-primary, 
	a.btn.btn-primary, input.btn.btn-primary, .modal .btn.btn-secondary	{
		width: 48%;
	}

	.modal-footer {
		/* flex-direction: row-reverse; */
	}

	.modal .btn.btn-secondary {
		background-color:#ffffff;
		outline-color: #2d2d2d ;
		border: 1px solid #CBCBCB;
	}

	.modal-footer button.btn.btn-primary:hover {
		background-color: #d60909;
		border-color: #d60909;
	}

	.modal .btn.btn-secondary:hover {
		background-color:#E9EEF3;
	}


	/* Selektor um alte und neue Formularseiten zu unterscheiden und Schriftgröße von Standardtext-Elementen zu beeinflussen */

	body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .tinyblock p, 
	body#body.tpl-2013_standard_formdesigner:has(div.schritte) main div.form-row, 
	body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .tinyblock strong 
	/* ,body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .col-form-label */
	{
		font-size: 1.375rem;
		color: #2d2d2d;
		font-weight: normal;
		font-family: 'ApproachKoelnRegular', Arial, sans-serif;
	}

	body#body.tpl-2013_standard_formdesigner:has(div.schritte) main .tinyblock strong {
		font-family: var(--font-family-semibold);
	}
	}
	
body:not(.moderncss) .wrapper, #rs_ganzeseite.wrapper {
	max-width: 1006px;
	/* margin: auto; */
}

div.board {
	width: 1006px;
}

div.col-sm-12:has(button[id*="tabboxf"]){
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;

}

.tpl-2013_standard_formdesigner .grid_3.artikel {
	width: 100%;
	margin-left: 0;
}

.tpl-2013_standard_formdesigner .grid_3.artikel div.grid_3, .grid_3 form#formulardesigner  {
	width: 100%;
}

 .board {
	width: 100%;
	padding: 0;
}

.board .form {
	width: 100%;
}

.form-check-input {
	width: 1.375rem;
	height: 1.5rem;
	margin-right: 0.625rem;
	margin-top: 0px;
	color: #2d2d2d;
	border: 1px solid #5A616C;

}

input.form-check-input + label.form-check-label {
	font-size: 1.125rem;
	font-family: "ApproachKoelnRegular";
	font-style: normal;
	font-weight: 400;
	line-height: 145%; /* 26.1px */
	margin-right: 1rem;
	display: flex;
}

input[type="checkbox"] + .form-check-label {
	font-size: 1rem;
	font-family: "ApproachKoelnRegular";
	font-style: normal;
	font-weight: 400;
	line-height: 140%; /* 26.1px */
	/* padding-right: 2.875rem; */
	margin-right: 10px;
	display: flex;
}

.form-check {
	margin: 0px;
	display: inline-block;

}

.form-group .col-form-label {
	font-size: 1.25rem;
	font-style: normal;
	line-height: 145%; /* 29px */
	padding-top: 0;
	padding-bottom: 0px;
	/* margin-bottom: 1.5rem; */

}

/* links am Fuß des Formulars */
.linkzurueck {
	/* text-indent: calc(var(--font-size)* -1.5);
    margin-left: calc(var(--font-size)* 1.5); */
	text-decoration: none;
	color: #2d2d2d;
	font-size: 1rem;
	display: inline-block;
	padding-top: 0.5rem;
	float: left;
}

.linkzurueck::before {
	content: '';
    display: inline-block;
    width: 1rem;
    height: 1rem;
    background-image: url(/images/x22/icons/arrow-left-red.svg);
    background-size: 1rem 1rem;
    height: 1rem;
    width: 1rem;
    margin-right: .5rem;
    background-position: 0 2px;
    background-repeat: no-repeat;
}

.eidhinweis.linkintern a {
	text-decoration: none!important;
	color: #2d2d2d!important;
	font-size: 1rem!important;
	display: inline-block;
	padding-top: 0.5rem;
	font-weight: 600;
}

div.eidhinweis.linkintern {
	background-image: none!important;
	display: flex;
	padding-left: 0!important;
}

.eidhinweis.linkintern a:before {
	content: '';
    display: inline-block;
    width: 1rem;
    height: 1rem;
    background-image: url(/images/x22/icons/box-arrow-up-right-red.svg);
    background-size: 1rem 1rem;
    height: 1.1rem;
    width: 1.1rem;
    margin-right: .25rem;
    background-position: 0 2px;
    background-repeat: no-repeat;
}

.btn.btn-primary {
	color: #fff;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    font-family: 'ApproachKoelnSemiBold', 'Arial';
    font-size: 1.25rem;
    padding: 0.5rem 2rem 0.5rem 2rem;
    border-radius: 1.4rem;
    border-color: var(--red);
	background-color: var(--red);
	line-height: 145%;
	width: 50%;
	float: none;
}

div.mb-1 + div:has(.linkzurueck) {
	margin-top: 4rem;
}


.form-check-input[type=radio]:focus-visible {
	border-color: #2d2d2d;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
	}


#myTabContent .file-list .bi-trash3:before {
		left: 16px;
}

/* Radiobuttons auf kleinen Bildschirmen untereinander, keine transitions, labels nicht floaten, keine Textveränderung */
@media (max-width: 475.5px) {
	div.form-group {
	display: flex;
	flex-direction: column;	
	}

	div.form-floating {
		display: flex; 
		flex-direction: column;
	}

	body.tpl-2013_standard_formdesigner div.form-floating a {
		margin-bottom: 	0;
	}

	div.form-floating label, 
	div.form-floating input:focus label, 
	.form-floating>.form-control:focus~label,
	div.form-floating select:focus label,
	.form-floating>.form-control:not(:placeholder-shown)~label,
	.form-floating>.form-select~label
	  {
		position: static;
		transform: none;
		font-size: 1rem;
		padding: 0;
		display: block;     
		opacity: unset; 
		order: -1;
	}

	.form-control {
		transform: none;
		position: static;
	}

	.form-floating>.form-control:focus, .form-floating>.form-control:not(:placeholder-shown) {
		padding: 0;
	}

	.col-form-label {
		margin: unset;
	}
	
}