body, html {
        height: 100%;
    }

* {
    box-sizing: border-box;
}

.loader {
    border: 6px solid #f3f3f3; /* Light grey */
    border-top: 6px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 2s linear infinite;
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }

.bg-image {
	
    background-image: url(../../brita_group_headquarter.JPG);
    filter: blur(3px);
    -webkit-filter: brightness(0.9);
    height: 100%;
	width: 100%;
	background-position: center center;
    background-repeat: repeat-y;
    background-size: cover;
    background-blend-mode: normal; 
	background-color: #e6e6eb;
	position: fixed;
	}

/* Position text in the middle of the page/image */
.bg-text {
    color: white;
    font-weight: bold;
    border: none;
    border-radius: 0px;
    position: absolute;
	top: calc(50% - 30px);
    left: calc(50%);
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 95%;
    max-width: 1110px;
    margin: 0 auto;
    text-align: left;
    min-width: 450px;
    /* background-size: 225%; */
    min-height: 150px;
}

.bg-content {
	background-color: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 0px, rgba(255,255,255,0.8) 740px, rgba(255,255,255,0) 90%);
	display: block;
    padding: 30px;
	margin-top: 30px;
}

#enter-inv-code .language-bar {
	margin-top: 0;
}

.bg-text.overview {
	transform: translate(-50%, -50%);
}

.bg-text.overview .bg-content {
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 0px, rgba(255,255,255,0.8) 633px, rgba(255,255,255,0) 90%);
	margin-top: 0;

}

.bg-mail-template {
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0, 0.5); /* Black w/opacity/see-through */
    color: white;
    font-weight: bold;
    border: 3px solid #fff;
	border-radius: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    width: 55%;
    padding: 15px;
    text-align: center;
	min-width: 650px;
}

.bg-button {
    position: relative;
    z-index: 3;
    width: auto;
    text-align: center;
    padding-top: 0px;
    display: inline-block;
    margin-top: 0px;
}


.bg-text h1, .bg-text h2, .quote-form-content h1, .bg-text h1 span {
    margin-top: 20px;
    font-size: 36px;
    font-family: Arial,sans-serif;
    font-weight: 400;
    color: #ffffff;
    margin-bottom: 20px;
}


h1.start-head {
    margin-bottom: 20.1px;
}

h1.start-head, text.start-head {
    font-size: 48px;
    font-family: Arial,sans-serif;
    font-weight: 400;
    line-height: 1.1;
    color: #282d74;
    margin: 0 0 10px 0;
}

h1.start-head.display-start-head {
	padding: 0 2%;
	margin-top: 20px;
	position: absolute;
}

h1.start-head sup {
    letter-spacing: 1px;
	font-size: 28px;
}

h2.start-head {
	font-size: 24px;
	font-family: Arial,sans-serif;
    font-weight: 400;
    line-height: 1.2;
    color: #4bafff;
	margin: 0 0 30px;
}

div.overview-point h2.start-head {
    margin: 0px 0 10px;
}

p#language a.button:not(:last-child) {
	margin-right: 22px;
}

.overview-point {
    display: inline-block;
    width: 275px;
    text-align: center;
    height: 240px;
    margin-right: 3px;
}

.overview-point img {
    z-index: 1;
    margin-bottom: -15px;
}

img.iframe-display {
	margin: 0 auto;
}

.bg-text h1#please-login {
    margin-top: 0px;
    text-align: left;
    margin-bottom: 25px;
    position: relative;
    margin-left: calc(50% - 67px);
}

.quote-form-content h1 {
	color: #222222;
	margin-bottom: 20px;
}

a.invisible-link {
	color: unset;
	text-decoration: none;
	padding: 0 3px;	

}

a.invisible-link:hover {
    background-color: #00c000;
	color: #ffffff;
	}

p.sprachen a.invisible-link:hover {
    color: #fcaf17;
	background: none;
}


.spalte {
    display: inline-block;
}

span.current-language {
    color: #fcaf17;
	padding: 0;
}

p.sprachen, p.sprachen a, p.sprachen span {
    font-family: Arial,sans-serif;
	font-weight: 700;
}

button.send-quote {
    text-decoration: none;
    display: block;
}

input {
font-family: Arial,sans-serif;
font-size: 14px !important;
}

input[type="file"] {
visibility: hidden;
width: 100px;
transform: translateY(-20px);
}

label.upload-button {
/*    background: #00c000;
    color: #fff;*/
	padding-top: 18px;
	border-radius: 3px;
	position: relative;
	transition: 300ms;
	display: inline-block;
}

img[src*="upload.png"]:hover {
	cursor: pointer;
	transform: translateY(-5px);
	transition: 300ms;
}

img[src*="upload.png"]:not(:hover) {
	transition: 300ms;
}

img[src*="enter.png"]:hover {
	transform: translateX(5px);
	transition: 300ms;
}

img[src*="enter.png"]:not(:hover) {
	transition: 300ms;
}

