/*
    Author     : Daniel Romahn
*/

@font-face {
    font-family: PTSans-Regular;
    font-display: swap;
    font-style: normal;
    src: local('PTSans-Regular'),url('../../font/PT_Sans/PTSans-Regular.ttf') format("opentype");
}

:root{
    --vitgray: #606970;
    --vitgreen: #769900;
    --vitgreena50: rgba(118, 153, 0, .5);
    --vitgreenmint: rgba(197, 209, 20, 0.3);
    --vitblue: #3a3651;
    --vitred: #b92668;
    --smokewhite: #F5F5F5;
    --white: #fff;
    --black: #000;

    --vit1a50: rgba(185, 38, 104, .5);
    --vit2a50: rgba(118, 153, 0, .5);
    /*--vit2a50: rgba(190, 230, 50, .5);*/
    --vit3a50: rgba(137, 102, 162, .5);
    --vit4a50: rgba(185, 148, 38, .5);
    --vit5a50: rgba(197, 201, 174, .5);
    --vitbluergb: rgba(58, 54, 81, .9);
}

/* CLEditor */
.cleditorMain iframe{
    width: 100% !important;
}

.cleditorMain textarea{
    width: 100% !important;
}

input[required]:valid, select[required]:valid{
    border: 1px solid green !important;
}

input[required]:invalid, select[required]:invalid {
    border: 1px solid red !important;
}

html, body {
    font-family: PTSans-Regular;
    background-color: var(--smokewhite);
}

.font-size-20{
    font-size: 20px;
}

/* farben */

.text-vitgray{
    color: var(--vitgray);
}

.bg-vitgray{
    background-color: var(--vitgray);
}

.bg-smokewhite{
    background-color: var(--smokewhite) !important;
}

.vitgreen2{
    color: var(--vitgreen) !important;
}

.bg-vitgreen2{
    background-color: var(--vitgreen) !important;
}

.border-5-vitgreen2{
    border: 5px solid var(--vitgreen) !important;
}

.vitblue{
    color: var(--vitblue) !important;
}

.bg-vitblue{
    background-color: var(--vitblue) !important;
}

.border-5-vitblue{
    border: 5px solid var(--vitblue) !important;
}

.vitred{
    color: var(--vitred) !important;
}

.bg-vitred{
    background-color: var(--vitred) !important;
}

.bg-vit1{
    background-color: var(--vit1a50) !important;
}

.bg-vit2{
    background-color: var(--vit2a50) !important;
}

.bg-vit3{
    background-color: var(--vit3a50) !important;
}

.bg-vit4{
    background-color: var(--vit4a50) !important;
}

.bg-vit5{
    background-color: var(--vit5a50) !important;
}

.bg-site-blau{
    background-color: rgba(207, 226, 255, .7)  !important;
}

.bg-site-vitred{
    background-color: rgba(245, 91, 159, .1)  !important;
    /*background-color: rgba(185, 38, 104, .1)  !important;*/
}

.bg-site-vitgreen{
    background-color: rgba(209, 231, 221, .5)  !important;
}

.bg-site-vityellow{
    background-color: rgba(255, 243, 205, .5)  !important;
}

/* grundeinstellungen */

.header{
    height: 90px !important;
}

.header-text1{
    background-color: var(--vitred);
    opacity: 0.8;
    color: #fff !important;
    padding: .5rem;
    font-size: 80px;
    position: absolute;
    top: -14rem;
    left: -11rem;
}

.header-text3{
    background-color: var(--vitred);
    opacity: 0.8;
    color: #fff !important;
    padding: .5rem;
    font-size: 80px;
    position: absolute;
    top: -14rem;
    right: -8rem;
}

.header-text2{
    background-color: #fff;
    opacity: 0.8;
    color: var(--vitred) !important;
    padding: .5rem;
    font-size: 40px;
    position: absolute;
    top: -6rem;
    left: -8rem;
}

