html { font-size: 14px; }
header { position: fixed; width: 100%; top: 0; font-size: 12px; }
header a,
header a:visited,
header a:link { color: #fff; }

.header-contact-bar { display: block; background: radial-gradient(circle, rgba(18, 138, 232, 0.95) 53%, rgba(39, 138, 204, 0.95) 100%); }
.header-contact-bar > div { padding: 10px; color: #fff; font-size: 13px; }
.header-contact-bar > div > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 20px; }
.header-contact-bar a { font-weight: normal; }

.header-main-bar { background: radial-gradient(circle, rgba(0,0,0,0.7) 13%, rgba(64,64,64,0.95) 100%); box-shadow: 0 2px 3px 0 rgba(0,0,0,0.16), 0 0 3px 0 rgba(0,0,0,0.12); }
.header-main-bar > div { display: flex; justify-content: space-between; }
.header-main-bar nav { display: flex; align-items: center; }
.header-main-bar nav ul { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.header-main-bar nav ul li a { color: #fff; padding-right: 10px; border-right-width: 1px; border: solid 0 #888; border-right-width: 1px; }
.header-main-bar nav ul li:last-child a { border: 0; }
.header-main-bar nav ul li a:hover { color: #d2d2d2; }
.header-main-bar button.icon-btn--menu { background: none; margin-right: 15px; }
.header-main-bar button.icon-btn--menu::before { font-size: 28px; line-height: 22px; color: #fff; }
.header-main-bar .mobile-nav-icon { display: none; padding-right: 20px; }

nav.mobile { display: flex; justify-content: end; }
nav.mobile ul { background: rgba(64,64,64,0.95); }
nav.mobile ul a { color: #fff; font-size: 12px; padding: 10px; border: solid 0 #888; border-top-width: 1px; display: block; }
nav.mobile ul a:hover { color: #d2d2d2; }

@media only screen and (max-width: 600px) {
	.header-main-bar nav ul { display: none; }
	.header-main-bar .mobile-nav-icon { display: block; }
}
@media only screen and (min-width: 601px) {
	nav.mobile { display: none; }
}
@media only screen and (max-width: 480px) {
	header img { width: 148px; height: 30px; }
}


.header-visual { background-image: url(/images/visual-header.webp); background-size: cover; background-position: center; position: relative; height: 550px; box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1); }
.header-visual .wrapper-abs-pos { position: absolute; bottom: 50px; background-color: rgba(57, 57, 57, 0.82); padding: 10px 20px; border-radius: 8px; margin: 10px; }
.header-visual h2 { font-size: 3.7em; color: #fff; }
.header-visual h5 { font-size: 1.5em; color: #fff; border: solid 0 #15b3ff; border-top-width: 1px; padding-top: 5px; margin-top: 5px; font-weight: normal; float: left; color: #dff908; }
@media only screen and (max-width: 992px) {
	.header-visual .wrapper-abs-pos { bottom: 40px; }
	.header-visual { height: 400px; }
	.header-visual h2 { font-size: 3.0em; }
	.header-visual h5 { font-size: 1.3em; }
}
@media only screen and (max-width: 768px) {
	.header-visual .wrapper-abs-pos { bottom: 30px; }
	.header-visual { height: 350px; }
	.header-visual h2 { font-size: 2.3em; }
	.header-visual h5 { font-size: 1.2em; }
}
@media only screen and (max-width: 480px) {
	.header-visual .wrapper-abs-pos { bottom: 20px; }
	.header-visual { height: 300px; }
	.header-visual h2 { font-size: 1.6em; }
	.header-visual h5 { font-size: 1.0em; }
}
.header-visual .overlay { background-color: rgba(25, 25, 25, 0.2); height: 100%; }


.about-us { border: solid 0 #e1e1e1; border-top-width: 1px; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1) inset; padding: 20px 0; }
.about-us h1 { margin-bottom: 20px; font-size: 1.67em; }
.about-us p { margin-bottom: 20px; font-size: 17px; line-height: 1.5; }
.about-us p.green { color: #606060; }


.brands { border: solid 0 #e1e1e1; border-top-width: 1px; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1) inset; padding: 20px 0; background: #fcfcfc; }
#anchor-brands { position: relative; top: -115px; }
@media only screen and (max-width: 480px) {
	#anchor-brands { top: -105px; }
}
@media only screen and (max-width: 339px) {
	#anchor-brands { top: -131px; }
}
.brands h2 { margin-bottom: 20px; font-size: 1.67em; }
.brands p { margin-bottom: 20px; font-size: 17px; line-height: 1.5; }
.brands p.green { color: #606060; }
.brands p.blue { color: #35a3d9; margin-bottom: 5px; }
.brands div.split { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 35px 25px; margin-top: 30px; }
.brands div.split div { box-sizing: border-box; flex: 1 1 0; max-width: 670px; min-width: 320px; background: #fff; }
.brands div.split div ul { list-style: none; margin: 0; }
.brands div.split div > img { width: 100%; }
.brands div.split h3 { margin-bottom: 10px; }
@media only screen and (max-width: 480px) {
	.brands div.split div:nth-child(1) { min-width:300px; }
	.brands div.split div:nth-child(2) { min-width:300px; }
	.brands div.split div.service-illustration { min-width: 300px; }
}
.brands ul { list-style: disc; border: solid 1px #ddd; border-top-width: 0; }
.brands ul li { padding: 10px; line-height: 1.5; }
.brands ul li:first-child { text-align: center; }
.brands ul li img { height: 28px; width: auto; }
@media only screen and (max-width: 350px) {
	.brands ul li img { height: 26px; width: auto; }
}
.brands ul li:nth-child(2) { padding: 0; border: solid 0 #09a7e3; width: 60%; margin: auto; border-top-width: 1px; }
.brands ul li:last-child { border: solid 0 #ddd; border-top-width: 1px; text-align: right; margin: 5px; margin-top: 10px; padding-top: 10px; padding-bottom: 5px; }
.brands div.split div:last-child li:last-child { text-align: center; font-weight: bold; color: #777777; }


.operational-area { box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1) inset; padding: 20px 0 30px 0; }
#anchor-operational-area { position: relative; top: -115px; }
@media only screen and (max-width: 480px) {
	#anchor-operational-area { top: -105px; }
}
@media only screen and (max-width: 339px) {
	#anchor-operational-area { top: -131px; }
}
.operational-area h2 { margin-bottom: 20px; }
.operational-area p { margin-bottom: 20px; font-size: 15px; line-height: 1.5; }
.operational-area p.blue { color: #35a3d9; }
.operational-area div.split { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px 20px; }
.operational-area div.split div { flex: 1; }
.operational-area div.split div:nth-child(1) { min-width: 460px; max-width: -moz-fit-content; max-width: fit-content; }
.operational-area div.split div:nth-child(2) { min-width: 300px; max-width: -moz-fit-content; max-width: fit-content; }
@media only screen and (max-width: 600px) {
	.operational-area div.split div { flex: 1 1 auto; }
	.operational-area div.split div:nth-child(1) { min-width: auto; }
}
.operational-area div.split h3 { margin-bottom: 15px; }
.operational-area div.split .vertical-line { border: solid 0 #90c1ff; border-left-width: 1px; padding-left: 15px; margin-bottom: 20px; }
.operational-area div.split .vertical-line:last-child { margin-bottom: 0; }
.operational-area div.split .vertical-line h5 { margin-bottom: 5px; }
.operational-area img { width: 100%; height: auto; }
.operational-area ul { list-style: disc; margin-left: 15px; }
.operational-area ul li { padding: 5px; }
.operational-area ul li a { font-weight: normal; }


.why-us { box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1) inset; text-align: center; color: #fff; background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.5) ), url(/images/visual-bg-02.webp); background-position: center; background-size: cover; }
.why-us h4 { font-size: 42px; font-weight: normal; margin: 20px 0 40px 0; }
.why-us .list-wrapper { display: flex; justify-content: space-around; gap: 20px; flex-wrap: wrap; margin: 40px 10px; font-size: 20px; }
.why-us .list-wrapper li p { margin-top: 15px; }
.why-us .checkmark-circle { display: inline-block; width: 75px; height: 75px; background-repeat: no-repeat; background-size: 100% 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' color='%23fff'%3E%3Cpath d='M17 3.338A9.95 9.95 0 0 0 12 2C6.477 2 2 6.477 2 12s4.477 10 10 10s10-4.477 10-10q-.002-1.03-.2-2'/%3E%3Cpath stroke='%23f3ce0d' d='M8 12.5s1.5 0 3.5 3.5c0 0 5.559-9.167 10.5-11'/%3E%3C/g%3E%3C/svg%3E"); }
@media only screen and (max-width: 860px) {
	.why-us h4 { font-size: 36px; margin: 15px 0 30px 0; }
	.why-us .list-wrapper { gap: 15px; margin: 30px 10px; font-size: 16px; }
	.why-us .list-wrapper li p { margin-top: 15px; }
	.why-us .checkmark-circle { width: 55px; height: 55px; }
}
@media only screen and (max-width: 700px) {
	.why-us { background-position: calc(100% / 2 - 130px) center; }
	.why-us h4 { font-size: 30px; margin: 15px 0 30px 0; }
	.why-us .list-wrapper { gap: 15px; margin: 30px 10px; font-size: 14px; }
	.why-us .list-wrapper li p { margin-top: 15px; }
	.why-us .checkmark-circle { width: 55px; height: 55px; }
}
@media only screen and (max-width: 620px) {
	.why-us .list-wrapper li { min-width: 190px; }
}
@media only screen and (max-width: 450px) {
	.why-us .list-wrapper li { min-width: 150px; }
}
@media only screen and (max-width: 360px) {
	.why-us .list-wrapper li { min-width: 200px; }
	.why-us .checkmark-circle { width: 45px; height: 45px; }
}


.phone { box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1) inset; text-align: center; color: #fff; background: radial-gradient(circle, #2364cb 20%, #4584e7) repeat scroll 0% 0% rgba(0,0,0,0.1); }
.phone.green-bg { background: radial-gradient(circle, #9ab500 20%, #b0ce02) repeat scroll 0% 0% rgba(0,0,0,0.1); }
.phone h4 { font-size: 26px; font-weight: normal; margin-bottom: 20px; }
.phone .split { display: flex; justify-content: space-around; gap: 20px; flex-wrap: wrap; padding: 20px 10px; }
.phone .text-wrapper { max-width: 600px; }
.phone .text-wrapper p { font-size: 16px; line-height: 1.5; }
.phone .phone-number-wrapper { display: flex; align-items: center; }
.phone .phone-number-wrapper a { border-radius: 8px; background: #b3c70d; padding: 10px; font-size: 24px; color: #fff; }
.phone .phone-number-wrapper a:hover { background: #abbf0c; }
.phone .phone-number-wrapper a.colr-orange { background: #ff7200; }
.phone .phone-number-wrapper a.colr-orange:hover { background: #f36d00; }
.phone .phone-number-wrapper a p:nth-child(1) { font-size: 14px; margin-bottom: 8px; }
.phone .phone-number-wrapper a p span.emergency-phone { color: #d90a0a; font-weight: normal; }
.phone .phone-number-wrapper a p:nth-child(2)::before { font-family: fontawesome; content: '\f095'; color: #fff; font-weight: bold; padding-right: 0.6rem; position: relative; top: 1px; }
.phone .phone-number-wrapper a.colr-orange p span.emergency-phone { color: #036839; }

@media only screen and (max-width: 768px) {
	.phone .split { padding: 20px 10px; }
	.phone h4 { font-size: 1.7em; }
	.phone .phone-number-wrapper a { font-size: 1.6rem; }
}
@media only screen and (max-width: 480px) {
	.phone .split { padding: 10px 10px; }
	.phone h4 { font-size: 1.5em; }
	.phone .phone-number-wrapper a { font-size: 1.3rem; }
}


.contact { box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1) inset; padding: 20px 0 20px 0; }
#anchor-contact { position: relative; top: -115px; }
@media only screen and (max-width: 480px) {
	#anchor-contact { top: -105px; }
}
@media only screen and (max-width: 339px) {
	#anchor-contact { top: -131px; }
}
.contact h2 { margin-bottom: 20px; }
.contact p { font-size: 15px; line-height: 1.5; }
.contact p.blue { color: #35a3d9; margin-bottom: 5px; }
.contact .contact-buttons-wrapper { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-around; border: solid 0 #ffdc39; border-top-width: 1px; padding-top: 25px; margin-top: 15px; }
.contact .phone-number-wrapper { display: flex; align-items: center; }
.contact .phone-number-wrapper a { border-radius: 8px; background: #b3c70d; padding: 10px; font-size: 24px; color: #fff; }
.contact .phone-number-wrapper a:hover { background: #abbf0c; }
.contact .phone-number-wrapper a p:nth-child(1) { font-size: 14px; margin-bottom: 8px; }
.contact .phone-number-wrapper a p:nth-child(2)::before { font-family: fontawesome; content: '\f095'; color: #fff; font-weight: bold; padding-right: 0.6rem; position: relative; top: 1px; }
.contact .phone-number-wrapper a p:nth-child(2) { font-size: 24px; }
.contact .email-wrapper { display: flex; align-items: center; }
.contact .email-wrapper a { border-radius: 8px; background: #b3c70d; padding: 10px; font-size: 18px; line-height: 22px; color: #fff; }
.contact .email-wrapper a:hover { background: #abbf0c; }
.contact .email-wrapper a p:nth-child(1) { font-size: 14px; margin-bottom: 8px; }
.contact .email-wrapper a p:nth-child(2)::before { font-family: fontawesome; content: '\f003'; color: #fff; font-weight: bold; padding-right: 0.6rem; position: relative; top: 1px; }
.contact .email-wrapper a p:nth-child(2) { font-size: 18px; }


footer { background: radial-gradient(circle, #5B5C5E, #2B2F3C) repeat scroll 0% 0% rgba(0,0,0,0.1); border: solid 0px #dddddd; border-top-width: 1px; box-shadow: 0px 5px 25px rgba(0, 0, 0, 0.6) inset; color: #ededed; }
footer .background { background-image: url(/images/banner-abstract.webp); }
footer .footer-address-contact { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 10px; border: solid 0 #ddd; border-bottom-width: 1px; }
footer .footer-address-contact ul li { padding: 5px 0; }
footer .footer-address-contact ul li a { font-weight: normal; color: #fff; }
footer div.flex { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 10px; font-size: 11px; }
footer .links ul { display: flex; }
footer .links ul li:last-child a { border: 0; padding-right: 0; margin-right: 0; }
footer .links a { color: #fff; border: solid 0 #5fb4df; border-right-width: 1px; padding-right: 10px; margin-right: 10px; }


.imprint-lightbox-content { width: calc(100vw - 20px); max-width: 700px; min-width: 300px; display: flex; flex-wrap: wrap; justify-content: space-between; font-size: 12px; }
.imprint-lightbox-content > div { flex: 1 1 auto; margin: 10px; }
.imprint-lightbox-content .imprint-headline { border: solid 0 #009cde; border-bottom-width: 1px; padding-bottom: 3px; margin-bottom: 15px; }
.imprint-lightbox-content h5 { margin: 15px 0 2px 0; }