/* Smooth behavior when scrolling links. In order not to interfere with Javascript, it has to be activated by class .smooth   */
html .smooth {
  scroll-behavior: smooth; 
} 
/* *************************************************************  TOP MENU ********************************************************************************** */
.mod_navigation ul {
  display:flex;
  flex-flow:row nowrap;
  justify-content:space-around;
  width: calc(100vw - 80px);
}
.mod_navigation ul li {
  flex: 1;
  text-align: center;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mod_navigation li, .mod_navigation li a {
  color:#004136;
  text-decoration:none;
  font-size: 1.4rem;
  line-height: 2.2rem;
}
.mod_navigation li a:hover {
  color:#48b5a2; /* Farbe beim Hover-Effekt */
}

/* Active Menu-Links in Top-Menu  in individual page-color  */
.active.home11 {
  color:#c0e855; /* Farbe für das aktive Element */
  font-weight: normal;
}
.active.angebot11{
  color:#c997ab; 
  font-weight: normal;
}
.active.design11{
  color:#00aaff; 
  font-weight: normal;
}
.active.web11{
  color:#feeaa7; 
  font-weight: normal;
}
.active.fairtrade11{
  color:#66d0d7; 
  font-weight: normal;
}
.active.test11{
  color:#c0e855; 
  font-weight: normal;
}
.active.kontakt11{
  color:#cd9b7d; 
  font-weight: normal;
}

.menutop {
  display:flex;
  position:fixed;
  flex-flow:row nowrap;
  z-index: 100;
  background:#FCD9CA;
  width:100%;
  border-bottom:1px dashed #004136;
  align-items: center;
  top:15px;
  padding-bottom: 6px;
}
.datenschutz .menutop {
  top:5px;
  padding-bottom:0;
}
@media screen and (max-height:460px) {
  .title-text {
  top: 2px;
  padding-bottom: 0;
  height: 44px;
}
}

@media screen and (max-height:460px) {
  .menutop {
  display:none;
}
}

.menulist {
  width: calc(100vw - 60px);
}

@media screen and (max-width:39.9999rem) {
.mod_navigation {
font-size: 13.5px;
display:none;
}
.menulist {
  width:0;
}

/* Adapted Header for small screens without a Top-Menu. Smallheader is replacing the Menulist with the Business-Name, as defined in Modul  */
.smallheader {
  margin-left:2vw;
  width:calc(98vw - 60px);
}
.smallheader h3 {
  margin-bottom:0;
}
}
@media screen and (min-width:40rem) {
.smallheader {
  display:none;
}
}

/* **********************************************************************  MOBILE MENUE ***************************************************** */
.hamburger {
  position:fixed;
  right:5px;
  top:11px;
  display:flex;
  justify-content:center;
  align-content:center;
  z-index:105;
  background-color: transparent;
  border: none;
}

button.hamburger img {
  width:40px;
  max-width:40px;
  height:40px;
  cursor: pointer;
}
.mod_article.menupage{
width:100%;
max-width:100%;
height:100vh;
margin:0;
padding-left:30px;
background-color:white;
color:#004136;
}

.mobile_canvas {
  position:fixed;
  left:-230000px;
  height:100vh;
  width:100%;
  top:0;
  background-color:rgba(0,0,0,0.5);
  z-index:100;
}
.show_up {
  left:1px;
}

.mobile_menu {
    background-color:#FDF2ED;
    width:300px;
    height:calc(100vh - 10px);
    padding-left:20px;
    padding-top:30px;
}
.mod_customnav.navmob ul{
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  z-index:110;
}
.mod_customnav.navmob ul li{
  justify-content:flex-start;
  color:#004136;
  font-size:2rem;
  line-height:2.5rem;
}
.mod_customnav.navmob ul li a{
  justify-content:flex-start;
  font-size:2rem;
  line-height:2.5rem;
  text-decoration:none;
  color:#004136;
}

@media screen and (max-width:420px), (max-height:480px) {
.mod_customnav.navmob ul li a{
  font-size:1.6rem;
  line-height:1.9rem;
}
}


/* Active Menu-Links in Mobile Menu (Canvas)  in individual page-color  */
.mod_customnav.navmob ul li a:hover {
  color:#676767; /* Farbe beim Hover-Effekt */
}

.home11 .mod_customnav.navmob li .active {
  color:#b7ea2f; /* Farbe für das aktive Element */
  text-shadow: 1px 1px grey;
  letter-spacing: 1px;
  font-weight: normal;
}
.angebot11 .mod_customnav.navmob li .active {
  color:#c997ab; /* Farbe für das aktive Element */
  font-weight: normal;
}
.web11 .mod_customnav.navmob li .active {
  color:#ffdb63; /* Farbe für das aktive Element */
  text-shadow: 1px 1px grey;
  letter-spacing: 1px;
  font-weight: normal;
}
.design11 .mod_customnav.navmob li .active {
  color:#027ad0; /* Farbe für das aktive Element */
  font-weight: normal;
}
.fairtrade11 mod_customnav.navmob li .active {
  color:#66d0d7; /* Farbe für das aktive Element */
  font-weight: normal;
}
.kontakt11 .mod_customnav.navmob li .active {
  color:#cd9b7d; /* Farbe für das aktive Element */
  font-weight: normal;
}
.datenschutz11 .mod_customnav.navmob li .active {
  color:#a69484; /* Farbe für das aktive Element */
  font-weight: normal;
}
.kunden11 .mod_customnav.navmob li .active {
  color:#c49a72; /* Farbe für das aktive Element */
  font-weight: normal;
}

h3.menu {
  font-size:2.8rem;
  line-height:3.4rem;
  font-family:BebasNeue,Roboto,Sans-Serif;
  color:#004136;
}
.menu p {
  font-size:1.4rem;
  line-height:1.8rem;
  color:#004136;
}
/* ***********************************************************************  ARROW DOWN ***************************************************************** */
.arrow {
  width:60px;
  position:fixed;
  top:85vh;
}
.sprungmarke {
    visibility: hidden;
    height: 0px!important;
    position: absolute;
}

/*   **************************************************************************** MENU ASIDE   ************************************************************ */
.menu_aside {
     position:fixed;
     left:0; top:65vh;
     max-width:180px;
     margin:0px;
     margin-left:-1px;
     z-index:20;
     border:1px dashed #ffffff;
}
.menu_aside ul {
    color:white; 
    padding:1px 5px;

}
@media screen and (min-width:700px) and (max-width:1300px) {
    menu-aside {
        margin-left:-2px;
    }
.menu_aside ul {
  color: white;
  padding: 1px 3px;
}
}
@media screen and (max-width:39.9999rem) {
.menu_aside {
    display:none;
}}

/* currently not active 
.home1 .menu_aside ul {
    background-color:#013c0f;
}
.wohnheim1 .menu_aside ul {
    background-color:#840202;
}
.bewohnende1 .menu_aside ul {
    background-color:#a85701;
}
.team1 .menu_aside ul {
    background-color:#7b6f11;
}
.arche1 .menu_aside ul {
    background-color:#013c0f;
}
.events1 .menu_aside ul {
    background-color:#022448;
}
.kontakt1 .menu_aside ul, .datenschutz1 .menu_aside ul, .zuweisende1 .menu_aside ul {
    background-color:#424242;
}
*/

/* Icons in Menu Aside */
a.am-locked::after {
  content:"";
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAACXBIWXMAAAsTAAALEwEAmpwYAAABoUlEQVR4nO3XO2tVQRDA8YsxFhFMNFcxEIxFPkBEFKK1ttqJqX2hhQq+C02thQTit/DRp1MLQQXFB4JoYePX+MnACLcw5O7JnhyVDAxzlp3Hnz27O+f0epvyPwtGcBTncTPtEWzZSIhtuILveIzbOIc7eIJvuIzRtkH24CUeYtcqPpNYwovwbwtkO97g1JD+p/EaY23ALONGYUy8wqXaIDP4hK2FcaP4jH01Ya7hesPYW7haE+YpDjaMPRSnribMK+xtGDsV8TVh3mGiYexExK+n+HzskbxZQ39icWBcoosZ/3sceedLlvVrw8LDauSfGgZmDs9yeUOnsw/NpJ2uMBf550pgDqcuYCcupV2oMFcG0yuQ0qbYCgx243nugbD9LmEe4EI+X8T9LmEe4UQ+n4xxlzCz+THVTzvbGczA7by/5JZtE+YtDsSH198AcxY/cKZzmCbyz8LcS+fjOJaNbTLvlH6O1zsX+e+uBTKGL9HYKi7En+qMZJ3V/xywAx/aBBmo9THqreW0gvd5ZNvSyL8yLPV4tv22dLzSAm9Kb8PlFxeUPQWSYZrWAAAAAElFTkSuQmCC);
  background-size:cover;
  position: relative;
  display:inline-block;
  width: 35px;
  height: 35px;
  margin-right:0px;
  padding-top:0px;
  top:0px;
}
a.am-info::after {
  content:"";
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAACXBIWXMAAAsTAAALEwEAmpwYAAACmElEQVR4nO2Xz04TURTGG1tIOthVo4IJCYm6oIkr0SWJUkuibX0I0AXlBSC4YGt0i1J8AlfAGhZurImLrjDBRBTje/zMod+NkybtvTPtxMRwN+fMmTOnX8//m8tdnv/xAEXgGbALHAMnwE/RY8ntfTFLEDeBd8B3/WAduOV+VCBvS96WnunPjBPEFeAlcAqsAHnJy0BN/LZozeTi88CqvtsyO6MCKQGHwNuYB54Ci0AEzEsWic5LvmR67p08ZHZKowD5AqzpuQHcS2hjwb4T35K9UprQHBoQ5cIsMOFClMCOhaqg74sCdJAoZPRyZEf8rMuNtAdYNjviLWSbSarmVP/EKmPSo/8GOAdee/QmlW+R7E+HgDHkK+LvDwsNcBf4BFwFOvbsCdmC+OdWFD4gkfpD3lWDR/+G9NdErweGrCD9wY3RddZcj3/kMyy9B9ZnzIuB+hd2gT1XaYMU28qTa653jPvI+2a/6f74IMUjtfgqUAk0/gr4YDRQvyL7Njo6wxRPknoE6KohdlN46HyYwg/R7VBQAjMXCkYg3Cz7NUzxa0rPzKXwzJTPM2lyppvQMy5n7vhyZlfxL2ccpnJINVmfaYtfzAjMkuh7X58pxjrwckZgXAc+866mmk2rIbMpCZi+2fTCO5ukOKOpGgVO7Y/WEowGTO26quhb0NTWh1vmoTHuM7XYPmMjZyPNptcaw6Y3Edv01oH9xMs5f3fglp7roZM5ZsNyri5+PdUO3AfoQEntbgBPgIfKqYvGGHtXkdzeP5ZsSqHZTw2kL2SbSmrb0AqSW+Oqinezphq7NxVUNZasGyPfm+LHsl/3pzMtRk21dOeVSM9NNTSrsJ3gqklz6CViQ6H7rGX8t2hH8kamd+3Lk/uH5w9tpF17g7xNQwAAAABJRU5ErkJggg==);
  background-size:cover;
  position: relative;
  display:inline-block;
  width: 35px;
  height: 35px;
  margin-right:0px;
  padding-top:0px;
  top:0px;
}
a.am-email::after {
  content:"";
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABQCAYAAACOEfKtAAAACXBIWXMAAAsTAAALEwEAmpwYAAADMklEQVR4nO3bXchlUxjA8TXGx8jQaDRTEolERJQyXEjJR5EkV+JqmluXbuXKlXJpLiUX4kKuJiU5jZJ85CMKRUlIPjIZw4yfdj0n2+mcd973rH32Ofs9z79Op73PWmuv9d/rOevZe7dLSZIkSZIkSZIkSZIkqUUylRTYt8DqqbxNSIGVpMBVEYijGK3L9iIEjvDWumxXC8Qz2FXWFOwKB3MLbPgUN5U1A9fhg6o0Bp/F9wk8gZ1lm4OdMdYTEw7mEthM4adxKrbfxpVlm4LL8GaM9R88h/OqFxHciW9j9284VLYZeBg/xxi/x32drsLYgxdas/MVXFQGTozrxda4XsbeiTL1AmecqR9wfxkouGszkdWpwPj9UrzROmvPY3cZCDgXz8b/nEigr9igfLcCo8wOPI4/o/hXuK2sOLgZn0ef/8KTp8suFiKwVfZavB9V/o5V+6yyYuDMifTkE9y4ybqLE9jQCIszeTKqvoOryoqAy+MyTYRtE77nbKH+YgWOwa34Mqr/ESG+oywRPIbfo0/f4I452uhHYAMuiAR0zBFcXHoG+/Bqqx8v4cI52+pP4Bg8hJ+iqR/xYOkJ3Ivv4ti/4JHK9voX2ID9eG1iFuwpCwLnT8z+13FJB+0uR2Ar3TmEY9Hs17i9dAxuwRdxjOOx4p7RUdvLEzgGV+PdaPpUrIRnl27Sk3YG8BGur2135QRO5GJNAtvwMW4oc4Jr8F60dTJy0OqTsmohfHTyOQMOtNKd41tNd1pXQU1d0daB0x13qAJHM54z7Mbhrf7hN2Wi7JjD067DZx130CE8DdzTSjl+xaNTC/53J6idGj1QeqB3gbYYPlOS3iNxq2lvfO6OfWOasvsW1Z9VEDiaJ3xwMO7LzaKZoQf76s8gQnhG8v0UPozc8Vg8HWv27S9LoBeBOlz1Fsk8/exL4KirVW+RzNPPQYXwKrIwgQYStrX9X6TA0RDCtrb/GcKVdCpw6GE7i43G1bXAQYftLDYaV4ZwJSmwkhRYSQqsJAVWkgIrSYGVpMBVEbjsN4fkm0rW602lTVfY5qTASlLgsgQm/ycFVlI7k5MkSZIkSZIkSZIkKcm/y6t1iiM0dQsAAAAASUVORK5CYII=);
  background-size:cover;
  position: relative;
  display:inline-block;
  width: 35px;
  height: 35px;
  margin-right:0px;
  padding-top:0px;
  top:0px;
}