/**
 *
 * Theme Name:        NOUR
 * Theme URI:         https://www.moleco.de
 * Description:       Dieses Theme wurde erstellt durch die MOLECO GmbH - Agentur für digitale Kommunikation
 * Version:           1.0.0
 * Author:            MOLECO GmbH
 * Author URI:        https://www.moleco.de
 * Tested up to:      6.8.1
 * Requires at least: 6.8.1
 * Requires PHP:      8.3.22
 *
 */

:root{
    
    --black:        #00111C;
    --beige:        #F5F1E9;
    --beige-dark:   #ECE3D2;
    --red:          #77303C;
    --green-dark:   #31342E;
    --green:        #b3bb91;
    --grey-light:   #f8f6f6;
    --white:        #ffffff;

}

body,html,*{font-size: 18px;line-height: 1.6;font-family:'TT Norms Pro';font-weight: 400;}
html{scroll-behavior: smooth;}
body{overflow-x: hidden;background-color: #f5f1e9;}
button:focus{outline: none;}
button:focus-visible{outline: auto;}

a{color:var(--red);text-decoration:underline;font-size:100%;transition:all .3s ease;}
a:hover{color:var(--black);transition:all .3s ease;}

li{list-style:none;padding-left:30px;position:relative;}
li:before{content:'';width:7.5px;height:7.5px;display:block;background:var(--red);position:absolute;top:7.5px;left:0;border-radius:50%;}

ul{padding:0;margin:0;}

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

/* h1{font-size:200%;display:block;width:max-content;position:relative;color:var(--black);margin-bottom: 50px;line-height:1;text-transform:uppercase;max-width: 100%;font-weight: 300;}
h2{font-size:180%;display:block;width:max-content;color:var(--black);margin-bottom: 50px;line-height:1;text-transform:uppercase;max-width: 100%;font-weight: 300;}
h3{font-size:110%;display:block;width:max-content;color:var(--black);margin-bottom: 30px;line-height:1;text-transform:uppercase;max-width: 100%;font-weight: 300;} */

.headline{display: block;color:var(--black);margin-bottom: 25px;text-transform: uppercase;max-width: 100%;font-weight: 400;font-size: 160%;}

.btn{position:relative;padding:12px 30px;text-transform: uppercase;font-size:90%;font-weight:400;background: var(--red);color:var(--white);transition:all .3s ease;line-height:1;text-align:center;text-decoration:none;border: 1px solid var(--red);border-radius: 12px;width: max-content;margin-top: 40px;letter-spacing: 3px;}
.btn:hover{background: var(--black);border-color: var(--black);transition:all .3s ease;color:var(--beige);text-decoration: none;}
.btn-outline{position:relative;padding:15px 20px;text-transform: uppercase;font-size:90%;font-weight:400;background: transparent;color:var(--black);transition:all .3s ease;line-height:1.2;text-align:center;text-decoration:none;border: 1px solid var(--black);border-radius: 12px;width: 140px;margin-top: 50px;letter-spacing: 3px;}
.btn-outline:hover{background: var(--black);border-color: var(--black);transition:all .3s ease;color:var(--grey-light);text-decoration: none;}

strong{font-weight:600;font-size:100%;}

.container{max-width: 1470px;}
.container.wide{max-width: 1650px;}

button.menuburgerbutton{border: none;background-color: transparent;}

.swiper-button-prev::after{display: none;}
.swiper-button-next::after{display: none;}

/*------------------------------------Header-------------------------------------------------*/

#page-header{position: fixed;top: 0;left: 0;right: 0;padding: 0;background: transparent;z-index: 999;transition: all 0.3s ease;border-bottom: 1px solid var(--black);}

#page-header .logo object{width: 180px;height: auto;display: block;z-index: -1;position: relative;}

#page-header .desktop-menu .menu{display: flex;}
#page-header .desktop-menu .row{align-items: center;}
#page-header .desktop-menu .menu{align-items: center;}
#page-header .desktop-menu .menu li{list-style: none;padding: 0 20px;}
#page-header .desktop-menu .menu li:last-child a{border: 1px solid var(--black);border-radius: 12px;padding: 10px;width: 140px;text-align: center;display: block;}
#page-header .desktop-menu .menu li:last-child a:hover{border: 1px solid var(--black);background-color: var(--black);color: var(--grey-light);}
#page-header .desktop-menu .menu li:last-child a::before{display: none!important;}
#page-header .desktop-menu .menu li::before{display: none;}
#page-header .desktop-menu .menu li a{text-decoration: none;color: var(--black);font-size: 85%;text-transform: uppercase;font-weight: 400;position: relative;}
#page-header .desktop-menu .menu li a::before{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--black);bottom: -8px;left: 0;transform-origin: right;transform: scaleX(0);transition: transform .3s ease-in-out;}
#page-header .desktop-menu .menu li a:hover::before{transform-origin: left;transform: scaleX(1);}
#page-header .current_page_item{position: relative;}
#page-header .current_page_item a::after{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--black);bottom: -8px;left: 0;transition: transform .3s ease-in-out;transform-origin: left;transform: scaleX(1);;}
#page-header .menu-topmenue-container{float: right;}
#page-header .desktop-menu .menu .menu-item-144{padding-right: 0;}

#page-header.bottom{position:fixed;top:0;left:0;right:0;background:var(--grey);-webkit-animation: fadein 2s; Safari, Chrome and Opera > 12.1              -moz-animation: fadein 2s; /* Firefox < 16 */-ms-animation: fadein 2s; /* Internet Explorer */-o-animation: fadein 2s; /* Opera < 12.1 */animation: fadein 2s;z-index:9999;}

#page-header.bottom {background: #F5F1E988;backdrop-filter: blur(15px);box-shadow: 0px 5px 20px -10px rgba(0,0,0,0.3);border-bottom: none;}
#page-header.bottom .logo object{width: 150px;}

@keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-moz-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-webkit-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-ms-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}

