@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Montserrat Regular'), local(Montserrat-Regular), url(https://www.zahnarzt-drseidel.de/upload/theme/montserrat-v14-latin-regular.woff2) format("woff2"), url(https://www.zahnarzt-drseidel.de/upload/theme/montserrat-v14-latin-regular.woff) format("woff")
}

@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local('Montserrat Medium'), local(Montserrat-Medium), url(https://www.zahnarzt-drseidel.de/upload/theme/montserrat-v14-latin-500.woff2) format("woff2"), url(https://www.zahnarzt-drseidel.de/upload/theme/montserrat-v14-latin-500.woff) format("woff")
}

@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: local('Montserrat SemiBold'), local(Montserrat-SemiBold), url(https://www.zahnarzt-drseidel.de/upload/theme/montserrat-v14-latin-600.woff2) format("woff2"), url(https://www.zahnarzt-drseidel.de/upload/theme/montserrat-v14-latin-600.woff) format("woff")
}

@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Montserrat Bold'), local(Montserrat-Bold), url(https://www.zahnarzt-drseidel.de/upload/theme/montserrat-v14-latin-700.woff2) format("woff2"), url(https://www.zahnarzt-drseidel.de/upload/theme/montserrat-v14-latin-700.woff) format("woff")
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
.h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

body,
html {
    scroll-behavior: smooth
}

body {
    line-height: 1
}

a[name] {
    display: block!important;
    height: 20px!important;
    width: 20px!important;
    position: relative!important;
    top: -80px!important;
    visibility: hidden
}

ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

:root {
    --black: #000;
    --red: #C70000;
    --white: #fff;
    --lightblue: #F0F8FE;
    --darkgray: #444;
    --blue: #0720C2;
}

body {
    font-family: 'Montserrat';
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    background: var(--white);
    /* color: var(--black); */
}

.innerwidth {
    width: 90%;
    max-width: 1400px;
    margin: 0 auto
}

h1 {
    text-transform: none;
    font-weight: 700;
    font-size: 3.6em;
    line-height: 1;
}

h2,
h3,
.h3,
h4,
h5,
h6 {
    text-transform: none;
    font-weight: 700;
    font-size: 1.6em;
    line-height: 1.4;
    margin-bottom: 20px;
}

.hero-small+section {
    padding-top: 100px
}

hr {
    border: 0;
    border-top: 1px solid var(--lightblue)
}

p {
    margin-bottom: 30px
}

b,
strong {
    font-weight: 700
}

a {
    color: var(--red);
    transition: .3s;
    text-decoration: underline;
    font-weight: 500
}

a:hover {
    color: var(--black)
}

a.newslink {
    text-decoration: none
}

section.content ul,
section.content ol {
    margin: 0 0 30px 25px
}

section.content ul {
    list-style-type: disc
}

a.button,
a.phonecontent,
a.phonecontent:hover {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 2px solid var(--red);
    text-transform: none;
    height: 50px;
    line-height: 50px;
    padding: 0 60px;
    font-size: 1em;
    font-family: inherit;
    font-weight: 700;
    border-radius: 100px;
    color: var(--red);
    cursor: pointer;
    background: transparent;
    transition: .3s;
    display: inline-block;
    text-decoration: none
}

.button:hover {
    color: var(--white);
    background: var(--black);
    border: 2px solid var(--black)
}

@media (max-width:1112px) {
    .hero-small+section {
        padding-top: 60px
    }
}

header {
    background: var(--white);
    height: 120px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9989;
    transition: .25s
}

header+article {
    margin-top: 120px
}

body.shrinked-header header {
    height: 80px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2)
}

header>.innerwidth {
    max-width: 95%;
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

a.logo {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/logo-dr-seidel.svg) no-repeat left center;
    width: 185px;
    height: 44px;
    display: block;
    text-indent: -9999px
}

body.frontpage header {
    background: transparent;
    top: 50px;
}

body.frontpage.shrinked-header header {
    background: var(--white);
    top: 0;
}

body.frontpage header+article {
    margin-top: 0
}

@media (max-width:1460px) {
    a.logo {
        width: 120px
    }
}

@media (max-width:1280px) {
    a.logo {
        width: 185px
    }
}

@media (max-width:1112px) {
    header {
        height: 80px
    }
    header+article {
        margin-top: 80px
    }
}

@media (max-width:414px) {
    body.frontpage header {
        top: 75px;
    }
}

nav.main ul {
    display: flex;
    flex-direction: row
}

nav.main ul>li {
    position: relative
}

nav.main ul>li>a {
    margin-left: 30px;
    line-height: 44px;
    display: block;
    text-transform: none;
    text-decoration: none;
    color: var(--black);
    font-size: .98em;
    font-weight: 500
}

nav.main ul>li>a:hover {
    color: var(--red)
}

nav.main ul>li>ul {
    display: none;
    background: var(--white);
    position: absolute;
    padding: 0 40px 15px 0;
    z-index: 10
}

nav.main ul>li>ul>li>a {
    line-height: 32px
}

nav.main ul>li:hover>ul {
    display: block;
    position: absolute;
    top: 44px;
    left: 0
}

nav.main ul>li.menue08>ul {
    left: inherit;
    right: 0;
    text-align: right;
    padding: 0 15px 0 0
}

@media (max-width: 1820px) {
    nav.main ul>li>a {
        font-size: .9em
    }
}

@media (max-width: 1720px) {
    nav.main ul>li>a {
        font-size: .83em
    }
}

@media (max-width:1620px) {
    nav.main ul>li>a {
        font-size: .7em;
        margin-left: 20px
    }
}

@media (max-width: 1550px) {
    nav.main ul>li>a {
        font-size: .8em
    }
}

@media (max-width: 1490px) {
    nav.main ul>li>a {
        font-size: .78em
    }
}

