navi – MYOS | SQUARE OF TRUST

				
					<script>
console.log('ready fuer main');
document.addEventListener('DOMContentLoaded', function(event) {

    jQuery(function($) {


        $('#mm--main-nav .elementor-shortcode a').on('click', function()  {
					 $('#mm--main-nav').removeClass('mm--main-nav-mob-active');
						$('#mm--icon-x-nav').removeClass('mm--icon-x-nav-active');
					$('#mm--nav-dynamic-inner').removeClass('mm--nav-dynamic-inner-mob');
					$('#mm--icon-burger').removeClass('mm--icon-burger-inactive');
        });
    });
});
</script>


<script>
console.log('ready fuer main');
document.addEventListener('DOMContentLoaded', function(event) {

    jQuery(function($) {


        $('#mm--icon-burger').on('click', function() {
          $('#mm--nav-dynamic-inner').addClass('mm--nav-dynamic-inner-mob');
					$('#mm--main-nav').addClass('mm--main-nav-mob-active');
					$('#mm--icon-x-nav').addClass('mm--icon-x-nav-active');
					$('#mm--icon-burger').addClass('mm--icon-burger-inactive');
					
        });     
			$('#mm--icon-x-nav').on('click', function() {
          $('#mm--nav-dynamic-inner').removeClass('mm--nav-dynamic-inner-mob');
					$('#mm--main-nav').removeClass('mm--main-nav-mob-active');
				$('#mm--icon-x-nav').removeClass('mm--icon-x-nav-active');
				$('#mm--icon-burger').removeClass('mm--icon-burger-inactive');
        }); 
    });
});
</script>


<script>
console.log('ready fuer popup');
document.addEventListener('DOMContentLoaded', function(event) {

    jQuery(function($) {



        $('#mm--icon-x-contact').on('click', function() {
            $('#mm--main-nav').removeClass('mm--main-nav-trsp');
            $('#mm--main-nav').addClass('mm--main-nav-mob-active');
            $('#mm--contact-nav').removeClass('mm--contact-nav-solid');
            $('#mm--icon-x-nav').addClass('mm--icon-x-nav-active');
            $('#mm--icon-x-contact').removeClass('mm--icon-x-contact-active');
        });
        $(document).keydown(function(event) {
            if (event.key == 'Escape') {
                $('#mm--main-nav').removeClass('mm--main-nav-trsp');
                $('#mm--main-nav').addClass('mm--main-nav-mob-active');
                $('#mm--contact-nav').removeClass('mm--contact-nav-solid');
                $('#mm--icon-x-nav').addClass('mm--icon-x-nav-active');
                $('#mm--icon-x-contact').removeClass('mm--icon-x-contact-active');
            }
        });

    $('#mm--esc').on('click', function() {
                $('#mm--main-nav').removeClass('mm--main-nav-trsp');
                $('#mm--main-nav').addClass('mm--main-nav-mob-active');
                $('#mm--contact-nav').removeClass('mm--contact-nav-solid');
                $('#mm--icon-x-nav').addClass('mm--icon-x-nav-active');
                $('#mm--icon-x-contact').removeClass('mm--icon-x-contact-active');
        
        });


    });
});
</script>

 
<script>
console.log('ready fuer main');
document.addEventListener('DOMContentLoaded', function(event) {

    jQuery(function($) {


        $('#mm--open-contact-trsp').on('click', function() {
          $('#mm--main-nav').addClass('mm--main-nav-trsp');
					 $('#mm--main-nav').removeClass('mm--main-nav-mob-active');
					$('#mm--contact-nav').addClass('mm--contact-nav-solid');
					$('#mm--icon-x-nav').removeClass('mm--icon-x-nav-active');
					$('#mm--icon-x-contact').addClass('mm--icon-x-contact-active');
        });
    });
});
</script>

				
					/**** KONTAKT NAV WECHSEL ****/
#mm--contact-nav {
    display: none;
    transition-duration: 500ms;
}

