@charset "utf-8";
/* CSS Document by onstay AG © 2022 */

* { position: relative; box-sizing: border-box; margin:0px 0px; padding: 0px 0px; line-height:1.5; text-decoration: none; color: inherit }


html {
    
    display: flex;
    max-width: 100vw;
    min-width: 100vw;
    min-height: 100vh;
    outline: none;
    justify-content: center;
    align-items: stretch;
    justify-items: stretch;
    font-size: 1em;
    font-family: "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    overflow-x: hidden;
    
} body {
    
    display: inline-flex;
    min-width: 100vw;
    max-width: 100vw;
    z-index:1;
    overflow: hidden;
    
}




nav#sidebar, div.myProfile { 


    max-width: 360px;
    width:85%;
    min-height: 100vh;
    max-height: 100vh;
    overflow-y: auto;
    

}
    
    
    
nav#sidebar {

    
    pointer-events: none;
    
    opacity:0;
    left: -95%;
    display: inline-flex;
    position: fixed;
    padding: 64px 12px 12px 12px;
    z-index:19;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: space-evenly;
    justify-items: flex-start;
    align-items: center;
    background-color:#454545;
    -webkit-box-shadow: 0 0 8px 0 rgba(0,0,0,0);
    box-shadow: 0 0 8px 0 rgba(0,0,0,0);
    
    background-size: 60px;
    background-position: 95% 12px;
    background-repeat: no-repeat;

}

nav#sidebar.open {

    pointer-events: all;
    opacity: 1; left: 0px;
    -webkit-box-shadow: 0 0 8px 0 rgba(0,0,0,0.6);
    box-shadow: 0 0 8px 0 rgba(0,0,0,0.6);
    background-color:#FDFDFF !important;

}



main {
    
    display: inline-flex;
    min-width: 100vw;
    max-width: 100vw;
    
    overflow-x: hidden;
    
    
}









div#page { 
    
    display: inline-flex;
    min-width: 100vw;
    max-width: 100vw;
    flex-wrap: wrap;
    flex-direction: column;
    align-self: flex-start;
    align-content: stretch;
    justify-content: flex-start;
    justify-items: flex-start;
    min-height: 100vh;

}



div#page > header,
div#page > div,
div#page > footer { 

    justify-content: center;
    display: inline-flex;
    min-width: 100vw;
    max-width: 100vw;
    padding:8px 12px;
    
}

div#page > footer,
div#page > header  { 
    
    background-color: transparent; 
    min-height: 70px; 
    align-items: center; 
    justify-items: stretch; 

}



div#innerContent     { flex-wrap: wrap; }
div#innerContent > * { max-width:100vw; min-width:100%; }
div#innerContent > p, div#innerContent > form, div#innerContent > h1, div#innerContent > h2, div#innerContent > h3, div#innerContent > div.admin, div#innerContent > ul, div#innerContent >  div.weatherBox, div#innerContent > div.chat > form.sender > div.center { max-width: 1600px !important; min-width: 55%; width: 100%; }



html, body, div#innerContent /* > header, div#page > div */ { background-color: #fafafa;  }

div#page > header {
    
    background-color: #F0F0F0 !important; 
    
    
    position: fixed;
    min-height: 60px !important;
    z-index: 5;
}




div#page > div { 
    
    display: inline-flex;
    min-height: 320px; 
    flex-wrap: wrap; 
    padding: 32px 18px 32px 18px;
    flex-direction: column;
    align-content: space-evenly;


}
 



div#page > header > a.home, div#page > header > nav.inlineNav  { height: 36px;  }
 

div#page > header > a.home         { 
    
    display:block; 
    width:128px; 
    align-self: center; 

}

div#page > header         { 
    
    background-size: auto 90%;
    background-repeat: no-repeat;
    background-position: center 55%;
}




div#page > header {  border-top: 4px solid; border-bottom: 1px solid rgba(0,0,0,0.05); }

div#page > footer {  border-bottom: 12px solid; }




div#page > header > a.button,
body > div.trigger,
div#page > header > div.myProfilTrigger, 
div#page > header > div.langSwitch {  
    
    display: inline-block;
    width: 36px;
    height: 36px;
    align-self: flex-end;
    position: fixed;
    right: 16px;
    top: 13px;
    overflow: hidden;
    padding: 36px 12px 0px 12px;
    z-index: 10;
    border-radius: 50% !important;
    cursor: pointer; 
    background-repeat: no-repeat;
    background-position: center;
    background-size:32px;
    background-color:white;
    
    -webkit-box-shadow: 0 0 7px 0.5px rgba(0,0,0,0.2);
    box-shadow: 0 0 7px 0.5px rgba(0,0,0,0.2);

}