@media (max-width: 1400px) {
    header>.innerwidth {
        width: 95%;
        max-width: 95%
    }
    footer>.innerwidth {
        width: 95%;
        max-width: 95%
    }
    nav.main ul>li>a {
        font-size: .78em;
        margin-left: 13px
    }
}

@media (max-width: 1320px) {
    nav.main ul>li>a {
        font-size: .75em
    }
}

@media (max-width:1280px) {
    nav.main ul {
        display: none
    }
    .menu-toggle {
        display: block;
        width: 40px;
        height: 40px;
        position: fixed;
      /*  top: 20px; */
        right: 2.5%
    }
    .menu-toggle span,
    .menu-toggle span:before,
    .menu-toggle span:after {
        background: var(--black);
        display: block;
        width: 35px;
        height: 3px;
        position: absolute;
        top: 19px;
        left: 0;
        transition: .3s
    }
    .menu-toggle span:before {
        content: "";
        top: -9px
    }
    .menu-toggle span:after {
        content: "";
        top: 9px
    }
    body.menu-active .menu-toggle span {
        height: 0;
        top: 20px;
        background: var(--white)
    }
    body.menu-active .menu-toggle span:before {
        top: 0;
        transform: rotate(45deg);
        background: var(--white)
    }
    body.menu-active .menu-toggle span:after {
        top: 0;
        transform: rotate(-45deg);
        background: var(--white)
    }
    body.menu-active {
        height: 100vh;
        overflow: hidden
    }
    body.menu-active nav.main {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        background: rgba(0, 0, 0, 0.9)
    }
    body.menu-active nav.main>ul,
    body.menu-active nav.main>ul>li>ul {
        position: relative;
        width: calc(100% - 60px);
        padding-top: 100px
    }
    body.menu-active nav.main>ul {
        display: block
    }
    nav.main ul>li:hover>ul {
        display: none
    }
    body.menu-active nav.main ul a {
        color: var(--white)
    }
    body.menu-active nav.main>ul>li>span {
        height: 40px;
        position: absolute;
        top: 0;
        right: -60px;
        width: 60px;
        display: block;
        background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-down-white.svg) no-repeat center center;
        background-size: 20px auto
    }
    body.menu-active nav.main ul>li.menu-1st-active>span {
        background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-up-white.svg) no-repeat center center;
        background-size: 20px auto
    }
    nav.main ul>li.menu-1st-active>ul {
        display: block;
        top: 0;
        border-bottom: 1px solid var(--white);
        margin-left: 5%;
        background: transparent;
        padding-top: 0!important
    }
}

.hero-small {
    background: #f5f5f5 url(https://www.zahnarzt-drseidel.de/upload/theme/platzhalter-1.jpg) no-repeat center center;
    background-size: cover;
    height: 400px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.hero-small h1 {
    text-transform: none;
    font-weight: 700;
    font-size: 3.0em;
    line-height: 1em;
    color: var(--red);
    max-width: 50%;
    margin-bottom: 40px
}

.hero-small h2 {
    text-transform: none;
    font-weight: 700;
    font-size: 1.6em;
    line-height: 1.1em;
    color: var(--white);
    max-width: 50%;
    margin-bottom: 0
}

body.set1 .hero-small {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/background-zahnimplantate.jpg) no-repeat center center;
    background-size: cover
}

body.set2 .hero-small {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/background-zahnersatz.jpg) no-repeat center center;
    background-size: cover
}

body.set3 .hero-small {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/background-tiefschlaf.jpg) no-repeat center center;
    background-size: cover
}

body.set4 .hero-small {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/background-zahnschmerzen.jpg) no-repeat center center;
    background-size: cover
}

body.set5 .hero-small {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/background-schoenezaehne.jpg) no-repeat center center;
    background-size: cover
}

body.set6 .hero-small {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/background-zahnbehandlung.jpg) no-repeat center center;
    background-size: cover
}

body.set7 .hero-small {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/background-angstfrei.jpg) no-repeat center center;
    background-size: cover
}

body.set8 .hero-small {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/background-kieferchirurgie.jpg) no-repeat center center;
    background-size: cover
}

@media (max-width:1112px) {
    .hero-small {
        height: 270px
    }
    .hero-small h1 {
        font-size: 2.4em;
        max-width: 100%
    }
    .hero-small h2 {
        max-width: 100%
    }
}

@media (max-width:414px) {
    .hero-small {
        height: 200px
    }
    .hero-small h1 {
        font-size: 1.5em;
        max-width: calc(100% - 50px);
        margin-bottom: 10px
    }
    .hero-small h2 {
        max-width: calc(100% - 50px);
        font-size: 1.2em
    }
}

body.frontpage .hero {
    height: 700px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 0;
    position: relative;
}

body.frontpage .hero:before {
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: calc(100% + 250px);
    box-sizing: border-box;
    background: #F0F8FE;
    background: linear-gradient(180deg, rgba(240, 248, 254, 1) 40%, rgba(240, 248, 254, 0) 100%);
}

body.frontpage .hero .innerwidth {
    position: relative;
    z-index: 2;
}

body.frontpage .hero .topline {
    font-weight: 700;
    text-transform: none;
    color: var(--darkgray);
    max-width: 50%;
	white-space: nowrap;
}

body.frontpage .hero h1 {
    color: var(--red);
    max-width: 50%;
    margin: 0 0 15px
}

body.frontpage .hero h2 {
    color: var(--black);
    max-width: 50%
}

body.frontpage .hero .hero-motive {
    position: absolute;
    width: 50%;
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/smiling-woman.png) no-repeat left bottom;
    background-size: contain;
    height: 100%;
    left: 50%;
    max-width: 700px;
    bottom: 0;
    z-index: 3;
}

@media (max-width:414px) {
    body.frontpage .hero {
        height: 70vh
    }
    body.frontpage .hero .topline {
        font-size: .8em;
		white-space: nowrap;
    }
    body.frontpage .hero h1 {
        font-size: 1.8em;
        max-width: calc(100% - 60px);
        line-height: 1.2em
    }
    body.frontpage .hero h2 {
        font-size: 1.1em;
        line-height: 1.3em;
        max-width: calc(100% - 100px)
    }
}