/*------------------------------------Footer-------------------------------------------------*/

#page-footer{background:var(--green-dark);padding: 0 0 20px;}
#page-footer *{color: var(--white);font-weight: 300;}
#page-footer a{text-decoration: none;}
#page-footer a:hover{text-decoration: underline;}
#page-footer .logo-object{max-width: 90px;}

#page-footer .bottom{align-items: end;}
#page-footer .homelink{font-weight: 600;display: block;height: max-content;text-align: center;width: 160px;margin: 0 auto;}
#page-footer .social{text-align: right;margin-bottom: 30px;}
#page-footer .social .instagram-object{max-width: 45px;}
#page-footer .social a{font-size: 120%;}
#page-footer .kontakt p{margin-bottom: 0;}
#page-footer .kontakt a{text-decoration: underline;}
#page-footer .footermenu ul{display: block;float: right;}
#page-footer a, #page-footer p{font-size: 80%;}
#page-footer .footermenu li{margin: 0;padding: 0;text-align: right;line-height: 1;}
#page-footer .footermenu li::after{position: relative;content: '';right: 0;height: 1rem;}
#page-footer .footermenu li:last-child:after{display: none;}
#page-footer .footermenu li::before{display: none;}
#page-footer .footermenu li:last-child{margin-right: 0;}

/*-----------------------ABWEICHUNGEN-----------------------*/

.kurse{background-color: var(--beige);}
/* #reformer, #pilates, #yoga, #barre{margin-top: -120px;padding-top: 120px;} */