div#page > header > div.langSwitch {  
    
    right: 64px; 
    color: #444;
    padding: 0px 0px 0px 0px;
    text-align: center;
    line-height: 2.45em;


}

div#page > header > a.button {  
    
    margin: 0px 0px;
    right: 120px;
    background-size: 26px;
    background-position: center;
    background-repeat: no-repeat;

}

div#page > header > a.button.booking   { right: 160px; background-position: 4px 4px; }
div#page > header > a.button.messenger { right: 112px; background-position: center; }




/* NAV BUTTON LEFT */
body > div.trigger {
    
    background-size:24px;
    right: auto !important; 
    left: 16px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48'%3E%3Cpath d='M6 36V33H42V36ZM6 25.5V22.5H42V25.5ZM6 15V12H42V15Z'/%3E%3C/svg%3E");
}
body > div.trigger.active {
    
    
    z-index: 20;
    background-size:30px;
    left: 16px !important;
    top: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='red' height='48' width='48'%3E%3Cpath d='M12.45 37.65 10.35 35.55 21.9 24 10.35 12.45 12.45 10.35 24 21.9 35.55 10.35 37.65 12.45 26.1 24 37.65 35.55 35.55 37.65 24 26.1Z'/%3E%3C/svg%3E");
    
    
    
}


div#page > header > div.myProfilTrigger { 