.section-contact-cta {
    background: var(--red);
    position: relative;
    z-index: 10;
    max-width: 1500px;
    border-radius: 25px;
    margin: 0 auto 80px auto;
    color: white;
    display: flex;
    padding: 45px;
    box-sizing: border-box;
}

.section-contact-cta-column {
    width: calc(100% / 3);
    display: flex;
    flex-direction: column;
    text-align: center;
    padding: 0 40px;
    box-sizing: border-box;
}

.section-contact-cta-column:not(:last-child) {
    border-right: 1px solid white;
}

.section-contact-cta-column a {
    color: white;
    text-decoration: none;
}

.section-contact-cta-column a:before {
    content: "";
    display: block;
    margin: 0 auto 20px auto;
    width: 65px;
    height: 65px;
}

.section-contact-cta-column a.section-contact-cta-termin-buchen:before {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-calender.svg) no-repeat center center;
    background-size: contain;
}

.section-contact-cta-column a.section-contact-cta-telefon:before {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-phone.svg) no-repeat center center;
    background-size: contain;
}

.section-contact-cta-column a.section-contact-cta-email:before {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-email.svg) no-repeat center center;
    background-size: contain;
}

.breadcrumb {
    position: absolute;
    top: 580px;
    left: 0;
    width: 100%;
    line-height: 1em;
    z-index: 100
}

body.frontpage .breadcrumb {
    top: 720px
}

.breadcrumb a {
    font-weight: 700;
    text-decoration: none;
    color: var(--red);
    text-transform: none;
    font-size: .6em
}

.breadcrumb a:hover {
    color: var(--red)
}

.breadcrumb a:last-child {
    color: var(--red)
}

@media (max-width:1112px) {
    .breadcrumb {
        top: 370px
    }
}

@media (max-width:414px) {
    .breadcrumb {
        top: 300px
    }
    body.frontpage .breadcrumb {
        top: calc(70vh + 20px)
    }
}

body>article {
    overflow-y: hidden
}

.inhaltsuebersicht {
    background: var(--lightblue);
    clear: both;
    padding: 20px 20px 20px 40px;
    margin: 0 0 40px;
    border-radius: 5px
}

.inhaltsuebersicht a {
    font-size: .9em;
    text-decoration: none;
    font-weight: 300;
    color: var(--black)
}

.inhaltsuebersicht a:hover {
    color: var(--red)
}

section.content .inhaltsuebersicht ul {
    list-style-type: none;
    margin-left: 30px;
    margin-bottom: 0
}

.inhaltsuebersicht li {
    margin-bottom: 7px;
    position: relative
}

section.content .inhaltsuebersicht ul li:before {
    content: "";
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-right-red.svg) no-repeat center center;
    background-size: contain;
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 3px
}

.inhaltsuebersicht>p:first-child>strong {
    text-transform: none;
    font-weight: 700
}

.inhaltsuebersicht>p:first-child {
    margin: 0 0 5px;
    letter-spacing: .5px
}

section.content .img-wrap,
section.content .img-wrap.align-right {
    padding: 30px 30px 15px;
    border: 2px solid var(--lightblue);
    display: inline-block;
    font-size: .8em;
    font-weight: 500;
    color: var(--darkgray);
    float: right;
    margin: 0 0 40px 80px;
    text-align: center
}

section.content .img-wrap.align-right {
    margin: 0 0 40px 80px;
    float: right
}

section.content .img-wrap.align-left {
    margin: 0 80px 40px 0;
    float: left
}

section.content .img-wrap>img {
    display: block;
    margin: 0 0 15px
}

section.content .intro-content .img-wrap {
    margin-left: 0;
    display: block;
    float: none;
    width: calc(100% - 60px)
}

section.content .intro-content .img-wrap img {
    width: 100%!important;
    height: auto
}

@media (max-width: 1112px) {
    section.content .einleitung-wrap {
        display: block
    }
    section.content .einleitung-wrap>.einleitung-content {
        width: 100%
    }
    section.content .einleitung-wrap>.inhaltsuebersicht {
        margin-top: 0;
        padding: 30px;
        width: calc(100% - 60px);
        margin-bottom: 40px
    }
    section.content .einleitung-wrap>.inhaltsuebersicht:before {
        display: none
    }
}

@media (max-width: 414px) {
    section.content .img-wrap,
    section.content .intro-content .img-wrap {
        float: none;
        margin: 20px auto;
        padding: 20px 20px 10px;
        width: calc(100% - 40px)
    }
    section.content .img-wrap img,
    section.content .intro-content .img-wrap img {
        width: 100%!important;
        height: auto!important
    }
}

.section-front {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 100px;
    position: relative
}

.section-front h2 {
    margin-bottom: 40px
}

.section-front img {
    width: calc(50% - 40px);
    height: auto;
    object-fit: cover
}

.section-front .imagewrap {
    width: calc(50% - 40px);
    height: auto
}

.section-front .imagewrap>img {
    width: 100%;
    height: auto
}

.section-front .content-wrap {
    width: calc(50% - 40px);
    display: flex;
    flex-direction: column;
    justify-content: center
}

.section-front .content-wrap p:first-child {
    font-weight: 700
}

.section-front .content-wrap p:last-child {
    margin-bottom: 0
}

.section-front h3,
.section-front .h3,
.section-front h4,
.section-front h5,
.section-front h6 {
    font-size: 1em;
    margin: 0 0 10px
}

.section-cta-front {
    color: var(--white);
    text-align: center;
    padding: 60px 0;
    margin-bottom: 100px;
    position: relative
}

.section-cta-front:before {
    content: "";
    background: var(--red);
    position: absolute;
    width: 100vw;
    height: 100%;
    left: calc(50% - 50vw);
    top: 0;
    z-index: -1
}