#mm--contact-nav.mm--contact-nav-solid {
    opacity: 1;
    display: block;
    z-index: 99999;
}

#mm--main-nav.mm--main-nav-trsp {
    opacity: 0;
    z-index: -1;
}

.mm--form-patient * {
    text-decoration-thickness: 0.05em !important;
    text-decoration-style: dashed !important;
}


/*****      IS ---- L I N K S       *****/
/**** IS ATHLETEN ****/
.mm--is-player {
    left: +0.7em;
    color: var(--e-global-color-e8c3d98);
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

/**** IS PATIENTEN ****/
.mm--is-patient {
    left: +0.7em;
    color: var(--e-global-color-362bfac);
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

/**** IS FIRMEN ****/
.mm--is-corporate {
    left: +0.7em;
    color: var(--e-global-color-553bf95);
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}


/*****      F O R M U L A R       *****/
.mm--form-player,
.mm--form-patient,
.mm--form-corporate {
    left: +0.7em;
    color: white !important;
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

/** EINGABE FELDER **/
.mm--form-player input[type="text"],
.mm--form-player input[type="tel"],
.mm--form-player input[type="email"],
.mm--form-player input[type="textarea"] *,
.mm--form-patient input[type="text"],
.mm--form-patient input[type="tel"],
.mm--form-patient input[type="email"],
.mm--form-patient input[type="textarea"] *,
.mm--form-corporate input[type="text"],
.mm--form-corporate input[type="tel"],
.mm--form-corporate input[type="email"],
.mm--form-corporate input[type="textarea"] * {
    left: +0.7em;
    font-size: 2vw !important;
    line-height: 0.9em;
    height: 1.2em;
    min-height: unset;
    font-weight: 300 !important;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
    /*text-decoration: underline;*/
}

.mm--form-patient input[type="textarea"] *,
.mm--form-player input[type="textarea"] *,
.mm--form-corporate input[type="textarea"] * {
    line-height: 1.4em;
}


/** IHR ANLIEGEN **/
.mm--form-player textarea,
.mm--form-patient textarea,
.mm--form-corporate textarea {
    font-size: 2vw !important;
    padding-left: 0 !important;
    line-height: 1em;
    /*text-decoration: underline;*/
}

/** SENDEN BUTTON **/
.mm--form-player .elementor-button-text,
.mm--form-patient .elementor-button-text,
.mm--form-corporate .elementor-button-text {
    opacity: 0.455;
    font-size: 2vw !important;
}

.mm--form-player .elementor-button-text:hover,
.mm--form-patient .elementor-button-text:hover,
.mm--form-corporate .elementor-button-text:hover {
    opacity: 1;
}



/** / BEFORE **/
.mm--form-player button>span:before {
    content: '/';
    color: var(--e-global-color-e8c3d98);
    opacity: 1;
    font-size: 2vw !important;
}

.mm--form-patient button>span:before {
    content: '/';
    color: var(--e-global-color-14f7f26);
    opacity: 1;
    font-size: 2vw !important;
}

.mm--form-corporate button>span:before {
    content: '/';
    color: var(--e-global-color-553bf95);
    opacity: 1;
    font-size: 2vw !important;
}



/** >> BEFORE **/
.mm--form-player button>span:hover:before {
    content: '>>';
    opacity: 1;
    color: var(--e-global-color-e8c3d98);
}

.mm--form-patient button>span:hover:before {
    content: '>>';
    opacity: 1;
    color: var(--e-global-color-14f7f26);
}

.mm--form-corporate button>span:hover:before {
    content: '>>';
    opacity: 1;
    color: var(--e-global-color-553bf95);
}

/** - - - - - - **/
.mm--form-player:before {
    content: '/';
    color: var(--e-global-color-e8c3d98);
    display: inline;
    position: absolute;
    left: -0.5em;
    top:  3px;
    line-height: 1em;
}

.mm--form-patient:before {
    content: '/';
    color: var(--e-global-color-14f7f26);
    display: inline;
    position: absolute;
    left: -0.5em;
    top:  3px;
    line-height: 1em;
}

.mm--form-corporate:before {
    content: '/';
    color: var(--e-global-color-553bf95);
    display: inline;
    position: absolute;
    left: -0.5em;
    top:  3px;
    line-height: 1em;
}


.mm--form-player:hover:before,
.mm--form-patient:hover:before,
.mm--form-corporate:hover:before {
    /*content: '>>';*/
    display: inline;
    position: absolute;
    /*left: -1.2em;*/
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}


.mm--form-player:hover:before {
    color: var(--e-global-color-e8c3d98);
}

.mm--form-patient:hover:before {
    color: var(--e-global-color-14f7f26);
}

.mm--form-corporate:hover:before {
    color: var(--e-global-color-553bf95);
}

/*****      G O ---- L I N K S       *****/
/**** GO PLAYER ****/
.mm--go-player {
    left: +0.7em;
    color: white !important;
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

.mm--go-player:hover {
    left: +1.2em;
}

.mm--go-player a:hover {
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
    color: var(--e-global-color-e8c3d98) !important;
}

.mm--go-player:before {
    content: '⁄';
    color: var(--e-global-color-e8c3d98);
    display: inline;
    position: absolute;
    left: -0.5em;
    line-height: 1em;
}

.mm--go-player:hover:before {
    content: '>>';
    color: var(--e-global-color-e8c3d98);
    display: inline;
    position: absolute;
    left: -1.2em;
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}


/**** GO PATIENT ****/
.mm--go-patient {
    left: +0.7em;
    color: white !important;
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

.mm--go-patient:hover {
    left: +1.2em;
    color: var(--e-global-color-362bfac);
}

.mm--go-patient a:hover {
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
    color: var(--e-global-color-362bfac) !important;
}

.mm--go-patient:before {
    content: '⁄';
    color: var(--e-global-color-362bfac);
    display: inline;
    position: absolute;
    left: -0.5em;
}

.mm--go-patient:hover:before {
    content: '>>';
    color: var(--e-global-color-362bfac);
    display: inline;
    position: absolute;
    left: -1.2em;
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}

/**** GO CORPORATE ****/
.mm--go-corporate {
    left: +0.7em;
    color: white !important;
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

.mm--go-corporate:hover {
    left: +1.2em;
    color: var(--e-global-color-553bf95);
}

.mm--go-corporate a:hover {
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
    color: var(--e-global-color-553bf95) !important;
}

.mm--go-corporate:before {
    content: '⁄';
    color: var(--e-global-color-553bf95);
    display: inline;
    position: absolute;
    left: -0.5em;
}

.mm--go-corporate:hover:before {
    content: '>>';
    color: var(--e-global-color-553bf95);
    display: inline;
    position: absolute;
    left: -1.2em;
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}


/*****      B A C K  ----  L I N K S       *****/
/* BACK BUTTON PLAYER */
.mm--back-player {
    left: +0.7em;
    color: white !important;
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

.mm--back-player:hover {
    left: +1.2em;
    color: var(--e-global-color-e8c3d98);
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}

.mm--back-player a:hover {
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
    color: var(--e-global-color-e8c3d98) !important;
}

.mm--back-player:before {
    content: '< ';
    color: var(--e-global-color-e8c3d98);
    display: inline;
    position: absolute;
    cursor: pointer;
    left: -.5em;
}

.mm--back-player:hover:before {
    content: '<<';
    color: var(--e-global-color-e8c3d98);
    display: inline;
    position: absolute;
    left: -1.2em;
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}


/* BACK BUTTON PATIENT */
.mm--back-patient {
    left: +0.7em;
    color: white !important;
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

.mm--back-patient:hover {
    left: +1.2em;
    color: var(--e-global-color-362bfac);
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}

.mm--back-patient a:hover {
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
    color: var(--e-global-color-362bfac) !important;
}

.mm--back-patient:before {
    content: '< ';
    color: var(--e-global-color-362bfac);
    display: inline;
    position: absolute;
    cursor: pointer;
    left: -.5em;
}

.mm--back-patient:hover:before {
    content: '<<';
    color: var(--e-global-color-362bfac);
    display: inline;
    position: absolute;
    left: -1.2em;
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}


/* BACK BUTTON CORPORATE */
.mm--back-corporate {
    left: +0.7em;
    color: white !important;
    font-family: font-1;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1em;
}

.mm--back-corporate:hover {
    left: +1.2em;
    color: var(--e-global-color-553bf95);
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}

.mm--back-corporate a:hover {
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
    color: var(--e-global-color-553bf95) !important;
}

.mm--back-corporate:before {
    content: '< ';
    color: var(--e-global-color-553bf95);
    display: inline;
    position: absolute;
    cursor: pointer;
    left: -0.5em;
}

.mm--back-corporate:hover:before {
    content: '<<';
    color: var(--e-global-color-553bf95);
    display: inline;
    position: absolute;
    left: -1.2em;
}


/***************************************/

/*** FARBE DER FORMULAR EINGABE ***/

input,
textarea {
    opacity: 1;
}


input::placeholder,
textarea::placeholder {
    color: white !important;
    opacity: .65 !important;
}


.mm--li-player {
    color: var(--e-global-color-e8c3d98);
}

.mm--li-patient {
    color: var(--e-global-color-362bfac)
}

.mm--li-corporate {
    color: var(--e-global-color-553bf95);
}

.mm--li-player:hover,
.mm--li-patient:hover,
.mm--li-corporate:hover {
    color: white;
    cursor: url(https://myos.one/wp-content/uploads/circle30.png) 15 15, auto;
}

/***************************************/


/* Small devices (mobile/tablets, 1200px and below) */
@media only screen and (max-width: 1200px) {

    .mm--is-player,
    .mm--is-patient,
    .mm--is-corporate,
    .mm--back-player,
    .mm--back-patient,
    .mm--back-corporate,
    .mm--go-player,
    .mm--go-patient,
    .mm--go-corporate,
    .mm--form-player,
    .mm--form-patient,
    .mm--form-corporate,
    .mm--form-player input[type="text"],
    .mm--form-player input[type="tel"],
    .mm--form-player input[type="email"],
    .mm--form-player input[type="textarea"] *,
    .mm--form-patient input[type="text"],
    .mm--form-patient input[type="tel"],
    .mm--form-patient input[type="email"],
    .mm--form-patient input[type="textarea"] *,
    .mm--form-corporate input[type="text"],
    .mm--form-corporate input[type="tel"],
    .mm--form-corporate input[type="email"],
    .mm--form-corporate input[type="textarea"] *,
    .mm--form-player button>span:before,
    .mm--form-patient button>span:before,
    .mm--form-corporate button>span:before,
    .mm--form-player .elementor-button-text,
    .mm--form-patient .elementor-button-text,
    .mm--form-corporate .elementor-button-text,
    .mm--form-player textarea,
    .mm--form-patient textarea,
    .mm--form-corporate textarea {
        font-size: 24px !important;
        line-height: 1.1em;
    }
}


/* Small devices (mobile/tablets, 768px and below) */
@media only screen and (max-width: 768px) {

    .mm--nav-dynamic-inner-mob {
        background: #33464A;
        height: 100vh !important;
        width: 100vw !important;
        padding: 30px !important;
    }

    #mm--logo-myos {
        order: 1;
    }

    #mm--main-nav {
        display: none;
        order: 2;
        left: -17px;
        top: 30px;
    }

    #mm--contact-nav {
        order: 2;
        position: relative;
        left: -17px;
        top: 30px;
    }

    #mm--icon-x-nav,
    #mm--icon-x-contact,
    #mm--esc {
        display: none;
    }