/* Bryant Web Regular */
@font-face {
font-family: "BryantWeb";
src: url("../fonts/BryantWebRegular.eot");
src: url("../fonts/BryantWebRegular.eot?#iefix") format("embedded-opentype"), url("../fonts/BryantWebRegular.woff2") format("woff2"), url("../fonts/BryantWebRegular.woff") format("woff");
font-weight: 400;
font-style: normal;
font-display: block;
}
input[type=text],
input[type=email],
input[type=tel],
input[type=url],
input[type=search],
input[type=submit],
button,
textarea {
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
border-radius: 0;
-moz-border-radius: 0;
-webkit-border-radius: 0;
}
input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=url]:focus,
input[type=search]:focus,
input[type=submit]:focus,
button:focus,
textarea:focus {
outline: 0;
}
*, *:before, *:after {
box-sizing: border-box;
}
::-moz-selection {
background: rgba(85, 185, 213, 0.99);
color: #2d367f;
}
::-webkit-selection {
background: rgba(85, 185, 213, 0.99);
color: #2d367f;
}
::selection {
background: rgba(85, 185, 213, 0.99);
color: #2d367f;
}
html,
body {
width: 100%;
height: 100%;
}
html {
font-size: 19px;
}
@media only screen and (max-width: 840px) {
html {
font-size: 18px;
}
}
body {
margin: 0;
padding: 0;
text-align: center;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: "BryantWeb", sans-serif;
font-size: 1rem;
line-height: 1.333;
}
img {
border: 0;
}
.fade-from-bottom {
will-change: transform, opacity;
}
.innerwrapper {
width: 100%;
max-width: 1180px;
padding: 0 30px;
margin: 0 auto;
}
@media only screen and (max-width: 1280px) {
.innerwrapper {
padding: 0 50px;
}
}
@media only screen and (max-width: 840px) {
.innerwrapper {
padding: 0 30px;
}
}
header {
background-color: #FFFFFF;
position: fixed;
left: 0;
top: 0;
width: 100%;
padding-left: 0;
z-index: 999;
will-change: transform;
}
@media only screen and (max-width: 1030px) {
header {
padding-left: 0;
top: auto;
bottom: 60px;
transform: translateY(100%);
transition: transform 500ms ease-out;
}
header.open {
transform: translateY(0%);
}
}
header .innerwrapper {
width: 100%;
max-width: 1380px;
padding: 0 30px;
margin: 0 auto;
display: flex;
align-items: center;
height: 100px;
position: relative;
transition: height 250ms ease-out;
}
@media only screen and (max-width: 1030px) {
header .innerwrapper {
flex-wrap: wrap;
height: auto;
padding-top: 30px;
padding-bottom: 35px;
}
}
header.fixed .innerwrapper {
height: 70px;
}
@media only screen and (max-width: 1030px) {
header.fixed .innerwrapper {
height: auto;
}
}
header nav {
width: 100%;
}
@media only screen and (max-width: 1280px) {
header nav {
flex: 1;
width: auto;
}
}
@media only screen and (max-width: 1030px) {
header nav {
padding-top: 35px;
}
}
header nav ul {
width: 100%;
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
}
@media only screen and (max-width: 1280px) {
header nav ul {
justify-content: flex-end;
}
}
@media only screen and (max-width: 1030px) {
header nav ul {
display: block;
}
}
header nav ul li {
list-style-type: none;
margin: 0;
padding: 0 25px;
font-size: 1.1rem;
color: #2d367f;
}
@media only screen and (max-width: 1390px) {
header nav ul li {
padding: 0 18px;
}
}
@media only screen and (max-width: 1030px) {
header nav ul li {
padding: 0;
border-top: 1px solid #2d367f;
font-size: 21px;
}
}
header nav ul li a {
color: inherit;
text-decoration: none;
}
@media only screen and (max-width: 1030px) {
header nav ul li a {
display: block;
padding: 10px 0 10px 0;
}
}
.logo {
display: flex;
align-items: center;
position: absolute;
left: 30px;
}
@media only screen and (max-width: 1280px) {
.logo {
position: relative;
}
}
@media only screen and (max-width: 1030px) {
.logo {
position: relative;
width: 100%;
left: auto;
display: block;
}
}
.logo img:first-child {
width: 66px;
height: auto;
}
@media only screen and (max-width: 1030px) {
.logo img:first-child {
display: block;
margin-left: auto;
margin-right: auto;
}
}
.logo img:nth-child(2) {
width: 162px;
height: auto;
margin-left: 38px;
}
@media only screen and (max-width: 1030px) {
.logo img:nth-child(2) {
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 25px;
}
}
.open__button {
background-color: #FFFFFF;
width: 230px;
padding: 0 15px 0 40px;
border-radius: 15px;
font-size: 17px;
height: 32px;
line-height: 32px;
color: #2d367f;
text-align: center;
position: relative;
}
.open__button:before {
content: "";
display: block;
width: 22px;
height: 22px;
background-color: gray;
position: absolute;
left: 10px;
top: 5px;
border-radius: 50%;
}
.open__button.open:before {
background-color: #94bf80;
}
.open__button.closed:before {
background-color: #BD3A3A;
}
aside {
width: 60px;
height: 100%;
position: fixed;
left: 0;
top: 0;
background-color: #2d367f;
z-index: 9999;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-bottom: 5vh;
display: none;
}
@media only screen and (max-width: 1030px) {
aside {
top: auto;
bottom: 0;
width: 100%;
height: 60px;
flex-direction: row;
padding-bottom: 0;
display: flex;
}
}
aside .open__mobile__nav {
display: none;
width: 40px;
height: 40px;
background-color: #FFFFFF;
border-radius: 50%;
position: relative;
margin: 0 25px;
cursor: pointer;
}
@media only screen and (max-width: 1030px) {
aside .open__mobile__nav {
display: block;
}
}
aside .open__mobile__nav span {
width: 60%;
position: absolute;
font-size: 0;
line-height: 0;
height: 1px;
background-color: #2d367f;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: background-color 150ms ease-out;
}
aside .open__mobile__nav span:before {
content: "";
display: block;
font-size: 0;
line-height: 0;
height: 1px;
position: absolute;
left: 0;
width: 100%;
background-color: #2d367f;
top: 0;
transform: translateY(-7px);
transition: transform 150ms ease-out;
}
aside .open__mobile__nav span:after {
content: "";
display: block;
font-size: 0;
line-height: 0;
height: 1px;
position: absolute;
left: 0;
width: 100%;
background-color: #2d367f;
top: 0;
transform: translateY(7px);
transition: transform 150ms ease-out;
}
aside .open__mobile__nav.open span {
background-color: transparent;
}
aside .open__mobile__nav.open span:before {
transform: translateY(0) rotate(45deg);
}
aside .open__mobile__nav.open span:after {
transform: translateY(0) rotate(-45deg);
}
aside .aside__button {
width: 32px;
height: 32px;
background-position: center center;
background-repeat: no-repeat;
margin: 20px 0;
cursor: pointer;
background-size: contain;
position: relative;
}
aside .aside__button svg {
width: 100%;
height: auto;
position: absolute;
left: 0;
top: 0;
}
aside .aside__button.current:before {
content: "";
display: block;
background-image: url("data:image/svg+xml;utf8,");
width: 31px;
height: 66px;
position: absolute;
right: -40px;
top: 50%;
margin-top: -33px;
}
aside .aside__button.current span {
display: none !important;
}
@media only screen and (max-width: 1030px) {
aside .aside__button {
width: 25px;
height: 25px;
margin: 0 15px;
}
}
aside .aside__button.person {
display: none;
}
@media only screen and (max-width: 1030px) {
aside .aside__button.person {
display: block;
}
}
aside .aside__button span {
display: block;
font-size: 0.833rem;
background-color: #2d367f;
width: 150px;
position: absolute;
left: calc(100% + 30px);
border-radius: 4px;
color: #ffffff;
height: 30px;
line-height: 32px;
pointer-events: none;
transform: translateX(20px);
opacity: 0;
transition: 200ms ease-out;
}
@media only screen and (max-width: 1030px) {
aside .aside__button span {
display: none !important;
}
}
aside .aside__button span:before {
content: "";
display: block;
width: 14px;
height: 14px;
position: absolute;
transform: rotate(45deg);
background-color: #2d367f;
border-radius: 2px;
left: -4px;
top: 8px;
}
aside .aside__button:hover span {
transform: translateX(0px);
opacity: 1;
}
.mainwrapper {
width: 100%;
overflow: hidden;
}
@media only screen and (max-width: 1030px) {
.mainwrapper {
padding-left: 0;
padding-bottom: 60px;
}
}
.section__start {
display: flex;
padding-top: 100px;
position: relative;
}
@media only screen and (max-width: 1030px) {
.section__start {
padding-top: 0;
}
}
@media only screen and (max-width: 840px) {
.section__start {
flex-wrap: wrap;
}
}
.section__start .column__left {
width: 44%;
background-color: #e9d9cc;
padding-left: 30px;
padding-right: 30px;
}
@media only screen and (max-width: 1280px) {
.section__start .column__left {
padding-left: 50px;
padding-right: 50px;
}
}
@media only screen and (max-width: 840px) {
.section__start .column__left {
width: 100%;
order: 2;
padding-left: 30px;
padding-right: 30px;
padding-bottom: 60px;
}
}
.section__start .column__left .circle__koala {
background-image: none;
}
.section__start .column__left .circle__koala .circle_bg,
.section__start .column__left .circle__koala .typo_el {
transition: fill 200ms ease-out;
}
.section__start .column__left .circle__koala:hover .circle_bg {
fill: #2d367f;
}
.section__start .column__left .circle__koala:hover .typo_el {
fill: #f5f5f0;
}
.section__start .column__right {
width: 56%;
background-color: #2d367f;
color: #FFFFFF;
text-align: left;
position: relative;
display: flex;
flex-direction: column;
}
@media only screen and (max-width: 840px) {
.section__start .column__right {
width: 100%;
order: 1;
}
}
.section__start .column__right .circle {
position: absolute;
width: 32vw;
height: 32vw;
right: 0;
top: 42%;
transform: translateY(-50%) translateX(55%);
background-image: url("data:image/svg+xml;utf8,");
background-size: 100% 100%;
}
@media only screen and (max-width: 480px) {
.section__start .column__right .circle {
width: 50vw;
height: 50vw;
}
}
.section__start .column__right .start__text {
padding: 8vw 8% calc(8% - 20px) 8%;
width: 100%;
}
@media only screen and (max-width: 1280px) {
.section__start .column__right .start__text {
padding-left: 50px;
padding-right: 50px;
padding-top: 70px;
}
}
@media only screen and (max-width: 840px) {
.section__start .column__right .start__text {
padding-left: 30px;
padding-right: 30px;
padding-bottom: 20px;
}
.section__start .column__right .start__text h1 {
-webkit-hyphens: auto;
hyphens: auto;
}
.section__start .column__right .start__text h1 br {
display: none;
}
}
.section__start .column__right p {
width: 70%;
}
.section__start .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.section__behandlung-image {
font-size: 0;
line-height: 0;
position: relative;
}
.section__behandlung-image .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.section__behandlung-image img {
width: 100%;
height: auto;
}
h1 {
font-size: calc(4.3181818182vw + 1 * -5.9090909091px);
font-weight: 400;
line-height: 1.06;
margin-top: 0;
}
@media (min-width: 1480px) {
h1 {
font-size: 58px;
}
}
@media only screen and (max-width: 840px) {
h1 {
font-size: calc(7.5vw + 1 * -5px);
}
}
@media (max-width: 600px) {
h1 {
font-size: 40px;
}
}
h2 {
font-size: calc(4.3181818182vw + 1 * -5.9090909091px);
font-weight: 400;
line-height: 1.06;
margin-top: 0;
display: block;
text-align: center;
margin-bottom: 0;
}
@media (min-width: 1480px) {
h2 {
font-size: 58px;
}
}
@media only screen and (max-width: 840px) {
h2 {
font-size: calc(7.5vw + 1 * -5px);
}
}
@media (max-width: 600px) {
h2 {
font-size: 40px;
}
}
h3 {
font-size: 30px;
font-weight: 400;
line-height: 1.16;
margin-top: 0;
display: block;
text-align: center;
margin-bottom: 0.8em;
}
@media (max-width: 600px) {
h3 {
font-size: 25px;
}
}
h3 a {
color: inherit;
text-decoration: none;
}
.start__image {
font-size: 0;
line-height: 0;
position: relative;
flex: 1;
}
.start__image .wave {
position: absolute;
top: -1px;
left: 0;
width: 100%;
}
.start__image .wave svg {
width: 100%;
height: auto;
}
.start__image img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.start__formular {
text-align: left;
width: 100%;
padding-left: calc((100vw - 60px - 1380px) / 2 + 84px + 20px);
padding-top: 8vw;
padding-right: 30px;
}
@media only screen and (max-width: 1280px) {
.start__formular {
padding-top: 70px;
padding-left: 0;
padding-right: 0;
}
}
@media only screen and (max-width: 840px) {
.start__formular {
padding-top: 40px;
}
}
.start-formular__inner {
font-size: 0.8333rem;
line-height: 1.4;
color: #2d367f;
}
.start-formular__inner p {
margin-top: 0.5em;
}
.start-formular__inner .button-blue {
margin-left: 0;
font-size: 0.8333rem;
height: 44px;
line-height: 46px;
width: auto;
max-width: none;
display: inline-block;
padding: 0 20px;
}
.start-formular__inner .profile {
width: 108px;
height: 108px;
position: relative;
border-radius: 50%;
overflow: hidden;
}
@media only screen and (max-width: 840px) {
.start-formular__inner .profile {
width: 80px;
height: 80px;
}
}
.start-formular__inner .profile img {
position: absolute;
width: 100%;
height: auto;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.start-formular__inner ul {
padding-left: 0;
}
@media only screen and (max-width: 840px) {
.start-formular__inner ul {
width: 100%;
padding-left: 15px;
}
}
.start-formular__inner ul li {
margin: 0.5em 0;
}
.start-formular__inner h3 {
font-size: 1.333rem;
line-height: 1.1;
font-weight: 400;
color: #2d367f;
margin-top: 2rem;
margin-bottom: 0;
text-align: left;
}
@media only screen and (max-width: 840px) {
.start-formular__inner h3 {
width: 100%;
}
}
.start-formular__inner .profile + h3 {
margin-top: 1rem;
}
@media only screen and (max-width: 840px) {
.start-formular__inner .profile + h3 {
padding-left: 25px;
}
}
.single__form-line {
margin: 12px 0;
}
.single__form-line p {
margin-bottom: 0;
}
.checkbox__wrapper {
display: flex;
align-items: center;
position: relative;
margin: 15px 0;
}
.checkbox__wrapper input[type=checkbox] {
position: absolute;
display: block;
width: 26px;
height: 26px;
opacity: 0;
margin: 0;
padding: 0;
z-index: 2;
}
.checkbox__wrapper input[type=checkbox] + span.wpcf7-list-item-label {
padding-left: 35px;
}
.checkbox__wrapper input[type=checkbox] + span.wpcf7-list-item-label:before {
content: "";
display: block;
font-size: 0;
line-height: 0;
display: inline-block;
width: 26px;
height: 26px;
border-radius: 50%;
background-color: #f5f5f0;
position: absolute;
left: 0;
top: 50%;
margin-top: -13px;
}
.checkbox__wrapper input[type=checkbox]:checked + span.wpcf7-list-item-label:after {
content: "";
display: block;
width: 16px;
height: 16px;
position: absolute;
left: 5px;
top: calc(5px + 50%);
background-color: #2d367f;
border-radius: 50%;
margin-top: -13px;
}
.checkbox__wrapper input[type=checkbox]:checked + .span_radio:before {
content: "";
display: block;
width: 16px;
height: 16px;
position: absolute;
left: 5px;
top: 5px;
background-color: #2d367f;
border-radius: 50%;
}
.checkbox__wrapper label {
width: calc(100% - 26px);
padding-left: 10px;
}
.span_radio {
font-size: 0;
line-height: 0;
display: inline-block;
width: 26px;
height: 26px;
border-radius: 50%;
background-color: #f5f5f0;
position: relative;
}
input[type=text],
input[type=email],
textarea {
width: 100%;
padding: 7px 15px 5px 15px;
display: block;
background-color: #f5f5f0;
height: 44px;
border: 0;
font-size: 0.8333rem;
font-family: "BryantWeb";
color: #2d367f;
border: 1px solid transparent;
}
input[type=text].wpcf7-not-valid,
input[type=email].wpcf7-not-valid,
textarea.wpcf7-not-valid {
border: 1px solid red;
}
textarea {
height: 156px;
resize: none;
}
.wpcf7-response-output.wpcf7-validation-errors {
display: none !important;
}
div.wpcf7-response-output {
padding: 0 !important;
border: 0 !important;
}
input[type=submit],
button {
font-size: 0.8333rem;
height: 44px;
line-height: 46px;
padding: 0 20px;
background-color: #2d367f;
border: 0;
border-radius: 20px;
cursor: pointer;
font-family: "BryantWeb";
color: #FFFFFF;
text-align: center;
margin-top: 1em;
}
.start-formular__intro-text {
max-width: 250px;
margin-bottom: 1.5rem;
}
@media only screen and (max-width: 840px) {
.start-formular__intro-text {
max-width: 10000px;
display: flex;
flex-wrap: wrap;
margin-bottom: 2rem;
}
.start-formular__intro-text .profile + h3 {
flex: 1;
width: auto;
}
}
.start-formular__intro-text + p {
margin-bottom: 2rem;
}
.circle__koala {
width: 45%;
display: block;
margin: 3rem auto -5% auto;
position: relative;
z-index: 99;
background-size: 100% 100%;
background-image: url("data:image/svg+xml;utf8,");
}
.circle__koala img,
.circle__koala svg {
width: auto;
height: 70%;
position: absolute;
left: 55%;
top: 50%;
transform: translate(-50%, -50%);
}
.circle__koala img.typo,
.circle__koala svg.typo {
height: auto;
width: 98%;
left: 50%;
}
.circle__koala:before {
content: "";
display: block;
padding-bottom: 100%;
}
.section__info {
background-color: #f5f5f0;
color: #2d367f;
position: relative;
}
.section__info .innerwrapper {
padding-top: 5%;
padding-bottom: 5%;
}
@media only screen and (max-width: 840px) {
.section__info .innerwrapper {
padding-top: 15%;
}
}
.section__info p {
max-width: 720px;
margin-left: auto;
margin-right: auto;
}
.section__info .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.column__wrapper {
display: flex;
justify-content: space-between;
}
@media only screen and (max-width: 840px) {
.column__wrapper {
flex-wrap: wrap;
}
}
.column__wrapper .column {
width: 26%;
margin: 30px 0;
}
@media only screen and (max-width: 840px) {
.column__wrapper .column {
width: 100%;
margin: 20px 0;
}
}
.icon {
width: 40%;
margin-left: auto;
margin-right: auto;
position: relative;
margin-bottom: 1.4rem;
}
@media only screen and (max-width: 840px) {
.icon {
width: 35%;
}
}
.icon img,
.icon svg {
position: absolute;
width: 100%;
height: auto;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.icon:before {
display: block;
content: "";
padding-bottom: 100%;
}
.wave__start-top,
.wave__start-bottom {
will-change: transform;
pointer-events: none;
}
.wave__start-top span,
.wave__start-bottom span {
position: absolute;
background-color: transparent;
width: 100%;
height: 100%;
left: 0;
top: 0;
pointer-events: none;
z-index: 12;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.wave__start-top svg,
.wave__start-bottom svg {
width: 100%;
height: 150px;
pointer-events: none;
transform: translateZ(0);
will-change: transform;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.wave__start-top svg path,
.wave__start-bottom svg path {
transform: translateZ(0);
will-change: transform;
}
@media only screen and (max-width: 480px) {
.wave__start-bottom {
overflow: hidden;
}
}
@media only screen and (max-width: 480px) {
.wave__start-bottom svg {
transform: translateY(45px);
}
}
.open__overlay {
cursor: pointer;
}
.open__overlay:hover {
text-decoration: underline;
}
.close_overlay {
display: block;
position: absolute;
right: 2rem;
top: 2rem;
width: 1.5rem;
font-size: 0;
line-height: 0;
cursor: pointer;
}
@media only screen and (max-width: 600px) {
.close_overlay {
right: 1rem;
top: 1rem;
}
}
.close_overlay svg {
width: 100%;
height: auto;
}
.arzt__overlay {
display: none;
position: fixed;
left: 50%;
top: 50%;
width: 90%;
max-width: 680px;
transform: translate(-50%, -50%);
text-align: left;
padding: 2rem;
z-index: 99999;
color: #2d367f;
border-radius: 1rem;
background-color: #FFFFFF;
}
@media only screen and (max-width: 600px) {
.arzt__overlay {
padding: 1rem;
max-height: 75vh;
overflow-y: scroll;
font-size: 0.8rem;
}
.arzt__overlay h2 {
font-size: 28px;
}
.arzt__overlay h3 {
font-size: 20px;
margin-top: 0.5em;
}
}
.arzt__overlay h2,
.arzt__overlay h3 {
text-align: left;
}
.arzt__overlay .close__overlay {
display: block;
position: absolute;
right: 2rem;
top: 2rem;
width: 1.5rem;
font-size: 0;
line-height: 0;
cursor: pointer;
}
@media only screen and (max-width: 600px) {
.arzt__overlay .close__overlay {
right: 1rem;
top: 1rem;
}
}
.arzt__overlay .close__overlay svg {
width: 100%;
height: auto;
}
.arzt__overlay ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.arzt__overlay ul li {
display: flex;
list-style-type: none;
margin: 0;
padding: 0;
}
.arzt__overlay ul li strong {
font-weight: normal;
width: 7rem;
}
@media only screen and (max-width: 600px) {
.arzt__overlay ul li strong {
width: 6rem;
}
}
.arzt__overlay ul li span {
flex: 1;
}
.termin__overlay {
visibility: hidden;
position: fixed;
left: 50%;
top: 50%;
width: 90%;
max-width: 980px;
height: 75vh;
overflow-y: auto;
transform: translate(-50%, -50%);
text-align: left;
z-index: 99999;
color: #2d367f;
background-color: #FFFFFF;
}
@media only screen and (max-width: 600px) {
.termin__overlay {
max-height: 75vh;
overflow-y: scroll;
font-size: 0.8rem;
}
.termin__overlay h2 {
font-size: 28px;
}
.termin__overlay h3 {
font-size: 20px;
margin-top: 0.5em;
}
}
.termin__overlay iframe {
width: 100%;
height: 100%;
margin-top: -32px;
}
@media only screen and (max-width: 600px) {
.termin__overlay iframe {
margin-top: 0;
}
}
.section__team--new {
position: relative;
display: flex;
width: 100%;
background-color: #f5f5f0;
overflow: hidden;
}
@media only screen and (max-width: 1190px) {
.section__team--new {
overflow: hidden;
}
}
@media only screen and (max-width: 840px) {
.section__team--new:before {
background-color: #e9dbcc;
content: "";
display: block;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
z-index: 1;
height: 60%;
}
}
.section__team--new .innerwrapper {
position: relative;
z-index: 3;
}
.section__team--new .innerwrapper .aerzte__wrapper {
display: grid;
grid-template-columns: 1fr 0.8fr 1fr;
width: calc(100% + 10rem);
margin-inline: -5rem;
}
@media only screen and (max-width: 840px) {
.section__team--new .innerwrapper .aerzte__wrapper {
grid-template-columns: 1fr 1fr;
width: calc(100% + 6rem);
margin-inline: -3rem;
margin-top: 2rem;
}
}
.section__team--new .innerwrapper .aerzte__wrapper .arzt-area__left,
.section__team--new .innerwrapper .aerzte__wrapper .content-area__middle,
.section__team--new .innerwrapper .aerzte__wrapper .arzt-area__right {
width: 100%;
}
@media only screen and (max-width: 840px) {
.section__team--new .innerwrapper .aerzte__wrapper .arzt-area__left {
margin-right: -1rem;
margin-left: auto;
z-index: 9;
}
.section__team--new .innerwrapper .aerzte__wrapper .arzt-area__left img {
position: relative;
z-index: 1;
}
}
@media only screen and (max-width: 840px) {
.section__team--new .innerwrapper .aerzte__wrapper .arzt-area__right {
margin-left: -1rem;
margin-right: auto;
position: relative;
}
.section__team--new .innerwrapper .aerzte__wrapper .arzt-area__right img {
position: relative;
z-index: 1;
}
.section__team--new .innerwrapper .aerzte__wrapper .arzt-area__right {
/*
&:before {
background-color: #f5f5f0;
content: '';
display: block;
width: 200%;
z-index: 0;
position: absolute;
right: 0;
bottom: 0;
height: 100%;
}
*/
}
}
.section__team--new .innerwrapper .aerzte__wrapper .content-area__middle {
color: #2d367f;
margin-bottom: 6rem;
margin-top: auto;
}
@media only screen and (max-width: 840px) {
.section__team--new .innerwrapper .aerzte__wrapper .content-area__middle {
grid-column: 1/3;
grid-row: 2/3;
margin-bottom: 0;
margin-top: 0;
padding-top: 2rem;
padding-bottom: 5rem;
background-color: #f5f5f0;
width: 100%;
margin-inline: 0;
padding-inline: 3rem;
}
}
.section__team--new .innerwrapper .aerzte__wrapper .content-area__middle h2 {
font-size: 38px;
font-weight: 400;
line-height: 1.16;
margin: 0;
margin-bottom: 1.5rem;
}
.section__team--new .innerwrapper .aerzte__wrapper .content-area__middle h3 {
font-size: 28px;
font-weight: 400;
line-height: 1.16;
margin: 0;
margin-top: 1em;
}
.section__team--new .innerwrapper .aerzte__wrapper .content-area__middle h3 + p {
margin-top: 0.2em;
}
.section__team--new .innerwrapper .aerzte__wrapper .content-area__middle p {
font-size: 0.9rem;
}
@media only screen and (max-width: 840px) {
.section__team--new .innerwrapper {
flex-wrap: wrap;
}
}
.section__team--new .arzt__image {
font-size: 0;
line-height: 0;
}
.section__team--new .arzt__image img {
width: 100%;
height: auto;
}
.section__team--new .arzt__image {
/*
@media only screen and (max-width: 840px) {
height: auto;
width: 100%;
margin-left: auto;
margin-right: auto;
max-width: 480px;
img {
object-fit: none;
height: auto;
}
}
*/
}
.section__team--new .wave__bg {
z-index: 2;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 20%;
/*
@media only screen and (max-width: 1190px) {
height: auto;
width: 1290px;
left: 50%;
transform: translateX(-50%);
}
*/
}
@media only screen and (max-width: 840px) {
.section__team--new .wave__bg {
left: 0;
width: 100%;
height: 100%;
transform: translateX(0%);
transform: translateX(0%);
bottom: auto;
height: 39rem;
top: auto;
bottom: 0;
}
}
.section__team--new .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
z-index: 3;
}
.section__team--new {
/*
.content-area__right {
padding-top: 0;
padding-bottom: 0;
display: flex;
flex-direction: column;
background-color: transparent;
//justify-content: flex-end;
justify-content: center;
padding-bottom: 100px;
padding-top: 22%;
.team__wrapper {
justify-content: space-between;
}
.single__team {
width: 46%;
}
.arzt__infos {
max-width: 480px;
margin: 0 auto;
line-height: 1.1;
margin-bottom: 9%;
@media only screen and (max-width: 1190px) {
//margin-bottom: auto;
margin-top: 64px;
}
.name {
font-size: 1.66em;
line-height: 1.1;
}
.status {
font-size: 1em;
line-height: 1.1;
}
}
}
*/
}
.section__team {
position: relative;
display: flex;
}
@media only screen and (max-width: 840px) {
.section__team {
flex-wrap: wrap;
}
}
.section__team .wave__start-top {
width: 100%;
position: absolute;
left: 0;
top: -1px;
height: 150px;
transform: scaleY(-1);
filter: FlipV;
-ms-filter: "FlipV";
}
.section__team .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.content-area__left {
width: 60%;
position: relative;
z-index: 0;
}
@media only screen and (max-width: 840px) {
.content-area__left {
width: 100%;
}
}
.content-area__left .arzt__image {
width: 100%;
height: 100%;
}
@media only screen and (max-width: 840px) {
.content-area__left .arzt__image {
height: auto;
}
}
.content-area__left .arzt__image .arzt__infos {
position: absolute;
width: 100%;
left: 0;
bottom: 134px;
text-align: center;
z-index: 9;
}
@media only screen and (max-width: 840px) {
.content-area__left .arzt__image .arzt__infos {
bottom: 7%;
}
}
.content-area__left .arzt__image .arzt__infos .name {
font-size: 2.5rem;
color: #FFFFFF;
line-height: 1.1;
text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.42);
}
@media only screen and (max-width: 840px) {
.content-area__left .arzt__image .arzt__infos .name {
font-size: 2.2rem;
}
}
@media only screen and (max-width: 480px) {
.content-area__left .arzt__image .arzt__infos .name {
font-size: 2rem;
}
}
.content-area__left .arzt__image .arzt__infos .status {
font-size: 1.5rem;
color: #FFFFFF;
line-height: 1.1;
text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.42);
}
@media only screen and (max-width: 840px) {
.content-area__left .arzt__image .arzt__infos .status {
font-size: 1.3rem;
}
}
.content-area__left .arzt__image img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: 50% 100%;
object-position: 50% 100%;
}
@media only screen and (max-width: 840px) {
.content-area__left .arzt__image img {
-o-object-fit: unset;
object-fit: unset;
-o-object-position: unset;
object-position: unset;
height: auto;
}
}
.team__intro__mobile {
display: none;
background-color: #e9d9cc;
padding-top: 130px;
color: #2d367f;
padding-left: 30px;
padding-right: 30px;
padding-bottom: 20px;
}
@media only screen and (max-width: 840px) {
.team__intro__mobile {
display: block;
width: 100%;
}
}
.team__intro__mobile h2 {
margin-bottom: 0.4em;
}
.team__intro__mobile h3 {
max-width: 450px;
margin-left: auto;
margin-right: auto;
font-size: 1rem;
}
.content-area__full {
width: 100%;
padding-top: calc(120px + 3rem);
padding-bottom: calc(150px + 3rem);
background-color: #e9d9cc;
color: #2d367f;
}
@media only screen and (max-width: 840px) {
.content-area__full {
width: 100%;
padding-top: 0;
padding-bottom: 110px;
}
}
.content-area__full h2 {
margin-bottom: 0.4em;
}
@media only screen and (max-width: 840px) {
.content-area__full h2 {
display: none;
}
}
.content-area__full h3 {
max-width: 450px;
margin-left: auto;
margin-right: auto;
}
@media only screen and (max-width: 840px) {
.content-area__full h3 {
display: none;
}
}
.content-area__full .content-area-right__inner {
width: 100%;
padding-right: calc((100vw - 60px - 1380px) / 2 - 30px + 20px);
position: relative;
}
.content-area__full .team__holder {
width: 100%;
position: relative;
}
.content-area__full .team__holder .team__wrapper {
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
.content-area__full .team__holder .single__team .team-image {
width: 76%;
margin: 0 auto;
}
@media only screen and (max-width: 600px) {
.content-area__full .team__holder .single__team .team-image {
width: 100%;
}
}
.content-area__full .team__holder .circle__koala {
position: absolute;
margin: 0;
bottom: calc(-150px - 19%);
right: 30px;
width: 16.5%;
}
@media only screen and (max-width: 840px) {
.content-area__full .team__holder .circle__koala {
display: none !important;
}
}
.content-area__right {
width: 40%;
padding-top: calc(150px + 3rem);
padding-bottom: calc(150px + 3rem);
background-color: #e9d9cc;
color: #2d367f;
}
@media only screen and (max-width: 840px) {
.content-area__right {
width: 100%;
padding-top: 30px;
padding-bottom: 110px;
margin-top: -1px;
}
}
.content-area__right h2 {
margin-bottom: 0.4em;
}
@media only screen and (max-width: 840px) {
.content-area__right h2 {
display: none;
}
}
.content-area__right h3 {
max-width: 450px;
margin-left: auto;
margin-right: auto;
}
@media only screen and (max-width: 840px) {
.content-area__right h3 {
display: none;
}
}
.content-area__right .content-area-right__inner {
width: 100%;
padding-right: calc((100vw - 60px - 1380px) / 2 - 30px + 20px);
position: relative;
}
.content-area__right .team__holder {
width: 100%;
position: relative;
}
.content-area__right .team__holder .circle__koala {
position: absolute;
margin: 0;
bottom: calc(-150px - 19%);
right: 30px;
width: 32%;
}
@media only screen and (max-width: 840px) {
.content-area__right .team__holder .circle__koala {
display: none !important;
}
}
.team__wrapper {
width: 100%;
display: flex;
flex-wrap: wrap;
margin-top: 1rem;
padding-left: 60px;
padding-right: 60px;
justify-content: center;
}
@media only screen and (max-width: 840px) {
.team__wrapper {
padding-left: 20px;
padding-right: 20px;
}
}
.single__team {
padding: 20px 15px;
width: 33.3333%;
}
@media only screen and (max-width: 600px) {
.single__team {
width: 50%;
}
}
.single__team strong {
display: block;
font-weight: normal;
font-size: 1.333rem;
display: block;
text-align: center;
margin-top: 0.5em;
line-height: 1.2;
}
.single__team span {
display: block;
text-align: center;
font-size: 0.8333rem;
line-height: 1.2;
}
.single__team .team-image {
font-size: 0;
line-height: 0;
border-radius: 50%;
display: block;
position: relative;
overflow: hidden;
transition: transform 350ms ease-out;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.single__team .team-image img {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
border-radius: 50%;
}
.single__team .team-image:after {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
border-radius: 50%;
border: 8px solid #FFFFFF;
opacity: 0;
transition: opacity 550ms ease-out;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: scale(1.03);
}
.single__team .team-image:before {
content: "";
display: block;
padding-bottom: 100%;
}
.single__team:hover .team-image {
transform: scale(1.1);
}
.single__team:hover .team-image:after {
opacity: 1;
}
.read-more {
width: 100%;
max-width: 330px;
border-radius: 24px;
background-color: #e9d9cc;
height: 46px;
line-height: 48px;
color: #2d367f;
font-size: 1.333rem;
text-align: center;
text-decoration: none;
display: block;
margin-left: auto;
margin-right: auto;
transition: 150ms ease-out;
}
.button-blue {
width: 100%;
max-width: 330px;
border-radius: 24px;
background-color: #55B9D5;
height: 46px;
line-height: 48px;
color: #2d367f;
font-size: 1.333rem;
text-align: center;
text-decoration: none;
display: block;
margin-left: auto;
margin-right: auto;
transition: 150ms ease-out;
}
.column-fade-1,
.column-fade-2,
.column-fade-3 {
will-change: transform, opacity;
}
.button-hover {
position: relative;
overflow: hidden;
z-index: 2;
}
@media (hover: hover) {
.button-hover span {
position: relative;
z-index: 2;
display: block;
width: 100%;
height: 100%;
transition: transform 350ms;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.button-hover:before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #55B9D5;
transform: translateY(100%);
transition-duration: 0.3s;
transition-timing-function: ease-out;
transition-property: transform;
z-index: 1;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.section__map .button-hover:before {
background-color: #FFFFFF;
}
.button-hover:after {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
transform: translateY(-100%);
transition: transform 350ms;
background-image: url(../images/arrow-right.svg);
background-repeat: no-repeat;
background-position: center center;
background-size: 30px auto;
z-index: 3;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.button-hover:hover span {
transform: translateY(100%);
}
.button-hover:hover:after {
transform: translateY(0%);
}
.button-hover:hover:before {
transition-duration: 0.5s;
transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
transform: translateY(0%);
}
.button-hover.wpcf7-submit:after {
background-image: url(../images/icon-mail.svg);
}
}
.section__allianz {
background-color: #2d367f;
color: #f5f5f0;
}
.section__allianz p {
max-width: 720px;
margin-left: auto;
margin-right: auto;
}
.section__allianz .innerwrapper {
padding-bottom: 5%;
padding-top: 5%;
}
@media only screen and (max-width: 480px) {
.section__allianz .innerwrapper {
padding-bottom: 10%;
}
}
.section__allianz h2 {
max-width: 900px;
margin-left: auto;
margin-right: auto;
}
.section__allianz .additional__content {
margin: 3rem auto;
max-width: 1140px;
}
.section__allianz .additional__content ul {
-moz-column-count: 2;
column-count: 2;
-moz-column-gap: 80px;
column-gap: 80px;
list-style-type: none;
margin: 0;
padding: 0;
counter-reset: section;
}
@media only screen and (max-width: 840px) {
.section__allianz .additional__content ul {
-moz-column-count: 1;
column-count: 1;
-moz-column-gap: 0;
column-gap: 0;
border-top: 1px solid #FFFFFF;
}
}
.section__allianz .additional__content ul li {
list-style-type: none;
margin: 0;
padding: 10px 0 6px 36px;
text-align: left;
display: block;
border-bottom: 1px solid #FFFFFF;
position: relative;
counter-increment: section;
transition: background-color 400ms ease-out, color 400ms ease-out;
}
.section__allianz .additional__content ul li:hover {
background-color: #55B9D5;
color: #2d367f;
}
.section__allianz .additional__content ul li:hover:before {
color: #2d367f;
}
.section__allianz .additional__content ul li:nth-child(1):after, .section__allianz .additional__content ul li:nth-child(6):after {
content: "";
display: block;
font-size: 0;
line-height: 0;
width: 100%;
height: 1px;
background-color: #FFFFFF;
position: absolute;
left: 0;
top: 0;
}
@media only screen and (max-width: 840px) {
.section__allianz .additional__content ul li:nth-child(1):after, .section__allianz .additional__content ul li:nth-child(6):after {
display: none;
}
}
.section__allianz .additional__content ul li:before {
content: counter(section) ".";
position: absolute;
padding-left: 10px;
padding-right: 10px;
color: #55B9D5;
transition: color 400ms ease-out;
left: 0;
}
.section__invisalign {
position: relative;
background-color: #f5f5f0;
overflow: hidden;
}
.section__invisalign .visual__element {
content: "";
display: block;
position: absolute;
width: 70vw;
height: 90vw;
left: 0;
z-index: 1;
transform: translateX(-45%) translateY(-10%);
top: 0;
background-image: url("data:image/svg+xml;utf8,");
background-size: 100% 100%;
}
@media only screen and (max-width: 840px) {
.section__invisalign .visual__element {
display: none;
}
}
.section__invisalign .innerwrapper {
display: flex;
padding-top: 10vw;
color: #2d367f;
align-items: center;
padding-bottom: 6vw;
max-width: 1140px;
margin-left: auto;
margin-right: auto;
justify-content: space-between;
position: relative;
z-index: 9;
}
@media only screen and (max-width: 840px) {
.section__invisalign .innerwrapper {
flex-wrap: wrap;
}
}
.section__invisalign .innerwrapper h2 {
margin-bottom: 0.2em;
}
.section__invisalign .innerwrapper .column {
width: calc(50% - 40px);
}
@media only screen and (max-width: 840px) {
.section__invisalign .innerwrapper .column {
width: 100%;
}
}
.section__invisalign .innerwrapper .column:nth-child(2) {
background-color: #f5f5f0;
}
.section__invisalign .innerwrapper .column img {
width: 100%;
height: auto;
mix-blend-mode: multiply;
position: relative;
}
@media only screen and (max-width: 840px) {
.section__invisalign .innerwrapper .column img {
max-width: 480px;
}
}
.section__invisalign .wave {
position: absolute;
top: -1px;
left: 0;
width: 100%;
z-index: 99;
}
.section__invisalign .wave svg {
width: 100%;
height: auto;
}
.section__behandlung {
background-color: #f5f5f0;
color: #2d367f;
position: relative;
overflow: hidden;
}
.section__behandlung .innerwrapper {
position: relative;
z-index: 9;
}
.section__behandlung .visual__element {
content: "";
display: block;
position: absolute;
width: 75vw;
height: 75vw;
left: 0;
border-radius: 50%;
z-index: 1;
transform: translateX(-45%) translateY(-40%);
top: 0;
background-size: 100% 100%;
background-image: url("data:image/svg+xml;utf8,");
}
.section__behandlung:after {
content: "";
display: block;
position: absolute;
width: 40vw;
height: 40vw;
right: 0;
border-radius: 50%;
z-index: 1;
transform: translateX(65%) translateY(-50%);
top: 0;
background-size: 100% 100%;
background-image: url("data:image/svg+xml;utf8,");
}
.section__behandlung .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
z-index: 9;
}
.section__behandlung .column__wrapper {
margin-top: 3rem;
}
.section__behandlung p {
max-width: 720px;
margin-left: auto;
margin-right: auto;
}
.section__behandlung .innerwrapper {
padding-bottom: calc(7% + 75px);
padding-top: 7%;
}
@media only screen and (max-width: 840px) {
.section__behandlung .innerwrapper {
padding-top: 15%;
padding-bottom: 130px;
}
}
.section__behandlung h2 {
max-width: 900px;
margin-left: auto;
margin-right: auto;
}
.phone__button__footer {
display: block;
width: 100%;
margin-top: auto;
margin-bottom: 12px;
width: 100%;
border-radius: 24px;
background-color: #e9d9cc;
height: 46px;
line-height: 48px;
color: #2d367f;
font-size: 1.333rem;
text-align: center;
text-decoration: none;
display: block;
margin-left: auto;
margin-right: auto;
}
.footer__bottom {
background-color: #2d367f;
color: #FFFFFF;
}
.footer__bottom .innerwrapper {
height: 90px;
display: flex;
font-size: 15px;
align-items: center;
}
@media only screen and (max-width: 880px) {
.footer__bottom .innerwrapper {
flex-wrap: wrap;
height: auto;
padding-top: 20px;
padding-bottom: 20px;
}
}
.footer__bottom .innerwrapper .social {
display: flex;
}
@media only screen and (max-width: 480px) {
.footer__bottom .innerwrapper .social {
width: 100%;
justify-content: center;
padding-bottom: 20px;
}
}
.footer__bottom .innerwrapper .social a {
margin: 0 12px;
}
.footer__bottom .innerwrapper .social a:first-child {
margin-left: 0;
}
.footer__bottom .innerwrapper .social a:last-child {
margin-right: 0;
}
.footer__bottom .innerwrapper .social svg {
height: 1.5rem;
width: auto;
}
.footer__bottom .innerwrapper .generic {
flex: 1;
list-style-type: none;
padding: 0;
justify-content: flex-start;
display: flex;
}
@media only screen and (max-width: 880px) {
.footer__bottom .innerwrapper .generic {
justify-content: flex-end;
}
}
@media only screen and (max-width: 480px) {
.footer__bottom .innerwrapper .generic {
width: 100%;
flex: none;
justify-content: center;
}
}
.footer__bottom .innerwrapper .generic li {
list-style-type: none;
margin: 0;
padding: 0 20px;
}
@media only screen and (max-width: 880px) {
.footer__bottom .innerwrapper .generic li {
padding: 0 0 0 30px;
}
}
@media only screen and (max-width: 480px) {
.footer__bottom .innerwrapper .generic li {
padding: 0 20px;
}
}
.footer__bottom .innerwrapper .generic li a {
color: inherit;
text-decoration: none;
}
.footer__bottom .innerwrapper .generic li a:hover {
text-decoration: underline;
}
.footer__bottom .innerwrapper .copy {
text-align: right;
}
@media only screen and (max-width: 880px) {
.footer__bottom .innerwrapper .copy {
width: 100%;
text-align: center;
padding: 20px 0;
}
}
footer {
background-color: #2d367f;
}
footer .abensberg__contact {
margin: 0 auto;
text-align: left;
font-size: 1.333rem;
color: #FFFFFF;
max-width: 23em;
line-height: 1.2;
}
footer .abensberg__contact p:first-child {
margin-top: 0;
}
footer .abensberg__contact strong {
color: #55B9D5;
font-size: 0.85em;
font-weight: 400;
}
footer .innerwrapper {
display: flex;
justify-content: space-between;
padding-top: 5%;
padding-bottom: 5%;
flex-wrap: wrap;
}
footer .innerwrapper h3 {
color: #55B9D5;
text-align: left;
margin-top: 0;
margin-bottom: 0;
}
footer .innerwrapper .small__column {
width: 50%;
font-size: 0.833rem;
color: #f5f5f0;
text-align: left;
line-height: 1.4;
}
footer .innerwrapper .small__column img {
width: calc(100% + 30px);
height: auto;
}
footer .innerwrapper .small__column p {
padding-right: 30px;
}
footer .innerwrapper .small__column a {
color: inherit;
text-decoration: none;
}
@media only screen and (max-width: 1040px) {
footer .innerwrapper .small__column {
width: 100%;
margin: 1.5rem 0;
font-size: 1rem;
}
footer .innerwrapper .small__column p {
padding-right: 0;
}
}
footer .innerwrapper .small__column h3 + p {
margin-top: 0;
}
footer .innerwrapper .small__column h3 {
position: relative;
padding-bottom: 6px;
margin-bottom: 0.5em;
}
footer .innerwrapper .small__column h3:before {
content: "";
display: block;
width: 50px;
height: 1px;
font-size: 0;
line-height: 0;
background-color: #55B9D5;
position: absolute;
left: 0;
bottom: 0;
}
footer .innerwrapper .small__column table {
width: 100%;
border-spacing: 0;
}
footer .innerwrapper .small__column table td:first-child {
width: 45px;
}
footer .innerwrapper .small__column table td {
vertical-align: top;
padding: 0;
}
footer .innerwrapper .column {
width: calc(50% - 50px);
}
@media only screen and (max-width: 1040px) {
footer .innerwrapper .column {
width: calc(50% - 25px);
}
}
@media only screen and (max-width: 840px) {
footer .innerwrapper .column {
width: 100%;
margin: 2rem 0;
}
}
footer .innerwrapper .column.small__column__wrapper {
display: flex;
margin-top: 3rem;
}
@media only screen and (max-width: 1040px) {
footer .innerwrapper .column.small__column__wrapper {
flex-wrap: wrap;
margin-top: 1rem;
}
}
@media only screen and (max-width: 840px) {
footer .innerwrapper .column.small__column__wrapper {
margin-bottom: 0;
margin-top: 0;
}
}
footer .innerwrapper .column.profile__column {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: flex-start;
}
footer .innerwrapper .column.profile__column h3 {
padding-left: 25px;
flex: 1;
}
footer .innerwrapper .column.profile__column ul {
width: 100%;
display: flex;
-moz-column-count: 2;
column-count: 2;
color: #f5f5f0;
font-size: 0.833rem;
flex-wrap: wrap;
justify-content: flex-start;
padding-left: 15px;
}
footer .innerwrapper .column.profile__column ul li {
width: 50%;
text-align: left;
margin: 0.3rem 0;
}
@media only screen and (max-width: 480px) {
footer .innerwrapper .column.profile__column ul li {
width: 100%;
}
}
footer .innerwrapper .column.profile__column .profile {
width: 80px;
height: 80px;
position: relative;
border-radius: 50%;
overflow: hidden;
}
footer .innerwrapper .column.profile__column .profile img {
position: absolute;
width: 100%;
height: auto;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.footer__form div.wpcf7-response-output {
margin-top: 1em;
font-size: 0.833rem;
color: #f5f5f0;
text-align: left;
margin-left: 0;
margin-right: 0;
}
.footer__form__wrapper {
display: flex;
width: 100%;
flex-wrap: wrap;
justify-content: space-between;
}
.footer__form__wrapper p {
width: calc(50% - 10px);
margin: 0;
}
@media only screen and (max-width: 480px) {
.footer__form__wrapper p {
width: 100%;
}
}
.footer__form__wrapper input[type=submit],
.footer__form__wrapper button {
background-color: #e9d9cc;
display: block;
width: 100%;
margin-top: 9px;
margin-bottom: 0;
color: #2d367f;
}
@media only screen and (max-width: 480px) {
.footer__form__wrapper input[type=submit],
.footer__form__wrapper button {
width: 100%;
}
}
.footer__form__wrapper .single__form-line {
width: calc(50% - 10px);
margin: 8px 0;
}
.footer__form__wrapper .single__form-line > p {
width: 100%;
}
@media only screen and (max-width: 480px) {
.footer__form__wrapper .single__form-line {
width: 100%;
}
}
.footer__form__wrapper .single__form-line .edd-body {
background-color: transparent;
}
.footer__form__wrapper .single__form-line .edd-arrow {
right: 3px;
}
.footer__form__wrapper .single__form-line .edd-arrow::before {
border-right: 1px solid #f5f5f0;
border-bottom: 1px solid #f5f5f0;
}
@media only screen and (max-width: 620px) {
.footer__form__wrapper .single__form-line .edd-arrow::before {
border-right: 3px solid #f5f5f0;
border-bottom: 3px solid #f5f5f0;
}
}
.footer__form__wrapper .single__form-line .edd-root {
color: #f5f5f0;
}
.footer__form__wrapper .single__form-line .edd-option, .footer__form__wrapper .single__form-line .edd-value {
background-color: #2d367f;
padding-left: 0;
border-bottom: 1px solid #FFFFFF;
padding-right: 30px;
}
.footer__form__wrapper .single__form-line .edd-option:hover, .footer__form__wrapper .single__form-line .edd-value:hover {
color: #f5f5f0 !important;
}
.footer__form__wrapper .single__form-line .edd-option {
border-top: 0;
background-color: #e9d9cc !important;
border-bottom: 1px solid #2d367f;
padding-left: 10px;
padding-right: 10px;
color: #2d367f !important;
}
.footer__form__wrapper .single__form-line .edd-option:hover {
color: #2d367f !important;
background-color: #55B9D5 !important;
}
.footer__form__wrapper .single__form-line input[type=text],
.footer__form__wrapper .single__form-line input[type=email],
.footer__form__wrapper .single__form-line textarea {
padding-left: 0;
padding-right: 0;
background-color: transparent;
border-bottom: 1px solid #f5f5f0;
color: #f5f5f0;
}
.footer__form__wrapper .single__form-line input[type=text].wpcf7-not-valid,
.footer__form__wrapper .single__form-line input[type=email].wpcf7-not-valid,
.footer__form__wrapper .single__form-line textarea.wpcf7-not-valid {
border: 1px solid transparent;
border-bottom: 1px solid red;
}
.footer__form__wrapper .single__form-line input[type=text]::-moz-placeholder, .footer__form__wrapper .single__form-line input[type=email]::-moz-placeholder, .footer__form__wrapper .single__form-line textarea::-moz-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: #f5f5f0;
opacity: 1; /* Firefox */
}
.footer__form__wrapper .single__form-line input[type=text]::placeholder,
.footer__form__wrapper .single__form-line input[type=email]::placeholder,
.footer__form__wrapper .single__form-line textarea::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: #f5f5f0;
opacity: 1; /* Firefox */
}
.footer__form__wrapper .single__form-line input[type=text]:-ms-input-placeholder,
.footer__form__wrapper .single__form-line input[type=email]:-ms-input-placeholder,
.footer__form__wrapper .single__form-line textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #f5f5f0;
}
.footer__form__wrapper .single__form-line input[type=text]::-ms-input-placeholder,
.footer__form__wrapper .single__form-line input[type=email]::-ms-input-placeholder,
.footer__form__wrapper .single__form-line textarea::-ms-input-placeholder { /* Microsoft Edge */
color: #f5f5f0;
}
/*! Flickity v2.2.0
https://flickity.metafizzy.co
---------------------------------------------- */
.flickity-enabled {
position: relative;
}
.flickity-enabled:focus {
outline: none;
}
.flickity-viewport {
overflow: hidden;
position: relative;
height: 100%;
}
.flickity-slider {
position: absolute;
width: 100%;
height: 100%;
}
/* draggable */
.flickity-enabled.is-draggable {
-webkit-tap-highlight-color: transparent;
tap-highlight-color: transparent;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.flickity-enabled.is-draggable .flickity-viewport {
cursor: move;
cursor: grab;
}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
cursor: grabbing;
}
/* ---- previous/next buttons ---- */
.flickity-prev-next-button {
top: 50%;
/* vertically center */
transform: translateY(-50%);
background-size: 100% 100%;
background-color: transparent !important;
position: absolute;
border: 0;
width: calc(7.7272727273vw + 1 * -16.3636363636px);
height: calc(7.7272727273vw + 1 * -16.3636363636px);
cursor: pointer;
padding: 0;
}
@media (min-width: 1480px) {
.flickity-prev-next-button {
width: 98px;
height: 98px;
}
}
@media (max-width: 600px) {
.flickity-prev-next-button {
width: 30px;
height: 30px;
}
}
.flickity-prev-next-button svg {
display: none;
}
.flickity-prev-next-button.previous {
left: 5%;
background-image: url(../images/arrow__prev.svg);
}
.flickity-prev-next-button.next {
right: 5%;
background-image: url(../images/arrow__next.svg);
}
/* ---- page dots ---- */
.flickity-page-dots {
position: absolute;
width: 100%;
bottom: -25px;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
line-height: 1;
}
.flickity-rtl .flickity-page-dots {
direction: rtl;
}
.flickity-page-dots .dot {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 8px;
background: #333;
border-radius: 50%;
opacity: 0.25;
cursor: pointer;
}
.flickity-page-dots .dot.is-selected {
opacity: 1;
}
.section__slider {
width: 100%;
}
.section__slider .single__slide {
font-size: 0;
line-height: 0;
width: 100%;
}
.section__slider .single__slide img {
width: 100%;
height: auto;
}
.edd-root,
.edd-root *,
.edd-root *::before,
.edd-root *::after {
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.edd-root {
display: inline-block;
position: relative;
width: 100%;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
font-family: "BryantWeb";
font-weight: 300;
font-size: 14px;
color: #2d367f;
margin: 0;
}
.edd-root-disabled {
color: #ccc;
cursor: not-allowed;
}
.edd-head {
position: relative;
overflow: hidden;
}
.edd-option,
.edd-value {
height: 44px;
background-color: #f5f5f0;
font-size: 0.8333rem;
line-height: 32px;
padding: 7px 50px 5px 15px;
font-family: "BryantWeb";
text-align: left;
font-weight: 400;
}
.edd-option {
height: auto;
line-height: 1.3;
white-space: normal !important;
}
.edd-option {
padding-right: 20px;
border-top: 1px solid #e9d9cc;
}
.edd-value {
width: 100%;
display: inline-block;
vertical-align: middle;
}
.edd-arrow {
position: absolute;
width: 14px;
height: 14px;
top: calc(50% - 8px);
right: 20px;
transition: transform 150ms;
pointer-events: none;
color: #666;
}
@media only screen and (max-width: 620px) {
.edd-arrow {
transform: scale(0.6);
right: 10px;
}
}
.edd-root-disabled .edd-arrow {
color: #ccc;
}
.edd-arrow::before {
content: "";
position: absolute;
width: 14px;
height: 14px;
border-right: 1px solid #2d367f;
border-bottom: 1px solid #2d367f;
top: 0;
right: 2px;
transform: rotate(45deg);
transform-origin: 75% 50%;
}
@media only screen and (max-width: 620px) {
.edd-arrow::before {
border-right: 3px solid #2d367f;
border-bottom: 3px solid #2d367f;
}
}
.edd-root-open .edd-arrow {
transform: rotate(180deg);
top: calc(50% - 5px);
}
@media only screen and (max-width: 620px) {
.edd-root-open .edd-arrow {
transform: scale(0.6) rotate(180deg);
}
}
.edd-value,
.edd-option,
.edd-group-label {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.edd-root:not(.edd-root-disabled) .edd-value,
.edd-option {
cursor: pointer;
}
.edd-select {
position: absolute;
opacity: 0;
width: 100%;
left: -100%;
top: 0;
}
.edd-root-native .edd-select {
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.edd-body {
opacity: 0;
position: absolute;
left: 0;
right: 0;
pointer-events: none;
overflow: hidden;
z-index: 999;
background: #FFFFFF;
border-top: 0;
text-align: left;
}
.edd-root-open .edd-body {
opacity: 1;
pointer-events: all;
transform: scale(1);
transition: opacity 200ms, transform 100ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.edd-root-open-above .edd-body {
bottom: 100%;
}
.edd-root-open-below .edd-body {
top: 100%;
}
.edd-items-list {
overflow: hidden;
max-height: 0;
transition: max-height 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
-webkit-overflow-scrolling: touch;
}
.edd-items-list::-webkit-scrollbar {
display: none;
}
.edd-group-label {
font-size: 13px;
padding: 4px 8px 4px 0;
color: #555;
font-weight: 600;
}
.edd-group-has-label {
padding-left: 22px;
}
.edd-option {
position: relative;
}
.edd-option-selected {
font-weight: 400;
display: none !important;
}
.edd-option-selected::before {
content: "";
position: absolute;
width: 8px;
height: 4px;
left: 6px;
top: calc(50% - 4px);
transform: rotate(-45deg);
}
.edd-option-focused:not(.edd-option-disabled) {
color: #2d367f;
}
.edd-option-disabled,
.edd-group-disabled .edd-option {
cursor: default;
color: #ccc;
}
.edd-gradient-top,
.edd-gradient-bottom {
content: "";
position: absolute;
left: 2px;
right: 12px;
height: 32px;
background-repeat: repeat-x;
background-size: 100% 200%;
pointer-events: none;
transition: opacity 100ms;
opacity: 0;
}
.edd-gradient-top {
background-position: bottom;
top: 0;
}
.edd-gradient-bottom {
background-position: top;
bottom: 0;
}
.edd-body-scrollable .edd-gradient-top,
.edd-body-scrollable .edd-gradient-bottom {
opacity: 1;
}
.edd-body-scrollable.edd-body-at-top .edd-gradient-top,
.edd-body-scrollable.edd-body-at-bottom .edd-gradient-bottom {
opacity: 0;
}
div.wpcf7 .ajax-loader {
display: none !important;
}
.fadeout-page {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.6);
z-index: 9997;
opacity: 0;
pointer-events: none;
transition: opacity 300ms ease-out;
}
.fadeout-page.visible {
opacity: 1;
pointer-events: auto;
}
.overlay {
width: 550px;
position: fixed;
left: 0;
top: 0;
padding-left: 60px;
height: 100%;
background-color: #e9d9cc;
z-index: 9998;
pointer-events: none;
transform: translateX(-550px);
transition: transform 300ms ease-out;
overflow-y: auto;
}
@media only screen and (max-width: 1030px) {
.overlay {
width: 100%;
padding-left: 0;
height: calc(100% - 60px);
transform: translateX(0) translateY(130%);
}
}
.overlay .overlay__inner {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
color: #2d367f;
text-align: left;
}
.overlay .overlay__inner h2 {
text-align: left;
margin-bottom: 15px;
font-size: 40px;
}
.overlay .overlay__inner h3 {
font-size: 24px;
line-height: 1.375;
text-align: left;
}
.overlay .overlay__inner h3:not(:first-child) {
margin-top: 60px;
position: relative;
padding-bottom: 6px;
margin-bottom: 0.5em;
}
.overlay .overlay__inner h3:not(:first-child):before {
content: "";
display: block;
width: 50px;
height: 1px;
font-size: 0;
line-height: 0;
background-color: #2d367f;
position: absolute;
left: 0;
bottom: 0;
}
.overlay .overlay__inner .overlay__top {
padding: 90px 90px 30px 90px;
}
@media only screen and (max-width: 1030px) {
.overlay .overlay__inner .overlay__top {
padding: 30px;
}
}
.overlay .overlay__inner .small {
font-size: 0.833rem;
}
.overlay .overlay__inner .overlay__sprechzeiten {
padding-top: 2rem;
padding-bottom: 2rem;
font-size: 20px;
}
.overlay .overlay__inner .overlay__sprechzeiten table tr td {
vertical-align: top;
padding-right: 1rem;
}
.overlay .overlay__inner .overlay__sprechzeiten p {
position: relative;
padding-bottom: 12px;
margin-bottom: 12px;
margin-top: 12px;
}
.overlay .overlay__inner .overlay__sprechzeiten p:not(:last-child):before {
content: "";
display: block;
width: 50px;
height: 1px;
font-size: 0;
line-height: 0;
background-color: #2d367f;
position: absolute;
left: 0;
bottom: 0;
}
.overlay .overlay__inner .overlay__bottom {
flex: 1;
position: relative;
}
.overlay .overlay__inner .overlay__bottom .wave {
position: absolute;
top: -1px;
left: 0;
width: 100%;
z-index: 99;
}
.overlay .overlay__inner .overlay__bottom .wave svg {
width: 100%;
height: auto;
}
.overlay .overlay__inner .overlay__map {
width: 100%;
height: 100%;
}
.overlay.visible {
transform: translateX(0px);
pointer-events: auto;
}
@media only screen and (max-width: 1030px) {
.overlay.visible {
transform: translateY(0px);
}
}
.overlay .close__overlay {
width: 38px;
height: 38px;
position: absolute;
right: 30px;
top: 30px;
cursor: pointer;
font-size: 0;
line-height: 0;
}
@media only screen and (max-width: 1030px) {
.overlay .close__overlay {
top: 15px;
right: 15px;
width: 28px;
height: 28px;
}
}
.overlay .close__overlay img,
.overlay .close__overlay svg {
width: 100%;
height: auto;
}
span.wpcf7-not-valid-tip {
display: none !important;
}
.section__map {
width: 100%;
position: relative;
}
.section__map .map__breaker {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 10;
}
.section__map .pin {
width: 11%;
position: absolute;
left: 50%;
top: 0;
transform: translateX(-50%) translateY(12%);
font-size: 0;
line-height: 0;
z-index: 998;
}
.section__map .pin .read-more {
width: 220px;
border-radius: 24px;
background-color: #55B9D5;
height: 46px;
line-height: 48px;
color: #f5f5f0;
font-size: 1rem;
display: block;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%) translateY(60px);
}
.section__map .pin svg {
width: 100%;
height: auto;
}
.section__map .wave {
position: absolute;
top: -1px;
left: 0;
width: 100%;
z-index: 99;
overflow: hidden;
}
.section__map .wave svg {
width: 104%;
height: auto;
margin-left: -2%;
}
.section__map #map {
width: 100%;
height: 35vw;
}
@media only screen and (max-width: 840px) {
.section__map #map {
height: 45vw;
}
}
@media only screen and (max-width: 600px) {
.section__map #map {
height: 60vw;
}
}
span.wpcf7-list-item {
margin-left: 0 !important;
}
.section__karriere-floater {
background-color: #55B9D5;
color: #2d367f;
margin-bottom: -10%;
}
.section__karriere-floater .innerwrapper {
padding-top: 60px;
padding-bottom: 0;
position: relative;
z-index: 9;
}
.section__karriere-floater .floater__wrapper {
max-width: 760px;
margin: 0 auto;
}
.section__karriere-floater .floater__wrapper .single__floater {
display: flex;
}
@media only screen and (max-width: 600px) {
.section__karriere-floater .floater__wrapper .single__floater {
flex-direction: column;
align-items: center;
padding-bottom: 3em;
}
}
.section__karriere-floater .floater__wrapper .single__floater .image {
font-size: 0;
line-height: 0;
width: 37%;
}
@media only screen and (max-width: 600px) {
.section__karriere-floater .floater__wrapper .single__floater .image {
order: 1 !important;
width: 50%;
}
}
.section__karriere-floater .floater__wrapper .single__floater .image img {
width: 100%;
height: auto;
border-radius: 50%;
}
.section__karriere-floater .floater__wrapper .single__floater .content {
flex: 1;
text-align: left;
padding-left: 4em;
}
@media only screen and (max-width: 600px) {
.section__karriere-floater .floater__wrapper .single__floater .content {
order: 2 !important;
padding-left: 0 !important;
padding-right: 0 !important;
text-align: center;
flex: none;
width: 100%;
}
}
.section__karriere-floater .floater__wrapper .single__floater:nth-child(even) {
align-items: center;
}
.section__karriere-floater .floater__wrapper .single__floater:nth-child(even) .image {
order: 2;
}
.section__karriere-floater .floater__wrapper .single__floater:nth-child(even) .content {
order: 1;
padding-left: 0;
padding-right: 4em;
}
.section__behandlung-top {
padding-top: 100px;
position: relative;
background-color: #f5f5f0;
color: #2d367f;
}
@media only screen and (max-width: 1030px) {
.section__behandlung-top {
padding-top: 0;
}
}
.section__behandlung-top .innerwrapper {
padding-top: 5%;
padding-bottom: calc(3% + 75px);
position: relative;
z-index: 9;
}
@media only screen and (max-width: 840px) {
.section__behandlung-top .innerwrapper {
padding-top: 15%;
}
}
.section__behandlung-top .innerwrapper p {
max-width: 720px;
margin-left: auto;
margin-right: auto;
}
.section__behandlung-top.section__karriere .innerwrapper {
font-size: 1.5em;
padding-bottom: calc(3% + 100px);
}
.section__behandlung-top.section__karriere .innerwrapper h1 {
margin-bottom: 0;
}
.section__behandlung-top.section__karriere .innerwrapper h1 + p {
margin-top: 0;
}
.section__behandlung-top .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.section__behandlung-top .icon__behandlung {
width: 60%;
max-width: 220px;
margin-left: auto;
margin-right: auto;
margin-bottom: 3rem;
}
.section__behandlung-top .icon__behandlung svg {
width: 100%;
height: auto;
}
@media only screen and (max-width: 480px) {
.section__behandlung-top .icon__behandlung svg {
width: 85%;
}
}
.section__behandlung-top .icon__koala {
width: 60%;
max-width: 130px;
margin-left: auto;
margin-right: auto;
margin-bottom: 2rem;
margin-top: 4rem;
}
.section__behandlung-top .icon__koala svg {
width: 100%;
height: auto;
}
@media only screen and (max-width: 480px) {
.section__behandlung-top .icon__koala svg {
width: 85%;
}
}
.section__behandlung-top .circle {
position: absolute;
width: 32vw;
height: 32vw;
right: 0;
top: -18%;
transform: translateY(0%) translateX(55%);
z-index: 4;
background-image: url("data:image/svg+xml;utf8,");
background-size: 100% 100%;
}
@media only screen and (max-width: 1030px) {
.section__behandlung-top .circle {
display: none;
}
}
.section__behandlung-blue {
position: relative;
background-color: #55B9D5;
color: #2d367f;
}
.section__behandlung-blue .innerwrapper {
padding-top: 3%;
padding-bottom: calc(4% + 75px);
position: relative;
z-index: 9;
}
@media only screen and (max-width: 840px) {
.section__behandlung-blue .innerwrapper {
padding-top: 10%;
}
}
.section__behandlung-blue .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.section__behandlung-rose {
position: relative;
background-color: #e9d9cc;
color: #2d367f;
}
.section__behandlung-rose .innerwrapper {
padding-top: 3%;
padding-bottom: calc(4% + 75px);
position: relative;
z-index: 9;
}
@media only screen and (max-width: 840px) {
.section__behandlung-rose .innerwrapper {
padding-top: 10%;
}
}
.section__behandlung-rose .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.image__faq {
width: 27%;
font-size: 0;
line-height: 0;
margin: -1.5rem auto 3.5rem auto;
}
@media only screen and (max-width: 840px) {
.image__faq {
width: 50%;
margin-top: 3rem;
}
}
.image__faq img {
width: 100%;
height: auto;
}
.beratung__image {
font-size: 0;
line-height: 0;
}
@media only screen and (max-width: 920px) {
.beratung__image {
overflow: hidden;
}
}
.beratung__image img {
width: 100%;
height: auto;
}
@media only screen and (max-width: 920px) {
.beratung__image img {
width: 145%;
margin-left: -35%;
}
}
.section__subpage-top {
padding-top: 100px;
position: relative;
background-color: #55B9D5;
color: #2d367f;
}
.section__subpage-top .circle {
position: absolute;
width: 32vw;
height: 32vw;
border-radius: 50%;
border: 10vw solid #e9d9cc;
right: 0;
top: 74%;
transform: translateY(-50%) translateX(55%);
z-index: 4;
}
@media only screen and (max-width: 1030px) {
.section__subpage-top .circle {
display: none;
}
}
.section__subpage-top .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.section__subpage-top h1 {
max-width: 800px;
margin-left: auto;
margin-right: auto;
}
.section__subpage-top .innerwrapper {
padding-top: 8%;
padding-bottom: calc(3% + 75px);
position: relative;
z-index: 9;
}
@media only screen and (max-width: 840px) {
.section__subpage-top .innerwrapper {
padding-top: 15%;
}
}
@media only screen and (max-width: 1030px) {
.section__subpage-top {
padding-top: 0;
}
}
.section__faq-main,
.section__empfehlung-main {
background-color: #f5f5f0;
color: #2d367f;
position: relative;
}
.section__faq-main .wave__start-bottom,
.section__empfehlung-main .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.section__faq-main h3,
.section__empfehlung-main h3 {
font-size: calc(2.2727272727vw + 1 * 16.3636363636px);
font-weight: 400;
line-height: 1.32;
margin-top: 0;
display: block;
text-align: center;
margin-bottom: 0.8em;
}
@media (min-width: 1480px) {
.section__faq-main h3,
.section__empfehlung-main h3 {
font-size: 50px;
}
}
@media (max-width: 600px) {
.section__faq-main h3,
.section__empfehlung-main h3 {
font-size: 30px;
}
}
.section__faq-main .innerwrapper,
.section__empfehlung-main .innerwrapper {
padding-top: 1rem;
padding-bottom: 1rem;
}
.section__faq-main .single__faq,
.section__empfehlung-main .single__faq {
font-size: 1.4rem;
max-width: 1100px;
margin-left: auto;
margin-right: auto;
margin-top: 4%;
margin-bottom: 8%;
}
.section__faq-main .single__faq:after,
.section__empfehlung-main .single__faq:after {
content: "";
display: block;
width: 56%;
height: 3px;
font-size: 0;
line-height: 0;
background-color: #55B9D5;
margin-left: 22%;
margin-top: 8%;
}
.section__faq-main.section__karriere-bottom,
.section__empfehlung-main.section__karriere-bottom {
margin-bottom: -8%;
padding-top: 20%;
}
.section__faq-main.section__karriere-bottom:after,
.section__empfehlung-main.section__karriere-bottom:after {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml;utf8,");
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center top;
z-index: 0;
}
.section__faq-main.section__karriere-bottom .innerwrapper,
.section__empfehlung-main.section__karriere-bottom .innerwrapper {
position: relative;
z-index: 3;
}
.section__faq-main.section__karriere-bottom .innerwrapper h4,
.section__empfehlung-main.section__karriere-bottom .innerwrapper h4 {
font-size: 1.666em;
font-weight: 500;
}
.section__faq-main.section__karriere-bottom .innerwrapper .read-more,
.section__empfehlung-main.section__karriere-bottom .innerwrapper .read-more {
background-color: #2d367f;
color: #f5f5f0;
margin-top: 0.5em;
margin-bottom: 1.5em;
}
.section__faq-main.section__karriere-bottom .faq__form,
.section__empfehlung-main.section__karriere-bottom .faq__form {
padding-top: 5%;
margin-top: 5em;
}
@media (max-width: 600px) {
.page-template-page_empfehlung-php .section__subpage-top h1 {
-webkit-hyphens: auto;
hyphens: auto;
font-size: 36px;
}
.page-template-page_empfehlung-php .section__subpage-top h1 br {
display: none;
}
}
.section__empfehlung-main .innerwrapper {
padding-top: 2em;
padding-bottom: calc(7% + 75px);
}
.empfehlung_main_inner {
max-width: 880px;
margin: 0 auto;
font-size: 1.4rem;
}
.empfehlung_button_wrapper {
display: flex;
justify-content: center;
margin-top: 3rem;
}
@media (max-width: 600px) {
.empfehlung_button_wrapper {
flex-direction: column;
margin-top: 2rem;
margin-bottom: 2rem;
}
}
.empfehlung_button_wrapper .button-hover {
margin-left: 1rem;
margin-right: 1rem;
}
@media (max-width: 600px) {
.empfehlung_button_wrapper .button-hover {
margin: 0.5rem 0;
}
}
.section__subpage-main {
background-color: #f5f5f0;
color: #2d367f;
position: relative;
}
.section__subpage-main a {
color: inherit;
}
.section__subpage-main a:hover {
text-decoration: none;
}
.section__subpage-main .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.section__subpage-main h3 {
font-size: calc(2.2727272727vw + 1 * 16.3636363636px);
font-weight: 400;
line-height: 1.32;
margin-top: 0;
display: block;
text-align: center;
margin-bottom: -0.2em;
margin-top: 1em;
}
@media (min-width: 1480px) {
.section__subpage-main h3 {
font-size: 50px;
}
}
@media (max-width: 600px) {
.section__subpage-main h3 {
font-size: 30px;
}
}
.section__subpage-main .innerwrapper {
padding-top: 3%;
padding-bottom: calc(5% + 80px);
}
.faq__form {
width: 100%;
background-color: #e9d9cc;
border-radius: 50%;
padding: 10% 10% 2% 10%;
position: relative;
z-index: 9;
}
.faq__form h3 {
font-size: 1.666em;
margin-bottom: 0.5em;
}
@media only screen and (max-width: 840px) {
.faq__form {
border-radius: 50px;
padding: 30px;
}
}
.faq__form textarea {
height: 156px;
resize: none;
}
.faq__form .column__wrapper {
display: flex;
justify-content: space-between;
}
@media only screen and (max-width: 840px) {
.faq__form .column__wrapper {
flex-wrap: wrap;
}
}
.faq__form .column__wrapper .column {
width: calc(50% - 13px);
margin: 0;
}
@media only screen and (max-width: 840px) {
.faq__form .column__wrapper .column {
width: 100%;
margin: 0;
}
.faq__form .column__wrapper .column:last-child .single__form-line {
margin-top: 0;
}
}
.section__clouds {
position: relative;
margin-top: -17%;
}
@media only screen and (max-width: 920px) {
.section__clouds {
margin-top: -31%;
}
}
.section__clouds .round__image {
overflow: hidden;
font-size: 0;
line-height: 0;
width: 50%;
position: absolute;
z-index: 9;
}
@media only screen and (max-width: 920px) {
.section__clouds .round__image {
width: 42%;
}
}
@media only screen and (max-width: 670px) {
.section__clouds .round__image {
width: 35%;
}
}
.section__clouds .round__image.round__image01 {
top: -60%;
left: -5%;
}
@media only screen and (max-width: 920px) {
.section__clouds .round__image.round__image01 {
top: -15%;
left: -36%;
}
}
@media only screen and (max-width: 670px) {
.section__clouds .round__image.round__image01 {
top: -9%;
left: -3%;
}
}
.section__clouds .round__image.round__image02 {
top: -52%;
right: -5%;
}
@media only screen and (max-width: 920px) {
.section__clouds .round__image.round__image02 {
top: -10%;
right: -35%;
}
}
@media only screen and (max-width: 670px) {
.section__clouds .round__image.round__image02 {
top: -7%;
right: -3%;
}
}
.section__clouds .round__image img {
width: 100%;
height: auto;
border-radius: 50%;
}
.section__clouds .sc__background {
position: absolute;
z-index: -1;
left: 0;
right: 0;
height: 50%;
bottom: 0;
background-color: #f5f5f0;
}
.section__clouds .wave__start-bottom {
width: 100%;
position: absolute;
left: 0;
bottom: -1px;
height: 150px;
}
.section__clouds:before {
content: "";
display: block;
position: absolute;
left: 0;
top: 5%;
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml;utf8,");
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center top;
z-index: 0;
}
.section__clouds:after {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 18%;
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml;utf8,");
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center bottom;
z-index: 0;
}
@media only screen and (max-width: 920px) {
.section__clouds:after {
bottom: 13%;
}
}
.section__clouds .innerwrapper {
color: #f5f5f0;
padding-bottom: calc(3% + 150px);
}
@media only screen and (max-width: 480px) {
.section__clouds .innerwrapper {
padding-bottom: calc(3% + 130px);
}
}
.section__clouds .second__bg {
position: absolute;
width: 100%;
height: 66%;
left: 0;
top: 10%;
z-index: 1;
background-color: #55B9D5;
}
@media only screen and (max-width: 920px) {
.section__clouds .second__bg {
top: 8%;
height: 77%;
}
}
.section__clouds .wave__start-bottom {
z-index: 7;
}
.cloud-column__wrapper {
width: 100%;
padding-top: 5%;
counter-reset: clouds;
}
.cloud-column__wrapper .koala__waving {
width: 50%;
margin-left: 0;
margin-right: auto;
position: relative;
z-index: 12;
margin-top: -20%;
text-align: left;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .koala__waving {
margin-left: auto;
margin-right: auto;
margin-top: 40%;
text-align: center;
width: 80%;
}
}
.cloud-column__wrapper .koala__waving img {
opacity: 0;
pointer-events: none;
}
.cloud-column__wrapper .koala__waving .koala__waving--holder {
width: 68%;
max-width: 360px;
height: auto;
position: relative;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .koala__waving .koala__waving--holder {
transform: translateX(35%);
}
}
.cloud-column__wrapper .koala__waving .koala__waving--holder img {
width: 100%;
height: auto;
}
.cloud-column__wrapper .koala__waving #lottie {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
.cloud-column__wrapper .koala__waving #lottie svg {
width: 189% !important;
height: auto !important;
transform: translate(-27%, -25%) !important;
pointer-events: none;
}
.cloud-column__wrapper .column {
text-align: center;
padding: 2.5rem 0;
position: relative;
z-index: 2;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column {
text-align: center;
padding-left: 0;
max-width: 400px;
}
}
@media only screen and (max-width: 670px) {
.cloud-column__wrapper .column {
padding-top: 3rem;
padding-bottom: 3rem;
}
}
@media only screen and (max-width: 480px) {
.cloud-column__wrapper .column p {
width: 90%;
display: block;
margin-left: auto;
margin-right: auto;
}
}
.cloud-column__wrapper .column h2 {
color: #f5f5f0;
position: relative;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column h2 {
text-align: center;
}
}
.cloud-column__wrapper .column h2:before {
counter-increment: clouds;
content: counter(clouds);
display: block;
text-align: center;
font-size: 8rem;
color: #2d367f;
text-stroke: 2px #f5f5f0;
-webkit-text-stroke: 2px #f5f5f0;
}
.cloud-column__wrapper .column .column__inner {
position: relative;
z-index: 2;
max-width: 470px;
margin: 0 auto;
}
.cloud-column__wrapper .column:nth-child(even) {
width: 50%;
margin-left: 50%;
margin-right: auto;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column:nth-child(even) {
width: 100%;
margin-left: auto;
margin-right: auto;
}
}
.cloud-column__wrapper .column:nth-child(odd) {
width: 50%;
margin-right: 50%;
margin-left: auto;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column:nth-child(odd) {
width: 100%;
margin-left: auto;
margin-right: auto;
}
}
.cloud-column__wrapper .column:nth-child(1) {
z-index: 3;
}
.cloud-column__wrapper .column:nth-child(1):after {
content: "";
display: block;
position: absolute;
width: 280%;
height: 164%;
background-image: url("data:image/svg+xml;utf8,");
background-size: 100% 100%;
left: 50%;
top: 50%;
transform: translate(-63%, -42%);
z-index: 1;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column:nth-child(1):after {
width: 170%;
height: 120%;
transform: translate(-50%, -46%);
}
}
@media only screen and (max-width: 480px) {
.cloud-column__wrapper .column:nth-child(1):after {
width: 150%;
height: 120%;
}
}
.cloud-column__wrapper .column:nth-child(2):after {
content: "";
display: block;
position: absolute;
width: 150%;
height: 150%;
background-image: url("data:image/svg+xml;utf8,");
background-size: 100% 100%;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column:nth-child(2):after {
width: 190%;
height: 116%;
transform: translate(-50%, -50%);
}
}
@media only screen and (max-width: 480px) {
.cloud-column__wrapper .column:nth-child(2):after {
width: 170%;
height: 110%;
transform: translate(-48%, -50%);
}
}
.cloud-column__wrapper .column:nth-child(3) {
margin-top: -10%;
z-index: 9;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column:nth-child(3) {
margin-top: 0;
z-index: 2;
}
}
.cloud-column__wrapper .column:nth-child(3):after {
content: "";
display: block;
position: absolute;
width: 140%;
height: 140%;
background-image: url("data:image/svg+xml;utf8,");
background-size: 100% 100%;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column:nth-child(3):after {
width: 190%;
height: 126%;
transform: translate(-50%, -50%);
}
}
@media only screen and (max-width: 480px) {
.cloud-column__wrapper .column:nth-child(3):after {
width: 170%;
height: 110%;
}
}
.cloud-column__wrapper .column:nth-child(4) {
margin-top: 0;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column:nth-child(4) {
margin-top: 0;
}
}
.cloud-column__wrapper .column:nth-child(4):after {
content: "";
display: block;
position: absolute;
width: 150%;
height: 150%;
background-image: url("data:image/svg+xml;utf8,");
background-size: 100% 100%;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
@media only screen and (max-width: 920px) {
.cloud-column__wrapper .column:nth-child(4):after {
width: 190%;
height: 135%;
transform: translate(-50%, -45%);
}
}
@media only screen and (max-width: 480px) {
.cloud-column__wrapper .column:nth-child(4):after {
height: 110%;
transform: translate(-50%, -50%);
}
}
.BorlabsCookie ._brlbs-content-blocker {
font-size: 0;
line-height: 0;
}
.BorlabsCookie ._brlbs-content-blocker ._brlbs-embed {
margin-bottom: 0;
font-size: 1rem;
line-height: 1.2;
width: 100%;
}
.BorlabsCookie ._brlbs-content-blocker ._brlbs-embed ._brlbs-thumbnail {
display: block;
max-width: 100%;
width: 100%;
max-width: none;
-o-object-fit: cover;
object-fit: cover;
height: 30rem;
}