img[src*="download.png"]:hover {
	cursor: pointer;
	transform: translateY(5px);
	transition: 300ms;
}

img[src*="download.png"]:not(:hover) {
	transition: 300ms;
}

/* a.button:disabled img, a.download:disabled img {
	filter: grayscale(1) brightness(0.92) !important;
	cursor: not-allowed;
} */

a#final-admin-login, /*a#final-admin,*/ a.download {
	filter: grayscale(1) brightness(0.92);
}

div.quote-form-content p {
    margin-bottom: 10px;
}

.form textarea#mail-template, .form textarea#mail-template-en {
    height: 150px;
    width: 600px;
	border-color: #2c3459;
	border-radius: 3px;
	font-family: Arial,sans-serif;
}

div#cke_editor {
width: 100%;
}

/* Dropdown Button */
.dropbtn {
  color: #222222;
  padding: 10px 0px;
  font-size: 22px;
  cursor: pointer;
  border: none;
  background: none;
  font-family: Arial,sans-serif;
}

.dropbtn:hover {
	color:fcaf17;
}

.dropbtn::after{
	position: absolute;
    content: "\f0d7";
    font-family: "FontAwesome";
    color: #222222;
	transform: translate(10px, 7px);
}


/* Dropdown button on hover & focus
.dropbtn:hover, .dropbtn:focus {
  background-color: #2C3459;
} */

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: rgba(34,34,34,0.85);
  min-width: 160px;
  /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
  z-index: 1;
  border-top: 2px solid #fcaf17;
  border-bottom: 1px solid #fcaf17;
}

/* Links inside the dropdown */
.dropdown-content a, select.custom-dropdown-select.quote-form-element option {
  color: #fff;
  padding: 10px 30px;
  text-decoration: none;
  display: block;
  font-size: 15px;
  font-family: Arial,sans-serif;
  border: 1px solid #fcaf17;
  border-bottom: none;
}

select.custom-dropdown-select.quote-form-element option {
  background-color: rgba(34,34,34,0.85);
	padding: 10px;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover, select.custom-dropdown-select option:hover, select.custom-dropdown-select option:focus, select.custom-dropdown-select option:active { 
background-color: #222; color:#fcaf17; 
}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

label.checkbox {
	font-size: 18px;
	border: none;
}

div.checkboxes {
	margin-top: 15px;
	display: none;
	margin-bottom: 15px;
}

h3#kriterium {
	display:none;
}

div#explanation-fog {
    display: block;
    max-height: calc(100vh - 93px);
    width: 100%;
    position: absolute;
    text-align: center;
}

.no-icon {
	display: inline-block;
}

a#alle-leads {
	display: none;
}

.button.button-navy-blue:disabled, .button.button-fairflexx-green:disabled, a:disabled, a:disabled:hover, a:disabled img, a:disabled img:hover {
	cursor: not-allowed !important;
	background-color: #7e7e7d;
}

.button.button-navy-blue:disabled:hover i {
	color: #7e7e7d;
}

a.tour-link {
    margin: 0 auto !important;
    color: #fff;
    background: linear-gradient(to bottom,#4bafff 50%,#282d74 50%);
    background-size: 100% 210%;
    background-position: 0 2%;
    transition: all .4s ease;
    font-family: Arial,sans-serif;
    font-weight: 700;
    text-align: center;
    padding: 14px 25px;
    font-size: 24px;
    line-height: 1.2;
    border-radius: 6em;
    text-transform: none;
    border-color: #4bafff;
    border: 2px solid #4bafff;
    text-decoration: none;
    z-index: 10;
    bottom: calc(9% - 5px);
    position: absolute;
    right: calc(50% - 196.344px);
    white-space: nowrap;
}

div.admin-eingabe {
	width: 325px;
	display: inline-block;
}

div.register-eingabe {
    display: block;
    text-align: justify;
    margin: 0 auto;
	margin-bottom: 15px;

}

/*.admin-login-label {
    font-family: Barlow Condensed, sans-serif;
    font-weight: 700;
    font-size: 18px;
}*/

.admin-eingabe input, .register-eingabe input, input.eingabe, #quote-popup #quote-popup-content .quote-form .quote-form-content .form input[type="text"], .checkbox {
    height: 41px;
    padding: 10px 30px 10px 12px;
    font-family: Arial,"Helvetica Neue",Helvetica,sans-serif;
    font-size: 16px;
    line-height: 1.2;
    color: #282d74;
    background-color: #fff;
    background-image: none;
    border: 1px solid #cdcdcd;
    border-radius: 4px;
    width: 350px;
}

.register-eingabe input {
    margin-top: 0px;
}

span.custom-dropdown {
margin-top: 14px;
}

select.custom-dropdown-select.quote-form-element {
border: solid 1px #fcaf17;
    padding: 10px;
margin-left: 5px;
}


.checkbox {
transform: translateY(6px);
padding-left: 0px;
}