.section-cta-front a {
    border-color: var(--white);
    color: var(--white);
    text-decoration: none
}

.section-cta-front a:hover {
    color: var(--red);
    background: var(--white);
    border-color: var(--white)
}

.section-02 {
    margin-bottom: 0
}

.section-02 .content-wrap {
    padding-bottom: 60px
}

.section-02 img {
    margin: -100px 0;
    position: relative;
    z-index: -1;
    object-fit: contain!important
}

.section-03 {
    padding: 80px 0;
    margin: 0
}

.section-03:before {
    content: "";
    background: var(--lightblue);
    position: absolute;
    width: 100vw;
    height: 100%;
    left: calc(50% - 50vw);
    top: 0;
    z-index: -1
}

.section-04 {
    z-index: 10
}

.section-04:before {
    content: "";
    background: var(--white);
    position: absolute;
    width: 100vw;
    height: 100%;
    left: calc(50% - 50vw);
    top: 0;
    z-index: -1;
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.2)
}

.section-04 .content-wrap {
    padding: 80px 0
}

.section-04 .image-placeholder {
    height: 100%;
    width: 50vw;
    left: 50%;
    position: absolute;
    display: block;
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/zahnbehandlung-vollnarkose.jpg) no-repeat center center;
    background-size: cover
}

.section-07 {
    padding: 120px 0;
    margin: 0
}

.section-07:before {
    content: "";
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/zahnersatz.jpg) no-repeat left center;
    background-size: cover;
    position: absolute;
    width: 100vw;
    height: 100%;
    left: calc(50% - 50vw);
    top: 0;
    z-index: -1
}

.section-07 .content-wrap {
    background: var(--white);
    border-radius: 15px;
    padding: 40px;
    width: calc(50% - 80px)!important
}

@media (max-width: 1112px) {
    .section-front {
        display: block
    }
    .section-front img {
        width: 100%;
        max-height: 170px;
        object-fit: cover;
        margin-bottom: 20px
    }
    .section-front .content-wrap,
    .section-front .imagewrap {
        width: 100%
    }
    .section-01 {
        display: flex
    }
    .section-01 img {
        order: 10;
        margin: 40px 0 0
    }
    .section-02 img {
        margin: 0 auto -170px 0;
        position: relative;
        z-index: -1;
        max-height: 1000px!important;
        height: auto!important;
        max-width: 500px
    }
    .section-02 {
        text-align: center
    }
    .section-02 .content-wrap {
        text-align: left
    }
    .section-04 {
        padding-bottom: 40px
    }
    .section-04 .image-placeholder {
        position: relative;
        width: 100%;
        top: 0;
        left: 0;
        height: 200px
    }
    .section-05 img {
        width: 300px;
        max-height: 300px!important
    }
    .section-06 img {
        width: 300px;
        max-height: 300px!important;
        margin-top: 40px
    }
    .section-front.section-06 {
        display: flex;
        flex-direction: column
    }
    .section-front.section-06 .imagewrap {
        order: 1;
        margin-bottom: 40px
    }
    .section-front.section-06 .content-wrap {
        order: 2
    }
    .section-07 {
        padding: 230px 0 40px
    }
    .section-07 .content-wrap {
        width: calc(100% - 80px)!important
    }
    .section-07:before {
        height: 200px
    }
}

@media (max-width:414px) {
    body.frontpage section.content .innerwidth> :not(.einleitung-wrap):first-child {
        padding-top: 0
    }
    .section-front,
    .section-cta-front {
        margin-bottom: 60px
    }
    .section-03 {
        margin: 0
    }
    .section-05 img {
        width: 100%
    }
    .section-06 img {
        width: 100%;
        margin: 0
    }
    .section-07 {
        padding-bottom: 0
    }
    .section-07 .content-wrap {
        padding: 0;
        width: 100%!important
    }
}

.news-infoabend-wrap {
    background: var(--lightblue);
    position: relative;
    padding: 60px 0;
    margin: 60px 0 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

body.frontpage .news-infoabend-wrap {
    margin: 0
}

.news-infoabend-wrap:before {
    content: "";
    background: var(--lightblue);
    position: absolute;
    top: 0;
    left: calc(50% - 50vw);
    width: 100vw;
    height: 100%;
    z-index: -1
}

.news-wrap {
    width: calc(100% - 420px)
}

.news-wrap .h4 {
    font-weight: 700;
    font-size: 1.6em;
    margin: 0 0 30px
}

.news-wrap img {
    float: left;
    width: 150px;
    height: 150px;
    object-fit: cover;
    margin-right: 40px
}

.news-wrap>p {
    height: 150px;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.news-wrap p:after {
    content: "";
    display: block;
    clear: both
}

.infoabend-wrap {
    width: 260px;
    height: 200px;
    background: var(--white) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-infoabend.svg) no-repeat 40px 40px;
    background-size: 50px auto;
    padding: 120px 40px 40px;
    border-radius: 20px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1)
}

.infoabend-wrap .h4 {
    font-weight: 700;
    display: block;
    margin: 0 0 15px
}

.infoabend-wrap a {
    display: block;
    margin-top: 15px
}

@media (max-width: 1112px) {
    .news-infoabend-wrap {
        display: block
    }
    .news-wrap {
        width: 100%;
        margin: 0 0 70px
    }
}

@media (max-width:414px) {
    .news-wrap {
        margin-bottom: 40px
    }
    .news-wrap img {
        float: none
    }
    .news-wrap p {
        height: auto;
        border-bottom: 1px solid var(--white);
        padding-bottom: 30px;
        margin-bottom: 30px
    }
    .infoabend-wrap {
        width: calc(100% - 80px)
    }
}

.authored {
    margin-top: 40px;
    font-size: .7em
}

.authored p {
    margin-bottom: 10px
}

.authored+hr {
    display: none
}

#pe_rating {
    width: 100%!important
}

#pe_rating>span {
    display: flex!important;
    flex-direction: row!important;
    margin-right: 30px!important
}