background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' fill='darkcyan' width='48'%3E%3Cpath d='M11.1 35.25Q14.25 33.05 17.35 31.875Q20.45 30.7 24 30.7Q27.55 30.7 30.675 31.875Q33.8 33.05 36.95 35.25Q39.15 32.55 40.075 29.8Q41 27.05 41 24Q41 16.75 36.125 11.875Q31.25 7 24 7Q16.75 7 11.875 11.875Q7 16.75 7 24Q7 27.05 7.95 29.8Q8.9 32.55 11.1 35.25ZM24 25.5Q21.1 25.5 19.125 23.525Q17.15 21.55 17.15 18.65Q17.15 15.75 19.125 13.775Q21.1 11.8 24 11.8Q26.9 11.8 28.875 13.775Q30.85 15.75 30.85 18.65Q30.85 21.55 28.875 23.525Q26.9 25.5 24 25.5ZM24 44Q19.9 44 16.25 42.425Q12.6 40.85 9.875 38.125Q7.15 35.4 5.575 31.75Q4 28.1 4 24Q4 19.85 5.575 16.225Q7.15 12.6 9.875 9.875Q12.6 7.15 16.25 5.575Q19.9 4 24 4Q28.15 4 31.775 5.575Q35.4 7.15 38.125 9.875Q40.85 12.6 42.425 16.225Q44 19.85 44 24Q44 28.1 42.425 31.75Q40.85 35.4 38.125 38.125Q35.4 40.85 31.775 42.425Q28.15 44 24 44ZM24 41Q26.75 41 29.375 40.2Q32 39.4 34.55 37.4Q32 35.6 29.35 34.65Q26.7 33.7 24 33.7Q21.3 33.7 18.65 34.65Q16 35.6 13.45 37.4Q16 39.4 18.625 40.2Q21.25 41 24 41ZM24 22.5Q25.7 22.5 26.775 21.425Q27.85 20.35 27.85 18.65Q27.85 16.95 26.775 15.875Q25.7 14.8 24 14.8Q22.3 14.8 21.225 15.875Q20.15 16.95 20.15 18.65Q20.15 20.35 21.225 21.425Q22.3 22.5 24 22.5ZM24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65ZM24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Z'/%3E%3C/svg%3E");

}
div#page > header > div.myProfilTrigger.red {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' fill='red' width='48'%3E%3Cpath d='M11.1 35.25Q14.25 33.05 17.35 31.875Q20.45 30.7 24 30.7Q27.55 30.7 30.675 31.875Q33.8 33.05 36.95 35.25Q39.15 32.55 40.075 29.8Q41 27.05 41 24Q41 16.75 36.125 11.875Q31.25 7 24 7Q16.75 7 11.875 11.875Q7 16.75 7 24Q7 27.05 7.95 29.8Q8.9 32.55 11.1 35.25ZM24 25.5Q21.1 25.5 19.125 23.525Q17.15 21.55 17.15 18.65Q17.15 15.75 19.125 13.775Q21.1 11.8 24 11.8Q26.9 11.8 28.875 13.775Q30.85 15.75 30.85 18.65Q30.85 21.55 28.875 23.525Q26.9 25.5 24 25.5ZM24 44Q19.9 44 16.25 42.425Q12.6 40.85 9.875 38.125Q7.15 35.4 5.575 31.75Q4 28.1 4 24Q4 19.85 5.575 16.225Q7.15 12.6 9.875 9.875Q12.6 7.15 16.25 5.575Q19.9 4 24 4Q28.15 4 31.775 5.575Q35.4 7.15 38.125 9.875Q40.85 12.6 42.425 16.225Q44 19.85 44 24Q44 28.1 42.425 31.75Q40.85 35.4 38.125 38.125Q35.4 40.85 31.775 42.425Q28.15 44 24 44ZM24 41Q26.75 41 29.375 40.2Q32 39.4 34.55 37.4Q32 35.6 29.35 34.65Q26.7 33.7 24 33.7Q21.3 33.7 18.65 34.65Q16 35.6 13.45 37.4Q16 39.4 18.625 40.2Q21.25 41 24 41ZM24 22.5Q25.7 22.5 26.775 21.425Q27.85 20.35 27.85 18.65Q27.85 16.95 26.775 15.875Q25.7 14.8 24 14.8Q22.3 14.8 21.225 15.875Q20.15 16.95 20.15 18.65Q20.15 20.35 21.225 21.425Q22.3 22.5 24 22.5ZM24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65ZM24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Z'/%3E%3C/svg%3E");
 
}
div#page > header > div.myProfilTrigger.administrator {
    
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' fill='crimson' width='48'%3E%3Cpath d='M20 23.75Q16.7 23.75 14.6 21.65Q12.5 19.55 12.5 16.25Q12.5 12.95 14.6 10.85Q16.7 8.75 20 8.75Q23.3 8.75 25.4 10.85Q27.5 12.95 27.5 16.25Q27.5 19.55 25.4 21.65Q23.3 23.75 20 23.75ZM4 39.8V35.1Q4 33.35 4.875 31.95Q5.75 30.55 7.4 29.8Q11 28.2 14.075 27.5Q17.15 26.8 20 26.8Q20.25 26.8 20.575 26.8Q20.9 26.8 21.15 26.8Q20.85 27.5 20.7 28.175Q20.55 28.85 20.45 29.8H20Q17.1 29.8 14.325 30.425Q11.55 31.05 8.6 32.5Q7.8 32.9 7.4 33.625Q7 34.35 7 35.1V36.8H20.45Q20.7 37.7 21.05 38.425Q21.4 39.15 21.9 39.8ZM33.35 42 32.85 38.7Q32 38.45 31.125 37.975Q30.25 37.5 29.65 36.9L26.9 37.5L25.65 35.4L28 33.2Q27.9 32.75 27.9 31.95Q27.9 31.15 28 30.7L25.65 28.5L26.9 26.4L29.65 27Q30.25 26.4 31.125 25.925Q32 25.45 32.85 25.2L33.35 21.9H36.05L36.55 25.2Q37.4 25.45 38.275 25.925Q39.15 26.4 39.75 27L42.5 26.4L43.75 28.5L41.4 30.7Q41.5 31.15 41.5 31.95Q41.5 32.75 41.4 33.2L43.75 35.4L42.5 37.5L39.75 36.9Q39.15 37.5 38.275 37.975Q37.4 38.45 36.55 38.7L36.05 42ZM34.7 35.95Q36.5 35.95 37.6 34.85Q38.7 33.75 38.7 31.95Q38.7 30.15 37.6 29.05Q36.5 27.95 34.7 27.95Q32.9 27.95 31.8 29.05Q30.7 30.15 30.7 31.95Q30.7 33.75 31.8 34.85Q32.9 35.95 34.7 35.95ZM20 20.75Q21.95 20.75 23.225 19.475Q24.5 18.2 24.5 16.25Q24.5 14.3 23.225 13.025Q21.95 11.75 20 11.75Q18.05 11.75 16.775 13.025Q15.5 14.3 15.5 16.25Q15.5 18.2 16.775 19.475Q18.05 20.75 20 20.75ZM20 16.25Q20 16.25 20 16.25Q20 16.25 20 16.25Q20 16.25 20 16.25Q20 16.25 20 16.25Q20 16.25 20 16.25Q20 16.25 20 16.25Q20 16.25 20 16.25Q20 16.25 20 16.25ZM20.45 36.8Q20.45 36.8 20.45 36.8Q20.45 36.8 20.45 36.8Q20.45 36.8 20.45 36.8Q20.45 36.8 20.45 36.8Q20.45 36.8 20.45 36.8Q20.45 36.8 20.45 36.8Z'/%3E%3C/svg%3E");
    
    background-size:     30px;
    background-position: 5px 1px;
    background-color:    gold;
 
}

