@font-face {
  font-family: 'LiberationSans';
  font-display: swap;
  font-weight: normal;
  font-style: normal;
  src: url("../font/LiberationSans-Regular-webfont-LuXpnQq.woff") format('woff');
  /*src: url('../font/LiberationSans-Regular-webfont.woff2') format('woff2'), url("../font/LiberationSans-Regular-webfont-LuXpnQq.woff") format('woff');*/
}


body {
	font-family: "LiberationSans", sans-serif;
	font-style: normal;
	font-weight: 400;
	color: #4d2764;
	font-size: 11pt;
	margin-bottom: 80px;
	background-color: rgba(77,39,100, 0.3); /* #4d2764 */
	background-image: url("../images/bg-footer-GEZoM2A.png");
	background-repeat: no-repeat;
	background-position: bottom;
	background-size: contain;

	/*min-height: 100vh;*/
	min-height: 90vh;
}

/* Selftest */
input[type="checkbox"], input[type="radio"] {
	width: 20px;
	height: 20px;
}


/* DataTable */
#maintable .dt-container
{
	padding-bottom: 10px;
}

/* PageLength => Info */
#maintable .dt-length
{
	padding-right: 100px;
	display: inline-block;
}

#maintable .dt-info
{
	display: inline-block;
}



/* fix for tom-select in Filter dropdown */
.ts-dropdown, .ts-dropdown.form-control, .ts-dropdown.form-select
{
	background: #fff !important;
}

.list-unstyled {
	list-style-type:none;
	list-style: none;
	padding-left: 0;
}

.help-block {
	color: #ff0000;
}

video {
 max-width: 100%;
 height: auto;
}


div.head1
{
 margin-top: 15px;
 font-weight: bold;
 text-transform: uppercase;
 letter-spacing: 0.07em;
}

#section-next-steps p
{
	text-align: justify;
	margin-top: 0;
	margin-bottom: 5px;
}

#section-welcome
{
	background-color: #4d2764;
	color: #ffffff;
	padding: 2em;
	text-align: left;
}

#section-welcome h1
{
 margin: 0;
 padding: 0;
 font-size: 2em; /* 30px */
 text-transform: uppercase;
}

#section-registration-form
{
 /*padding-top: 30px;*/
}


#logo
{
 background-color: rgba(255, 255, 255, 0.95);
 z-index: 99;
 position: absolute;
top: 80px;
left: 20px;
color:#ffffff;
padding-left: 60px;
padding-top: 30px;
padding-right: 30px;
padding-bottom: 30px;
}

#logo img
{
	/*width: 220px;*/
}