#pe_rating #pe_stars {
    margin-right: 15px!important
}

#pe_rating.pe_g .pe_u {
    line-height: 1.7em!important;
    margin: 0!important
}

.cta-termin-vereinbaren {
    position: relative;
    padding: 0;
    color: var(--white);
    text-align: center;
    font-size: 1.4em
}

.cta-termin-vereinbaren:before {
    content: "";
    background: var(--red);
    position: absolute;
    top: 0;
    left: calc(50% - 50vw);
    width: 100vw;
    height: 100%;
    z-index: -1;
    transition: .3s
}

.cta-termin-vereinbaren:hover:before {
    background: var(--darkgray)
}

.cta-termin-vereinbaren a {
    color: var(--white);
    text-decoration: none;
    font-weight: 700;
    display: block;
    height: 100%;
    padding: 80px 0
}

.video {
    background: var(--darkgray);
    padding: 60px 0;
    color: var(--white);
    text-align: center;
    position: relative;
    margin-bottom: 60px;
    font-weight: 500
}

.video:before {
    content: "";
    background: var(--darkgray);
    position: absolute;
    top: 0;
    left: calc(50% - 50vw);
    height: 100%;
    width: 100vw;
    z-index: -10
}

.video h2 {
    font-size: 1.6em;
    text-transform: none;
    margin-bottom: 40px;
    position: relative;
    z-index: 1
}

.video .video-container {
    margin: 0 auto;
    position: relative;
    z-index: 1
}

.video .video-container iframe {
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
    margin-bottom: 20px
}

section.content ul.weiterlesen {
    background: var(--lightblue);
    padding: 20px 20px 20px 40px;
    border-radius: 5px;
    margin: 0 0 60px;
    position: relative;
    display: flow-root;
    list-style-type: none
}

section.content ul.weiterlesen:before {
    content: "Hier weiterlesen zum Thema: ";
    text-transform: none;
    margin: 0 0 5px -20px;
    font-weight: 700;
    display: block
}

section.content ul.weiterlesen li {
    position: relative;
    margin-bottom: 7px
}

section.content ul.weiterlesen li:before {
    content: "";
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-right-red.svg) no-repeat center center;
    background-size: contain;
    display: block;
    width: 20px;
    height: 14px;
    position: absolute;
    top: 6px;
    left: -23px
}

#kontaktform {
    position: relative;
    display: block;
    padding: 60px 0!important;
    width: 100%;
    z-index: 1;
    clear: both
}

#kontaktform:before {
    content: "";
    background: var(--lightblue);
    height: 100%;
    width: 100vw;
    position: absolute;
    left: calc(50% - 50vw);
    top: 0;
    display: block;
    z-index: -1
}

#kontaktform table.formtable {
    width: 100%
}

#kontaktform table.formtable tr {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

#kontaktform table.formtable tr td {
    width: calc(50% - 10px)!important
}

#kontaktform input[type="text"],
#kontaktform select,
#kontaktform textarea {
    background: var(--white);
    height: 40px;
    line-height: 40px;
    width: calc(100% - 20px)!important;
    padding: 0 10px;
    font-size: 1em!important;
    font-family: inherit!important;
    border: 0!important;
    border-radius: 3px
}

#kontaktform textarea {
    height: auto
}

#kontaktform select {
    width: calc(100% - 50px)!important;
    margin-right: 10px
}

#kontaktform td {
    padding-bottom: 10px
}

#kontaktform #Terminwunsch,
#kontaktform #Alternativterminwunsch,
#kontaktform #Alternativterminwunsch2 {
    width: calc(33.33% - 34px)!important;
    margin-right: 20px;
    display: inline-block
}

#kontaktform #Alternativterminwunsch2 {
    margin-right: 0
}

#kontaktform input[type="submit"] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 2px solid var(--red);
    text-transform: none;
    height: 50px;
    line-height: 50px;
    padding: 0 60px;
    font-size: 1em;
    font-family: inherit;
    font-weight: 700;
    border-radius: 100px;
    color: var(--red);
    cursor: pointer;
    background: transparent;
    transition: .3s
}

#kontaktform input[type="submit"]:hover {
    color: var(--white);
    background: var(--black);
    border: 2px solid var(--black)
}

@media (max-width: 1112px) {
    #kontaktform table.formtable tr {
        display: block
    }
    #kontaktform table.formtable tr td {
        display: block!important;
        width: 100%!important
    }
}

.user_forum #calendarTable {
    margin: 40px 0 0
}

.user_forum .h3.blogforum {
    margin-top: 40px
}

.user_forum #calendarTable tr {
    display: flex;
    flex-direction: column
}

.user_forum .number {
    background: var(--red);
    color: var(--white);
    padding: 0 5px;
    margin: 0 5px 0 0
}

.user_forum .quote_handler+p {
    padding: 10px 0 0 60px;
    position: relative
}

.user_forum .quote_handler+p:before {
    content: "»";
    position: absolute;
    left: 0;
    top: 5px;
    color: var(--lightblue);
    font-size: 5em
}

.user_forum #calendarTable td:nth-child(2) .block {
    border: 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    width: 100%
}

.user_forum #calendarTable td:nth-child(2) .block p {
    white-space: nowrap
}

.user_forum #calendarTable td:nth-child(2) .block a {
    margin: 0
}

.user_forum #calendarTable td:nth-child(2) .block .like,
.user_forum #calendarTable td:nth-child(2) .block .dislike {
    margin-left: 20px;
    padding-left: 0
}

.user_forum #calendarTable td {
    border: 0!important;
    width: 100%!important
}

.user_forum #calendarTable td .block p {
    max-width: 100%;
    margin: 0!important
}

.news-liste-item {
    display: flex;
    flex-direction: row;
    margin: 0 0 40px;
    border-bottom: 1px solid var(--lightblue);
    padding-bottom: 40px
}