h2#agree {
transform: translateY(11px);
}

.admin-login-label, .registration-label {
	font-size: 24px;
	font-family: Arial,sans-serif;
	font-weight: 400;
	line-height: 1.2;
	color: #4bafff;
	margin: 0 0 30px;
}

.registration-label, span#have-code {
    display: inline-block;
    text-align: left;
	width: 290px;
	margin: 0;
    transform: translateY(5px);

}

span.registration-label.label-small {
    width: 100%;
    text-align: center;
    margin-left: 0;
    margin-top: 5px;
    font-size: 18px;
    margin-bottom: 5px;
}

a.download img {
	padding-top: 18px;
}

.button.button-fairflexx-white {
    color: #000;
    background-color: #fff;
    font-family: Arial,sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    border-radius: 5px;
    width: 45px;
    height: 40px;
    padding: 9px 18px;
    margin-top: 14px;
	margin-bottom: 9px;
    text-align: center;
    border: 1px solid #fcaf17;
}

.button.button-fairflexx-green {
    color: #fff;
    background-color: #00c000;
    font-family: Arial,sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    border-radius: 5px;
    padding: 9px 18px;
    border: none;
    float: right;
    margin-top: 17px;
	margin-bottom: 6px;
}

.button.button-flottweg-blue {
    color: #fff;
    background-color: #003c78;
    font-family: Arial,sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    border-radius: 5px;
    padding: 9px 18px;
    border: none;
    margin-top: 17px;
	margin-bottom: 6px;
}

.button.button-fairflexx-orange {
    color: #fff;
    background-color: #fcaf17;
    font-family: Arial,sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    border-radius: 5px;
    padding: 9px 18px;
    border: none;
    margin-top: 17px;
	margin-bottom: 6px;
}
.button.button-fairflexx-orange:disabled {
    cursor: not-allowed !important;
	background-color: #7e7e7d;
}

span.ff-orange {
	color: #fcaf17 !important;
}

a#nutzer-login, a#user-login, div#register-link, div#register-link-en {
	color: #fcaf17;
	text-align: center;
	font-size: 20px;
	font-weight: 400;
	font-family: Arial,sans-serif;
	font-weight: 400;
    margin-top: 15px;
    text-decoration: none;
}

a#nutzer-login:hover, a#user-login:hover, div#register-link:hover, div#register-link-en:hover {
	color: #fcaf17;
	text-decoration: underline;
	margin-top: 15px;
	cursor: pointer;
}


.button.button-fairflexx-green:hover {
    color: #fff;
    padding: 12px 21px;
    margin-top: 14px;
    margin-bottom: 6px;
}

label.dsgvo {
    font-size: 14px;
}

button#registrierung, button#join {
    display: none;
}

div#loginError, div#fehler {
    background-color: #ff0000;
    border: 0;
    color: #fff;
	margin: 20px 0 0px;
    padding: 10px 20px;
    border-radius: 0;
	font-family: Arial,sans-serif;
	font-size: 18px;
	font-weight: 400;
}

div#error, div#fehler {
    background-color: #ff0000;
    border: 0;
    color: #fff;
	margin: 20px 0 0px;
    padding: 10px 20px;
    border-radius: 0;
	font-family: Arial,sans-serif;
	font-size: 18px;
	font-weight: 400;
    display: none;
    position: absolute;
}

div#invitationCodeError {
    background-color: #ff0000;
    border: 0;
    color: #fff;
	margin: 20px 0 0px;
    padding: 10px 20px;
    border-radius: 0;
	font-family: Arial,sans-serif;
	font-size: 18px;
	font-weight: 400;
}


div#uploaderror {
    background-color: #ff0000;
    border: 0;
    color: #fff;
    margin: 20px 0 0px;
    padding: 10px 20px;
    border-radius: 0;
    font-family: Arial,sans-serif;
    font-size: 18px;
    font-weight: 400;
    
}

div.divMesssage{
    height: 30px;
    width: 100%;
}

div.success {
	background-color: #00c000;
    border: 0;
    color: #fff;
	margin: 20px auto 0px;
    padding: 10px 20px;
    border-radius: 0;
	font-family: Arial,sans-serif;
	font-size: 18px;
	font-weight: 400;
	display: none;
    position: relative;
    width: calc(100% - 40px);
    
}

div.uploadsuccess {
    background-color: #00c000;
    border: 0;
    color: #fff;
    margin: 20px 0 0px;
    padding: 10px 20px;
    border-radius: 0;
    font-family: Arial,sans-serif;
    font-size: 18px;
    font-weight: 400;
}

div#anwendungslink {
    text-align: left;
	margin-top: 20px;
}

a#user-login {
    color: #fcaf17;
    text-align: left;
    font-size: 20px;
    font-weight: 400;
    font-family: Arial,sans-serif;
    font-weight: 400;
    text-decoration: none;
    margin-left: calc(50% - 65px);
}

