body , html {
    min-height:100%;
    height:100%;
    width: 100%;
    margin:0px;
    padding:0px;
    background-color: #EBEBEB;
    font-family: 'Roboto', sans-serif;
    font-weight:400;
    line-height: 1.4;
    color: #FFFFFF;
    /*
    -webkit-text-size-adjust: 100%;
		*/
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
}

#ccm-panel-add-blocktypes-list {
  display: flex;
  flex-direction: column-reverse;
}

.ccm-marketplace-btn-wrapper {
  display:none;
}

#console, #console2 {
  position:fixed;
  left:6px;
  top:116px;
  color:red;
  z-index: 3001;
  max-width:280px;
  background-color:rgba(255,255,255,0.9);
  display:block;
  font-size:13px;
  word-wrap: break-word;

}
#console2 {
  top:12px;
  padding:8px;
  color:#000000;
  border-radius: 12px;
}

/* ///////////////////////////////////////////////////////////////////////////////  BACKGROUND */
.background-wrapper-fixed {
    position: fixed;
    top:0px;
    z-index:0;
    min-height:100%;
    width:100%;
    overflow:visible;
    background-color: rgba(25,23,0,0);
}
.background-wrapper {
    position: relative;
    width:100%;
    height:calc(100vh);
    /*
    max-width:1280px;
    */
    margin: 0 auto;
    background-color: #1D75BF;
    background-image: linear-gradient(to bottom, #1D75BF 0%, #134F80 100%);
}
.background-stage {
    position: relative;
    height:100%;
    /*
    max-height:1100px;
    */
    width:100%;
    overflow:hidden;
    display:flex;
    justify-content:center;
    background-repeat: no-repeat;
}

#page {
  position: relative;
  width:100%;
}

/* ///////////////////////////////////////////////////////////////////////////////  MENU TOP */
.menu-wrapper-fixed {
    /*
    position: fixed;
    */
    position: absolute;
    top:0px;
    z-index:300;
    height:1px;
    width:100%;
    overflow:visible;
}
.menu-wrapper-outer {
		background-color: rgba(0,100,163,0);
}
.menu-wrapper {
    position: relative;
    width:100%;
    max-width:1280px;
    margin: 0 auto;
}
.menu-wrapper > .header {
    position: relative;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    width:100%;
    background-color: rgba(230,70,163,0);
}
.menu-wrapper > .hamburger a {
		color:#FFFFFF;
		background-image: url(../images/symbols/Symbol_next-white.svg);
    background-position: center left;
    background-repeat: no-repeat;
    padding-left:28px;
    line-height:2.1;
}
.menu-wrapper-outer .hamburger {
		max-height:0px;
		overflow:hidden;
}

.menu-wrapper-outer.open {
		background-color: rgba(0,100,163,0.8);
		animation: fadein_HMenu;
		animation-duration: 800ms;
}
.menu-wrapper-outer.open .hamburger {
		max-height:2000px;
		animation: openHMenu;
		animation-duration: 1000ms;
}
@keyframes openHMenu {
  0% {
    max-height:0px;
  }
  100% {
    max-height:400px;
  }
}
@keyframes fadein_HMenu {
  0% {
    background-color: rgba(0,100,163,0);
  }
  100% {
    background-color: rgba(0,100,163,0.8);
  }
}
.menu-wrapper-outer.closed {
		background-color: rgba(0,100,163,0);
		animation: fadeout_HMenu;
		animation-duration: 400ms;
}
.menu-wrapper-outer.closed .hamburger {
		max-height:0px;
		animation: closeHMenu;
		animation-duration: 400ms;
}
@keyframes closeHMenu {
  0% {
    max-height:400px;
  }
  100% {
    max-height:0px;
  }
}
@keyframes fadeout_HMenu {
  0% {
    background-color: rgba(0,100,163,0.8);
  }
  100% {
    background-color: rgba(0,100,163,0);
  }
}

/* ///////////////////////////////////////////////////////////////////////////////  PAGE CONTENT */
.page-wrapper {
    z-index:1;
    position: relative;
    min-height:100%;
    width:100%;
    max-width:1280px;
    margin: 0 auto;
    overflow:hidden;
    display:flex;
    justify-content:center;
}

.content-area {
    display:flex;
    flex-direction:column;
    flex-wrap:wrap;
    min-height: 100%;
}

.vspace-upper {
   background-color: rgba(0,210,0,0);
}

.vspace-under {
   background-color: rgba(0,210,0,0);
}

.logo-wrapper-startpage {
    width:100%;
}
.logo-wrapper-startpage .logo {
    display:block;
    background-image: url(../images/logos/Logo_SP-white.svg);
    background-size: 100% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    height:100%;
    margin: 0 auto;
    background-color: rgba(255,0,0,0);
}
.menu-wrapper .logo {
    display:block;
    position:relative;
    background-image: url(../images/logos/Logo_SP-white.svg);
    background-size: 100% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    height:100%;
    margin: 0 auto;
    cursor:pointer;
}
.opentext-wrapper {
    width:100%;
}
.opentext-wrapper .text {
    background-color: rgba(255,150,0,0);
}

.space-between {
    justify-content:space-between;
}
.flex-centered {
	justify-content:center;
}

.flex-box.align-right {
  display:flex;
  background-color: rgba(255,150,0,0);
  flex-direction:column;
  align-items:flex-end;
  width:100%;
}
.flex-box.align-center {
  display:flex;
  background-color: rgba(255,150,0,0);
  flex-direction:column;
  align-items:center;
  width:100%;
}

.sp-selector-wrapper,
.sp-buttons-wrapper {
    width:100%;
    display:flex;
    flex-direction:row;
}
.sp-selector {
    display:flex;
    justify-content:center;
    align-items:flex-end;
    background-color: #FFFFFF;
    color:#0075BF;
    background-repeat: no-repeat;
    text-decoration:none;
    text-align:center;
}

.rounded-corners {
    border-radius: 23px;
}

.sp-selector-wrapper > .button-left {
    background-image: url(../images/icons/Icon_Schulen-Lehrer.svg);
}

.sp-selector-wrapper > .button-right {
    background-image: url(../images/icons/Icon_Eltern-Schueler.svg);
}

.arrow-to-content {
    display:block;
    background-image: url(../images/symbols/Symbol_Page-down-white.svg);
    background-size: 100% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: rgba(255,0,0,0);
}

.menu-bottom-wrapper {
    /*
    min-height:36px;
    */
    width:100%;
    background-color: rgba(255,255,255,0.16); /* 0.16 opak */
}

.menu-link {                                /* ALLE LINKS */
  min-height:50px;
  display:flex;
  justify-content:flex-start;
  align-items:center;
}

