@CHARSET "ISO-8859-1";

div.select2-container.selection2,select.selection2 {
    background-color: #ffffd1;
    border: 1px solid #d8d8d8;
    font-family: Open Sans,Verdana,sans-serif;
    font-size: 14px
}

/* Position Relative damit der Custom-Dropdown direct unter dem Auswahlenfeld ist.*/
 .dataClass.selection2 {
  position: relative
}


div.checkbox3>a {
    display: inline-block;
    min-width: 16px;
    height: 16px
}

div.checkbox3>a.enabled:focus {
    outline: 1px solid #94b494
}

div.checkbox3>a.booleanChecked.disabled {
    background: url(../images/checked.png) no-repeat center center;
    cursor: default
}

div.checkbox3>a.booleanUnchecked.disabled {
    background: url(../images/unchecked.png) no-repeat center center;
    cursor: default
}

div.checkbox3>a.booleanChecked.enabled {
    background: url(../images/checkedEnabled.png) no-repeat center center
}

div.checkbox3>a.booleanUnchecked.enabled {
    background: url(../images/uncheckedEnabled.png) no-repeat center center
}

div.checkbox3.booleanCompactClass {
    color: #000;
    font-family: Open Sans,Verdana,sans-serif;
    font-size: 14px;
    margin: 0 18px;
    min-width: 250px;
    display: flex;
    align-items: center;
    min-height: 26px;
    overflow: hidden
}

div.checkbox3.booleanCompactClass>a {
    margin: 0 6px 0 1px
}

div.item>div.checkbox3.booleanCompactClass:nth-child(2) {
    margin-left: 0;
    width: 100%
}

tr.tableCell>td>div.checkbox3 {
    display: flex;
    align-items: center;
    justify-content: center
}

tr.tableCell>td>div.dataClass.inputDisabledClass {
    border: medium
}

tr.tableCell>td.noWhiteSpaceWrap {
    white-space: nowrap; 
}

.filterToggleAction {
  position:relative;
  display:inline-block;
  width:20px;
  height:30px;
  background-color:#bbb;
  -webkit-border-radius:2px;
  -moz-border-radius:2px;
  border-radius:2px;
  text-align:center;
}

.filterToggleAction input {
  width:100%;
  height:100%;
  margin:0 0;
  padding:0 0;
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  z-index:2;
  cursor:pointer;
  opacity:0;
  filter:alpha(opacity=0);
}