a#user-login:hover {
	color: #fcaf17;
	text-decoration: underline;
	margin-top: 15px;
}

p.register {
font-size: 15px !important;
}

.form-control {
    width: calc(100% - 75px) !important;
	margin-left: 0px !important;
}

span.subject {
    font-family: Arial,sans-serif;
    width: 75px;
    display: inline-block;
}

#subject-mail{
	font-family: Arial,sans-serif;
    width: 75px;
    font-size: 22px;
    margin-right: 10px;
}

/* button#registrierung, button#join {
    display: none; 
} */

button#upload-submit {
    float: none;
}

div#dsgvo {
    text-align: left;
    margin-top: 20px;
}

div#dsgvo a {
    color: #ffffff;
    text-decoration: none;
}

div#dsgvo p {
    margin-block-start: 1em;
    margin-block-end: 1em;
}

div#dsgvo label, input#gdpr label {
    font-size: 10px;
    line-height: 1.2em;
    width: 60%;
    min-width: 300px;
}

div#dsgvo span, input#gdpr span {
    display: inline-block;
    width: calc(50% + 60px);
    float: right;
    line-height: 1.4em;
    margin-bottom: 5px;
    min-width: 270px;
}

input#dsgvo, input#gdpr {
    border: solid #fcaf17 1px;
    width: 16px;
    height: 16px;
    margin-left: calc(50% - 120px);
    margin-bottom: 3.5em;
    margin-right: 33px;
}

div.bg-text form#form-register-code {
    margin-bottom: 55px;
}

form#form-register-code .register-eingabe input, .register-eingabe input {
    margin-top: 0px;
    margin-bottom: 1px;
    }

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

div#ds-placeholder {
    width: calc(44.5% - 54px);
    display: inline-block;
    height: 76px;
}

div#register-code {
    margin-left: 10px;
    margin-top: 20px;
}

p#language {
    text-align: left;
    font-size: 32px;
    margin: 16px 0px;
}

div#admin-language p#language {
    margin-bottom: 32px;
    margin-top: 20px;
}

div.logo-and-language {
    width: 80%;
    text-align: left;
	
}

div#enter-inv-code div.logo-and-language {
    padding-top: 10px;
}

div#logo, div#placeholder-before-language {
    display: inline-block;
    width: 38.2%;
    position: relative;
    float: left;
    min-width: 300px;
}

div#logo img {
    width: 210px;
    margin-left: 20px;
    position: relative;
}

div#ff-heading, div.language-bar {
    display: block;
    position: relative;
}

div.language-bar, div.language-bar {
	margin-top: 20px;
}

div#detailed-overview div.language-bar, .bg-text.overview div.language-bar {
	margin-top: 10px;
}

footer.tour-footer {
    position: fixed;
    padding: 15px calc(50% - 555px) 0px;
    width: 100%;
    background-color: #e6e6eb;
    color: #282d74;
    bottom: 0%;
    z-index: 10000;
    height: 63px;
}

a.hansa-page {
    transform: translate(90%, -58%) scale(1.9);
    margin-right: 20px;
    margin-left: 0;
}

a.hansa-page:nth-child(2) {
    transform: translate(calc(200% + 40px), -58%) scale(1.9);
    display: none;
}

div.footer-menu {
    display: inline-block;
    text-align: right;
    float: right;
    padding: 0px;
    font-size: 20px;
}

div.footer-menu.tour-footer-menu {
	padding: 10px 0px;
}

div.footer-menu:has(a > div):hover {
	
}

div.envelope {
    display: inline-block;
    background-image: url(../_img/envelope.png);
    height: 19.2px;
    width: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    transform: translateY(-1px);
}


div.envelope:hover {
	cursor: pointer;
}

div.envelope.icon-disabled, div.phone.icon-disabled {
		opacity: 0.4;
}

div.phone {
    display: inline-block;
    background-image: url(../_img/phone-no-circle.png);
	height: 30px;
    width: 30px;
    background-size: cover;
    background-repeat: no-repeat;
}


div.phone:hover {
	cursor: pointer;
}



div.envelope.icon-disabled:hover {
		cursor: default;
		background-image: url(../_img/envelope-regular.png);
}

div.map {
    display: inline-block;
    background-image: url(../_img/map.png);
    height: 30px;
    width: 21px;
    background-size: contain;
    background-repeat: no-repeat;
}

div.map:hover {
	cursor: pointer;
}

div.house {
    display: inline-block;
    background-image: url(../_img/home.png);
	height: 30px;
    width: 33px;
    background-size: contain;
    background-repeat: no-repeat;
}


div.house:hover {
	cursor: pointer;
}

div.head {
	display: inline-block;
    background-image: url(../_img/head.png);
    height: 30px;
    width: 32px;
    background-size: cover;
    background-repeat: no-repeat;
    transform: translateY(5px);
}

div.head:hover{
	background-image: url(../_img/head-hover.png);
	cursor: pointer;
}