.menu-bottom-wrapper .menu-link {
    text-decoration:none;
    color:#FFFFFF;
    border-bottom:2px solid #FFFFFF;
    background-image: url(../images/symbols/Symbol_next-white.svg);
    background-repeat: no-repeat;
    background-color: rgba(255,0,0,0);
}
.menu-bottom-wrapper .menu-link:last-child {
    border-bottom:2px solid transparent;
}
.menu-inner-wrapper {
    min-height:36px;
    width:100%;
}
.menu-inner-wrapper .menu-link {
    text-decoration:none;
    color:#596A80;
    border-top:2px solid rgba(89,106,128,0.16);
    background-image: url(../images/symbols/Symbol_next-gray.svg);
    background-repeat: no-repeat;
    background-color: rgba(255,0,0,0);
}
.menu-inner-wrapper .menu-link:last-child {
    border-bottom:2px solid rgba(89,106,128,0.16);
}

.buttons-login-wrapper > .button-left {
  border:1px solid #FFFFFF;
  background-color:transparent;
  color:#FFFFFF;
}
.buttons-login-wrapper > .button-right {
  border:1px solid #FFFFFF;
  background-color:#FFFFFF;
  color:#0075BF;
}

p {
  margin:0px;
}
.page_schlossbedienung .opentext-wrapper p {
  margin-bottom: 16px;
}

a {
	text-decoration:none;
	color:#0075BF;
}

.blank-text p {								/* blank pages : blank, full */
  margin-bottom:12px;
}

.button {
    text-decoration:none;
    display:flex;
    justify-content:center;
    align-items:center;
}

.small-link {
    text-decoration:none;
    background-color: rgba(255,255,255,0);
}
.download-file {
   background-image: url(../images/symbols/download-file.png);
   background-position: center right;
   background-repeat: no-repeat;
   display: flex;
   align-items:center;
   min-height:35px;
}
.download-file > a {
   display: flex;
   align-items:center;
   color:#8F9FB3;
   padding-right:40px;
   line-height:1.3;
   min-height:35px;
   width:calc(100% - 40px);
   background-color: rgba(255,0,0,0);
}
.font-color-white {
    color:#FFFFFF;
}

.font-color-blue {
  color:#0075BF;
}
.color-blue {     /* schliessfaecher.de */
  color:#0175c0;
}
.center {
  text-align:center;
}

.centered-wrapper {
	display:flex;
	width:100%;
	height:100vh;
	justify-content:center;
	align-items:center;
	background-color: rgba(255,255,0,0);
}

.inner-inline p {
	display:inline;
}

.font-color-grey,
.color-grey-light {
  color:#8F9FB3;
}
.font-color-darkgrey,
.color-grey-dark {
  color:#596A80;
}

.font-color-red {
  color:red;
}

.green {
  color:#2a5a33;
}

.navi-toggle {
    background-image: url(../images/symbols/Symbol_Menue-white.svg);
    background-size: auto 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: rgba(255,0,0,0);
}
.menu-wrapper-outer.open .navi-toggle {
    background-image: url(../images/symbols/Symbol_Close-white.svg);
    animation-duration: 600ms;
    animation-name: toggleButton_open;
}

@keyframes toggleButton_open {
  0% {
      opacity:1;
      transform: rotate(90deg);
      background-image: url(../images/symbols/Symbol_Close-white.svg);
  }
  100% {
      opacity:1;
      background-image: url(../images/symbols/Symbol_Close-white.svg);
  }
}


.logbtn-toggle {
    background-image: url(../images/symbols/Symbol_login-white.svg);
    background-size: auto 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}
.logbtn-toggle.open {
    background-image: url(../images/symbols/Symbol_logged-white.svg);
}

.login-wrapper-rounded {
    background-color: rgba(0,0,0,0.3);  /* 0.3 opak */
    min-height:200px;
    width:100%;
}
.content-wrapper {
    background-color: rgba(255,255,255,1);  /* #FFFFFF */                        /* WEISSE BOX */
    min-height:120px;
    width:100%;
}
#content_wrapper_extras {
  display:none;
}

.box-headline {
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  min-height: 24px;
  background-color: rgba(255,0,0,0.3);
}
.box-headline.centered {
  justify-content:center;
}
.box-headline > span {
  display:block;
  margin-left:24px;
  margin-right:24px;
}

.button-wrapper {
  min-width:30px;
  display:flex;
  flex-direction:row;
  align-items:center;
  background-color: rgba(255,0,0,0);
}

.button-wrapper.wrapper-left {
  justify-content:flex-start;
}

.button-wrapper.wrapper-right {
  justify-content:flex-end;
}