div#page > header > div.myProfilTrigger.isopen { 

 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='red' height='48' width='48'%3E%3Cpath d='M12.45 37.65 10.35 35.55 21.9 24 10.35 12.45 12.45 10.35 24 21.9 35.55 10.35 37.65 12.45 26.1 24 37.65 35.55 35.55 37.65 24 26.1Z'/%3E%3C/svg%3E");
z-index:22;
    top:16px;
    background-position:center !important;
    
}




div.myProfile { 
    
     pointer-events: none;
    opacity: 0;
    display: none;
    display: flex;
    position: fixed;
    top: 0px;
    background-color: #FDFDFF;
    padding: 0px 20px 20px 20px;
    right: -95%;
    z-index: 19;
    border-radius: 0px;
    -webkit-box-shadow: 0 0 8px 0 rgba(0,0,0,0.6);
    box-shadow: 0 0 8px 0 rgba(0,0,0,0.6);
    align-items: flex-start;
    align-content: flex-start;
    justify-content: space-around;
    justify-items: flex-start;
    flex-wrap: wrap;

} div.myProfile.inview { 
    
    pointer-events: all;
    opacity:1;
    right: 0px;

}

div.myProfile.inview > h3 {

    display: inline-block;
    float: left;
    width: 100%;
    font-size: 1.4rem;
    margin: 0px 0px 32px 0px;
    font-weight: 400;
    /* border-bottom: 1px solid #ddd; */
    padding: 12px 38px 1px 38px;
    text-align: center;
    background-repeat: no-repeat;
    background-size: 28px;
   /* background-position: 0px 12px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' fill='grey' width='48'%3E%3Cpath d='M11.1 35.25Q14.25 33.05 17.35 31.875Q20.45 30.7 24 30.7Q27.55 30.7 30.675 31.875Q33.8 33.05 36.95 35.25Q39.15 32.55 40.075 29.8Q41 27.05 41 24Q41 16.75 36.125 11.875Q31.25 7 24 7Q16.75 7 11.875 11.875Q7 16.75 7 24Q7 27.05 7.95 29.8Q8.9 32.55 11.1 35.25ZM24 25.5Q21.1 25.5 19.125 23.525Q17.15 21.55 17.15 18.65Q17.15 15.75 19.125 13.775Q21.1 11.8 24 11.8Q26.9 11.8 28.875 13.775Q30.85 15.75 30.85 18.65Q30.85 21.55 28.875 23.525Q26.9 25.5 24 25.5ZM24 44Q19.9 44 16.25 42.425Q12.6 40.85 9.875 38.125Q7.15 35.4 5.575 31.75Q4 28.1 4 24Q4 19.85 5.575 16.225Q7.15 12.6 9.875 9.875Q12.6 7.15 16.25 5.575Q19.9 4 24 4Q28.15 4 31.775 5.575Q35.4 7.15 38.125 9.875Q40.85 12.6 42.425 16.225Q44 19.85 44 24Q44 28.1 42.425 31.75Q40.85 35.4 38.125 38.125Q35.4 40.85 31.775 42.425Q28.15 44 24 44ZM24 41Q26.75 41 29.375 40.2Q32 39.4 34.55 37.4Q32 35.6 29.35 34.65Q26.7 33.7 24 33.7Q21.3 33.7 18.65 34.65Q16 35.6 13.45 37.4Q16 39.4 18.625 40.2Q21.25 41 24 41ZM24 22.5Q25.7 22.5 26.775 21.425Q27.85 20.35 27.85 18.65Q27.85 16.95 26.775 15.875Q25.7 14.8 24 14.8Q22.3 14.8 21.225 15.875Q20.15 16.95 20.15 18.65Q20.15 20.35 21.225 21.425Q22.3 22.5 24 22.5ZM24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65Q24 18.65 24 18.65ZM24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Q24 37.35 24 37.35Z'/%3E%3C/svg%3E"); */

}
div.myNavBG,
div.myProfileBG { 
    
        display:flex;
		position: fixed;
		top:0px;
		min-width: 100vw;
        max-width: 100%;
        min-height: 100vh;
		padding: 0px 0px 0px 0px;
		z-index:18;
		border-radius:0px; 
        opacity:0;

}
div.myNavBG.inview, div.myProfileBG.inview {  opacity:0.75; }
div.myProfileBG { left:-102vw; }
div.myProfileBG.inview { left:0px; }
div.myNavBG { right:-102vw; }
div.myNavBG.inview { right:0px; }