div.language {
    display: inline-block;
    background-image: url(../_img/language.png);
    height: 30px;
    width: 30px;
    background-size: cover;
    background-repeat: no-repeat;
    transform: none;
}

div.language:hover {
	cursor: pointer;
}

img#close-contact, img#close-data-pro, img#close-home, img#close-brita-group, div.close, div[background-image$="close.png"] {
top: calc(50% - 410px);
    right: calc(50% - 650px);
    position: absolute;
    display: none;
    z-index: 101;
    height: 30px;
}

div.close, div[background-image$="close.png"] {
	border-radius: 50%;
	height: 32px;
	width: 32px;
	color: #4bafff;
	border: solid 2px #4bafff;
	background: linear-gradient(to bottom,#ffffff 50%,#282d74 50%);
	background-size: 100% 210%;
	text-align: center;
	background-position: 0 0;
	transition: all .4s ease;
}

span.lnr.lnr-cross {
    font-size: 27px;
    vertical-align: middle;
}

div.close:hover {
	color: #ffffff;
	background-position: 0 100%;
    border-color: #282d74;
}

img#close-partner-choice {
    top: calc(50% - 265px);
    right: calc(50% - 390px);
    position: absolute;
    display: none;
    z-index: 101;
    height: 30px;
}

img#close-contact:hover, img#close-tour-choice:hover, img#close-partner-choice:hover, img#close-data-pro:hover, img#close-home:hover, img#close-brita-group:hover, div.close:hover {
	cursor: pointer;
}

img#close-tour-choice {
	top: calc(50% - 415px);
    right: calc(50% - 715px);
    position: absolute;
    display: none;
    z-index: 101;
    height: 30px;
}

div.footer-menu.tour-footer-menu {
	padding: 10px 0px;
}

div.fog {
	width: 100vw;
	height: 100vh;
	position: absolute;
	background-color: rgba(255,255,255,0.8);
	display: none;
    z-index: 20;
    top: 0;
}

div.footer-icon:not(:last-child) {
	margin-left: 20px;
	padding: .1rem 0px;
}

div.footer-icon:last-child {
	margin-right: 0px;
	padding: .1rem 0px;
	margin-left: 20px;
}

.overview-point area {
    background: rgba(255,255,255,1.0);
    cursor: auto;
    z-index: 10000;
	height: 80px;
	width: 120px;
}

.overview-point area:hover {
/*outline: #282d74;*/
cursor: pointer;
}

a.overview-target rect, a.overview-target path, a.overview-target circle {
	transition: all .4s ease;
    opacity: 0;
}

a.overview-target:hover rect, a.overview-target:hover path, a.overview-target:hover circle {
	    opacity:0.8;
		background-blend-mode: multiply;
}

svg.overview-image {
    z-index: 100;
    margin-bottom: -15px;
}

div.gallery-left, div.gallery-right {
	display: block;
	position: absolute; 
	bottom: -5px;
	width: 45%;
}

div.gallery-right {
    left: 54%;
	text-align: right;
	margin-right: 1%;
}
div.gallery-left {
	margin-left: 1%;
}


div.gallery-point {
    display: inline-block;
    height: 225px;
	margin: 0 1%;
}



div.gallery-point img {
    height: 100%;
    margin: 0 auto;
}

svg.overview-image.display {
    height: 100%;
    margin: 0 auto;
    width: 100%;
    z-index: 100;
}

svg.overview-image.display image:not(.hover-image):not(.gallery-hover-image)  {
    height: 100%;
}


a.overview-target text, a.overview-target.segment-link text tspan {
	font-family: Arial, sans-serif; 
	font-size: 13px;
	fill: #4bafff;
	font-weight: 700;
	padding: 16px 20px;
	opacity: 0.0;
	text-align: center;
}

a.overview-target text.display {
	font-family: Arial, sans-serif; 
	font-size: 20px;
	fill: #282d74;
	font-weight: 700;
	padding: 16px 20px;
	opacity: 0.0;
	text-align: left;
}

a.overview-target text.display tspan {
	font-size: 20px;
}

a.overview-target image.hover-image {
	opacity: 0;
	position: absolute;
}

a.overview-target image.gallery-hover-image {
	opacity: 1;
}

a.overview-target:hover text, a.overview-target:hover image.hover-image, a.overview-target:hover, a.overview-target.segment-link:hover tspan {
	opacity: 1;
	z-index: 10000;
	transition: all .4s ease;
}

a.overview-target:hover path {
	fill-opacity: 0.8;
}

a.overview-target.feature-link:hover, a.overview-target.segment-link:hover {
	cursor: pointer;
}

div.img-row {
	height: 25%;
	width: 100%;
	padding: 0 9.5% 25px;
	display: inline-block;
	
}

svg.video-display.h1 {
    display: block;
    min-width: 275px;
    width: 61.5%;
    max-width: 100%;
    margin-left: 2%;
	margin-right: 2%;
    margin-bottom: 20px;
}