.startseite #page-header .desktop-menu .menu li a{position: relative;}
.startseite #page-header .desktop-menu .menu li a::before{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--grey-light);bottom: -8px;left: 0;transform-origin: right;transform: scaleX(0);transition: transform .3s ease-in-out;}
.startseite #page-header .desktop-menu .menu li a:hover::before{transform-origin: left;transform: scaleX(1);}
.startseite #page-header.bottom .desktop-menu .menu li a::before{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--black);bottom: -8px;left: 0;transform-origin: right;transform: scaleX(0);transition: transform .3s ease-in-out;}
.startseite #page-header.bottom .desktop-menu .menu li a:hover::before{transform-origin: left;transform: scaleX(1);}

.startseite #page-header .desktop-menu .menu li:last-child a{border: 1px solid var(--grey-light);border-radius: 12px;padding: 10px;width: 140px;text-align: center;display: block;}
.startseite #page-header .desktop-menu .menu li:last-child a:hover{background-color: var(--grey-light);color: var(--black);}
.startseite #page-header .desktop-menu .menu li a{text-decoration: none;color: var(--grey-light);font-size: 85%;text-transform: uppercase;font-weight: 400;}
.startseite #page-header .logo object{filter: brightness(0) invert(1);z-index: -1;position: relative;}
.startseite #page-header{border-bottom: 1px solid var(--grey-light);}

.startseite #page-header.bottom .desktop-menu .menu li:last-child a{border: 1px solid var(--black);border-radius: 12px;padding: 10px;width: 140px;text-align: center;display: block;}
.startseite #page-header.bottom .desktop-menu .menu li:last-child a:hover{background-color: var(--black);color: var(--grey-light);}
.startseite #page-header.bottom .desktop-menu .menu li a{text-decoration: none;color: var(--black);font-size: 85%;text-transform: uppercase;font-weight: 400;}
.startseite #page-header.bottom .logo object{filter: unset;}
.startseite #page-header.bottom{border-bottom: unset;}

.impressum .inhaltsbloecke,
.agb .inhaltsbloecke,
.datenschutzerklaerung .inhaltsbloecke{margin-top: 100px;}
.impressum .flx_textblock.nurtext,
.datenschutzerklaerung .flx_textblock.nurtext{background-color: transparent;text-align: left;}
.impressum .flx_textblock.nurtext .headline,
.datenschutzerklaerung .flx_textblock.nurtext .headline{margin: 0 0 25px;}
.preise .inhaltsbloecke{margin-top: 150px;}

/*------------------------------------ACF-Flexible-Content-----------------------------------*/

.inhaltsbloecke{margin-top: 200px;overflow-x:hidden;background: var(--beige);}

.startseite .inhaltsbloecke{margin-top: 0;}

.flx_headerblock .headlinebox{padding-bottom: 150px;text-align: center;}
.flx_headerblock .headlinebox .headline{color: var(--white);font-size: 170%;line-height: 1.2;}

/*Bildblock*/
.flx_bildblock .bg{height: 920px;width: 100%;object-fit: cover;}
.flx_bildblock .bilderbox{position: relative;}
.flx_bildblock.mittext p{font-size: 210%;text-transform: uppercase;color: var(--grey-light);position: absolute;top: calc(50% - 100px);left: calc(50% - 300px);font-weight: 300;width: max-content;max-width: 100%;text-align: center;}
.flx_bildblock.miticon{position: relative}
.flx_bildblock.miticon .container > .iconbox{position: absolute;top: 0; left: 0; right: 0; bottom: 0;display: flex;justify-content: center;align-items: center;}
.flx_bildblock.miticon .container > .iconbox .icon{width: 400px;height: auto;max-width: 100%;}

/*Textblock*/
.flx_textblock.nurtext{background-color: var(--beige);padding: 100px 0 100px;text-align: center;}
.flx_textblock.nurtext .btn-outline{display: block;margin: 2rem auto 0;}
.flx_textblock.nurtext .text{max-width: 80%;margin: 0 auto;}
.flx_textblock{padding-bottom: 100px;}
/* .flx_textblock img{aspect-ratio: 350/467;width: 100%;} */
.kurse .flx_textblock.mitbildlinks .bild img, .kurse .flx_textblock.mitbildrechts .bild img{min-height: 650px;object-fit: cover;}