.news-liste-item img {
    width: 200px;
    height: 200px;
    object-fit: cover;
    margin-right: 40px;
    padding: 0!important;
    float: none!important
}

.news-liste-item h2 {
    font-size: 1em;
    margin: 0 0 15px
}

.news-liste-item h2 a {
    font-weight: 700;
    color: var(--black)
}

.news-liste-item .news-liste-item-content {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.news-liste-item .news-liste-item-content p {
    margin: 0
}

@media (max-width: 414px) {
    .news-liste-item {
        flex-direction: column
    }
    .news-liste-item img {
        width: 100%;
        margin-right: 0;
        height: 150px;
        object-fit: cover;
        margin-bottom: 20px
    }
}

.googlemaps-embed {
    width: 100vw;
    height: auto;
    position: relative;
    left: calc(50% - 50vw);
    margin-top: 60px;
    margin-bottom: -60px;
    height: 400px;
}

body.frontpage .googlemaps-embed {
    margin-top: 0;
    margin-bottom: 0
}

.googlemaps-embed iframe {
    width: 100% !important;
    height: 400px !important
}

.googlemaps-embed img {
    max-width: 100%;
    height: auto;
	overflow: hidden
}

div[itemprop="video"] {
    margin-bottom: 40px
}

@media (max-width:1112px) {
    #schema-videoobject {
        position: relative;
        padding-bottom: 56.25%;
        padding-top: 30px;
        height: 0;
        overflow: hidden
    }
    #schema-videoobject iframe,
    #schema-videoobject object,
    #schema-videoobject embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }
}

.searchResultItem {
    padding: 0 0 20px
}

.searchResultItem hr {
    margin: 0 0 20px
}

.searchResultItem h2 {
    font-size: 1.2em;
    position: relative
}

.searchResultItem h2 a {
    text-decoration: none
}

.searchResultItem img {
    display: none
}

.searchResultItem>a {
    position: relative;
    padding-left: 20px
}

.searchResultItem>a:before {
    content: "";
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-right-red.svg) no-repeat center center;
    background-size: contain;
    display: block;
    width: 20px;
    height: 14px;
    position: absolute;
    top: 4px;
    left: -3px
}

.result {
    border-top: 2px solid var(--lightblue);
    padding-top: 20px;
    text-align: center;
    line-height: 35px
}

.result img {
    display: none
}

.result>span {
    margin-right: 9px
}

.result>span>strong,
.result>a,
.result>span>a,
.result>span>a:hover {
    background-color: var(--red);
    color: var(--white);
    display: inline-block;
    border-radius: 50px;
    width: 35px;
    height: 35px;
    margin: 0;
    text-decoration: none
}

.result>a,
.result>span>a {
    background-color: var(--lightblue);
    color: var(--red)
}

.a_prev {
    text-indent: -9999px;
    background: var(--lightblue) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-left-red.svg) no-repeat center center;
    background-size: 15px auto;
    margin-right: 10px!important
}

.a_prev:hover {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-left-white.svg) no-repeat center center;
    background-size: 15px auto
}

.a_next {
    text-indent: -9999px;
    background: var(--lightblue) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-right-red.svg) no-repeat center center;
    background-size: 15px auto
}

.a_next:hover {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-right-white.svg) no-repeat center center;
    background-size: 15px auto
}

.faq {
    background-color: var(--lightblue);
    position: relative;
    padding: 80px 0;
    position: relative;
    left: calc(50% - 50vw);
    width: 100vw;
    margin-bottom: 60px
}

.faq>h2,
.faq>dl {
    width: 86%;
    max-width: 1400px;
    margin: 0 auto 1em
}

.faq>dl>dt {
    font-weight: 700;
    border-bottom: 1px solid var(--black);
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/arrow-down.svg) no-repeat right center;
    background-size: 25px auto;
    padding: .5em 40px .5em 0;
    cursor: pointer
}

.faq>dl>dd {
    max-height: 0;
    transition: max-height .5s;
    overflow: hidden
}

.faq dt.faq-active {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/arrow-up.svg) no-repeat right center;
    background-size: 25px auto;
    border: 0
}

.faq dt.faq-active+dd {
    max-height: 300px;
    padding-bottom: .5em;
    border-bottom: 1px solid var(--black);
    overflow: hidden;
    transition: max-height .5s
}

@media (max-width: 768px) {
    .faq dt.faq-active+dd {
        max-height: 1500px
    }
}

footer {
    height: 100px;
    line-height: 100px
}

footer>.innerwidth {
    max-width: 95%;
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

footer>.innerwidth>.metanavigation {
    display: flex;
    flex-direction: row
}

footer nav a {
    margin-right: 20px;
    text-transform: none;
    font-size: .8em;
    text-decoration: none;
    color: var(--black)
}

footer nav a:hover {
    color: var(--red)
}

footer .copyright {
    color: var(--darkgray)
}

footer .siegel {
    background: url(https://www.zahnarzt-drseidel.de/images/logos-test.png) no-repeat right center;
    width: 350px;
    height: 46px;
    margin-top: 27px
}

@media (max-width: 1112px) {
    footer {
        height: auto;
        line-height: 1.6em;
        padding: 40px 0 20px
    }
    footer>.innerwidth {
        display: block
    }
    footer>.innerwidth>.metanavigation {
        display: block
    }
    footer nav {
        margin-bottom: 40px
    }
    footer nav a {
        display: block;
        margin-bottom: 7px
    }
    .footer .copyright {
        margin-top: 20px;
        display: block
    }
}

aside.floating-data {
    background: var(--red);
    border-radius: 0 0 0 5px;
    position: fixed;
    top: 250px;
    right: -140px;
    padding: 0 0 13px;
    width: 140px;
    transition: 1s;
    z-index: 10000;
}

aside.floating-data>a,
aside.floating-data>a:hover,
aside.floating-data>div {
    color: var(--white);
    display: block;
    text-transform: none;
    font-weight: 700;
    font-size: .7em;
    text-align: center;
    text-decoration: none;
    position: relative;
    transition: .3s;
    cursor: pointer
}

aside.floating-data:hover>a,
aside.floating-data:hover>div {
    opacity: .35
}

aside.floating-data>a:hover,
aside.floating-data>div:hover {
    opacity: 1
}

aside.floating-data>a:before,
aside.floating-data>div:before {
    content: "";
    display: block;
    height: 50px;
    width: 50px;
    margin: 13px auto 0
}

aside.floating-data>a.icon-zahnarztpraxis:before {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-zahn.svg) no-repeat center center;
    background-size: contain;
    background-size: 40px auto
}

aside.floating-data>a.icon-videos:before {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-video.svg) no-repeat center center;
    background-size: contain;
    background-size: 35px auto
}