.header-text4{
    background-color: #fff;
    opacity: 0.8;
    color: var(--vitred) !important;
    padding: .5rem;
    font-size: 40px;
    position: absolute;
    top: -6rem;
    right: -4rem;
}

.inhalt {
    position: relative;
    min-height: calc((100vh - 90px) - 0px);
    /*margin: 0 auto;*/
}

.footer-rep{
    position: relative;
    margin-bottom: -6rem;
}

/*.sticky-footer{
    position:relative;
    bottom: 0;
    height: 0px;
}*/

.sprung {
    visibility: hidden;
    height: 0px !important;
    position: absolute;
    margin: -5rem;
}

.text-block {
    hyphens: auto; 
    text-align: justify
}

/* parallax */

.parallax_section{
    background-image: url("../../images/h2.png");
    /*height: 600px;*/
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: 100% auto;
    background-position: center;
    position:relative;
    overflow: hidden;
    isolation: isolate;
    padding-bottom: 25px;
    color: var(--smokewhite);
}

.parallax_section::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient( 0deg, var(--vitbluergb), rgb(0 0 0 / 0) );
    z-index: -1;
}

.bg-section-pic{
    background-image: url("../../images/h2.png");
    /*height: 600px;*/
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: 100% auto;
    background-position: center;
    position:relative;
    overflow: hidden;
    isolation: isolate;
    padding-bottom: 25px;
}

.bg-section-pic::before{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(207, 226, 255, .9);
    z-index: -1;
}

.bg-section-pic2{
    background-image: url("../../images/h2.png");
    /*height: 600px;*/
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: 100% auto;
    background-position: center;
    position:relative;
    overflow: hidden;
    isolation: isolate;
    padding-bottom: 25px;
}

.bg-section-pic2::before{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(209, 231, 221, .9);
    z-index: -1;
}

.bg-section-pic3{
    background-image: url("../../images/h2.png");
    /*height: 600px;*/
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: 100% auto;
    background-position: center;
    position:relative;
    overflow: hidden;
    isolation: isolate;
    padding-bottom: 25px;
}

.bg-section-pic3::before{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(245, 91, 159, .9);
    /*background: rgba(185, 38, 104, .9);*/
    z-index: -1;
}

/* Captcha */

.capbox {
    background-color: #BBBBBB;
    background-image: linear-gradient(#BBBBBB, #3a3651);
    /*border: #2A7D05 0px solid;*/
    /*border-width: 2px 2px 2px 20px;*/
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: inline-block;
    padding: 3px 3px 3px 3px;
    border-radius: .3rem;
}

.capbox-inner {
    /*font: bold 12px arial, sans-serif;*/
    color: #000000;
    background-color: #E3E3E3;
    margin: 0px auto 0px auto;
    padding: 3px 10px 5px 10px;
    border-radius: .3rem;
    display: inline-block;
    vertical-align: middle;
}

#CaptchaDiv {
    color: #000000;
    font: normal 25px Impact, Charcoal, arial, sans-serif;
    font-style: italic;
    text-align: center;
    vertical-align: middle;
    background-color: #FFFFFF;
    user-select: none;
    display: inline-block;
    padding: 3px 14px 3px 8px;
    margin-right: 3px;
    margin-left: 3px;
    border-radius: .3rem;
}

#CaptchaInput {
    /*border: 1px solid red !important;*/
    margin: 3px 0px 1px 0px;
    /*width: 105px;*/
    width: 80%;
    border-radius: .3rem;
}

/* Captcha end */


/* breiten */
.w-10{
    min-width: 10% !important;
}

.w-20{
    min-width: 20% !important;
}

.w-30{
    min-width: 30% !important;
}
.w-150{
    width: 150% !important;
}

.input-width-220{
    max-width: 220px !important;
}
/* --- */

