/*
Theme Name: Betheme Child
Theme URI: https://themes.muffingroup.com/betheme
Author: Muffin group
Author URI: https://muffingroup.com
Description: Child Theme for Betheme
Template: betheme
Version: 2.1.3
*/

/* fonts */

/* solway-700 - latin */
@font-face {
    font-display: swap;
    font-family: 'Solway';
    font-style: normal;
    font-weight: 700;
    src: url('fonts/solway-v19-latin-700.woff2') format('woff2');
}

/* open-sans-regular - latin */
@font-face {
    font-display: swap;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/open-sans-v44-latin-regular.woff2') format('woff2');
}

/* open-sans-700 - latin */
@font-face {
    font-display: swap;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: url('fonts/open-sans-v44-latin-700.woff2') format('woff2');
}

/* root */

:root {
    --blue: #18A6D5;
    --light-blue: #9DD5EF;
    --super-light-blue: #D1EBF9;
    --light-gray: #F4F4F4;
    --thunder-blue: #113046;
    --white: white;

    --menu-font-size: 24px;

    --h1-font-size: 35px;
    --h2-font-size: 28px;
    --h3-font-size: 24px;
    --h4-font-size: 20px;

    --p-font-size: 18px;
}

@media (min-width:768px) {
    :root {
        --h1-font-size: 46px;
        --h2-font-size: 38px;
        --h3-font-size: 30px;
        --h4-font-size: 20px;
    }
}

@media (min-width:1240px) {
    :root {
        --h1-font-size: 64px;
        --h2-font-size: 48px;
        --h3-font-size: 30px;
        --h4-font-size: 20px;
    }
}

/* typo */

h1,
.h1 {
    font-size: var(--h1-font-size);
    color: var(--thunder-blue);
    line-height: 1.15;
}

h2,
.h2 {
    font-size: var(--h2-font-size);
    color: var(--thunder-blue);
    line-height: 1.325;
}

h3,
.h3 {
    font-size: var(--h3-font-size) !important;
    color: var(--thunder-blue);
    line-height: 1.3;
}

h4,
.h4 {
    font-size: var(--h4-font-size);
    color: var(--thunder-blue);
    line-height: 1.3;
}

p {
    font-size: var(--p-font-size);
    color: var(--thunder-blue);
    line-height: 1.55;
}

#Content li {
    font-size: var(--p-font-size);
    color: var(--thunder-blue);
    line-height: 1.55;
    padding-left: 10px;
}

.the_content_wrapper ul {
    list-style: '•';
    margin: 0 0 15px 7px;
}

/* general BeTheme settings */

body:not(.template-slider) #Header {
    min-height: 0;
}

#Top_bar .menu>li>a span:not(.description) {
    border: 0;
}

#Top_bar .menu.page-menu>li>a {
    border-right: 0;
}

#Content {
    padding-top: 0;
}

.the_content_wrapper {
    margin-bottom: 0 !important;
}

.wpb_wrapper>div {
    margin-bottom: 0 !important;
}

/* general settings */

#Content {
    background-color: var(--white);
}

.wpb_content_element+.spacer {
    margin-top: 0 !important;
}

#Top_bar .menu>li>a span {
    font-size: var(--menu-font-size);
    color: var(--thunder-blue);
}

@media (min-width: 1240px) {
    .menu-main {
        display: flex;
        align-items: center;
    }
}

@media (min-width: 1240px) {
    #Top_bar.is-sticky .menu-main {
        height: 61px;
    }
}

#Top_bar.is-sticky {
    opacity: 1;
}

#Top_bar .responsive-menu-toggle {
    color: var(--thunder-blue) !important;
}

.menu_wrapper .icon-menu-fine:before {
    font-weight: 700 !important;
}

#Side_slide {
    background-color: var(--thunder-blue) !important;
    border-color: var(--thunder-blue) !important;
}

#Side_slide a:not(.button) {
    color: var(--white) !important;
}

