﻿/* ==================================================
   ROOT / DESIGN TOKENS
================================================== */

:root {
    --mellis-base: #A7147F;
    /* --mellis-extra:#f7f5f2;*/
     --mellis-extra:#fbfaf8;
    --space-sm: 24px;
    --space-md: 60px;
    --space-lg: 90px;
    --space-xl: 120px;
}


/* ==================================================
   GLOBAL LAYOUT
================================================== */

section{
  padding:var(--space-lg) 0;
}

.container{
  padding-top:0;
  padding-bottom:0;
}

.section-title{
  margin-bottom:var(--space-md);
}

.section-title__title{
  margin-bottom:32px;
  font-size:25px;
  line-height:1.2;
}

.section-title__tagline{
  font-size:25px;
}


/* ==================================================
   TYPOGRAPHY
================================================== */

section p{
  max-width:560px;
  line-height:1.8;
  margin-bottom:24px;
}

.main-header__contact-list p{
  margin:0;
}


/* ==================================================
   HEADER / HERO
================================================== */

.main-slider{
  margin:0 !important;
  padding:0 !important;
}

.main-slider__content {
    text-align: center;
}
    .main-slider__content p {
        max-width: none;
    }
.main-slider__sub-title {
    display: block;
    width: 100%;
    text-align: center;
    white-space: nowrap;
}
.main-header__top {
    background: #f7f5f2;
}


/* ==================================================
   ABOUT
================================================== */

.welcome-one{
  padding:var(--space-xl) 0;
}

.welcome-one__text{
  font-size:18px;
}

.welcome-one__right{
  padding-left:40px;
}

.welcome-one__img{
  margin-top:-60px;
  margin-left:-40px;
}

.welcome-one__img img{
  width:115%;
  max-width:none;
}

.welcome-one__points li{
  margin-bottom:24px;
}

.welcome-one__points .icon{
  transform:scale(.75);
  color:#c9c9c9;
}


/* ==================================================
   SERVICES SECTIONS
================================================== */

.services-details-one{
  padding:70px 0;
}

.services-details-one__benefits-title{
  margin-bottom:20px;
  font-size:25px;
}

.services-details-one__benefits-points p{
  margin-bottom:0;
}

.services-details-one__benefits-points li .text p{
  color:#fff;
}

#Shiatsu .services-details-one__benefits-points li .text p{
  color:#89868d;
}


/* ==================================================
   EMS SECTION
================================================== */

.ems-section{
  background:#0b0b0d;
  color:#fff;
  position:relative;
  overflow:hidden;
  margin-top:-40px;
}

.ems-section::before{
  content:"";
  position:absolute;
  inset:0;
  /*background:
    linear-gradient(rgba(0,0,0,.85),rgba(0,0,0,.92)),
    url("../images/backgrounds/ems-bg.jpg");*/
  background-size:cover;
  background-position:center;
  z-index:0;
}

.ems-section .container{
  position:relative;
  z-index:2;
}

.ems-section h2,
.ems-section h3{
  color:#fff;
}

.ems-section .icon span{
  background:#ffd400;
  color:#000;
  border-radius:50%;
  padding:6px;
}

.ems-section img{
  filter:contrast(1.08) brightness(.95);
}

.ems-section .titel_red{
  color:#ffd400;
}

.ems-section,
.ems-section p,
.ems-section li,
.ems-section .services-details-one__benefits-text-2{
  color:#fff;
}

#Ems-Training .services-details-one__massages-text-2{
  color:#ffd400;
}



/* ==================================================
   MENU UNDERLINE
================================================== */

.main-menu .main-menu__list > li > a,
.stricky-header .main-menu__list > li > a {
    position: relative;
    text-decoration: none;
}

    /* underline basis */

    .main-menu .main-menu__list > li > a::after,
    .stricky-header .main-menu__list > li > a::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -6px;
        width: 100%;
        height: 2px;
        background: var(--mellis-base);
        opacity: 0;
        transition: opacity .25s ease;
    }

/* hover */

.main-menu .main-menu__list > li:hover > a::after,
.stricky-header .main-menu__list > li:hover > a::after {
    opacity: 1;
}

/* active section */

.main-menu .main-menu__list > li.scrollToLink.current > a::after,
.stricky-header .main-menu__list > li.scrollToLink.current > a::after {
    opacity: 1;
}
.main-menu .main-menu__list > li.scrollToLink.current > a,
.stricky-header .main-menu__list > li.scrollToLink.current > a {
    color: var(--mellis-base);
}
/* ==================================================
   FADE ANIMATION
================================================== */

.fade{
  opacity:0;
  transform:translate3d(0,50px,0) scale(.98);
  transition:opacity .8s ease-out,
             transform .8s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform;
}

.fade.show{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}


/* Disable animation during resize */

.resize-animation-stop *{
  transition:none !important;
  animation:none !important;
}


/* ==================================================
   SECTION BACKGROUNDS
================================================== */

#about,
#Myofascial-Release,
#Personaltraining{
  background:#fbfaf8;
}

#Shiatsu{
  background:#f7f5f2;
}

#Ems-Training{
  background:#0b0b0d;
}


/* ==================================================
   FOOTER
================================================== */

.elite-footer{
  background:#fff;
  border-top:1px solid #e6d5df;
  padding:80px 0 40px;
}

.footer-container{
  max-width:1200px;
  margin:auto;
  padding:0 20px;
}

/* CTA */

.footer-cta{
  text-align:center;
  margin-bottom:60px;
}

.footer-cta h2{
  color:#b0177b;
  max-width:700px;
  margin:auto;
}

.footer-cta p{
  max-width:600px;
  margin:15px auto 0;
  line-height:1.7;
}


/* GRID */

.footer-main{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  align-items:center;
  text-align:center;
  gap:40px;
}


/* LOGO */

.footer-logo img{
  max-width:260px;
}


/* CONTACT */

.footer-contact p{
  margin:6px 0;
  color:#6d6d6d;
}


/* SOCIAL */

.footer-social a{
  display:block;
  color:#b0177b;
  text-decoration:none;
  margin:8px 0;
  transition:.3s;
}

.footer-social a:hover{
  opacity:.7;
}


/* COPYRIGHT */

.footer-bottom{
  text-align:center;
  margin-top:60px;
  font-size:14px;
  opacity:.6;
}


/* ==================================================
   MOBILE
================================================== */

@media(max-width:768px){

  section{
    padding:60px 0;
  }

  .welcome-one{
    padding:80px 0;
  }

  .services-details-one{
    padding:50px 0;
  }

  .row{
    --bs-gutter-x:20px;
  }

  .footer-main{
    grid-template-columns:1fr;
  }

  .footer-cta h2{
    font-size:28px;
  }

}

@media(max-width:767px){
  .section-title__title{
    font-size:32px;
  }
}

#Kontakt {
    min-height: 900px;
}