.box-headline .ico-button {
  display:block;
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.box-headline .button-back {
  background-image: url(../images/symbols/Symbol_back-white.svg);
}
.box-headline .button-back-blue {
  background-image: url(../images/symbols/Symbol_back-blue.svg);
}
.box-headline .button-close-grey {
  background-image: url(../images/symbols/Symbol_Close-light-gray.svg);
}

.box-indent {
  margin:0px 20px 0px 20px;
}

input[type="text"],
input[type="password"],
textarea {
	-webkit-appearance: none;
}


input[type="button"],
input[type="submit"] {
  cursor:pointer;
}

input.opaque,
.button.opaque {
    background-color: rgba(200,200,255,0.18);
    color:#FFFFFF;
  }

input.bg-white,
.button.bg-white {
    border: 1px solid #FFFFFF;
    background-color: #FFFFFF;
    color:#1D75BF;
  }

input.bg-grey,
.button.bg-grey {
    border: 1px solid #8F9FB3;
    background-color: #8F9FB3;
    color:#FFFFFF;
  }

.button.bg-grey-light {							/* BORDER 1 ! */
    border: 1px solid #EDF0F2;
    background-color: #EDF0F2;
    color:#596A80 !important;
  }

input.bg-grey-light, 								/* BORDER 2 ! */
textarea.bg-grey-light {						/* BORDER 2 ! */
    border: 1px solid #EDF0F2;
    background-color: #EDF0F2;
    color:#596A80 !important;
  }

input.bg-trans,
.button.bg-trans {
    border: 1px solid #FFFFFF;
    background-color: transparent;
    color:#FFFFFF;
  }
input::placeholder {
  color: #FFFFFF;
  opacity:1;
}
.easy-autocomplete {
  background-color: rgba(255,0,0,0);
}
.easy-autocomplete.bg-grey-light .bg-grey-light {
  border: 1px solid #EDF0F2;
  box-shadow: unset;
  background-color: #EDF0F2;
  color:#596A80;
  background-image: none;
  padding-top: unset;
  padding-bottom: unset;
  padding-left: unset;
  padding-right: unset;
  width:100%;
  min-height:48px;
}

.reg-elmt {
  position: relative;
  min-height:89px;
}

.reg-elmt .info {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  top: -3px;
  right: 2px;
  border-radius: 50%;
  width: 21px;
  height: 21px;
  background-color: #0075BF;
  color: #FFFFFF;
  font-family: 'serif';
  font-weight: bolder;
}

input.red {
  border-color:#D86154 !important;
}
input.blue {
  border-color:blue;
}
span.red,
.font-color-red {
  color:#D86154 !important;
}
.uppercase {
  text-transform:uppercase;
}

input:focus, textarea:focus, select:focus{
  outline: none !important;
}

.nowrap {
  white-space:nowrap;
}


.header-image {
  background-size: auto 100%;
  background-position: 50%;
  background-repeat: no-repeat;
  margin: 0 auto;
  background-color: rgba(255,0,0,0);
}

.header-image-success {
	background-image: url(../images/icons/Icon_Danke.svg);
}
.header-image-error {
	background-image: url(../images/icons/Icon_404.svg);
}
.header-image-activation,
.header-image-password-saved {
	background-image: url(../images/symbols/Symbol_Bestaetigt-1.svg);
}
.header-image-intime {
	background-image: url(../images/icons/Icon_puenktliche_Fachvergabe.svg);
}
.header-image-unsubscribe {
	background-image: url(../images/icons/Icon_Vertrag_kuendigen.svg);
}
.header-image-maintenance {
	background-image: url(../images/icons/Symbol_Baustelle_1.svg);
}

.no-margin-top {
	margin-top:0px !important;
}

.box-data-outer {
  background-color: rgba(255,0,0,0);
}
.box-data-outer > .content {
  overflow:hidden;
  max-height:2px;
}

.page_meinefaecher .box-data-outer > .content {
  max-height:unset;
}



.box-data-outer .header {
  background-color: #EDF0F2;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.box-data-outer .header .menu-link {
    text-decoration:none;
    color:#8F9FB3;
    width:calc(100% - 140px);
}

.btn-change {
    height:1.4rem;
    padding:1px 16px 0px 16px;
    align-items:center;
    justify-content:center;
    text-decoration:none;

}
.box-data-outer .header .btn-change {
    display:none;
}
.box-data-outer .btn-change {
    background-color: #929FB2;
}
.box-table-outer .btn-change {
    background-color: #EDF0F2;
    color:#8F9FB3;
}
.box-table-outer .btn-change:hover {
    background-color: #929FB2;
    color:#FFFFFF;
    cursor:pointer;
}
.box-data-outer.open .header .btn-change {
    display:flex;
    opacity:1;
    animation-duration: 1200ms;
    animation-name: buttonFade_in;
}

@keyframes buttonFade_in {
  0% {
    opacity:0;
  }
  50% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

.box-data-outer.open .header .menu-link {
    color:#596A80;
}

.box-data-outer .header .menu-link .ico {
    display:inline-block;
    background-image: url(../images/symbols/Symbol_next-gray.svg); /* grey with A :-) is Jörg american ? */
    background-repeat: no-repeat;
    background-size: auto 18px;
    width:18px;
    height:18px;
}

.box-data-outer.open .header .menu-link .ico {     /* staus = OPEN */
    transform: rotate(90deg);
    opacity:1.0;
    animation-duration: 200ms;
    animation-name: iconRotate90;
  }

@keyframes iconRotate90 {
  0% {
    transform: rotate(0deg);
    opacity:0.6;
  }
  100% {
    transform: rotate(90deg);
    opacity:1.0;
  }
}

.box-data-outer .header .menu-link .ico {       /* staus = CLOSE */
    transform: rotate(0deg);
    opacity:0.6;
  }
.box-data-outer.closed .header .menu-link .ico {
    transform: rotate(0deg);
    opacity:0.6;
    animation-duration: 200ms;
    animation-name: iconRotate0;
  }

@keyframes iconRotate0 {
  0% {
    transform: rotate(90deg);
    opacity:1.0;
  }
  100% {
    transform: rotate(0deg);
    opacity:0.6;
  }
}

.box-data-outer .content {
	background-color: rgba(255,0,0,0);
}

.box-data-outer .content-inner {
	padding-top:12px;
	background-color: rgba(255,0,0,0);
}

.box-data-outer .content-inner .form-data > div {
	margin:8px 0px 0px 0px;
	/*
	background-color:yellow;
	*/
}
.box-data-outer .content-inner .form-data.first-child div {         /* 1. Zeile Data Fields */
	margin:6px 0px 0px 0px;
	/*
	background-color:lime;
	*/
}
.box-data-outer .content .content-inner > div:last-child {        /*       letztes DIV in allen Accordions  */
	margin:0px 0px 26px 0px;
	/*
	background-color:yellow !important;
	*/
}
.last-child .content .content-inner > div:last-child {            /* letztes DIV im LETZTEN Accordion, weniger margin  */
	margin-bottom:12px;
	/*
	background-color:red !important;
	*/
}

.box-data-outer .content .content-inner > div.form-data > div:first-child {   /* LEFT */
	width: calc(34% - 6px);
	margin-right:6px;
	color:#8F9FB3;
	float:left;
	/*
	background-color:lime !important;
	*/
}
.box-data-outer .content .content-inner > div.form-data > div:last-child {    /* RIGHT */
	width:65%;
	color:#596A80;
	float:left;
	/*
	background-color:green !important;
	*/
}

.box-data-outer .box-indent > p:first-child {     /* 1. Absatz Text */
	margin-top:12px;
	margin-bottom:0px;
	padding-top:0px;
	/*
	background-color:green;
	*/
}

.form-data {
  display:flex;
}

.wrapper-steps {
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-top:12px solid #FFFFFF;
}
.wrapper-steps > div {
  /* width:50%; */
  display:flex;
  align-items:center;
}
.wrapper-steps > div:last-child {
  justify-content:flex-end;
  background-color: rgba(55,125,0,0);
}
.wrapper-steps > div > div {
  min-height:28px;
  display:flex;
  align-items:center;
}
.circle-step {
  width: 27px;
  height:27px;
  line-height:1.0;
  justify-content:center;
  align-content:center;
  flex-shrink : 0;
  border-radius:50%;
  background-color:#FFFFFF;
  border:1px solid #EDF0F2;
  color:#8F9FB3;
  margin-right:0px;
  margin-left: 7px;
}
.wrapper-steps > div:last-child .circle-step:first-child {
  margin-left: 0px;
}
.circle-step.current {
  background-color:#0075BF;
  border:1px solid #0075BF;
  color:#FFFFFF;
  margin-right:7px;
  margin-left: 0px;
}
.circle-step.done {
  background-color: #0075BF;
  border: 1px solid #0075BF;
  color:transparent;
  margin-left:0px;
  margin-right: 7px;
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-image: url(../images/symbols/Symbol_registration-page-OK.svg);
}
.steps-progess-bar {
  margin-top:10px;
  margin-bottom:-6px;
  height:5px;
  background-color:#EDF0F2;
}
.steps-progess-bar > div {
  height: 5px;
  background-color:#0075BF;
}
.steps-progess-bar.progress-1 > div {
  width: 20%;
}
.steps-progess-bar.progress-2 > div {
  width: 40%;
}
.steps-progess-bar.progress-3 > div {
  width: 60%;
}
.steps-progess-bar.progress-4 > div {
  width: 80%;
}

.content-wrapper .header-area {
  background-color: #EDF0F2;
  border-top: 2px solid #FFFFFF;
}
.content-wrapper .header-area > div {       /* header area for selects + charts */
  display:flex;
  justify-content:center;
  border-top:   11px solid transparent;
  border-bottom:12px solid transparent;
}
.tenants-list .content-wrapper .header-area > div {       /* tenants list */
  border-bottom:6px solid transparent;
}
.content-wrapper .header-area > div > .wrapper-select {       /* wrapper for selects */
  color:#8F9FB3;
  width:272px;
  border:0px solid blue;
  margin:0px 9px 0px 9px;
}

.wrapper-select select {
  display:none;
}
.wrapper-select .simpleselect {
  border-top:4px solid transparent;
}
.wrapper-select.noborder .simpleselect {
  border-top:0px none;
}
/* fehlender Klassenzusatz - Select anzeigen usw.... 2025-03-13 */
#insert-class_suffix {
  display: flex;
}
#insert-class_level {
  display: block;
  float: left;
}
#select_class_suffix {
  margin-left: 6px;
  display: flex;
}
#class-upper {
  display: flex;
}
#select_class_warning {
  width: 1.2em;
  height: 1.2em;
  min-width: 1.2em;
  min-height: 1.2em;
  margin-left: 8px;
  display: inline-block;
  background-size: contain;
  background-size: 100%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-image: url(../images/symbols/warning.png);
  visibility: hidden;
  
}
#select_class_save {
  display: none;
  margin-left: 8px;
}