#Side_slide #menu ul li {
    border-top: 0 none !important;
}

#Side_slide #menu>ul:last-child>li:last-child {
    border-bottom: 0 none;
}

#Side_slide #menu ul li a {
    font-size: 22px;
    line-height: 1.5;
}

#Side_slide .btn--menu span {
    justify-self: flex-start;
    max-width: -webkit-fit-content;
}

#Content a:not([class^="btn-"]):not(.brlbs-cmpnt-cb-btn),
#Footer .widgets_wrapper a {
    color: var(--blue);
    text-decoration: underline;
}

#Footer {
    background-color: var(--white);
}

#Footer .column:nth-child(n+2) .mcb-column-inner {
    display: grid;
    grid-template-columns: 33px 1fr;
    gap: 25px;
}

.mfn-footer .footer_copy {
    border-top: 0 none;
    background: var(--thunder-blue);
}

@media (min-width: 768px) and (max-width: 1239px) {
    #Footer .container {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .one-fourth.column {
        width: 100%;
    }
}

.copyright {
    display: flex;
    justify-content: flex-start;
    width: 97%;
    gap: 50px;
    margin: 0 !important;
}

@media (min-width: 1239px) {
    .copyright {
        justify-content: flex-end;
    }
}

.footer_copy .mcb-column-inner {
    margin: 0 !important;
    padding: 0 !important;
}

.copyright a {
    color: var(--white) !important;
    font-size: var(--h4-font-size);
    font-family: 'Solway';
}

@media (max-width: 991px) {
    #Footer .widgets_wrapper {
        padding: 15px 0 !important;
    }
}

/* backgrounds */

.footprint-on-blue {
    background-image: url('img/grafik-hellblau-podologie-fusspraxis-boehner.svg');
    background-size: 110%;
    background-position: center bottom;
    background-repeat: no-repeat;
}

.footprint-on-blue a:not([class^="btn-"]) {
    color: var(--thunder-blue) !important;
}

.footprint-on-gray {
    background-image: url('img/grafik-hellblau-hero-podologie-fusspraxis-boehner.svg');
    background-size: 75%;
    background-position: 115% 20%;
    background-repeat: no-repeat;
}

@media (min-width: 1400px) {
    .footprint-on-gray {
        background-size: 50vw;
        background-position: 115% 120%;
    }
}

.hero {
    background-image: url('img/grafik-hellblau-hero-podologie-fusspraxis-boehner.svg');
    background-size: 65%;
    background-position: top left;
    background-repeat: no-repeat;
}

/* buttons */

.btn--menu span {
    background-color: var(--blue);
    color: var(--white) !important;
    border-radius: 68px;
    padding: 10px 20px !important;
    line-height: 1 !important;
    display: flex !important;
    gap: 10px;
    align-items: center;
    transition: color .2s ease, background-color .2s ease;
}

.btn--menu span::before {
    content: '';
    display: inline-block;
    background-color: currentColor;
    width: 22px;
    height: 22px;
    mask: url('img/grafik-telefon-grau-podologie-fusspraxis-boehner.svg') no-repeat 50% 50%;
    mask-size: contain;
}

.btn-default {
    background-color: var(--light-blue);
    color: var(--thunder-blue);
    border-radius: 68px;
    font-family: 'Solway';
    font-size: var(--p-font-size);
    padding: 10px 20px;
    display: flex;
    justify-self: flex-start;
    gap: 12px;
    align-items: center;
}

@media (min-width: 768px) {
    .btn-default::after {
        content: '';
        display: inline-block;
        background-color: currentColor;
        width: 19px;
        height: 17px;
        mask: url('img/grafik-pfeil-podologie-fusspraxis-boehner.svg') no-repeat 50% 50%;
        mask-size: contain;
    }
}

.vc_row-has-fill .btn-default {
    background-color: var(--white);
    justify-self: center;
}