svg.video-display.link {
	display: inline-block;
	width: 28.5%;
    margin-left: 2%;
	margin-right: 2%;
	margin-bottom: 20px;
	min-width: 275px;
}

svg.video-display.link:hover {
	cursor: pointer;
}

svg.video-display.link:hover image.video-play {
	width: 65px;
	transform: translate(-15px, -15px);
	transition: 200ms;
}

svg.video-display.link:not(:hover) image.video-play {
	transition: 200ms;
}

div.image-hover-scale, img.hover-scale, a.image-hover-scale {
    display: inline-block;
    height: 100%;
    width: 29%;
    background-size: contain;
    background-position: left center;
	margin-left: 2%;
    margin-right: 2%;
    background-color: #fff;
    transition: 200ms;
    z-index: 100;
    background-repeat: no-repeat;
}

a.image-hover-scale {
	height: auto !important;
	margin-bottom: 20px;
}

.image-hover-scale p, .image-hover-scale span, text.video-mouseover {
	color: #282d74;
	font-size: 20px;
	font-weight: 700;
	transform: none;
    height: 100%;
	z-index: 0;
	display: block;
	visibility: visible;
	margin-top: 10px;
	width: max-content;
}

img.hover-scale {
	width: 100% !important;
	vertical-align: middle;
}



a.image-hover-scale:hover p {
	visibility: visible;
	transform: none;
	transition: 300ms;
	z-index: 100000;
}

div.image-hover-scale.signing {
	z-index: 0;
	color: #282d74;
	font-size: 20px;
	font-weight: 700;
	outline: none;
	transform: translateY(-50%);
	background: none;
}

div.image-hover-scale.signing:hover{
	transform: translateY(-50%);
}

img.linked-display {
    width: 100%;
}

div.linked-display-container {
    margin: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
	text-align: center;
}

div.linked-display-container.undercounter {
    background-color: #eef9ff;
	
}

.linked-back {
    position: absolute;
    top: 30px;
    left: 30px;
    z-index: 100;
}

.linked-back a:hover {
	cursor: pointer;
}

.linked-display-container img {
	margin: 0 auto;
}

.linked-back img {
	transform: rotate(-90deg);
}

.linked-back img:hover {
	opacity: 0.8;
}

p.linked-caption {
    font-family: Arial, sans-serif;
    font-size: 30px;
    color: #4bafff;
    font-weight: 400;
    text-align: left;
    padding: 10px 15px;
	transform: translateY(-5px);
    line-height: 1.1em;
	background: #fff;
}

p.linked-caption a {
    font-family: Arial, sans-serif;
    font-size: 30px;
    color: #282d74;
    font-weight: 400;
    text-align: left;
	text-decoration: none;
}

@media (max-width: 1479px) {
div.admin-eingabe {
	text-align: justify;
	display: block;
	margin: 0 auto !important;
}	
span.admin-login-label {
	width: 130px;
	display: inline-block;
}


span.subject {
	width: 75px !important;
}

#subject-mail{
	width: 75px !important;
}

div#logo, div.language-bar, div#ff-heading {
    display: block;
    text-align: left;
    width: 100%;
    min-width: unset;
    max-width: 750px;
}



div#placeholder-before-language {
    display: none;
}

div#logo img {
    margin-left: 0px;
}

div.language-bar {
    display: block;
    text-align: left;
    /* margin: 0 auto; */
    width: unset;
    width: 100%;
	margin-bottom: 0px !important;
}

p#language {
    text-align: left;
}

div#dsgvo span {
    margin-bottom: 20px;
}

input#dsgvo {
    margin-bottom: 4em;
    margin-left: calc(50% - 120px);
}
.button.button-navy-blue {
    margin-left: calc(50% - 85px);
}



}

@media (max-width: 1683px) {
	.admin-login-label {
	display: inline-block;
    text-align: left;
	}


}

@media (max-width: 1349px) and (min-width: 950px) {
	input.form-control {
    width: calc(100% - 75px) !important;
}
input#dsgvo {
    margin-bottom: 4em;
    margin-left: calc(50% - 120px);
}
}




@media (max-height: 890px) and (max-width: 1479px) {

.bg-text.overview, #detailed-overview {
    top: 4%;
    transform: translate(-50%, 0);
}

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

iframe.footer-contact, iframe.choose-tour, iframe.choose-lang {
	width: 90%;
	left: 5%;
	height: calc(80% - 64px);
	top: 10%;
}

img#close-contact, img#close-tour-choice, img#close-lang-choice, img#close-data-pro, img#close-homepage, img#close-home, img#close-brita-group, div.close, div[background-image$="close.png"] {
    right: calc(5% - 45px);
	top: 10%;
}
}