.section{
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.card-footer-neg{
    background-color: initial;
    border-top: 0;
}

.h6nav2{
    margin-top: 2px !important;
}

.map-size{
    min-width: 20rem;
    max-width: 20rem;
    min-height: 20rem;
    max-height: 20rem;
    border:0;
}

fieldset {
    display: block;
    margin-left: 2px;
    margin-right: 2px;
    padding-top: 0.35rem;
    padding-bottom: 0.625rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.fieldset-border-red{
    border: 2px solid var(--vitred) !important;
}

.fieldset-border-green{
    border: 2px solid var(--vitgreen) !important;
}

legend {
    float: none !important;
    width: 100% !important;
    padding: .5rem !important;
    margin-bottom: .5rem !important;
    /*font-size: calc(1.275rem + .3vw);*/
    line-height: inherit !important;
}

.blur{
    filter: blur(1rem);
}


@media all and (min-width: 970px) {
    .navbar .nav-item .dropdown-menu{ display: none; }
    .navbar .nav-item:hover .nav-link{   }
    .navbar .nav-item:hover .dropdown-menu{ display: block; }
    .navbar .nav-item .dropdown-menu{ margin-top:0; }
}

.header2-fixed-top{
    margin-top: 90px !important;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 2;
}

.navbar-height{
    height: 90px !important;
}

.nav-linkstyle{
    color: var(--black) !important;
}

/*.nav-linkstyle:hover{
    background-color: var(--vitgreenmint);
    border-radius: .5rem;
}*/

.nav-linkstyle:hover{
    color: var(--vitred) !important;
}

.nav2-style{
    height: 30px;
    z-index: 5;
    margin-top: 90px !important;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
}

.u-style{
    border-bottom-right-radius: 1.5rem;
    border-bottom-left-radius: 1.5rem;
}

.nav2-link{
    text-decoration: none;
    /*margin-left: 3px;*/
    /*margin-right: 3px;*/
    display: block;
    padding: 0 !important;
    margin-top: 2px !important;
}

.nav2-link:hover{
    color: var(--black) !important;
    background-color: white;
    height: 30px !important;
}


/*hr:not([size]) {
    height: 2px;
}*/

.trainer{
    width: 13rem;
    height: 13rem;
}

.trainer:hover{
    width: 16rem;
    height: 16rem;
}

.wbox1, .wbox2, .wbox3 {
    transition: all 0.5s cubic-bezier(.25,.8,.25,1);
}

.wbox1:hover, .wbox2:hover, .wbox3:hover{
    border-top-left-radius: 10px !important;
    border-bottom-left-radius: 10px !important;
    animation-name: example;
    animation-duration: 0.4s;
    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22) !important;
}
.wbox1:hover {
    border-left: 8px solid var(--vitblue) !important;
}

.wbox2:hover {
    border-left: 8px solid var(--vitred) !important;
}

.wbox3:hover{
    border-left: 8px solid var(--vitgreen) !important;
}



.no-resize{
    resize: none;
}

.social{
    display: inline-block;
    width: 35px;
    height: 35px;
    background-color: lightgray !important;
    color: white;
}

.social:hover{
    color: black;
}
/* rechte seite nav */
.nav.side{
    position: fixed;
    margin-top: 9rem;
    margin-left: 99%;
    z-index: 8;
}
.nav ul{
    list-style: none;
    padding: 0;
}

.nav ul li{
    position: relative;
}

.nav ul li .nav-link{
    color: var(--white) !important;
    transition: all .5s linear;
    text-decoration: none !important;
    transform: translate(-100%,0);
    background-color: var(--vitgreen);

    /*width: 23rem;*/
}

nav li .nav-link i {
    position: absolute;
}

ul li .nav-link span {
    display: none;
    position: relative;
    top: -42px;
    left: 60px;
    padding: .5rem !important;
    margin-left: -.5rem !important;
    margin-right: -.5rem !important;
    color: var(--white) !important;
    border-radius: .25rem !important;
}

.nav ul li .nav-link:hover{
    width: 23rem;
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, .3);
    background-color: var(--vitgreena50) !important;
}

