
/* General  **************************/

* { box-sizing:border-box; }

html { background:#fff; color:#464646; cursor:default; line-height:1.3; overflow:hidden; overflow-y:auto; height:100%; min-width:380px; }
body { font-size: 16px; font-family:'Open Sans', Arial, sans-serif; height:100%; }

img { max-width:100%; height:auto; vertical-align: top; box-sizing: content-box; }

svg { height:auto; }
svg * { fill:currentColor !important; }

ul, li { list-style: none; padding:0; margin:0; }
a { text-decoration: none; color:currentColor; }
p { margin:24px 0; }

blockquote { color:#910f42; margin:0 0 24px; padding:0 0 17px; font-size:29px; font-style: italic; border-bottom: 1px solid currentColor; }
blockquote div { display: inline-block; }
blockquote .author { display: block; font-style: normal; font-size:16px; padding:4px 0 0; }

.subtitle + blockquote { margin-top:35px; }
.subtitle + blockquote div { border-top:1px solid currentColor; padding:17px 0 0; }

h1, h2, h3, h4, h5, .htitle { margin:0; color:#910f42; display:block; }


.clearfix:after { content:''; display:table; clear:both; }

.relative { position: relative; }

.valign-mid { font-size:0; }
.valign-mid:before { content:' '; display: inline-block; vertical-align:middle; height:100%; width:0.01%; }
.valign-mid > * { display: inline-block; vertical-align: middle; width:99.99%; }

.align-right { float:right; margin:0 0 20px 15px; }
.align-left { float:left; margin:0 15px 20px 0; }


.wrapper { max-width:1000px; height:100%; padding:0 20px; margin:0 auto; position: relative; }
.wrapper:after { content:''; display:table; clear:both; }

section, .in-section { position: relative; overflow: hidden; z-index:1; }
.in-section { padding:40px 0 60px; opacity:0; transition:opacity 400ms ease-in; }
.active .in-section { opacity:1; }


.cols { margin:40px 0; }
.cols.two .col { width:50%; padding:0 25px; float:left; position: relative; border-right:1px solid #910f42; }
.cols.two .col:first-child { padding-left: 0; }
.cols.two .col:last-child { padding-right: 0; border:0; }
.cols.two .col > :first-child { margin-top:0 !important; }
.cols.two .col > :last-child { margin-bottom:0 !important; }


.title { color:#910f42; font-size:48px; margin:0 0 40px; font-weight:600; overflow: hidden; position: relative; text-transform: uppercase; }
.title span { display: inline-block; position: relative; }
.title span:after { content:' '; position: absolute; bottom:13px; left:100%; margin:0 0 0 6px; width:100vw; height:1px; background:currentColor; }
.subtitle { color:#910f42; font-size:30px; margin:20px 0; font-weight:700; }

.link-download { position: absolute; z-index:5; top:0; right:0; display:inline-block; width:175px; height:150px; padding:0 25px 0 0; text-align: center; }
.link-download:hover { opacity:0.95; }
.link-download span { font-size:20px; text-transform: uppercase; line-height:1.3; font-weight:600; }
.link-download .icon-arrow { display: block; }
.link-download:hover .icon-arrow { top:3px; }

.links-download { text-align: center; }
.links-download .link-download { position:static; width:140px; height:121px; margin:24px 35px 18px; padding-right: 19px; }
.links-download .link-download span { font-size:16px; line-height:1.2; font-weight:400; }
.links-download .link-download .icon-arrow { top:-2px; }
.links-download .link-download:hover .icon-arrow { top:1px; }
.links-download .link-download .icon-arrow:before { width:14px; height:14px; }


.icon-arrow { text-align: center; height:0; position: relative; top:0; transition:all 150ms ease-out; }
.icon-arrow:before { content:' '; display:inline-block; width:18px; height:18px; border:1px solid #fff; border-width:0 1px 1px 0; transform: rotate(45deg); }
.icon-arrow.right:before { transform: rotate(-45deg); }


.pink { color:#910f42 !important; }

.bg-dark { color:#f9f9f9; }
.bg-dark .title,
.bg-dark .subtitle,
.bg-dark blockquote,
.bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4, .bg-dark h5, .bg-dark .htitle { color:#f9f9f9; }
.bg-pink { background:#910f42; }
.bg-stain { background:url('../img/bg-stain.png') no-repeat 0 0; background-size:contain; color:#fff; }
.bg-stain-twin { background:url('../img/bg-stain-twin.png') no-repeat 0 0; background-size:contain; color:#fff; }

.content { line-height:1.5; }
.content h2, .content h3, .content .htitle { font-size:20px; font-weight:700; margin:24px 0; }
.content li { position:relative; padding:0 0 0 15px; }
.content ul { margin:24px 0; }
.content li:before { content:"\002022"; color:#910f42; padding:0 5px 0 0; top:0.05em; left:0; position: absolute; }
.content ul.list li { padding:0; margin:18px 0; line-height:1.3; }
.content ul.list li:before { display:none; }
.content ul.list li .label { display: block; float:left; padding:0 20px 0 0; font-weight: 700; margin:0 0 5px; }
.content ul.list li .detail { display: block; overflow: hidden; }
.content a { text-decoration: underline; }

.top-file > .title,
.top-file > .subtitle,
.top-file > blockquote > div { margin-right:190px; }
.top-file > blockquote:first-child { margin-right:190px; margin-bottom:45px; }
.top-file > blockquote:first-child > div { margin-right:0; }

/* Header **************************/

#header { position: fixed; top:0; left:0; width:100%; z-index:99; background:#fff; border-top:10px solid #910f42; text-align: center; }
#header:after { content:' '; height:1px; position: absolute; bottom:-1px; left:0; width:100%; background:#910f42; }

/* animate */
#header { border-top-color:transparent; transition:border 300ms 2000ms ease-out; }
.lets-start #header { border-top-color:#910f42; }
#header .wrapper { visibility: hidden; opacity:0; }
.lets-start #header .wrapper { visibility:visible; opacity:1; transition:opacity 700ms 2200ms ease-out; }
#header:after { width:0; opacity:0; transition:all 300ms 1500ms ease-out; }
.lets-start #header:after { width:100%; opacity:1; }


#header nav { float:left; text-align: left; font-size:0; margin:19px 0 17px; }
#header nav li { display: inline-block; position: relative; font-size:18px; line-height:1; }
#header nav li a { padding:5px 11px; border:1px solid transparent; border-width:0 1px; display:block; transition:color 150ms ease-out; }
#header nav li a:hover,
#header nav li.active a { color:#fff; }
#header nav li:before { content:' '; display:block; position: absolute; left:1px; right:1px; top:10px; height:100%; background:#910f42; opacity:0; transform:scale(0.5); z-index:-1; transition:opacity 150ms ease-out, top 150ms ease-out, transform 150ms ease-out; }
#header nav li:hover:before,
#header nav li.active:before { opacity:1; top:0; transform: scale(1); }

#header .logo { display:none; }

#header .social { float:right; text-align: right; padding:15px 0; font-size:0; }
#header .social li { display: inline-block; vertical-align: middle; margin:0 0 0 6px; }
#header .social li:first-child { margin:0; }
#header .social li a { display:block; height:35px; width:38px; line-height:34px; text-align: center; }
#header .social li a:hover { opacity:0.95; }
#header .social li a img { vertical-align: middle; }


#header .switch-language { position: absolute; text-align: right; top:100%; right:0; background:#fff; border-radius:0 0 5px 5px; border:1px solid #910f42; border-top: 0; font-size: 0; padding:0 3px; }
#header .switch-language li { display: inline-block; vertical-align: middle; margin:0; }
#header .switch-language li a { display:block; padding:5px 3px; font-size:13px; }
#header .switch-language li a span { display:block; /*height:12px; overflow: hidden;*/ }
#header .switch-language li a img { position: relative; top:-100%; }
#header .switch-language li a:hover { text-decoration:underline; }
#header .switch-language li a:hover img,
#header .switch-language li.active a img { top:0; }


#header .ham-nav { display:none; }


/* Footer **************************/
#footer { background:#fff; text-align: right; padding:20px 0;  color:#910f42; }
#footer .copyright span { font-size: 14px; vertical-align:bottom; display: inline-block; }
#footer .copyright .picture {  vertical-align:bottom; width:94px; padding:0 0 0 5px; position: relative; top:4px; }


/* Sections ********************************/

/* Section - home */
#section-home .in-section.top { height:684px; max-height:684px; text-align: center; padding:0; }
#section-home .in-section.top .logo { padding:130px 20px 0; }
#section-home .in-section.top .bg { position: absolute; left:0; bottom:0; width:100%; height:100%; z-index:-1; background:url('../img/bg-section-home.jpg') no-repeat 50% 100%; }
#section-home .in-section.top .scroll { position: absolute; bottom:42px; left:50%; margin:0 0 0 -40px; width:80px; height:75px; line-height:75px; cursor:pointer; }
#section-home .in-section.top .scroll .icon-arrow { animation:scroll 600ms ease-in infinite alternate; }

#section-home .in-section.bottom { padding-bottom:60px; }
#section-home .in-section.bottom blockquote { border:0; margin-bottom:25px; }
#section-home .in-section.bottom .bg-splash { position: absolute; top:-112px; left:-250px; width:560px; height:388px; background:url('../img/bg-splash.png') no-repeat 0 0; z-index:-1; }

/* animate */
#section-home .in-section.top .logo { opacity:0; transform:translateY(-10px); filter:blur(1px); transition:all 850ms 600ms ease-in; }
.lets-start #section-home .in-section.top .logo { opacity:1; transform:translateY(0); filter:blur(0); }
#section-home .in-section.top .bg { bottom:-100px; opacity:0; filter:blur(5px); transition:all 1300ms ease-out;  }
.lets-start #section-home .in-section.top .bg { bottom:0; opacity:1; filter:blur(0); }
#section-home .in-section.top .scroll { opacity:0; transition:all 350ms 2300ms ease-out; }
.lets-start #section-home .in-section.top .scroll { opacity:1; }


/* Section MBSR */
#section-mbsr .in-section.second { background:#ececec; }


/* Section Coaching */
#section-coaching { background:url('../img/bg-section-coaching.jpg') no-repeat 50% 100%; background-size: cover; }


/* Section Termine */
#section-termine { background:#d5d5d5; }
#section-termine .cols .item { margin:24px 0; }
#section-termine .cols .item .pink { display:block; }


/* Section Profil */
#section-profil .portrait { max-width:50%; }
#section-profil .social { font-size:0; margin:30px 0 0; }
#section-profil .social li { display: inline-block; vertical-align:middle; margin:0 20px 0 0; }
#section-profil .social li a { display:block; }
#section-profil .social li a:hover { opacity:0.95; }


/* Section Links */
#section-links { background:url('../img/bg-section-links.jpg') no-repeat 50% 0; background-size: cover; }
#section-links .links { margin:40px 0; }
#section-links .links li { margin:20px 0; }
#section-links .links li a { font-size:18px; margin-right:12px; background:#910F42; display:inline-block; min-width:36%; padding:10px 110px 10px 10px; color:#fff; position: relative; }
#section-links .links li a:hover { opacity:0.95; }
#section-links .links li a .bg-stain-twin { width:90px; position: absolute; top:-1px; right:-22px; bottom:-1px; padding-right:20px; background-position:100% 50%; text-align:right; }
#section-links .links li a .icon-arrow { top:-7px; width:auto; }
#section-links .links li a .icon-arrow:before { width:14px; height:14px; }

#section-links .links-cds { margin:0; font-size:0; }
#section-links .links-cds li { display: inline-block; margin:140px 40px 0 0; vertical-align:bottom; }
#section-links .links-cds li a { display:block; background:#910F42; min-height:60px; padding:5px 37px 5px 10px; color:#fff; font-size:20px; position: relative; z-index:0; }
#section-links .links-cds li a .bg-stain { width:135px; height:125px; position: absolute; bottom:100%; left:50%; margin:0 0 -18px -67px; z-index:-1; }
#section-links .links-cds li a .bg-stain:before { content:' '; position: absolute; top:0; left:0; width:100%; height:100%; background:url('../img/icon-audiocd.png') no-repeat 50% 50%; transition:all 450ms ease-out; }
#section-links .links-cds li a span { display:block; }
#section-links .links-cds li a .label { font-weight: 700; }
#section-links .links-cds li a .name { font-size:18px; }
#section-links .links-cds li a .icon-arrow { position: absolute; top:50%; right:10px; margin:-9px 0 0; }
#section-links .links-cds li a:hover { opacity:0.95; }
#section-links .links-cds li a:hover .bg-stain:before { transform:rotate(300deg); }


/* Section Contact */
#section-contact { background:#858585 url('../img/bg-section-contact.png') repeat-x 0 0; }
#section-contact .in-section { padding-bottom:0; }
#section-contact .portrait { display: inline-block; vertical-align: bottom; margin-right:-110px; width:60%; }
#section-contact .detail-infos { display: inline-block; vertical-align: bottom; width:46%; }
#section-contact .detail-infos .content > :first-child { margin-top:0; }
#section-contact .detail-infos .infos .info { margin:5px 0; width:50%; float:left; padding-right:10px; }
#section-contact .detail-infos .infos .info img { float:left; padding:0 14px 0 0; }
#section-contact .detail-infos .infos .info span { display: block; overflow: hidden; word-wrap: break-word; padding:7px 0 0; }
#section-contact .detail-infos .link-download { position: static; margin:28px 0; clear:both; }
#section-contact .detail-infos .link-download span { font-size:24px; }




@media screen and (max-width:1024px) {

    /* General ***************************/

    .links-download .link-download { margin:20px 20px 10px; }


    /* Header **************************/

    #header .logo { height:48px; margin:8px 0 0; display: inline-block; opacity:0; transition:opacity 250ms ease-out; }
    html:not([data-section=section-home]) #header .logo { opacity:1; cursor:pointer; }

    #header nav { position: absolute; z-index:5; top:100%; left:0; width:100%; margin:0; visibility:hidden; opacity:0; background:rgba(255,255,255,0.9); transition:opacity 150ms ease-out; }
    #header.opened nav { visibility: visible; opacity:1; }
    #header.opened nav li { display: block; text-align: center; }
    #header.opened nav li a { padding:20px; }
    #header.opened nav li::before { left:0; right:0; }

    #header .ham-nav { margin:11px 0 0; float:left; display:block; cursor:pointer; height:4px; border:20px solid transparent; width:45px; color:#910f42; background:currentColor; position: relative; z-index:1; background-clip: content-box; box-sizing: content-box; -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
    #header .ham-nav:before,
    #header .ham-nav:after { content:' '; display: block; position: absolute; width:100%; height:100%; background:currentColor; transition:top 150ms ease-out 100ms, transform 150ms ease-out; }
    #header .ham-nav:before { top:-11px;  }
    #header .ham-nav:after { top:11px; }
    #header .ham-nav:hover:before { top:-14px;  }
    #header .ham-nav:hover:after { top:14px; }
    #header.opened .ham-nav { background-color:transparent; }
    #header.opened .ham-nav:before,
    #header.opened .ham-nav:after { top:0; transform:rotate(-45deg); transition:top 150ms ease-out, transform 150ms ease-out 100ms; }
    #header.opened .ham-nav:after { transform:rotate(45deg); }


    /* Sections ********************************/

    /* Section - home */
    #section-home .in-section.top { height:80vw; min-height:350px; }
    #section-home .in-section.top .bg { background-size:230% auto; }


    /* Section Contact */
    #section-contact .detail-infos { width:auto; display:block; position: relative; }
    #section-contact .detail-infos .content { float:left; }
    #section-contact .detail-infos .infos { overflow: hidden; padding:40px 0 0 7%; }
    #section-contact .portrait { display:block; width:auto; margin:30px 40% 0 5%; clear:both; text-align:left; }
    #section-contact .detail-infos .link-download { position: absolute; top:100%; right:18%; margin-top:45px; }


}

@media screen and (max-width:768px) {

    /* General **************************/

    .cols.two .col { float:none; width:auto; padding:0; border:0; }


    /* Sections ********************************/

    /* Section Profil */
    #section-profil .portrait { float:none; margin:0 auto; display:block; max-width:85%; }

    /* Section Contact */
    #section-contact .detail-infos .content { float:none; }
    #section-contact .detail-infos .infos { overflow: visible; padding:0; }

}

@media screen and (max-width:560px) {

    /* General **************************/

    .title { overflow: visible; }
    .title span { display: block; word-wrap: break-word; }
    .title span:after { left:0; bottom:-10px; width:100%; }

    .top-file > .title,
    .top-file > .subtitle,
    .top-file > blockquote div { margin-right:0; }
    .top-file > blockquote:first-child { margin-right:0; margin-bottom:24px; }

    .link-download { position:static; margin:0 auto; display:block; }

    .links-download .link-download { margin:10px; }

    .content ul.list li .label { display: block; float:none; }



    /* Header **************************/

    #header .logo { display:none !important; }


    /* Sections ********************************/

    /* Section - home */
    #section-home .in-section.top .logo { padding-top:110px; }


    /* Section Contact */
    #section-contact .detail-infos .infos .info { width:auto; float:none; clear:both; margin:0; padding:5px 0; }
    #section-contact .detail-infos .link-download { right:30px; }


}