@media (max-height: 680px) and (min-width: 1480px) {

.bg-text.overview {
    top: 0% !important;
    transform: translate(-50%, -26px) !important;
}

.overview-point {
    display: inline-block;
    width: 275px;
    text-align: center;
    height: 220px;
    margin-right: 3px;
}


h1.start-head, h1.start-head.display-start-head {
    font-size: 38px;
}
div.language-bar {
    display: block;
    text-align: left;
    width: 100%;
    margin-bottom: 0px !important;
}
}

@media (max-height: 680px) and (max-width: 1479px) {
.bg-text {
    top: 50%;
    margin-bottom: 50px;
    transform: translate(-50%, calc(-50% - 59px));
}

.bg-content {
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 0px, rgba(255,255,255,0.8) 60%, rgba(255,255,255,0) 100%);
	
}

h1.start-head, h1.start-head.display-start-head {
	font-size: 38px;
}

h2.start-head {
    font-size: 20px;
    margin-bottom: 0px;
}

.bg-text.overview {
    top: 0 !important;
    transform: none !important;
    padding: 10px;
    left: unset !important;
    margin: 0 auto;
}

.overview-point {
    height: 230px;
    width: 275px;
    text-align: center;
}


div.language-bar {
	width: 100%;
}

}

@media(max-height: 560px) {
.bg-text {
    top: 30px;
    transform: translate(-50%, 0);
}
	
.bg-content {
	margin-top: 0px;
	margin-bottom: 15px;
}
.bg-image {
min-height: 525px;	
}
a.tour-link {
    display: inline-block;
    border-radius: 3em;
    right: calc(50% - 196.344px);
    bottom: 5%;
}
div.footer-menu {
    transform: translateX(-15px);
}

img#explanation-de, img#explanation-fr {
    max-height: calc(100% - 100px);
    width: auto;
    margin: 0 auto;
    max-width: 100%;
}
div#explanation-fog {
    display: block;
    height: calc(100% - 103px);
    width: 100%;
    text-align: center;
}
}

@media (max-height: 350px) {
.bg-text {
    top: 30px;
    transform: translate(-50%, 0);
}	
.bg-content {
	margin-top: 0px;
	margin-bottom: 15px;
}
.bg-image {
min-height: 525px;	
}
}

@media (max-width: 950px) {

.bg-text.overview {
    top: calc(50% - 39px);
    left: 50%;
    transform: translate(-50%, -50%);
}

.bg-text .bg-content {
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 0px, rgba(255,255,255,0.8) 60%, rgba(255,255,255,0) 100%);

}

.bg-text.overview .bg-content {
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 0px, rgba(255,255,255,0.8) 300px, rgba(255,255,255,0) 100%);
}

div#ff-heading {
    width: 100%;
}

h2.start-head {
	width: calc(100% - 150px);
}

div#detailed-overview .overview-point h2.start-head {
    width: 100%;
}

div.logo-and-language {
    width: 100%;
    text-align: center;
}
div.gallery-point {
	height: 200px;
}

}

@media (max-width: 848px) {
	div.linked-display-container {
	height: calc(100% - 101px);
}
div.gallery-point {
	height: 150px;
}
div.footer-menu {
    transform: translateX(-15px);
}

}

@media (max-width: 700px) {
	a.footer-icon:not(:last-child), a.no-icon {
		margin: 0rem .5rem;
	}
	
	a.footer-icon:last-child, div.footer-menu > div.footer-icon {
		margin-left: .5rem;
	}
	
	a.footer-icon > div.footer-icon {
		margin: 0 !important;
	}
	
	.footer-icon#brita-group {
		display: none;
	}
	
	

div.language-bar {
	text-align: left;
}

.overview-point {
    display: inline-block;
    width: 250px;
    text-align: center;
    height: 210px;
    margin-right: 3px;
}


#detailed-overview .overview-point {
    display: inline-block;
    width: 260px;
    text-align: center;
    height: 230px;
    margin-right: 3px;
}


}

@media (max-width: 1024px) and (orientation: portrait) {

.bg-content {
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 0px, rgba(255,255,255,0.8) 400px, rgba(255,255,255,0) 100%) !important;
}

a.tour-link {
    position: relative;
    top: 32px;
    margin: 0 auto;
    right: 0;
}
}

@media (max-width: 622px) and (orientation: portrait) {

.bg-content {
    background: linear-gradient(90deg, rgba(255,255,255,0.8) 0px, rgba(255,255,255,0.8) 240px, rgba(255,255,255,0) 100%) !important;
	padding: 15px;
}

h2.start-head {
    width: calc(100% - 80px);
	font-size: 20px;
}
	
div.overview-point {
    height: 180px;
    width: 215px;
    text-align: center;
}

div#detailed-overview .overview-point {
    height: 230px;
    width: 275px;
    text-align: center;
}
.bg-text {
	min-width: unset;
}
.bg-text {
	padding: 10px;
}
a.tour-link {
    max-width: 100%;
    font-size: 19px;
    padding: 14px;
}
}