.wrapper-product {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:120px;
  border:2px solid #1D75BF;
  border-radius:7px;
  background-color:#F2FAFF;
  margin:8px 0px 8px 0px;
  cursor:pointer;
}

.wrapper-product.passive {
  /*
  border-color:#8F9FB3;
  */
  border-color: rgba(143,159,179,0.4);
  background-color:#FFFFFF;
  opacity:0.6;
}

.wrapper-product .image {
  position:relative;
  display:flex;
  align-items:center;
  align-content:flex-start;
  min-height:120px;
  width:calc(42%);
  background-color: rgba(12,150,200,0);
}
.wrapper-product .image > div {
  position:relative;
  width:calc(92%);
  margin-left:8%;
  height:118px;
  background-size: auto 94%;
  background-position: left 50%;
  background-repeat: no-repeat;
  background-color: rgba(12,150,200,0);
}
.wrapper-product.wrapper-extra .image > div {
  width:100%;
  margin-left:0px;
  background-position: left 50%;
  background-color: rgba(12,12,200,0);
}
.wrapper-product .text {
  display:flex;
  align-items:center;
  align-content:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  min-height:100px;
  width:calc(58% - 14px);
  background-color: rgba(241,10,200,0);
  margin:10px 10px 10px 4px;
}
.wrapper-product .text p {
  width:100%;
  background-color: rgba(0,10,200,0);
}

.wrapper-donation {
  position:relative;
}

.wrapper-product .info,
.wrapper-donation .info {
  position:absolute;
  top:2px;
  left:2px;
  padding:2px;
  color:#000000;
  font-size:11px;
  line-height:1.1;
  background-color: rgba(255,255,255,0.8);
}
.wrapper-donation .info {
  top:12px;
  left:18px;
}

.wrapper-fach .text .line-1 {
  white-space:nowrap;
}

.wrapper-options-outer {		/* outer container selects donation */
	display: flex;
	justify-content: center;
}
.opentext-wrapper.spende .wrapper-options {				/* all resolutions */
  min-width: 160px;
  border-bottom: 32px solid transparent;
}
.opentext-wrapper.spende .wrapper-options:last-child {				/* all resolutions */
  margin-left: 16px;
}
.opentext-wrapper.spende img {				/* all resolutions */
  width:52%;
  height:auto;
  margin-top:24px;
}

.info-icon {
	position:absolute;
	top:9px;
	left:28px;
	display:block;
	width:24px;
	height:24px;
	border-radius:50%;
  background-size: 100%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-image: url(../images/symbols/info-icon.png);
	background-color: rgba(255,0,255,0);
	opacity:0.9;
}

.notice-asterisk {
  margin-top: 1.2em;
}

.line-warenkorb {
	display:flex;
}
.line-warenkorb {																	/* WARENKORB */
	padding:8px 0px 4px 0px;
}
.line-warenkorb > div:first-child {
	width: calc(100% - 108px);
	text-align:left;
	background-color: rgba(255,94,35,0);
}
.line-warenkorb > div:last-child {
	width:108px;
	text-align:right;
	background-color: rgba(255,0,255,0);
}
.splitter-warenkorb {
	width:100%;
	margin-top:13px;
	border-bottom:8px solid #FFFFFF;
	border-top:2px solid #c1cad5;
}

.check-mark {
	display:flex;
	justify-content:center;
	align-items:center;
	flex-shrink: 0;
	width:26px !important;
	height:26px;
	border: 2px solid #c1cad5;
	border-radius: 5px;
}
.check-mark > span {
	display:block;
	width:18px !important;
	height:18px;
	background-color:#FFFFFF;
	border-radius: 3px;
}
.check-mark.checked > span {
	background-color:#0075BF;
}
.check-mark.red {
	border-color:#D86154 !important;
}
.checkmark-outer {
	display:flex;
	align-items:center;
}
.checkmark-outer > div {
	width: calc(100% - 46px) !important;
	background-color: rgba(255,0,255,0);
	margin-left:12px;
}

.notice-error {
	margin-top:-6px;
	overflow:hidden;
	max-height:0px;
  color:#D86154 !important;
}
.notice-error.red {
  color:#f01f08 !important;
}
.notice-notice {
	overflow:hidden;
	max-height:0px;
  color:#0075BF !important;
}
.notice-error.show {
	margin-bottom:8px;
	max-height:200px;
}
.notice-notice.show {
	margin-bottom:4px;
  margin-top:2px;
	max-height:80px;
  animation-duration: 600ms;
  animation-name: rollout_notice;
}

@keyframes rollout_notice {
  0% {
    max-height:0px;
  }
  100% {
    max-height:80px;
  }
}