ul li:hover .nav-link span {
    display: block;
}

.sidenav{
    margin-right: 0;
}

.sidenavitem{
    width: 75px;
    height: 60px;
    color: var(--white);
}
/* rechte seite nav  ende */

.bereiche{
    text-decoration: none;
    color: inherit;
}

.bereiche:hover{
    text-decoration: underline;
    color: inherit;
    /*font-weight: bold;*/
}

.bereichebla{
    height: 5rem;
    opacity: 0.8;
}

.bereich-fitness{
    margin-top: -15rem;
}

.wbtn:hover{
    color: var(--vitred) !important;
    border-color: var(--vitred) !important;
    background-color: transparent !important;
}

.b1btn{
    color: var(--vitblue) !important;
    border-color: var(--vitblue) !important;
    background-color: var(--white) !important;
}

.b1btn:hover{
    color: var(--white) !important;
    border-color: var(--white) !important;
    background-color: var(--vitblue) !important;
}

.b1abtn{
    color: var(--white) !important;
    border-color: var(--white) !important;
    background-color: var(--vitblue) !important;
}

.b1abtn:hover{
    color: var(--vitblue) !important;
    border-color: var(--vitblue) !important;
    background-color: var(--white) !important;
}

.b2btn{
    color: var(--vitred) !important;
    border-color: var(--vitred) !important;
    background-color: var(--white) !important;
}

.b2btn:hover{
    color: var(--white) !important;
    border-color: var(--white) !important;
    background-color: var(--vitred) !important;
}

.b3btn{
    color: var(--vitgreen) !important;
    border-color: var(--vitgreen) !important;
    background-color: var(--white) !important;
}

.b3btn:hover{
    color: var(--white) !important;
    border-color: var(--white) !important;
    background-color: var(--vitgreen) !important;
}

.b3abtn{
    color: var(--white) !important;
    border-color: var(--white) !important;
    background-color: var(--vitgreen) !important;
}

.b3abtn:hover{
    color: var(--vitgreen) !important;
    border-color: var(--vitgreen) !important;
    background-color: var(--white) !important;
}

.b4btn{
    color: var(--white) !important;
    border-color: var(--vitgray) !important;
    background-color: var(--vitgray) !important;
}

.b4btn:hover{
    color: var(--vitgray) !important;
    border-color: var(--vitgray) !important;
    background-color: var(--white) !important;
}

.cardhover:hover{
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.5) !important;
}

.rounded-4{
    border-radius: .4rem !important;
}
.rounded-5{
    border-radius: .5rem !important;
}
.rounded-6{
    border-radius: .6rem !important;
}
.rounded-7{
    border-radius: .7rem !important;
}
.rounded-8{
    border-radius: .8rem !important;
}
.rounded-9{
    border-radius: .9rem !important;
}
.rounded-10{
    border-radius: 1rem !important;
}

.padding-left-rep{
    padding-left: 14rem;
}

.padding-right-rep{
    padding-right: 14rem;
}

/* Cookiewarner */
#footer-cookie,
#footer-cookie * {
    box-sizing: border-box;
}

#footer-cookie {
    display: none;
    position: fixed;
    bottom: 15%;
    left: 50%;
    transform: translateX(-50%);
    overflow: hidden;
    width: 50%;
    min-height: 50%;
    padding-left: 30px;
    padding-right: 30px;
    /*line-height: 40px;*/
    background: var(--white);
    color: var(--vitblue);
    z-index: 9;
    border: 2px solid var(--vitblue);
}

#footer-cookie .custom-font {
    color: var(--vitblue);
    font-size: xx-large;
}

#footer-cookie #accept .custom-font {
    border: 1px solid var(--vitblue);
    padding: 10px 40px;
    text-decoration: none;
}