td.inprofile { min-height:22px; box-sizing: border-box; padding-top:6px; }
	








div.myProfileBG, div.myProfile, nav#sidebar, div.myNavBG {
    

-webkit-transition:  all 220ms ease-in-out;
-moz-transition:     all 220ms ease-in-out;
-ms-transition:      all 220ms ease-in-out;
-o-transition:       all 220ms ease-in-out;
transition:          all 220ms ease-in-out;
    
    
}


div#page > header > div.myProfilTrigger,
nav#sidebar > ul > li > a > div, div.trigger {
    

-webkit-transition:  all 90ms ease-in-out;
-moz-transition:     all 90ms ease-in-out;
-ms-transition:      all 90ms ease-in-out;
-o-transition:       all 90ms ease-in-out;
transition:          all 90ms ease-in-out;
    
    
}








nav#sidebar > ul,
nav#sidebar > form {
    
    display:inline-flex;
    min-width:51%;
    width:100%;
    max-width:320px;
    align-content: center;
    justify-content: center;
    
    align-self: center;
    margin-bottom:24px;
    flex:1;
    
    
}


nav#sidebar > ul {
    
    list-style: none;
    flex-wrap: wrap;
    justify-content: center;
    align-content: flex-start;
    align-items: flex-start;
    
    
}
nav#sidebar > ul > li {
    
    list-style: none;
    display: inline-block;
    width:100%; 
    padding: 0px 2px 0px 2px;
    
}
nav#sidebar > ul > li > a {
    
    display: inline-block;
    width:100%; 
    padding: 0px 0px 0px 0px;
    cursor: pointer;
    
        
}












nav#sidebar > ul > li > a > div {
    
    display: inline-block;
    width:100%; 
    padding: 9px 9px 8px 9px;
    background-color: rgba(255,255,255,0.0);
    border-top: 1px solid rgba(0,0,0,0.2);
    background-repeat: no-repeat;
    background-size:24px; 
    background-position: 10px center;
}



nav#sidebar > ul > li.addlink > a > div,
nav#sidebar > ul > li > a > div.extern {
    
    opacity: 0.8;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(128,128,128)' height='48' width='48'%3E%3Cpath d='M35.35 46H11Q9.8 46 8.9 45.1Q8 44.2 8 43V10.25H11V43Q11 43 11 43Q11 43 11 43H35.35ZM20.5 26.4V21.75Q20.5 20.9 21 20.425Q21.5 19.95 22.35 19.95H28.9L26.85 17.9L28.65 16.1L33.8 21.25L28.65 26.4L26.85 24.6L28.9 22.5H23.05V26.4ZM17 40Q15.8 40 14.9 39.1Q14 38.2 14 37V5Q14 3.8 14.9 2.9Q15.8 2 17 2H37Q38.2 2 39.1 2.9Q40 3.8 40 5V37Q40 38.2 39.1 39.1Q38.2 40 37 40ZM17 34V37Q17 37 17 37Q17 37 17 37H37Q37 37 37 37Q37 37 37 37V34ZM17 34V37Q17 37 17 37Q17 37 17 37Q17 37 17 37Q17 37 17 37V34ZM17 31H37V11H17ZM17 8H37V5Q37 5 37 5Q37 5 37 5H17Q17 5 17 5Q17 5 17 5ZM17 8V5Q17 5 17 5Q17 5 17 5Q17 5 17 5Q17 5 17 5Z'/%3E%3C/svg%3E");
        
}

nav#sidebar > ul > li.applink > a > div {
    
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48'%3E%3Cpath d='M15.2 43.9 12.4 41.05 29.55 23.9 12.4 6.75 15.2 3.9 35.2 23.9Z'/%3E%3C/svg%3E");

        
}
















nav#sidebar > ul > li > a:hover > div {
    
    background-color: rgba(0,0,0,0.1);
        
}


nav#sidebar > ul > li > a > div > h3 {
    
    text-align: right;
    display: inline-block;
    width:100%; 
    font-size: 1rem;
    font-weight: 400;
    text-transform: uppercase;
    padding: 7px 5px 7px 34px;
        
}
















form.login {
    
    
    display: inline-block;
    position: relative;
    flex-wrap: wrap;
    padding: 0px 10px 10px 10px;
    border-radius: 9px;
    align-self: flex-start;
} 