.notice-container {
	padding-left:28px;
	padding-top:6px;
	padding-bottom:6px;
	border-left:8px solid transparent;
	margin-bottom:4px;
	background-color: rgba(255,255,255,0.9);
	min-height:24px;
	color:#8F9FB3;
}
.notice-container-red {
	border-left:8px solid #f63c23;
}
.notice-container-green {
	border-left:8px solid #12e73f;
}
.notice-container-blue {
	border-left:8px solid #63b1e8;
}
.notice-container.hand {
	cursor:pointer;
}

.loading-ani {
	width: 140px;
	height: 140px;
	border:2px solid #FFFFFF;
	border-radius:50%;
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-image: url(../images/mietra-loading-ani.gif);
}

#overlay .headline {
	display:block;
	margin-bottom:20px;
}

.pagination {
  width: 100%;
  min-height: 28px;
  display:flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: -12px;
  background-color: rgba(12,150,200,0);
}
.pagination a.circle-step {
  margin: 0px 5px 16px 5px;
  display:flex;
  align-items: center;
  justify-content: center;
}


.box-table-outer {                      /* Tabelle Mieterliste */
  margin-bottom:24px;
}
.box-table-outer .line {
  display:flex;
  justify-content:space-between;
  color:#596A80;
  border-bottom:1px solid #dfe5ed;
}
.box-table-outer .line.header {
  padding-top: 12px;
  color:#8F9FB3;
}
.box-table-outer .line > div {              /* alle */
  display:flex;
  align-items:center;
  margin-left: 2px;
  margin-right:2px;
  min-height:40px;
  flex-wrap: wrap;
  overflow: hidden;
}


@media screen and (max-width: 659px) {		/*  /////////////  MOBILE //////////////////// */

	.box-data-outer .header .menu-link {
		padding:0px 20px 0px 14px;
	}
	.box-data-outer .header .menu-link .ico {       		/* staus = OPEN */
		margin-right:13px;
	}
	.box-data-outer .content {
		margin:0px 15px 0px 16px;
	}
  .box-data-outer .header .btn-change {
    margin-right:16px;
  }
}

@media screen and (min-width: 660px) {		/*  ////////////////// DESKTOP ////////////////*/

  .box-data-outer .header .menu-link {
    padding:0px 20px 0px 21px;
  }
  .box-data-outer .header .menu-link .ico {       		/* staus = OPEN */
    margin-right:16px;
  }
	.box-data-outer .content {
		margin:0px 22px 0px 22px;
	}
  .box-data-outer .header .btn-change {
    margin-right:22px;
  }
}