aside.floating-data>a.icon-vita:before {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-doktor.svg) no-repeat center center;
    background-size: contain
}

aside.floating-data>a.icon-ratgeber:before {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-ratgeber.svg) no-repeat center center;
    background-size: contain;
    background-size: 34px auto
}

aside.floating-data>div.icon-socialmedia:before {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-socialmedia.svg) no-repeat center center;
    background-size: contain;
    background-size: 36px auto
}

aside.floating-data>div.icon-suche:before {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-suche.svg) no-repeat center center;
    background-size: contain;
    background-size: 28px auto
}

aside.floating-data>a.icon-termin {
    padding: 0 5px;
    line-height: 15px
}

aside.floating-data>a.icon-termin:before {
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-calender.svg) no-repeat center center;
    background-size: 35px auto
}

body.layer-floating-active aside.floating-data {
    right: 0
}

body.layer-floating-active aside.floating-data>div,
body.layer-floating-active aside.floating-data>a {
    opacity: 1!important
}

aside.floating-data span.handler {
    display: block;
    position: absolute;
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-info.svg) no-repeat center center;
    background-size: 30px auto;
    border-radius: 5px 0 0 5px;
    width: 50px;
    height: 50px;
    top: 0;
    left: -50px;
    cursor: pointer;
    z-index: 999;
    box-shadow: 0 0 6px rgba(0,0,0,0.4);
}

body.layer-floating-active aside.floating-data span.handler {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-right-white.svg) no-repeat center center;
    background-size: 20px auto
}

aside.phone-data,
aside.termin-data,
aside.implant-data {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-phone.svg) no-repeat 10px center;
    background-size: 30px auto;
    position: fixed;
    top: 130px;
    border-radius: 5px 0 0 5px;
    right: -180px;
    height: 50px;
    width: 200px;
    line-height: 50px;
    text-align: center;
    padding: 0 0 0 30px;
    cursor: pointer;
    transition: right 1s;
    box-shadow: 0 0 6px rgba(0,0,0,0.4);
}

aside.termin-data {
    top: 190px;
    text-align: center;
    padding: 0 0 0 30px;
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-calender.svg) no-repeat 10px center;
    background-size: 30px auto
}

body.layer-phone-active aside.phone-data,
body.layer-termin-active aside.termin-data {
    right: 0;
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-right-white.svg) no-repeat 15px center;
    background-size: 20px auto
}

aside.phone-data a,
aside.termin-data a {
    color: var(--white);
    text-decoration: none;
    font-weight: 700;
    font-size: .9em
}

aside.implant-data {
    top: 310px;
    text-align: center;
    padding: 0 0 0 30px;
    background: var(--blue) url(https://www.zahnarzt-drseidel.de/upload/theme/implant-data.svg) no-repeat 10px center;
    background-size: 30px auto
}

aside.implant-data a {
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    text-indent: -9999px;
}

aside {
    z-index: 9999;
}

body.menu-active aside {
    z-index: 9988;
}

@media (max-width: 414px) {
    aside.phone-data {
        top: 150px
    }
    aside.termin-data {
        top: 210px
    }
    aside.floating-data {
        top: 270px
    }
    aside.implant-data {
        top: 330px
    }
}

.layer-socialmedia {
    background: rgba(0, 0, 0, 0.8);
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    z-index: 9990
}

body.layer-socialmedia-active .layer-socialmedia {
    display: flex!important
}

.layer-suche {
    background: rgba(0, 0, 0, 0.8);
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    z-index: 9990;
    color: var(--white);
    font-weight: 700
}

body.layer-suche-active .layer-suche {
    display: flex!important
}

.layer-suche input {
    height: 50px;
    width: 70%;
    max-width: 700px;
    font-size: 1em;
    padding: 0 30px;
    border: 0;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.8);
    margin: 15px 0 0;
    outline: none
}

.icon-close {
    position: fixed;
    cursor: pointer;
    top: 40px;
    right: 40px;
    width: 40px;
    height: 40px;
    z-index: 9999
}

.icon-close span,
.icon-close span:before {
    height: 4px;
    width: 30px;
    display: block;
    background: var(--white);
    position: absolute;
    top: 18px;
    left: 5px;
    transform: rotate(45deg)
}

.icon-close span:before {
    content: "";
    top: 0;
    left: 0;
    transform: rotate(90deg)
}

@media (max-width: 1280px) {
    body {
        margin-top: 0px
    }
    aside {
        margin-top: 0px
    }
}

@media (max-width: 1112px) {
    .breadcrumb {
        margin-top: 10px
    }
}

.read-toc h2[id^=toctoc-]::before,
.read-toc h3[id^=toctoc-]::before,
.read-toc h4[id^=toctoc-]::before,
.read-toc h5[id^=toctoc-]::before,
.read-toc h6[id^=toctoc-]::before {
    display: block;
    content: " ";
    margin-top: -150px;
    height: 150px;
    visibility: hidden;
    pointer-events: none
}

#toctoc {
    display: block!important;
    background: var(--lightblue);
    clear: both;
    padding: 20px 20px 20px 40px;
    margin: 0 0 40px;
    border-radius: 5px;
    font-size: .9em
}