form.login > p {
    
    position: relative;
    display: inline-block;
    width:100%;
    text-align: center;
    padding: 0px 10px 10px 10px;
    font-weight: 400;
    color:red;

} 





div#innerContent > form.login {
    
    display: inline-flex;
    position: relative;
    flex-wrap: wrap;
    flex-direction: column;
    padding: 158px 21px 32px 21px;
    border-radius: 9px;
    margin-bottom: 120px;
    max-width: 360px !important;
    min-width: 280px !important;
    align-self: center;
    margin-top: 64px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' fill='white' width='48'%3E%3Cpath d='M34.55 34.5q1.3 0 2.2-.95.9-.95.9-2.25t-.9-2.2q-.9-.9-2.2-.9-1.3 0-2.25.9t-.95 2.2q0 1.3.95 2.25t2.25.95Zm-.05 6.25q1.65 0 3-.7t2.3-2q-1.3-.7-2.6-1.05-1.3-.35-2.7-.35-1.4 0-2.725.35-1.325.35-2.575 1.05.95 1.3 2.275 2t3.025.7ZM24 44q-6.9-1.6-11.45-7.825Q8 29.95 8 21.9V9.95l16-6 16 6v13.5q-.7-.35-1.5-.625T37 22.45v-10.4l-13-4.8-13 4.8v9.85q0 3.8 1.225 7t3.125 5.625q1.9 2.425 4.2 4.025 2.3 1.6 4.45 2.3.3.6.9 1.35.6.75 1 1.15-.45.25-.95.375-.5.125-.95.275Zm10.65 0q-3.9 0-6.65-2.775-2.75-2.775-2.75-6.575 0-3.9 2.75-6.675t6.65-2.775q3.85 0 6.625 2.775t2.775 6.675q0 3.8-2.775 6.575Q38.5 44 34.65 44ZM24 24.05Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 128px;
    background-position: center 16px;
    
    -webkit-box-shadow: 0 0 12px 0 rgba(255,255,255,0.5);
    box-shadow: 0 0 12px 0 rgba(255,255,255,0.5);

}




div.fxinput {
    
    position: relative;
    display: inline-flex;
    justify-content: space-between;
    align-content: flex-start;
    align-items: baseline;
    flex-wrap: nowrap;
    float: left;
    min-width: 140px;
    color: #222 !important;
    padding: 4px 12px;
    min-height: 24px;
    width: 100%;
    margin: 0px !important;
    text-align: center !important;
    
}



input::-webkit-date-and-time-value,
textarea,
select,
input,
button,
div.fxinput > input,
div.fxinput > button, a.button { 

    outline: none;
    display: inline-block;
    position: relative;
    border:  0px;
    line-height: 1.2;
    font-family: inherit;
    margin-top:2px;
    margin-bottom:8px;
    font-size: 1rem;
    color:#555;
    padding: 12px 6px 10px 6px;
    border-radius:5px;
    width:100%;
    
    -webkit-transition: all 100ms ease-in-out;
    -moz-transition:    all 100ms ease-in-out;
    -ms-transition:     all 100ms ease-in-out;
    -o-transition:      all 100ms ease-in-out;
    transition:         all 100ms ease-in-out;

}

input::-webkit-date-and-time-value  { 

    font-size: 1rem;
    padding: 9px 0px 0px 0px;
    text-align: left;
    
}

select {
        height:40px;
        line-height:40px;
    } 


input { min-width:65%; -webkit-min-logical-width: calc(65% - 15px); }
input[type='date'] { -webkit-min-logical-width: calc(100% - 15px);  }



form { display: inline-block; position: relative; width:100%; }
button, div.fxinput > button, a.button { 

    
    display:inline-block;
    position: relative;
    
    margin-top:8px;
    margin-bottom:16px;
    border-radius:10px;
    padding:14px 10px 13px 10px;
    font-weight:400;
    font-size:1.45rem;
    width:100%;
    text-align: center;
    cursor:pointer !important;
    -webkit-box-shadow: 0 0 4px 0 rgba(0,0,0,0.5);
    box-shadow: 0 0 4px 0 rgba(0,0,0,0.5);
    
}