@media (max-width: 1100px) and (orientation: portrait) {
.bg-image {
    background-position: center right -385px;
}
iframe.footer-contact, iframe.choose-tour, iframe.choose-lang {
	width: 90%;
	left: 5%;
	height: calc(80% - 64px);
	top: 10%;
}

	footer.tour-footer {
		padding: 20px 1rem 0px;
	}

img#close-contact, img#close-tour-choice, img#close-lang-choice, img#close-data-pro, img#close-homepage, img#close-home, img#close-brita-group, div.close, div[background-image$="close.png"] {
    right: 0;
	top: 10%;
}
}

@media (max-width: 1140px) {
	footer.tour-footer {
		padding: 15px 15px 0px;
	}
	
}

@media (max-width: 1187px) {
	svg.video-display.h1 {
    width: 100%;
	max-width: 600px;
	display: block;
}
	
}


@media (max-height: 900px) {
iframe.footer-contact, iframe.choose-tour, iframe.choose-lang {
	width: 90%;
	left: 5%;
	height: calc(80% - 64px);
	top: 10%;
}

img#close-contact, img#close-tour-choice, img#close-lang-choice, img#close-data-pro, img#close-homepage, img#close-home, img#close-brita-group, div.close, div[background-image$="close.png"] {
    right: calc(5% - 16px);
    top: calc(10% - 16px);
}

iframe#krpano_iframe_IFRAME_HTML {
    height: calc(95% - 20px) !important;
    max-width: calc(90vw - 50px) !important;
    margin: 0 auto;
}
}

@media (max-height: 1040px) and (orientation: portrait) {
	.bg-image {
    background-position: center right 30%;
}
iframe.footer-contact, iframe.choose-tour, iframe.choose-lang {
	width: 90%;
	left: 5%;
	height: calc(80% - 64px);
	top: 10%;
}

img#close-contact, img#close-tour-choice, img#close-lang-choice, img#close-data-pro, img#close-homepage, img#close-home, img#close-brita-group, div.close, div[background-image$="close.png"] {
    right: calc(5% - 16px);
    top: calc(10% - 16px);
}

iframe#krpano_iframe_IFRAME_HTML {
    height: calc(95% - 20px) !important;
    max-width: calc(90vw - 50px) !important;
    margin: 0 auto;
}

}


@media (min-width: 2400px) and (min-height: 1200px) {
h1.start-head, h1.start-head.display-start-head {
    font-size: 64px;
	margin: 0 0 28px 0;
	}

h2.start-head {
    font-size: 32px;
    margin: 0 0 40px;
}
.bg-text {
    width: 95%;
    max-width: 1418.6px;
	min-height: 200px;
	max-width: 1480px;
}

.bg-content {
    padding: 40px;
	min-height: 200px;
}

a.button {
    padding: 19px 27px;
    font-size: 17px;
    margin-top: 23px;
    margin-bottom: 8px;
}
footer.tour-footer {
    padding: 28px calc(50% - 709.3px) 16px;
    width: 100%;
}
a.hansa-page {
    transform: translate(90%, -58%) scale(2.5);
    margin-right: 20px;
    margin-left: 0;
}

a.hansa-page:nth-child(2) {
    transform: translate(calc(200% + 60px), -58%) scale(2.5);
}

footer a, footer button.menu-element, footer div.no-icon, footer span {
    font-size: 17px;
	margin-top: 4px;
    margin-bottom: 4px;
}
.footer-icon:last-child {
    margin-right: 0px;
    padding: .13rem 0px;
    margin-left: 28px;
}
a.tour-link {
    padding: 19px 27px;
    font-size: 17px;
    margin-top: 23px;
    margin-bottom: 8px;
	right: calc(50% - 149px);
}
.overview-point {
    width: 366.6px;
    height: 300px;
    margin-right: 4px;
}
.footer-icon:not(:last-child) {
    margin-left: 28px;
    padding: .13rem 0px;
}
div.language {
    height: 40px;
    width: 40px;
}
div.map {
    height: 40px;
    width: 28px;
}
div.envelope {
    height: 25.6px;
    width: 40px;
    transform: translateY(-1.33px);
}
div.house {
    height: 40px;
    width: 44px;
}
iframe.footer-contact {
    transform: scale(1.33);
}

img#close-contact, img#close-data-pro, img#close-home, img#close-brita-group, div.close, div[background-image$="close.png"] {
    top: calc(50% - 530px);
    right: calc(50% - 855px);
    transform: scale(1.33);
}

div.close, div[background-image$="close.png"] {
    border: solid 2.5px #4bafff;
}

span.lnr.lnr-cross {
    transform: scale(1.33);
}
/*iframe#krpano_iframe_IFRAME_HTML {
    transform: scale(1.33);
}*/

}



@media (max-height: 878px) and (max-width: 1920px) and (orientation: landscape) {
img#explanation-de, img#explanation-fr {
    width: unset;
	height: auto;
    margin: 0 auto;
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 93px);

}
}