/* MAX 369 */
@media screen and (max-width: 369px) {
   /*
   .content-area {
    border-left: 1px solid red;
    border-right:1px solid red;
   }
   */
  .circle-step {
		margin-left:2px;
  }
  .wrapper-product {
    align-items:flex-start;
  }
}
/* MAX 400 */
@media screen and (max-width: 400px) {
	.wrapper-options-outer {									/* outer container selects donation */
		flex-wrap:wrap;
	}
  .opentext-wrapper.spende .wrapper-options {				/* mobile narrow */
    min-width: unset !important;
    width:calc(100% - 32px);
    margin-left:0px !important;
    border-bottom: 24px solid transparent;
  }
  .opentext-wrapper.spende img {					/* all resolutions */
		width:80%;
		height:auto;
		margin-top:24px;
	}
}
/* MAX 659 */
@media screen and (max-width: 659px) {
  .wrapper-product .image > div {
    width:100%;
    margin-left:0px;
    background-size: contain;
  }
  .wrapper-product.wrapper-extra .image > div {
    margin-left:-8px;
  }

  .background-stage {
    background-size: 253% auto;
    background-position: 78.5% calc(-4vw);
    background-image: url(../images/bg_lowres.png);
  }
  .page-wrapper {
    background-size: 100% auto;
    background-position: top center;
    background-repeat: no-repeat;
  }
  .content-area {
    width: calc(100% - 20px);
  }
  .menu-wrapper .logo {
    width:calc(20vw);
    padding-top:calc(9vw);
  }
  .logo-wrapper-startpage {
    display:flex;
    flex-direction:column;
    align-items:center;
    height:unset;
    margin-top:calc(31vw);
    background-color: rgba(12,150,200,0);
  }
  .logo-wrapper-startpage .logo {
    margin:unset;
    margin-left:calc(6vw);
    width:calc(49.8vw);
    padding-top:23%;
    background-color: rgba(12,10,80,0);
  }
  .content-wrapper {               /* BOXEN */
    margin-top:11px;
  }
  .content-wrapper:nth-child(2) { /* ERSTE BOX */
    margin-top:0px;
  }
  .opentext-wrapper .text {
    margin:calc(6vw) 6.3% calc(6.3vw) 6.3%;
    text-align:center;
    line-height:1.2;
    background-color: rgba(12,150,200,0);
  }
  .content-wrapper .opentext-wrapper .text  {
    margin-top: 0px;
    margin-bottom: 0px;
  }

  .opentext-wrapper.spende .text {
    margin-top:16px;
    margin-bottom:32px;
    background-color: rgba(12,150,200,0);
  }

  .sp-selector-wrapper {
    background-color: rgba(12,150,200,0);
  }
  .sp-selector {
    width: calc(50% - 5px);
    height:calc(52vw);
    background-size: 72% auto;
    background-position: 50% 37%;
  }
  .sp-selector span {
    margin-bottom:calc(3.8vw);
  }
  .arrow-to-content {
    width:26px;
    height:26px;
    margin-left: calc(50% - 13px);
    margin-top:calc(4vw);
    margin-bottom:25px;
    background-color: rgba(255,150,0,0);
  }
  .menu-bottom-wrapper {
    width: calc(100% + 20px);
    margin-left:-10px;
  }
  .menu-bottom-wrapper .menu-link {
    border-bottom:1px solid #FFFFFF;
    margin:0px 10px 0px 10px;
    background-size: auto 22px;
    background-position: calc(100% - 10px) 50%;
  }
  .menu-bottom-wrapper .menu-link span {
    display:block;
    padding:11px 18px 11px 18px;
    background-color: rgba(255,150,0,0);
  }
  .menu-inner-wrapper {     /* placed after content ...  .opentext-wrapper --> */
    margin-top: calc(6.3vw);
  }
  .menu-inner-wrapper .menu-link:last-child {
    margin-bottom:40px;
  }
  .menu-inner-wrapper .menu-link {
    background-size: auto 22px;
    background-position: calc(100% - 16px) center;
  }
  .menu-inner-wrapper .menu-link span {
    display:block;
    padding:11px 20px 11px 21px;
    background-color: rgba(255,150,0,0);
  }

  .navi-toggle {
    margin-left:calc(4vw);
    margin-top: 19px;
    background-size: auto 100%;
    background-position: 50%;
    background-repeat: no-repeat;
    width:24px;
    height:24px;
  }
  .wrapper-logbtn-toggle {      /* added 2022-04-11 */
    display: flex;
    justify-content: flex-end;
    margin-right:calc(4vw);
    margin-top: 19px;
    width:80px;
  }
  .logbtn-toggle {              /* mobile */
    background-size: auto 100%;
    background-position: left top;
    background-repeat: no-repeat;
    width:24px;
    height:24px;
    flex-shrink: 0;
  }
  .language-selector {
    display: flex;
    height:24px;
    border-left: 1px solid #FFFFFF;
    margin-left: 9px;
    padding-left: 10px;
    color: #FFFFFF;
    text-transform: uppercase;
  }
  .menu-wrapper > .hamburger {
		margin:0px;
	}
  .menu-wrapper > .hamburger > div {
		margin:calc(5.2vw);
		padding-bottom:calc(5.2vw);
	}
  .button {                             /* --- ALL --- */
    min-height:46px;
    border-radius: 24px;
  }
  .button span {                       /* --- ALL --- */
    text-align:center;
    margin-left:8px;
    margin-right:8px;
  }

  .buttons-login-wrapper {
    margin-top:16px;
    margin-bottom:0px;
    background-color: rgba(255,150,0,0);
  }
  .buttons-login-wrapper .button {
    width: calc(50% - 10px);
  }
  .buttons-login-wrapper.anmeldung-complete .button-left {
    width: calc(32% - 10px);
  }
  .buttons-login-wrapper.anmeldung-complete .button-right {
    width: calc(68% - 10px);
  }
  .separate-line {
    line-height:1.0;
    margin-top:12px;
    margin-bottom:12px;
  }
  .small-link.separate-line {   /* password vergessen? */
    margin-right: 16px;
    margin-bottom:0px;
    background-color: rgba(255,150,0,0);
  }
  .login-wrapper-rounded .separate-line { /* Login Box */
    margin-top:0px;
    margin-bottom:17px;
  }
  .page_login .vspace-upper {         /* Page: login */
    height:calc(43vw);
  }
  .page_login.create_account .vspace-upper {   /* Page: user account */
    height:calc(34vw);
  }
  .page_useraccount .vspace-upper {   /* Page: user account */
    height:calc(34vw);
  }
  .page_normal .vspace-upper {   /* Page: alle Folgeseiten */
    height:calc(21vw);
  }
  .vspace-under {   /* Page: alle Seiten */
    height:calc(10vw);
  }
  .box-headline {
    width:calc(100% - 30px);
    min-height: 30px;
    margin-top: calc(4vw);
    margin-bottom: calc(2.6vw);
    margin-left: 15px;
    background-color: rgba(255,0,0,0);
  }
  .header-image + .box-headline {
    display:block;
    margin-top: calc(2vw);
    margin-bottom: calc(2vw);
    text-align:center;
  }
  .box-headline + .header-image {
    margin-top:0px;
    border-bottom:4px solid rgba(255,2,5,0);
  }
  .box-headline .ico-button,
  .hint .ico-button {
    width:22px;
    height:22px;
  }
  .box-indent {
    margin:0px 0px 0px 15px;
    width:calc(100% - 30px);
  }
  .alt-size .box-indent {
    margin:0px 0px 0px 0px;
    width:calc(100% - 1px);
  }
  input {
    min-height:48px;
    border:0px none;
    padding:0px;
    padding-left:calc(3.6vw);   /*  max-width: 659px  */
    border-radius:5px;
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1;
    margin:8px 0px 15px 0px;
  }
  .bg-grey-light {
    min-height:46px;																								/* BORDER 2 ! */
  }
  .easy-autocomplete.bg-grey-light .bg-grey-light {
    padding-left: calc(3.6vw) !important;   /*  max-width: 659px  */
    padding-right:calc(3.6vw) !important;   /*  max-width: 659px  */
    width:calc(100% - 7.2vw - 2px)  !important;
  }
  input[type="text"].width100,
  input[type="password"].width100 {
    width:calc(100% - 3.6vw);
  }
  input[type="button"].width100,
  input[type="submit"].width100 {
    width:100%;
  }
  .button-inner-center {
    width:calc(100% - 60px);
    margin-top:12px;
    margin-bottom:36px;
  }
  ._button-login {
    margin:34px 0px 18px 0px;
  }
  .page_login ._button-account {
    margin:18px 0px 42px 0px;
  }
  .page_login.create_account ._button-account {
    margin:0px 0px 34px 0px;
  }
  .header-image {
    margin-top:calc(6vw);
    width:35%;
    padding-top:28%;
  }
  .checkmark-outer {
		align-items:flex-start;
	}
	.check-mark {
		margin-top:40px;
	}
  .alt-size .check-mark {
		margin-top:0px;
	}
	#overlay .headline {
		margin-top:10px;
		margin-bottom:20px;
	}
	.info-icon {
		top:13px;
		left:12px;
	}
	.content-wrapper .header-area > div > .wrapper-select {       /* wrapper for selects */
    width:100%;
  }
  .box-table-outer {
    width: 100% - 30px;
    margin: 0px;
  }
}
/* MIN 660 */
@media screen and (min-width: 660px) {

  html {
    height: 100.1%;
  }

  body {
    overflow-y: scroll;
  }

  .background-stage {
    background-size: cover;
    background-position: right top;
    background-image: url(../images/bg_highres.png);
  }
  .content-area {
    width: 600px;
    background-size: 100% auto;
    background-position: top center;
  }
  .menu-wrapper > .header {
    min-height:50px;
  }
  .menu-wrapper .logo {
    height:32px;
    width:76px;
    margin-top:18px;
  }
  .logo-wrapper-startpage {
    height:91px;
    margin-top:218px;
  }
  .logo-wrapper-startpage .logo {
    width:190px;
  }
  .content-wrapper {               /* BOXEN */
    margin-top:16px;
  }
  .content-wrapper:nth-child(2) { /* ERSTE BOX */
    margin-top:0px;
  }
  .opentext-wrapper .text {
    margin:18px 134px 32px 134px;
    text-align:center;
  }
  .content-wrapper .opentext-wrapper .text {
    margin:12px 28px 0px 28px;
    text-align:center;
    width:calc(100% - 56px);
  }
  .opentext-wrapper.spende .text {
    margin:0 auto;
    margin-top: 16px;
    margin-bottom: 36px;
    width: 370px;
    background-color: rgba(12,150,200,0);
  }
  .opentext-wrapper.spende .wrapper-options {				/* desktop */
    margin-top: 6px;
  }
  .wrapper-donation > .header-image {
    margin-top:0px;
    border-top:16px solid transparent;
  }

  .sp-selector {
    width: calc(50% - 10px);
    height:195px;
    background-size: 43% auto;
    background-position: 49% 31%;
  }
  .sp-selector span {
    margin-bottom:1rem;
  }
  .arrow-to-content {
    width:28px;
    height:28px;
    margin: 0 auto;
    margin-top:19px;
    margin-bottom:25px;
  }
  .menu-bottom-wrapper .menu-link {
    margin:0px 22px 0px 22px;
    background-size: auto 22px;
    background-position: 100% 50%;
  }
  .menu-bottom-wrapper .menu-link span {
    display:block;
    padding:10px 18px 10px 20px;
    background-color: rgba(255,150,0,0);
  }
  .menu-inner-wrapper {     /* placed after content ...  .opentext-wrapper --> */
    margin-top: 34px;
  }
  .menu-inner-wrapper .menu-link:last-child {
    margin-bottom:42px;
  }
  .menu-inner-wrapper .menu-link {
    background-size: auto 22px;
    background-position: 566px center;
  }
  .menu-inner-wrapper .menu-link span {
    display:block;
    padding:10px 18px 10px 21px;
    background-color: rgba(255,150,0,0);
  }

  .buttons-login-wrapper {
    margin-top:16px;
    margin-bottom:0px;
  }
  .button {
    min-height:50px;
  }
  .buttons-login-wrapper .button {
    width: calc(50% - 10px);
  }
  .buttons-login-wrapper.anmeldung-complete .button-left {
    width: calc(38% - 10px);
  }
  .buttons-login-wrapper.anmeldung-complete .button-right {
    width: calc(62% - 10px);
  }
  .separate-line {
    line-height:1.0;
    margin-top:12px;
    margin-bottom:12px;
  }
  .small-link.separate-line {   /* Link Password vergessen? */
    margin-right:17px;
  }
  .login-wrapper-rounded .separate-line { /* Login Box */
    margin-top:0px;
    margin-bottom:17px;
  }
  .navi-toggle {
    margin-left:40px;
    margin-top:20px;
    background-size: auto 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    height:24px;
    width:24px;
  }
  .wrapper-logbtn-toggle {      /* added 2022-04-11 */
    display: flex;
    justify-content: flex-end;
    margin-right:40px;
    margin-top:20px;
    height:24px;
    width:80px;
  }
  .logbtn-toggle {              /* desktop */
    margin-top:0px;
    background-size: auto 100%;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    height:24px;
    width:24px;
  }
  .language-selector {
    display: flex;
    height:24px;
    border-left: 1px solid #FFFFFF;
    margin-left: 11px;
    padding-left: 12px;
    color: #FFFFFF;
    text-transform: uppercase;
  }
  .menu-wrapper > .hamburger {
		margin:0px 40px 0px 40px;
	}
  .menu-wrapper > .hamburger > div {
		margin:24px 0px 0px 0px;
		padding-bottom:32px;
	}
  .page_login .vspace-upper {   /* Page: login */
    height:162px;
    border-bottom:1px solid transparent;
  }
  .page_login.create_account .vspace-upper {   /* Page: user account */
    height:202px;
    border-bottom:1px solid transparent;
  }
  .page_normal .vspace-upper {   /* Page: alle Folgeseiten */
    height:80px;
  }
  .vspace-under {   /* Page: alle Seiten */
    height:48px;
  }
  .box-headline {
    width:calc(100% - 40px);
    min-height: 30px;
    margin-top: 15px;
    margin-bottom: 6px;
    margin-left: 20px;
    background-color: rgba(255,0,0,0);
  }
  .header-image + .box-headline {
    width:calc(100% - 126px);
    margin-left: 63px;
    display:block;
    margin-top: 7px;
    text-align:center;
    background-color: rgba(5,85,0,0);
  }
  .header-image + .box-headline > span {
    width:100%;
    display:block;
    margin: 0px;
    text-align:center;
    background-color: rgba(65,10,0,0);
  }
  .box-headline + .header-image {
    margin-top:0px;
    border-bottom:2px solid rgba(255,2,5,0);
  }

  .box-headline .ico-button,
  .hint .ico-button {
    width:20px;
    height:20px;
  }
  .box-indent {
    margin:0px 20px 0px 20px;
  }
  .alt-size .box-indent {
    margin:0px 20px 0px 0px;
  }
  input {
    min-height:48px;
    border:0px none;
    padding:0px;
    padding-left:21px;
    border-radius:5px;
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1;
    margin:8px 0px 15px 0px;
  }
  .bg-grey-light {
    min-height:46px;																								/* BORDER 2 ! */
  }
  .easy-autocomplete.bg-grey-light .bg-grey-light {
    padding-left: 21px !important;   /*  min-width: 660px  */
    padding-right:21px !important;   /*  min-width: 660px  */
    width:calc(100% - 44px)  !important;
  }
  input[type="text"].width100,
  input[type="password"].width100 {
    width:calc(100% - 21px);
  }
  input[type="button"].width100,
  input[type="submit"].width100,
  .button.width100 {
    width:100%;
  }
  .button-inner-center {
    width:240px;
    margin-top:14px;
    margin-bottom:36px;
  }
  ._button-login {
    margin:31px 0px 20px 0px;
  }
  .page_login ._button-account {
    margin:18px 0px 42px 0px;
  }
  .page_login.create_account ._button-account {
    margin:0px 0px 34px 0px;
  }
  .header-image {
    margin-top:16px;
    width:118px;
    padding-top:108px;
  }
  .page_meinefaecher .content-wrapper .header-area > div > .wrapper-select {       /* wrapper for selects - Meine Fächer */
    width:300px;
  }
  .page_meinefaecher .box-data-outer .content .content-inner > div.form-data > div:first-child {   /* LEFT */
    width: 124px;
  }
  .page_meinefaecher .box-data-outer .content .content-inner > div.form-data > div:last-child {    /* RIGHT */
    width:calc(100% - 130px);
  }
  .mobile-only {
    display: none;
  }
}