input, div.fxinput > input, textarea       { background-color:#F2F2F7; }
textarea:focus, input:focus, div.fxinput > input:focus     { background-color:#E2EDEA; color:black; }
textarea:hover, input:hover, div.fxinput > input:hover     { background-color:#F0F5F2; color:black; }

a.button, button, div.fxinput > button {  background-color: #204774; color:white; } 
a.button:hover, button:hover, div.fxinput > button:hover {  background-color: #102020; } 

textarea { min-height:150px;  }




button.action {  background-color: limegreen; color:white; } 
button.abort  {  background-color: darkred; color:white; } 






div.myProfile.inview > form { width:100%; }

form.login > div.fxinput > button  { width:100%; }
form.login > div.fxinput > input   { font-size: 1.45rem; text-align:center !important;  }


div.myProfile > table { 

    font-size: 0.875rem;
    border-collapse: collapse;
    margin: 12px 0px;
    width:100%;

}



div.myProfile > table td { 

    padding: 8px 4px 6px 4px;
    border-top: 1px solid rgba(0,0,0,0.1);

}

div.myProfile > table tr > td:first-child { 

    font-size:0.825rem;
    color:#777;

}

div.myProfile > table tr > td:last-child { 

    font-size:0.925rem;
    color:#111;
    font-weight:800;
    text-align: right;

}




div.copyright { font-size: 0.75rem; }




div#innerContent {
    
    align-items: flex-start;
    align-content: flex-start;
    justify-items: center;
    padding-top: 72px !important;
    justify-content: start !important;
    min-height: calc(100vh - 86px) !important;
    
    
}





span.table {
    
    display: inline-block;
    position: relative;
    width: 100%;
    padding: 12px 12px;
    border-radius: 5px;
    background-color: beige;
    margin-bottom: 20px;
    
}

span.table > b {
    
    display: inline-block;
    position: relative;
    width: 100%;
    font-weight: 400;
    color:#444;
    
}
span.table > b > i {
    
    display: inline-block;
    position: relative;
    float: right;
    width: 60%;
    font-size: 2rem;
    padding: 0px 3px;
    line-height: 1.1;
    font-style: normal;
    margin-bottom: 10px;
    color:black;
    
}




span.tableText {
    
    display: inline-block;
    position: relative;
    width: 100%;
    padding: 12px 0px;
    margin-bottom: 20px;
    margin-top:15px;
    
}

span.tableText > b {
    
    display: inline-block;
    position: relative;
    width: 100%;
    font-weight: 400;
    color:#444;
    
}
span.tableText > b > i {
    
    display: inline-block;
    position: relative;
    float: right;
    width: 60%;
    font-size:1.1rem;
    padding:0px 3px;
    line-height:1.1;
    font-style:normal;
    margin-bottom:10px;
    color:black;
    
}




span.tableText.short {
    
    padding: 5px 0px;
    margin-bottom: 8px;
    margin-top:4px;
    
}







       div#page > header > div.langSwitch {
           
            -webkit-transition: all 120ms ease-in-out;
            -moz-transition: all 120ms ease-in-out;
            -ms-transition: all 120ms ease-in-out;
            -o-transition: all 120ms ease-in-out;
            transition: all 120ms ease-in-out;
           
        }
    
       div#page > header > div.langSwitch.open {
           
            width: 200px !important;
            right: 70px !important;
            border-radius: 12px !important;
            height: 262px;
            padding: 12px;
           
       }
    
        div#page > header > div.langSwitch > span { 

                text-transform: uppercase;
                display:inline-block; 
                position: relative;
                width:100%;
                height:24px;
        }
            
        div#page > header > div.langSwitch.open > span {
            

            background-size:24px; 
            background-position: right top;
            background-repeat: no-repeat;
            color:#999;
            
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48'%3E%3Cpath d='M12.45 37.65 10.35 35.55 21.9 24 10.35 12.45 12.45 10.35 24 21.9 35.55 10.35 37.65 12.45 26.1 24 37.65 35.55 35.55 37.65 24 26.1Z'/%3E%3C/svg%3E");
            


        }



@media only screen and (max-width: 540px) {
    
    div#page > header.userview { background-position: 32% 50%; background-size: auto 50px !important; }
    div#page > header.userview  > a.home.userview  { z-index: 8; left: -16% !important; border-radius: 20px; width: 100px; }
    
}


@media only screen and (max-width: 420px) {
    
    div#page > header.userview { background-position: 28% 50%; background-size: auto 48px !important; }
    div#page > header.userview  > a.home.userview  { z-index: 8; left: -19% !important; border-radius: 20px; width: 100px; }
    
}

@media only screen and (max-width: 380px) {
    
    div#page > header.userview { background-position: 24% 50%; background-size: auto 40px !important; }
    div#page > header.userview  > a.home.userview  { z-index: 8; left: -22% !important; border-radius: 20px; width: 100px; }
    
}