.filterToggleAction label {
  display:block;
  position:absolute;
  top:0.5px;
  right:0.5px;
  bottom:0.5px;
  left:0.5px;
  background-image:-webkit-linear-gradient(top,#94B494 0%,#ddd 50%,#94B494 50%,#D8E4D8 100%);
  background-image:-moz-linear-gradient(top,#94B494 0%,#ddd 50%,#94B494 50%,#D8E4D8 100%);
  background-image:-ms-linear-gradient(top,#94B494 0%,#ddd 50%,#94B494 50%,#D8E4D8 100%);
  background-image:-o-linear-gradient(top,#94B494 0%,#ddd 50%,#94B494 50%,#D8E4D8 100%);
  background-image:linear-gradient(top,#94B494 0%,#ddd 50%,#94B494 50%,#D8E4D8 100%);
  -webkit-box-shadow:0 1px 1.5px rgba(0,0,0,0.4),
    inset 0 -0.5px 0.5px #888,
    inset 0 -2.5px 0.5px #bbb,
    inset 0 -3px 0 white;
  -moz-box-shadow:0 2px 3px rgba(0,0,0,0.4),
    inset 0 -0.5px 0.5px #888,
    inset 0 -2.5px 0.5px #bbb,
    inset 0 -3px 0 white;
  box-shadow:0 2px 3px rgba(0,0,0,0.4),
    inset 0 -0.5px 0.5px #888,
    inset 0 -2.5px 0.5px #bbb,
    inset 0 -3px 0 white;
  -webkit-border-radius:1.5px;
  -moz-border-radius:1.5px;
  border-radius:1.5px;
  font:bold 9px Arial,Sans-Serif;
  color:#666;
  text-shadow:0 0.5px 0 white;
  cursor:text;
}

.filterToggleAction label:before {
  content:attr(data-off);
  position:absolute;
  top:2px;
  right:0;
  left:0;
  z-index:4;
}

.filterToggleAction label:after {
  content:attr(data-on);
  position:absolute;
  right:0;
  bottom:2px;
  left:0;
  color:#666;
  text-shadow:0 -1px 0 #D8E4D8;
}

.filterToggleAction input:checked + label {
  background-image:-webkit-linear-gradient(top,#D8E4D8 0%,#277A8A 50%,#94B494 50%,#D8E4D8 100%);
  background-image:-moz-linear-gradient(top,#D8E4D8 0%,#277A8A 50%,#94B494 50%,#D8E4D8 100%);
  background-image:-ms-linear-gradient(top,#D8E4D8 0%,#277A8A 50%,#94B494 50%,#D8E4D8 100%);
  background-image:-o-linear-gradient(top,#D8E4D8 0%,#277A8A 50%,#94B494 50%,#D8E4D8 100%);
  background-image:linear-gradient(top,#D8E4D8 0%,#277A8A 50%,#94B494 50%,#D8E4D8 100%);
  -webkit-box-shadow:0 0 0.5px rgba(0,0,0,0.4),
    inset 0 0.5px 3.5px -0.5px #277A8A,
    inset 0 2.5px 0.5px #fafafa,
    inset 0 3px 0 white;
  -moz-box-shadow:0 0 0.5px rgba(0,0,0,0.4),
    inset 0 0.5px 3.5px -0.5px #277A8A,
    inset 0 2.5px 0.5px #fafafa,
    inset 0 3px 0 white;
  box-shadow:0 0 0.5px rgba(0,0,0,0.4),
    inset 0 0.5px 3.5px -0.5px #277A8A,
    inset 0 2.5px 0.5px #fafafa,
    inset 0 3px 0 white;
}

.filterToggleAction input:checked:hover + label {
  -webkit-box-shadow:0 0.5px 1.5px rgba(0,0,0,0.4),
    inset 0 0.5px 3.5px -0.5px #277A8A,
    inset 0 2.5px 0.5px #fafafa,
    inset 0 3px 0 white;
  -moz-box-shadow:0 0.5px 1.5px rgba(0,0,0,0.4),
    inset 0 0.5px 3.5px -0.5px #277A8A,
    inset 0 2.5px 0.5px #fafafa,
    inset 0 3px 0 white;
  box-shadow:0 0.5px 1.5px rgba(0,0,0,0.4),
    inset 0 0.5px 3.5px -0.5px #277A8A,
    inset 0 2.5px 0.5px #fafafa,
    inset 0 3px 0 white;
}

.filterToggleAction input:checked + label:before {
  z-index:1;
  top:4px;
}

.filterToggleAction input:checked + label:after {
  bottom:3px;
  color:#aaa;
  text-shadow:none;
  z-index:4;
}

.displayNone {
    display: none !important;
}

/* ********************** ADD_ON_INFO_LAYER - START ********************** */
.add-on-infoLayers {
	transform: translate(0,0);
	/*transition: all 0.5s ease;*/
	transition: all 0.5s ease-in-out;
}

.no-transition {
	transition: none !important;
}

.add-on-infoLayers--opener {
	transform: scale(1,1);
	transition: all 0.6s ease-in-out;
}
.add-on-infoLayers--opener.active {
	transform: scale(0.5,0.5);
}
.add-on-infoLayers--opener > * {
	pointer-events: none;
}

/* Move Directions */
.add-on-infoLayers--enlarge-BottomToLeft {
	transform: scale(0,0);
	transform-origin: bottom left;
}
.add-on-infoLayers--enlarge-BottomToLeft.visible {
	transform: scale(1,1);
}

.add-on-infoLayers--header {
	background-color: #bed7dc;
	position: sticky;
	top: 0;
	right: 0;
	width: 100%;
    height: 44px;
    line-height: 44px;
    cursor: pointer;
    text-align: center;
    border: 1px solid #d8d8d8;
}

.add-on-infoLayers--closer  {
	background: #bed7dc url(../images/dbDelete.png) no-repeat 0;
	position: absolute;
	top: 0;
	right: 0;
	width: 44px;
    height: 44px;
    line-height: 44px;
    cursor: pointer;
    text-align: center;
}

.add-on-infoLayers--content {
	margin: 24px;
	height: fit-content;
}

#add-on-info-layer-iframe {
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: -1;
}

.add-on-info-button-controls {
	float: right;
	width: 80px;
	margin-bottom: 20px;
	margin-left: 20px;
	display: none;
}

.add-on-info-button-controls.visible {
	display: block;
}


#add-on-info-button-container {
	position: fixed;
	/*right: 6px;*/
	bottom: 0;
	/*width: calc(100% - 12px);*/
	z-index: 999;
	pointer-events: none;
	margin: 0;	
	left: 0;
}
#add-on-info-button-container > div {pointer-events: all;} 

#add-on-info-button {
	background: url(../images/info_button.svg) no-repeat 0 0;
	position: relative;
	bottom: 0;
	width: 80px;
	height: 80px;
	cursor: pointer;
	transform: scale(1,1);
	margin: 0 0 16px 0;
}
#add-on-info-button.active {
	transform: scale(0,0);
	/* opacity: 0!important; */
}

#add-on-info-layer-container {
	position: fixed;
	left: 35px;
	bottom: 55px;
	box-sizing: border-box;
	width: calc(100% - 48px);
	height: 50%;
	/*padding: 48px 0 16px 0;*/
	background-color: #fff;
	overflow: auto;
    overflow-x: hidden;
    z-index: 999;
    /*transition: all 0.5s ease-in-out;*/
    border-radius: 80px;
    box-shadow: 0px 2px 14px rgba(210,201,201,1);
    border: 1px solid #d8d8d8;
}
#add-on-info-layer-container.visible {
	 border-radius: 0px;
}

div.unicorn {
  background: url(../images/1920px-Invisible_Pink_Unicorn.svg.png) no-repeat;
    background-size: auto;
  background-size: 600px 600px;
  height: 600px;
}
/* ********************** ADD_ON_INFO_LAYER - END ********************** */

/* ********************** CARDBOX - START ********************** */

.card-box {
	display: flex;
	flex-wrap: wrap;
	background-color: #fafafa;
	/*min-width: 375px;*/
	border: 4px solid #d2cbcb;
	margin: 15px;
	padding: 20px;
}

.card {
	display: flex;
	flex-flow: column;
	align-items: center;	
	background-color: white;				
	border: 4px solid white;
	border-radius: 10px;
	min-width: 300px;	
	/*width: 20%;
	height: 250px;*/
	margin: 15px;
	padding: 20px;
}

.card.card-best {			
	border: 4px solid #f9ec42;
}

.card > div {
	display: flex;
	justify-content: center;
	align-items: center;
	/*width: 75%;*/
	font-family: Arial,Helvetica,sans-serif;

}

.card-header {
	border: 4px solid #f9ec42;
	border-radius: 10px;
	background-color: #f9ec42;
	margin-top: -35px;
	font-size: 12px;
	font-weight: bold;
	z-index: -99;
	width: 75%;
}

div.card.card-best > div.card-header {
	z-index: 1;
}

.card-titel {
	margin-top: 20px;
	font-family: verdana;
	font-size: 20px;
	font-weight: bold;
}

.card-subtitel {
	font-size: 14px;
	color: #979797;
}

.card-divider{
	 border-bottom: 1px solid black;
	 /*margin-bottom: 10px;*/
	 padding-top: 10px;
	 width: 75%;
}

.card-desc {
	font-size: 14px;
	height: 42%;
	align-items: start !important;
}

.card-list {
  min-height: 150px;
  align-items: unset !important;
}

.card-list > ul {
	margin-left: -20px;
}

.card-list > ul > li {
	padding-bottom: 5px;
}

div.card > div.card-action {
	border: 2px solid black;
	border-radius: 5px;
	background-color: white;
	height: 45px;
	font-weight: bold;
	width: 75%;
}

div.card > div.card-action:hover {
	border: 2px solid #FED402;
}
.card-action > a {
	text-decoration: none;
	color: black;
}

div.card.card-best > div.card-action {
	background-color: #f9ec42;
	border: 4px solid #f9ec42;
}

div.card.card-best > div.card-action:hover {
	background-color: #FED402;
	border: 4px solid #FED402;
}

div.card-desc > p {
	text-align: center;
}
/* ********************** CARDBOX - END ********************** */