/* Typo */
h1 { font-size: 2em; /*16pt */  margin-top: 30px; }
p { margin: 1em 0 1em 0; }
a { color: #0000f0; text-decoration: none; }



a:hover { text-decoration: none; }
code { background: #F5F5F5; max-width: 100px; padding: 2px 6px; word-wrap: break-word; }

/** #wrapper { background: #f4f2f6; margin: 1em auto; max-width: 1030px; width: 95%; } **/
#wrapper-backend { background: #FFF; margin: 1em auto; width: 95%; }


#container { padding: 2em; }


#welcome, #status { margin-bottom: 2em; }
#welcome h1 span { display: block; font-size: 75%; }
.link { color: #4d2764; text-decoration: underline; }
#icon-status, #icon-book { float: left; height: 64px; margin-right: 1em; margin-top: -4px; width: 64px; }
#icon-book { display: none; }




h2, .h2 {
    font-size: 22px;
}


.container-form_bemerkung {
	display: none;
}


.content-container ul
{
 margin-top: 20px;
 margin-bottom: 20px;
}

.content-container ul li
{
 list-style-type: square;
 list-style-position: outside;
 list-style-image: none;

 margin-top: 5px;
 margin-bottom: 5px;
}


section
{
 padding-top: 0;
 padding-bottom: 30px;
 margin-bottom: 0;
}

section.divider
{
	padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 0;
	margin-top: 0;
 	border-bottom: 1px solid #4d2764;
}


section.first /*, #section-video*/
{
	padding-top: 0 !important;
	margin-top: 0 !important;
	padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}


#section-video
{
	padding-top: 0 !important;
	margin-top: 0 !important;
}


#mediaGallerie
{
 margin-top: 15px;
}

.item
{
 margin-bottom: 30px;
}

.headline1{ /*margin-top: 30px;*/ color: #4d2764; font-size: 2em; /*24px*/ font-weight: 800; text-transform: uppercase;}
.headline2{ margin-left: 75px; color: #4d2764; font-size: 2em; /*24px*/ text-transform: uppercase;}



label, .col-form-label
{
	color: #4d2764;
	font-weight: 800;
}


.btn-primary
{
	background-color: #4d2764; !important;
	border-color: #4d2764; !important;
}


.footer-headline
{
	font-size: 40px;
	text-align: right;
	color: #4d2764;
	margin-right: 50px;
	/*font-weight: 800;*/
}


.btn-primary:hover {
    background-color: #FFB500 !important;
    border-color: #FFB500 !important;
}



/*
.form-container
{
	background: url("../images/SRT_Karte_lila_RGB_web-tdSbnAX.png") no-repeat 120% 50%;
    background-size: auto;
	background-size: 52% auto;
	margin-right: -30px;
}
*/



.form-container-with-formular {
  margin-right: -30px;
  display: block;
  position: relative;
}

.form-container-with-formular::after {
  content: "";

  background: url("../images/SRT_Karte_lila_RGB_web-tdSbnAX.png") no-repeat 120% 50%;
  /*background-size: auto;*/
  background-size: 52% auto;
  /*margin-right: -30px;*/

  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  /*right: 0;*/
  right: 15px;
  position: absolute;
  z-index: 1;
}

.form-inner-container
{
 position: relative;
 z-index: 5;
}



.headline-welcome
{}



#footer {
	/*background-color: #f4f2f6; */
	background-color:rgba(244,242,246,0.8);
	color: #4d2764;
	padding: 2em;
	text-align: left;
}

#footer .urlLink
{ text-align: right; }

#footer a { color: #4d2764; }



.badge {font-size: 14px; font-weight:400; letter-spacing: 0.06em;}


/* Fancybox: Iframe dimensions can be controlled by CSS:  (These CSS rules can be overridden by JS, if needed) */
.fancybox-slide--iframe .fancybox-content {
    width  : 1300px;
    height : 1000px;
    max-width  : 80%;
    max-height : 80%;
    margin: 0;
}



#myBtn {
  display: none;
  position: fixed;
  bottom: 30px;
  right: 70px;
  z-index: 99;
  font-size: 26px;
  border: none;
  outline: none;
  /*background-color: red;
  padding: 15px;
  border-radius: 4px;
  */
  color: #4d2764;
  cursor: pointer;
}

#myBtn:hover {
  color: #555;
}


.question-headline
{text-align: center;
margin-top: 25px;
margin-bottom: 15px;
font-size: 22px;
}

.btn-question
{
	margin-top: 15px;
}


/* E-Learning (Start) */

.questionContainer label {
    font-weight: normal !important;
}

.btn-group-next
{
	padding-top: 15px;
	margin: auto;
	text-align: center;
}

/* E-Learning (End) */



/* Break out of Bootstrap-Grid */
.break-out
{
	width: 100vw;
	position: relative;
	left: calc(-1 * (100vw - 100%) / 2);
}


/* Desktop (large Displays) */
@media (min-width: 768px) {
	#wrapper { background: #f4f2f6; width: 95%; max-width: 1030px; margin: 2em auto; }

	#icon-book { display: inline-block; }
	#status a, #next a { display: block; }

	@-webkit-keyframes fade-in { 0% { opacity: 0; } 100% { opacity: 1; } }
	@keyframes fade-in { 0% { opacity: 0; } 100% { opacity: 1; } }
	.sf-toolbar { opacity: 0; -webkit-animation: fade-in 1s .2s forwards; animation: fade-in 1s .2s forwards;}



	/* Navi START */
	.navbar {
	    position: absolute;
	    z-index: 2000;
	}

	.navbar-srt a#dropdown-menu-end
	{
	 color: #ffffff;
	 font-size: 56px;
	}

	.navbar .dropdown-toggler
	{
	 margin-left: 15px;
	 margin-right: 15px;
	}

	.navbar-srt .dropdown-toggle:after { content: none }


	.navbar .collapse:not(.show) {
	    display: block;
	}

	.navbar {
		right: 40px;
    	top: 40px;
	}
	/* Navi END */

}


/* Mobile (small Displays) */
@media (max-width: 768px) {

	#wrapper { background: #f4f2f6; width: 100%; max-width: 1030px; margin: 0 auto; padding: 0.8em}

	#wrapper .container { padding: 0 !important;  margin: 0 auto; }

	.container > .row { margin-left: 0; margin-right: 0;}

	.wrapper-footer {background: #f4f2f6; padding: 0 !important; margin-top: 10px !important;}

	#footer { padding: 1em; }

	h1,h2,h3, .headline1, .headline2 {font-size: 1.2em !important;}
	.headline2 {margin-left: 10px;}

	h4,h5,h6{font-size: 2.4em !important;}


	/* Navi START */
	.navbar {
	    position: absolute;
	    z-index: 2000;

	}

	.navbar-collapse
	{
		top: 0;
   		position: absolute;
	}

	.navbar-srt .dropdown-toggle:after { content: none }

	.navbar a.dropdown-item {
		padding-top: 15px;
		padding-bottom: 15px;
	}

	.navbar-srt a#dropdown-menu-end
	{
	 color: #ffffff;
	 font-size: 22px;
	}

	/* Für mobil */
	.navbar .collapse:not(.show) {
	    display: block;
	}

	.navbar-nav .dropdown-menu {
    width: 100%;
    min-width: 350px;
	}

	/* Navi END */
}