.btn-custom1 {
    background-color: var(--blue);
    color: var(--white);
    border-radius: 68px;
    font-size: var(--menu-font-size);
    font-family: 'Solway';
    padding: 10px 20px;
    border: 0 none;
}

.btn-custom2 {
    background-color: var(--white);
    color: var(--blue);
    border-radius: 68px;
    font-size: var(--menu-font-size);
    font-family: 'Solway';
    padding: 8px 20px;
    border: 2px solid var(--blue);
    display: inline-flex;
    justify-self: flex-start;
    gap: 12px;
    align-items: center;
    position: relative;
    padding-left: 60px;
}

.btn-custom2::before {
    content: '';
    position: absolute;
    left: 20px;
    display: inline-block;
    width: 29px;
    height: 29px;
    background-image: url('img/grafik-play-button-podologie-fusspraxis-boehner.svg');
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
}

.btn-default:hover,
.btn-default:focus,
.btn-custom1:hover,
.btn-custom1:focus,
.btn-custom2:hover,
.btn-custom2:focus,
.btn--menu span:hover,
.btn--menu span:focus {
    background-color: var(--super-light-blue);
    color: var(--blue) !important;
    opacity: 1;
}

.btn-custom2:hover {
    border-color: var(--super-light-blue);
}

/* jump anchors */

.jump-anchors p {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    padding-bottom: 20px;
    border-bottom: 2px solid var(--blue);
    column-gap: 20px;
    row-gap: 10px;
}

@media (max-width: 767px) {
    .jump-anchors p {
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }
}

.jump-anchors a {
    font-weight: 700;
    text-decoration: none !important;
}

/* teaser card */

.teaser-card {
    background-color: var(--light-gray);
    border-radius: 0 0 20px 20px;
}

/* swiper */

.swiper--base {
    overflow: visible;
}

.swiper--pb {
    padding-bottom: 5rem !important;
}

.swiper--base .swiper-button-prev {
    left: unset;
    right: 56px;
    top: unset;
    bottom: 0;
}

.swiper--base .swiper-button-next {
    right: 0;
    top: unset;
    bottom: 0;
}

.swiper--base .swiper-button-prev,
.swiper--base .swiper-button-next {
    width: 48px;
    height: 48px;
    border-radius: 100px;
    background: var(--blue);
}

.swiper--base .swiper-button-prev.swiper-button-disabled,
.swiper--base .swiper-button-next.swiper-button-disabled {
    opacity: .5 !important;
}

.swiper--base .swiper-button-prev svg,
.swiper--base .swiper-button-next svg {
    height: 20px;
}

.swiper--base .swiper-button-prev svg path,
.swiper--base .swiper-button-next svg path {
    fill: var(--white);
}

.swiper--base .swiper-slide {
    background-color: var(--white);
    border-radius: 16px;
}

.swiper--base .swiper-slide .wpb_content_element {
    margin-bottom: 0;
    padding: 20px;
}

@media (min-width: 768px) {
    .swiper--base .swiper-slide .wpb_content_element {
        padding: 40px;
    }
}

.swiper--base .swiper-slide .wpb_content_element p {
    position: relative;
    padding-left: 20px;
}

@media (min-width: 768px) {
    .swiper--base .swiper-slide .wpb_content_element p {
        padding-left: 30px;
    }
}

@media (max-width: 767px) {
    .swiper--base .swiper-slide .wpb_content_element p {
        font-size: 16px;
    }

    .swiper--base .swiper-slide .wpb_content_element h3 {
        font-size: 20px !important;
    }
}

.swiper--base .swiper-slide .wpb_content_element p::before {
    content: '';
    display: block;
    width: 2px;
    height: 100%;
    background-color: var(--thunder-blue);
    position: absolute;
    top: 0;
    left: 0;
}

.swiper--base .swiper-slide .wpb_content_element .wpb_wrapper>p:first-child::before {
    height: 100%;
}