@media screen and (max-width: 999px) {

  .content-area.tenants-list {
    width: calc(100% - 20px);
    /*
    border-top:1px solid lime;
    */
  }
}
@media screen and (min-width: 1000px) {

  .content-area.tenants-list {
    width: 980px;
  }
}


.vspacer {
  width:100%;
}

.vspacer_0_3 {
  height:3px;
}
.vspacer_0_5 {
  height:10px;
}

.vspacer_0_75 {
  height:15px;
}
.vspacer_1_0 {
  height:20px;
}
.vspacer_1_5 {
  height:28px;
}

.line-height_1 {
	line-height:1.0 !important;
}

sup {
	line-height:0.8 !important;
}


/* OVERLAY */
#overlayBG {
  display:none;
  position:fixed;
  top:0px;
  left:0px;
  height:calc(100vh);
  width:100%;
  z-index:1000;
  /* background-color: rgba(7,78,129,0.8); */
  background-color: #074E81;
  opacity:0.8;
  animation-duration: 400ms;
  animation-name: fadeOverlayBG_in;
}

@keyframes fadeOverlayBG_in {
  0% {
    opacity:0;
  }
  100% {
    opacity:0.8;
  }
}

#overlay {
  display:none;
  position:absolute;
  top:0px;
  left:-1px;
  min-height:calc(100vh);
  z-index:1001;
  width:100%;
  background-color:rgba(255,0,0,0);
}