@media (max-width: 993px) {
    #footer-cookie {
        width: 100%;
    }

    #footer-cookie #accept .custom-font {
        width: 100%;
        display: block;
        text-align: center;
    }
}

/* gallery */
.gal {
    -webkit-column-count: 4; /* Chrome, Safari, Opera */
    -moz-column-count: 4; /* Firefox */
    column-count: 4;
}

/*.gal .imggray{ width: 100%; padding-bottom: 15px;}*/
.gal .imgstyle{ width: 100%; padding-bottom: 15px;}
@media (max-width: 500px) {

    .gal {
        -webkit-column-count: 1; /* Chrome, Safari, Opera */
        -moz-column-count: 1; /* Firefox */
        column-count: 1;
    }

}

/* gallery end */

@media only screen and (max-width: 576px) {
    .custom-vh-1{
        min-height: 50vh;
    }

    .top-rep{
        margin-top: 3rem;
        background-color: whitesmoke;
        padding: 1rem;
        border: 1px solid #c5d114;
        border-radius: .5rem;
    }

    .nav2-rep{
        margin-top: -0.25rem;
        background-color: var(--vitblue);
        padding: 1rem;
        border: 1px solid var(--vitgreen);
        border-radius: .5rem;
    }
    .nav2-ausrichtung{
        margin-top: -1rem;
    }
    .nav2-link{
        margin-bottom: 5px;
    }
    .navbar-brand{
        text-align: start !important;
    }
    .logo{
        width: 200px;
    }
    .scrolling{
        height: 50vh;
        overflow-y: auto;
    }
    .bereich-fitness{
        margin-top: 0;
    }
    #fitness{
        margin-top: 2rem;
    }
    .h6nav2{
        margin-top: 0px !important;
    }
    #nav2links{
        font-size: 0.75rem;
    }
    #sbereiche{
        font-size: 0.75rem;
        margin-top: 2px;
    }
    #fad{
        text-align: left !important;
    }
    .nav.side{
        margin-left: 95% !important;
    }
    .padding-left-rep{
        padding-left: 0;
    }

    .padding-right-rep{
        padding-right: 0;
    }
    .footer-rep{
        position: relative;
        margin-bottom: -2rem;
    }
    .footer-rep2{
        justify-content: center !important;
    }
    .pfeil{
        display: none;
    }
    .header-text1{
        font-size: 20px;
        top: -3rem;
        left: -1rem;
    }
    .header-text2{
        font-size: 10px;
        top: -.5rem;
        left: 0rem;
    }
    .header-text3{
        font-size: 20px;
        top: -3rem;
        right: 2rem;
    }
    .header-text4{
        font-size: 10px;
        top: -.5rem;
        right: 3rem;
    }
}

@media only screen and (min-width: 577px) and (max-width: 768px) {
    .custom-vh-1{
        min-height: 48vh;
    }
    .top-rep{
        margin-top: 3rem;
        background-color: whitesmoke;
        padding-left: 1rem;
        padding-right: 1rem;
        border: 1px solid var(--vitgreen);
        border-radius: .5rem;
    }
    .nav2-rep{
        margin-top: -0.25rem;
        background-color: var(--vitblue);
        padding: 1rem;
        border: 1px solid var(--vitgreen);
        border-radius: .5rem;
    }
    .nav2-ausrichtung{
        margin-top: -1rem;
    }
    .nav2-link{
        margin-bottom: 5px;
    }
    .navbar-brand{
        text-align: start !important;
    }

    .logo{
        width: 200px;
    }
    .scrolling{
        max-height: 50vh;
        overflow-y: auto;
    }
    .bereich-fitness{
        margin-top: 0;
    }
    #fitness{
        margin-top: 2rem;
    }
    .nav.side{
        margin-left: 97% !important;
    }
    .padding-left-rep{
        padding-left: 6rem;
    }

    .padding-right-rep{
        padding-right: 6rem;
    }
    .footer-rep{
        position: relative;
        margin-bottom: -3rem;
    }
    .footer-rep2{
        justify-content: center !important;
    }
    .pfeil{
        display: none;
    }
    .header-text1{
        font-size: 30px;
        top: -5rem;
        left: -3rem;
    }
    .header-text2{
        font-size: 15px;
        top: -1.5rem;
        left: -1rem;
    }
    .header-text3{
        font-size: 30px;
        top: -5rem;
        right: 0rem;
    }
    .header-text4{
        font-size: 15px;
        top: -1.5rem;
        right: 2rem;
    }
}