/* image text element */

.hero .btn-custom1 {
    margin-bottom: 15px;
}

.vc_row:not(.hero) .image-text {
    gap: 30px;
}

@media (min-width: 992px) {

    .vc_row:not(.hero) .image-text__image,
    .image-text__content {
        flex: 0 0 calc(50% - 15px);
    }
}

.vc_row:not(.hero) .image-text__content {
    background-color: var(--super-light-blue);
    border-radius: 20px;
    padding: 20px !important;
}

@media (min-width: 768px) {

    .vc_row:not(.hero) .image-text__content {
        padding: 50px !important;
    }
}

/* team & contact */

.team {
    row-gap: 30px;
}

.team .wpb_wrapper {
    background-color: var(--light-gray);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.team .wpb_text_column {
    padding: 20px;
    padding-bottom: 45px;
}

.contact-boxes {
    row-gap: 30px;
}

.contact-boxes a {
    color: var(--thunder-blue) !important;
}

.contact-boxes .wpb_wrapper {
    background-color: var(--super-light-blue);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.contact-boxes .wpb_text_column {
    padding: 40px;
    padding-top: 20px;
}

.contact-boxes .vc_single_image-wrapper {
    padding-top: 40px;
}

/* benefits */

.benefits {
    row-gap: 50px;
}

.benefits img {
    margin-bottom: 25px;
}

/* accordion */

.vc_tta-panel-title>a {
    text-decoration: none !important;
    color: var(--thunder-blue) !important;
}

.vc_tta.vc_general .vc_tta-panel-title>a {
    padding: 50px 0 !important;
    padding-right: 60px !important;
}

@media (min-width: 768px) {
    .vc_tta.vc_general .vc_tta-panel-title>a {
        padding-right: 20px !important;
    }
}

.vc_tta-title-text {
    line-height: 1.5;
}

.vc_tta-panel-heading {
    border: 0 none !important;
}

.vc_tta-panel-heading {
    border-top: 2px solid var(--blue) !important;
}

.vc_tta.vc_tta-shape-rounded :is(.vc_tta-panel-body, .vc_tta-panel-heading) {
    border-radius: 0 !important;
}

.vc_tta.vc_tta-style-classic :is(.vc_tta-panel.vc_active, .vc_tta-panel:not(:last-child)) .vc_tta-panel-heading {
    margin-bottom: 0 !important;
}

.vc_tta-color-custom.vc_tta-style-classic .vc_tta-panel :is(.vc_tta-panel-heading:focus, .vc_tta-panel-heading:hover) {
    background-color: transparent !important;
}

.vc_tta-panels-container {
    border-bottom: 2px solid var(--blue) !important;
}

.vc_tta.vc_general .vc_tta-panel-body {
    padding: 10px 0px 50px 0 !important;
}

.vc_tta .vc_tta-controls-icon {
    height: 20px !important;
    width: 20px !important;
}

.vc_tta-controls-icon:after,
.vc_tta-controls-icon:before {
    border-color: var(--thunder-blue) !important;
}

/* contact form */

input[type="date"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
select,
textarea {
    padding: 16px !important;
    border-radius: 10px !important;
    border: 2px solid var(--blue) !important;
}

input[type="date"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus {
    background-color: white !important;
    color: var(--thunder-blue) !important;
}

.codedropz-upload-handler {
    border: 2px solid var(--blue) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.5) !important;
}

.codedropz-upload-inner>div:first-child {
    font-weight: 700;
}

.codedropz-upload-container {
    padding: 40px 20px !important;
}

/* google map */

.wpb_gmaps_widget .wpb_wrapper {
    background-color: transparent !important;
    padding: 0 !important;
    border-radius: 20px;
    overflow: hidden;
}

.embed-responsive iframe {
    border-radius: 20px;
}

/* imprint & ds links */

.page-id-26 a,
.page-id-28 a {
    overflow-wrap: anywhere;
}