#toctoc-head {
    text-transform: none;
    font-weight: 700
}

#toctoc-head .toc-toggle {
    font-weight: 300;
    color: var(--red);
    cursor: pointer
}

#toctoc-head .toc-toggle:hover {
    font-weight: 300;
    color: #000
}

#toctoc-body {
    margin-top: 15px;
    transition: 1s;
    max-height: 3000px;
    overflow: visible
}

#toctoc-body.hidden {
    max-height: 0;
    overflow: hidden;
    margin-top: 0
}

#toctoc-body p {
    margin-bottom: 6px;
    position: relative
}

#toctoc-body p.link-h3 {
    margin-left: 20px
}

#toctoc-body p.link-h4 {
    margin-left: 40px
}

#toctoc-body p.link-h5 {
    margin-left: 60px
}

#toctoc-body p:before {
    content: "";
    background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-arrow-right-red.svg) no-repeat center center;
    background-size: contain;
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 3px
}

#toctoc-body a {
    position: relative;
    font-size: .9em;
    text-decoration: none;
    font-weight: 300;
    color: var(--black);
    margin-left: 25px;
    display: block
}

#toctoc-head p {
    margin: 0
}

.youtube {
    position: relative;
    padding-top: 0;
    height: 100%;
    overflow: hidden;
	max-width: 560px;
}

.youtube img {
    max-width: 100%;
    height: auto;
}

.youtube .video-wrap {
	height: 0;
	padding-bottom: 56.3%;
	position: relative;
	margin-bottom: 25px;
}

.youtube .video-wrap iframe {
  	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

/* Top Notification Bar */

.top-notification-bar {
    display: block;
    background: #0720C2;
    box-sizing: border-box;
    padding: 10px;
    width: 100%;
    top: 0;
    left: 0;
    height: 50px;
    color: white;
    text-align: center;
    position: relative;
    z-index: 1000;
}

.top-notification-bar a {
    color: white;
    text-decoration: none;
}

@media (max-width: 414px) {
    .top-notification-bar {
        top: 0px;
        height: 75px;
    }
}

.scroll-cta {
    display: flex;
    background: var(--red);
    padding: 16px 21px 16px 21px;
    box-sizing: border-box;
    position: fixed;
    /* transform: translateY(calc(var(--scroll-cta-height) + 10px)); */
    width: auto;
    right: 0;
    bottom: 30px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0);
    z-index: 9977;
    text-align: center;
    transition: 0.3s ease;
    gap: 27px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.scroll-cta a {
    color: white;
    text-decoration: none;
    font-weight: bold;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: auto;
    font-size: 14px;
    box-sizing: border-box;
}

.scroll-cta a:before {
    content: "";
    display: inline-block;
    margin: 0 0 0 0;
    width: 28px;
    height: 30px;
    transform: translateY(-3px);
    /* background: url(https://www.zahnarzt-drseidel.de/upload/theme/icon-calender.svg) no-repeat center center;
    background-size: contain; */
}

.scroll-cta a.scroll-cta-termin-buchen:before {
     /* background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/logo-doctolib.svg) no-repeat center center;*/
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-calender.svg) no-repeat center center;
    background-size: contain;
    width: 68px;
    height: 30px;
}

.scroll-cta a.scroll-cta-telefon:before {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-phone.svg) no-repeat center center;
    background-size: contain;
}

.scroll-cta a.scroll-cta-email:before {
    background: var(--red) url(https://www.zahnarzt-drseidel.de/upload/theme/icon-email.svg) no-repeat center center;
    background-size: contain;
}

@media (max-width: 768px) {
    .scroll-cta {
        bottom: 0;
        display: flex;
        justify-content: space-evenly;
        width: 100%;
        transform: translateY(500px);
        gap: 15px;
        padding: 10px 10px 10px 10px;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }
    .scroll-cta a {
        width: auto;
        padding: 0;
    }

    body.scroll-down .scroll-cta {
        transform: translateY(0);
        box-shadow: 0 0 30px rgba(0, 0, 0, 0.3);
    }

    body.scroll-up .scroll-cta {
        transform: translateY(calc(var(--scroll-cta-height) + 10px));
        box-shadow: 0 0 30px rgba(0, 0, 0, 0);
    }
}

.cta-content {
    text-align: center;
    display: inline-block;;
	margin-bottom: 30px;
	width: 100%;
}

.cta-content a {
    text-decoration: none;
    color: white;
    position: relative;
    padding: 20px 30px 20px 70px;
    background-color: var(--red);
    box-sizing: border-box;
    border-radius: 13px;
    display: inline-block;
}

.cta-content a:hover {
    background-color: #444444;
}

.cta-content a:before {
    content: "";
    position: absolute;
    top: calc(50% - 15px);
    left: 23px;
    width: 28px;
    height: 30px;
    padding-top: 0px;
    margin-right: 20px;
    background: url('https://www.zahnarzt-drseidel.de/upload/theme/icon-calender.svg') no-repeat center center;
    background-size: contain;
}


















.cta-content-doctolib {
    text-align: center;
    display: inline-block;;
	margin-bottom: 30px;
	width: 100%;
}

.cta-content-doctolib a {
    text-decoration: none;
    color: white;
    position: relative;
    padding: 20px 30px 20px 130px;
    background-color: var(--red);
    box-sizing: border-box;
    border-radius: 13px;
    display: inline-block;
}

.cta-content-doctolib a:hover {
    background-color: #444444;
}
.cta-content-doctolib a:before {
    content: "";
    position: absolute;
    top: calc(50% - 15px);
    left: 23px;
    padding-top: 0px;
    padding-right: 20px;
    background: url('https://www.zahnarzt-drseidel.de/upload/theme/logo-doctolib.svg') no-repeat center center;
    background-size: contain;
    width: 68px;
    height: 30px;
}


























@media (max-width: 468px) {

    .cta-content a {
        display: block;
    }
}