@media only screen and (min-width: 769px) and (max-width: 992px) {
    .custom-vh-1{
        min-height: 46vh;
    }
    .top-rep{
        margin-top: 3rem;
        background-color: whitesmoke;
        padding-left: 1rem;
        padding-right: 1rem;
        border: 1px solid var(--vitgreen);
        border-radius: .5rem;
    }
    .nav2-rep{
        margin-top: -0.25rem;
        background-color: var(--vitblue);
        padding: 1rem;
        border: 1px solid var(--vitgreen);
        border-radius: .5rem;
    }
    .nav2-ausrichtung{
        margin-top: -1rem;
    }
    .nav2-brandverschiebung{
        margin-left: 10rem;
    }
    .nav2-link{
        margin-bottom: 5px;
    }

    .navbar-brand{
        text-align: start !important;
    }
    .nav.side{
        margin-left: 98% !important;
    }
    .padding-left-rep{
        padding-left: 8rem;
    }

    .padding-right-rep{
        padding-right: 8rem;
    }
    .footer-rep{
        position: relative;
        margin-bottom: -4rem;
    }
    .header-text1{
        font-size: 40px;
        top: -7rem;
        left: -6rem;
    }
    .header-text2{
        font-size: 20px;
        top: -2.5rem;
        left: -5rem;
    }
    .header-text3{
        font-size: 40px;
        top: -7rem;
        right: -2rem;
    }
    .header-text4{
        font-size: 20px;
        top: -2.5rem;
        right: 1rem;
    }
}

@media only screen and (min-width: 993px) and (max-width: 1200px) {
    .custom-vh-1{
        min-height: 44vh;
    }
    .navbar-brand{
        text-align: start !important;
    }
    .navbarwidth{
        width: 390% !important;
    }
    .nav2height{
        height: 50px !important;
    }
    .nav.side{
        margin-left: 98% !important;
    }
    .footer-rep{
        position: relative;
        margin-bottom: -5rem;
    }
    .nav2height{
        height: 90px !important;
    }
    .header-text1{
        font-size: 60px;
        top: -10rem;
        left: -9rem;
    }
    .header-text2{
        font-size: 30px;
        top: -4rem;
        left: -6rem;
    }
    .header-text3{
        font-size: 60px;
        top: -10rem;
        right: -4rem;
    }
    .header-text4{
        font-size: 30px;
        top: -4rem;
        right: -1rem;
    }

}

@media only screen and (min-width: 1201px) and (max-width: 1400px) {
    .custom-vh-1{
        min-height: 42vh;
    }
    .navbar-brand{
        text-align: start !important;
    }
    .navbarwidth{
        width: 220% !important;
    }
    .nav2height{
        height: 60px !important;
    }
}

@media only screen and (min-width: 1401px) {
    .custom-vh-1{
        min-height: 40vh;
    }
    .navbarwidth{
        width: 150% !important;
    }
    .footer-rep{
        position: relative;
        margin-bottom: -6rem;
    }
}


@media only screen and (max-width: 768px) {
    .te{
        text-align: center !important;
        justify-content: center !important;
    }
}

@media only screen and (min-width: 769px) {
    .te{
        text-align: right !important;
        justify-content: flex-start !important;
    }
}