/*Kursteaser*/
.flx_kursteaser{position: relative;padding: 150px 100px;background-color: #ffffff;}
.flx_kursteaser .item{position: relative;margin-bottom: 1.7rem;}
.flx_kursteaser .item div{overflow: hidden;}
.flx_kursteaser img{width: 100%;object-fit: cover;transform: scale(1) translateY(40px);opacity: 0;transition: opacity 0.8s ease-out, transform 0.8s ease-out;height: 550px;}
.flx_kursteaser img.visible{opacity: 1;transform: scale(1) translateY(0);}
.flx_kursteaser .item:hover img{transform: scale(1.05);transition: all ease .5s;}
.flx_kursteaser .name{position: absolute;width: 100%;bottom:50px;text-align: center;left: 0;font-size: 110%;color: var(--white);text-transform: uppercase;letter-spacing: 3px;font-weight: 400;}

/* Bildergalerie */
.flx_bildergalerie{position: relative;padding: 100px 0 100px;}
.flx_bildergalerie .instagram{text-align: center;margin: 0 auto 100px;font-size: 175%;color: var(--black);display: block;}
.flx_bildergalerie .galerie{display: flex;flex-wrap: wrap;}
.flx_bildergalerie .item{position: relative;padding: 15px;}
.flx_bildergalerie img{width: 100%;aspect-ratio: 3/4;object-fit: cover;transform: translateY(40px);opacity: 0;transition: opacity 0.8s ease-out, transform 0.8s ease-out;}
.flx_bildergalerie img.visible{opacity: 1;transform: translateY(0);}
.flx_bildergalerie img:hover{transform: scale(1.05);transition: all ease .5s;}
.flx_bildergalerie .name{position: absolute;width: 100%;bottom:0;text-align: center;left: 0;font-size: 100%;color: var(--white);text-transform: uppercase;letter-spacing: 1.5px;font-weight: 500;}

/*Kontaktformular*/
.flx_newsletterblock{padding: 65px 0 110px!important;background-size: cover!important;min-height: 500px;}
.flx_newsletterblock *{color: var(--grey-light)!important;}
.flx_newsletterblock h2{font-weight: 400;margin-bottom: 80px;width: 50%;}
.flx_newsletterblock .textinner p{font-size: 150%;margin-bottom: 80px;}
/* .flx_newsletterblock .jss185{} */
.flx_newsletterblock .widget-1 > div{width: 100%!important;background-color: transparent!important;}
.flx_newsletterblock .widget-2 > div{width: 100%!important;background-color: transparent!important;}
.flx_newsletterblock button{background-color: transparent; border: 1px solid var(--grey-light);transition: all ease .3s;}
.flx_newsletterblock button:hover{background-color: var(--grey-light);transition: all ease .3s;}
.flx_newsletterblock button span{transition: all ease .3s;}
.flx_newsletterblock button:hover span{color: var(--black)!important;transition: all ease .3s;}
.flx_newsletterblock .jss1 div:last-child{z-index: 999;}
.MuiSvgIcon-fontSizeLarge-225, .MuiTypography-h5-235{display: none!important;}
.MuiSvgIcon-root-60{display: none!important;}
.MuiTypography-h5-78{display: none!important;}
.jss342, .jss15{display: none!important;}
.jss28{padding: 0!important;}
.widget-1{justify-content: flex-start!important;}
.MuiFormLabel-root-112{font-size: 14px!important;color: #c2c2c2!important;}
.jss185{padding: 0px!important;}

/*CF7*/
label[for="nachricht"] span{margin-left: .5rem;}
input{height: 45px;background-color: transparent;border: none;border-bottom: 1px solid var(--grey-light);}
label,
.wpcf7 p{margin-bottom: 0;}
input#confirm{width: max-content;margin: 0 10px 0 0;height: max-content;}
input#submit{width: max-content;padding: 20px 30px;margin-top: 0;background-color: transparent;border-color: var(--grey-light);height: unset;}
input#submit:hover{background-color: var(--white);color: var(--black);}
.wpcf7-form-control-wrap label{display: flex;}
.wpcf7-not-valid-tip{margin: -15px 0 10px;}
.wpcf7-acceptance .wpcf7-list-item{margin: 0;}
.wpcf7-acceptance .wpcf7-list-item{padding: 60px 0 50px;}
.wpcf7 .pflicht{margin-top: 1rem;}
.wpcf7 .pflicht,
.wpcf7-acceptance .wpcf7-list-item span{font-size: 70%;}
.wpcf7-form.sent .row{display: none;}
.MuiTypography-h5-80{display: none!important;}
.MuiSvgIcon-fontSizeLarge-70{display: none!important;}
.wpcf7-form.sent .wpcf7-response-output{border-color: var(--main)!important;background-color: var(--main);padding: 20px;text-align: center;font-weight: 500;color: var(--white);border-radius: 10px;}

.flx_instagram_feed{padding: 100px 0;}

/*Banner*/
.flx_banner{position: relative;overflow: hidden;background: var(--beige-dark);color: var(--black);height: 93px;display: flex;align-items: center;white-space: nowrap;}
.flx_banner .track{display: inline-flex;width: max-content;animation: ticker 20s linear infinite;}
.flx_banner .track::after{content: attr(data-duplicate); }
.flx_banner .item{display: inline-block;padding: 0 2rem;font-size: 165%;}
@keyframes ticker {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/*-------------------------------------RESPONSIVE---------------------------------------------------------*/

/*-------------------------------------------------------------------------------------------*/
@media (max-width:1480px){

    .container{padding: 0 50px;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:1199px){

.inhaltsbloecke{margin-top: 200px;}

.flx_textblock .leer{display: none;}
.flx_textblock img{width: 100%;}

#page-header .menuburgerbutton{display: block;}
button.menuburgerbutton{display: block;width:40px;height: 40px;cursor: pointer;  -webkit-transform: rotate(0deg);  -moz-transform: rotate(0deg);  -o-transform: rotate(0deg);  transform: rotate(0deg);  -webkit-transition: .5s ease-in-out;  -moz-transition: .5s ease-in-out;  -o-transition: .5s ease-in-out;  transition: .5s ease-in-out;  cursor: pointer;z-index: 100;right: 35px;position: absolute;border: none;background-color: transparent;top: 30px}
button.menuburgerbutton span{margin: 8px 0; display: block;height: 4px;border-radius: 4px;width: 100%;background-color: var(--black);opacity: 1;left: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;}
button.menuburgerbutton.active span:nth-child(1) {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);margin-top: 12.5px;background-color: var(--black);}
button.menuburgerbutton.active span:nth-child(2){display: none;}
button.menuburgerbutton.active span:nth-child(3) {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);margin-top: -11.5px;background-color: var(--black);}

#page-header .navigation{position: unset;}
#page-header .navigation .menu-topmenue-container{display: none;}
#page-header .navigation.open .menu{flex-direction: column;align-items: baseline;}
#page-header .navigation.open .menu-topmenue-container{display: flex;padding: 10rem 0 5rem 2rem;position: absolute;right: 0;flex-direction: column;width: 50%;height: 100vh;top: 0;background-color: var(--beige);box-shadow: 0 5px 10px #0005;align-items: start;justify-content: start;}
#page-header .navigation.open .menu-topmenue-container a{margin-right: 0!important;padding:0!important;margin-bottom: 2rem;color: var(--black)!important;display: block;font-weight: 400!important;font-size: 130%!important;}
#page-header .navigation.open .menu-topmenue-container a:hover{color: var(--red);}
#page-header .navigation.open .menu-topmenue-container a::before{display: none;}
.startseite #page-header .desktop-menu .menu li:last-child a,
#page-header .desktop-menu .menu li:last-child a{width: max-content;padding: 0;border: none;font-weight: 600!important;color: var(--red)!important;}
.startseite #page-header .desktop-menu .menu li:last-child a:hover,
#page-header .desktop-menu .menu li:last-child a:hover{background-color: transparent;color: var(--black);}

#page-header .logo img{max-height: 55px;}

.startseite button.menuburgerbutton span{margin: 8px 0; display: block;height: 3px;border-radius: 4px;width: 100%;background-color: var(--grey-light);opacity: 1;left: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;}
.startseite #page-header.bottom button.menuburgerbutton span{background-color: var(--black);}
 
.flx_bildblock .bg{height: auto;}

.flx_kursteaser{padding: 150px 0;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:991px) {

    .flx_banner{height: 70px;}
    .flx_banner .item{padding: 0 1rem;font-size: 130%;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:767px) {

    *{font-size: 17px;}

    #page-header .navigation.open .menu-topmenue-container{width: 80%;}

    .btn-outline{padding: 10px 20px;width: max-content;letter-spacing: 1px;margin-top: 10px;}
    .btn{margin-top: 1rem;}

    .flx_textblock p br{display: none;}
    .flx_textblock.nurtext{padding: 70px 0 70px;text-align: left;}
    .flx_textblock.nurtext .headline{margin: 0 0 25px;}
    .flx_textblock.mitbildlinks .text, 
    .flx_textblock.mitbildrechts .text{justify-content: unset;}

    .flx_textblock img{max-width: 100%;}
    .flx_textblock .bild{order: 2;margin-top: 30px;}
    .flx_textblock .text{order: 1;}

    .flx_textblock.nurtext .text{max-width: 100%;}

    .flx_kursteaser{padding: 100px 0;}

    .flx_newsletterblock h2{padding-left: unset;margin-bottom: 30px;}
    .flx_newsletterblock .textinner p{margin-bottom: 40px;}
    .flx_newsletterblock input{width: 100%;}
    .wpcf7 .pflicht, .wpcf7-acceptance .wpcf7-list-item span{font-size: 80%;}

    #page-footer{padding-bottom: 10px;}
    #page-footer .kontakt{order: 2;}
    #page-footer .logo{order: 1;}
    #page-footer .homelink{margin-bottom: 2rem;}
    #page-footer .footermenu{order: 3;margin-top: 3rem;}
    #page-footer .footermenu ul{float: unset;display: flex;gap: 5px;}
    #page-footer .footermenu li{text-align: left;}

    .flx_bildblock .bg{height: 500px;}
    .flx_bildblock.mittext p{top: 30%;left: 15px;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:576px) {

    *{font-size: 15px;}

    .container{padding: 0 30px;}

    button.menuburgerbutton{top: 20px;}

    #page-header .navigation.open .menu-topmenue-container{width: 100%;}

    #page-header .logo object{width: 150px}

    .inhaltsbloecke {margin-top: 130px;}

    .flx_headerblock{height: 80vh!important;background-position: center 0px!important;}
    .flx_headerblock .headlinebox{padding-bottom: 250px;}

    .flx_bildergalerie{padding: 50px 0 80px;}
    .flx_bildergalerie .instagram{margin: 0 auto 50px;}

    .flx_textblock.nurtext p{margin: unset;font-size: 100%;}

    .kurse .flx_textblock.mitbildlinks .bild img, .kurse .flx_textblock.mitbildrechts .bild img{min-height: 300px;width: 100%;}

    .flx_kursteaser{padding: 50px 0;}
    .flx_kursteaser img{height: 450px;}
    .flx_kursteaser .name{font-size: 140%;}

    .flx_newsletterblock h2{width: 100%;}

    .flx_textblock{padding-bottom: 50px;}

    #page-footer .logo-object{max-width: 60px;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:400px) {

    .flx_kursteaser .name{margin-bottom: 30px;}

}