@media only screen and (max-width: 340px) {
    
    html, body, 
    main, div#page, 
    div#page > header,  
    div#page > footer,  
    div#page > div#innerContent {  min-width:320px !important; }

    div#page > header { background-position: 35% 50%; background-size: auto 50px !important; }
    div#page > header  > a.home  { z-index: 8; left: -13% !important; border-radius: 20px; width: 100px; }
    
    
    div#page > header.userview  { background-image:none;  }
    div#page > header.userview  > a.home.userview  { display:none !important; }
    
}



@media only screen and (min-width: 640px)  { div.chat span.verlauf { padding: 20px 10% 80px 10% !important; } }
@media only screen and (min-width: 800px)  { div.chat span.verlauf { padding: 20px 12% 80px 12% !important; } }
@media only screen and (min-width: 1024px) { div.chat span.verlauf { padding: 20px 15% 80px 15% !important; } }
@media only screen and (min-width: 1280px) { div.chat span.verlauf { padding: 20px 18% 80px 18% !important; } }
@media only screen and (min-width: 1440px) { div.chat span.verlauf { padding: 20px 25% 80px 25% !important; } }










div.admin { 
    display: inline-flex;
    width: 100%;
    position: relative;
    height: 100%;
    min-height: 480px;
    padding: 12px 0px;
    background-color: transparent;
    align-content: flex-start;
    justify-content: space-evenly;
    align-items: flex-start;
    justify-items: stretch;
    flex-wrap: wrap;
}


div.admin table  {
                    display: flex;
                    flex-direction: column;
                    border: none;
                    background: #fff;
                    min-width: 100%;
                    padding: 32px 24px;
                    margin:12px 0px;
                    position: relative;
                    align-items: flex-start;
                    justify-content: flex-start;
                    flex-wrap: nowrap;
                    box-sizing: border-box;
        }
div.admin table  thead { color: #777; }
div.admin table  thead,
div.admin table  tbody {
        padding: 0px 0px;
        margin: 0px 0px;
        display: inline-flex;
        border-collapse: collapse;
        border-spacing: 0px;
        max-width: 100%;
        position: relative;
        min-width: 100%;
        box-sizing: border-box;
        flex-wrap: wrap;
        }
div.admin table  thead tr,
div.admin table  tbody tr {
            display: flex;
            min-width:100%;
            margin:0px 0px;
        }
div.admin table  thead tr th,
div.admin table  tbody tr td { 

    display: flex;
    flex: 1;
    padding: 3px 5px 2px 4px;
    font-size: 1.2rem;
    align-items: flex-start;

}

div.admin table  tbody tr td input     { margin: 0px 0px; font-size: 1rem; color: black; }

div.admin table  tbody tr td textarea  { margin: 0px 0px; padding: 4px 5px; line-height: 1.2; font-size: 0.725rem; color: black; min-height:40px; }

div.admin table  tbody tr td p  { 

    margin: 0px 0px !important;
    padding: 4px 5px !important;
    background: aquamarine;
    border-radius: 4px;
    line-height: 1.2;
    font-size: 0.725rem;
    color: black;
    min-height: 40px;
    display: inline-block;
    position: relative;
    width: 100%;



}


div.admin table  tbody tr td button { 

    margin: 0px 0px;
    padding: 9px 5px 9px 5px;
    border-radius: 4px;
    font-size: 1.2rem;

}
div.admin table  thead tr th { font-size:1rem; color:#333; font-weight:200; }
@media screen and (max-width: 640px) {
           div.admin table thead { display: none; }
           div.admin table  tbody tr { 
                    flex-direction: column;
                    padding: 10px;
                    border-radius: 5px;
           }
           div.admin table  tbody tr td { flex-direction: column; }
           div.admin table  tbody tr td:before {
                    display: inline-flex;
                    position: relative;
                    align-items: center;
                    margin: 0px 0px;
                    font-size: 0.9rem;
                    content: attr(data-label);
                    color: #777;
                    padding-top: 4px;
                    padding-left: 2px;
                    min-width: 100%;
            }
}

        div.admin table thead tr th.labelOnly,
        div.admin table tbody tr td.labelOnly { font-size:0.8rem; color:#777; max-width:268px; padding-right:20px; text-align: right; justify-content: flex-end; align-content: stretch; }
        div.admin table thead tr th.labelOnly { font-size:1rem; }
        @media screen and (max-width: 640px) { div.admin table tbody tr td.labelOnly { display: none; } }



form.adding {
        display: inline-block;
    position: relative;
    min-width: 100%;
    float: left;
    padding: 18px 12px;
    border-radius: 9px;
    margin-top: 36px;
    
}