#overlay > .page-wrapper {
  margin-top:0px;
  animation-duration: 800ms;
  animation-name: slideOverlayContent_in;
}
#overlay > .page-wrapper.no-ani {
  animation-name: none;
}
@keyframes slideOverlayContent_in {
  0% {
    margin-top:800px;
  }
  100% {
    margin-top:0px;
  }
}

#overlay .content-area {
  display:flex;
  min-height:calc(100vh);
  justify-content:center;
}

@media screen and (max-width: 400px) {

   #overlay .box-headline > .wrapper-left {
    width:1px !important;
    min-width:unset;
   }
}


/* ////////////////////////////////////////////////  Video + Overlay  - rulesets taken from website  */
#overlay .content-area.video-wrapper {
    width: 100vw;
    align-items: center;
}
#overlay .content-area.video-wrapper .content-wrapper {
    width: calc(100vw - 12px) !important;
}
.video-title {
  margin-left: 24px;
  margin-top: 8px;
}
@media screen and (min-width: 660px) {
  #overlay .content-area.video-wrapper {
    width: calc(100vw - 12px);
  }
  #overlay .content-area.video-wrapper .content-wrapper {
    width: 80vw !important;
    max-width: 1152px !important;
  }
}
#overlay .content-area.video-wrapper .content-wrapper .ico-button {
  display:block;
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  width:22px;
  height:22px;
  background-color: rgba(255,0,0,0);
}
#overlay .content-area.video-wrapper .content-wrapper .button-close-grey,
.content-wrapper .button-close-grey {
  background-image: url(../images/symbols/Symbol_Close-light-gray.svg);
  position: absolute;
  right: 24px;
  top: 12px;
}
/* /////////////////////////// VIMEO VIDEO - OVERLAY  ///////////////////////// */
#overlay .content-wrapper > .vimeo-video {
    position: relative;
    width: calc(100% - 48px);
    margin: -12px 0px -2px 24px;
    padding-top:59%;
    background-color: rgba(255,0,0,0);
}
#overlay .content-wrapper > .vimeo-video .vimeo-player {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    z-index: 1;
}
#overlay .button-close-grey {
    z-index: 2;
  }
@media screen and (max-width: 559px) {
  #overlay .button-close-grey {
    right: 16px;
    top: 16px;
  }
  .video-title {
    margin-left: 16px;
    margin-top: 9px;
  }
  #overlay .content-wrapper > .vimeo-video {
    position: relative;
    width: calc(100% - 34px);
    margin: 0px 0px 8px 17px;
    padding-top:59%;
  }
}


.form-content {
  display:flex;
  flex-wrap:wrap;
  padding-top:20px;
  padding-bottom:24px;
}

.form-content > div {
  float:left;
  width:100%;
  color:#8F9FB3;
}

@media screen and (max-width: 659px) {
  .form-content input {
    width:calc(100% - 7.2vw - 2px);
    padding-left:calc(3.6vw);
    padding-right:calc(3.6vw);
    margin-top:2px;
  }
}

@media screen and (min-width: 660px) {
  .form-content input {
    width:calc(100% - 44px);
    padding-right:21px;
    margin-top:2px;
  }
  .postcode {
    width:100px !important;
  }
  .anrede,
  .name1 {
    width:130px !important;
  }
  .postcode-pwreset {
    width:calc(50% - 14px) !important;
  }
  .city {
    width:calc(100% - 114px) !important;
    margin-left:14px;
  }
  .name2 {
    width:calc(100% - 144px) !important;
    margin-left:14px;
  }

}

.no-select {
  -ms-user-select: None;
  -moz-user-select: None;
  -webkit-user-select: None;
  user-select: None;
}


/* BLOCK Videos Schlosstypen - start */

.type-video .content {
    width: 100%;
    min-height: 132px;
    border-top: 12px solid #FFFFFF;
    margin-bottom: 12px;
    background-color: rgba(196,0,16,0);
  }
.type-video .content > .image {
    position: relative;
    width: 100%;
    display:flex;
    justify-content: center;
    align-items: center;
    padding-top: 56.4%;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    background-color: rgba(198,0,10,0);
  }
.type-video .video-button {
    display: block;
    position: absolute;
    left: calc(50% - 36px);
    top: calc(50% - 20px);
    width: 72px;
    height: 42px;
    border-radius: 6px;
    background-color: #0075BF;
    background-image: url(../images/symbols/video-arrow.png);
    background-size: auto;
    background-position: 50%;
    background-repeat: no-repeat;
  }
.type-video .content > .description {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background-color: rgba(0,0,160,0);
  }
.type-video .content > .description div:nth-child(1) {
    width: 100%;
    margin-top: 9px;
    margin-bottom: -2px;
    line-height: 1.3;
    background-color: rgba(0,0,160,0);
  }
.type-video .content > .description div:nth-child(2) {
    padding-top: 4px;
    background-color: rgba(198,69,10,0);
  }
.type-video .content > .description a {
    display: inline-block;
    cursor: pointer;
    padding-top: 4px;
    padding-right: 32px;
    background-image: url(../images/symbols/Symbol_Download-blue.svg);
    background-size: 22px auto;
    background-position: top right;
    background-repeat: no-repeat;
    background-color: rgba(198,0,210,0);
  }

@media screen and (max-width: 659px) {
  .box-indent.schlosstypen {
    margin:0px 0px 0px 10px;
    width:calc(100% - 20px);
  }
  .type-video .content {
    margin-bottom: 20px;
  }
}

/* BLOCK Videos Schlosstypen - ende */

/* OVERWRITES */

.box-data-outer + .menu-inner-wrapper {     /* placed after .box-data-outer --> */
   margin-top: 13px;
}

#console div {
  border:1px solid red;
  float:left;
}

.text-no-topmargin {
  margin-top:0px !important;
}

#ccm-file-set-list input[type="checkbox"],
.checkbox input[type="checkbox"],
.radio input[type="radio"] {     /* Files DASHBOARD normal ! */
  min-height: unset;
  margin-top: 4px;
}

.ccm-ui .form-check-input[type="checkbox"],
#ccm-file-set-list input[type="checkbox"],
.checkbox input[type="checkbox"],
.radio input[type="radio"] {                  /* Files DASHBOARD normal ! */
  min-height: unset !important;
  margin-top: 3px;
  padding-left: 0px !important;
}