
@media (max-width:800px) {
    
    body {
        overflow-x:hidden !important
    }
    
    
    #overlay_container {
        transform:scale(0.7)
    }
    
    .mann {
        display:none !important
    }
    
     #navigation {
        top:18px !important;
        right:10px !important;
    z-index: 100000001 !important;
    }
    
       #mobilehead {
        background-color:transparent !important;
        height:80px;
        top:0px;
        left:0;
        position: fixed;
        width:100%;
        visibility: hidden;
    z-index: 100000001 !important;
    }
    
     #logostart {
    width:280px;
        height:80px;
position: fixed;
left:-10px;
        top:0px;
       
    z-index: 100000001 !important;
    transition:1s;
        transform:scale(0.8)
}
        .logosmall {
transform: scale(0.8)!important;
left:-15px !important;
        top:5px !important;
}
    
       .content_how {
      position: relative !important;
        top:10% !important
    }
    
       #start {
    background-size: cover;
background-position: center center;
top: 0;
height: 100% !important;
   
}
    
          #factbox {
        width:40% !important;
        right:2% !important; 
        bottom:0px !important
    }
    #factbox img {
        bottom:40px !important
    }
    
    .nextsection {
        display:none !important
    }
.dj-mobile-open-btn {
    background-color:transparent !important;
    font-size:30px !important
}

nav ul {
    width:300px !important;
    right:0 !important;
    top:0 !important;
}
.dj-pos-absolute.dj-align-right .dj-accordion-light,
.dj-pos-absolute .dj-accordion-light .dj-accordion-in {
    width:100% !important;
}

.itemid-120 .modules-wrap {
    padding-bottom:23px !important
    }}

@media (max-width:800px) and (orientation:landscape) {

    .dj-mobile-open-btn {
    background-color:#fff !important;
    font-size:30px !important
}
    
       #videobox {
        bottom:20px !important;
        max-height:220px !important;
        left:10px !important
    }
    
    #logostart {
        position:absolute !important
    }
    
    #nitebanner {
        width:180px !important;
        left:250px !important;
    }
    
    #videobox video {
        width:350px !important
    }
     #medicinal .content_medicinal {
height:88% !important;
top: 12%;
width: 90%;
left: inherit;
        right:7% !important
}
    #medicinal .content_medicinal p {
        margin-bottom:0 !important
    }
    
    
#medicinal .productfamily {
  height:55% !important;
    margin-top:-30px !important
}
    
     .himbeeren {
   display:none;
}
.thyme {
 
   display:none;
}
.marshmallow {
   
   display:none;
}
    
    .flascherl, .flascherl2 {
        top: 10% !important;
        width:170px !important;
        margin-left:-85px !important;
        display:none !important;

}
    .flascherl-mobile {
        width:30% !important;
        margin-left:-15% !important;
        left:50%;
        height:auto !important;
        visibility: hidden;
        position: absolute;
        top:25% !important;
        z-index: 1000000 !important
    }

.content_purely {
top: 12% !important;
width: 35%!important;
left: 3%;
    right:inherit !important;
    margin-right:inherit !important;
    z-index:  100000 !important;
    padding-left:0 !important;
visibility: hidden;
}

    .content_purely_thyme {

top: 20% !important;
width: 28%!important;
        right:5%;
        text-align: right !important;
left: inherit !important;
margin-left: inherit !important;
z-index: 100000 !important;
visibility: hidden;
}

.content_purely_raspberry {
    width: 28%!important;
        right:5%;
        text-align: right !important;
left: inherit !important;
margin-left: inherit !important;
}

.content_purely_marshmallow {
bottom: 5% !important;
    left: 3%;
width: 30%!important;
padding-left: inherit !important;
right: inherit !important;
margin-right: inherit!important;
z-index: 100000 !important;
visibility: hidden;
}
    .content_how {
position: relative !important;
top: 15% !important;
}
    #howworks .content_how p {
        margin:0 !important
    }
    
    .thyme2, .marshmallow2 {
        display:none !important
    }
    
    #howworks h2 {
        line-height:15px !important
    }
    
    .content_how_marshmallow, .content_how_thyme {
        width:28% !important;
        top:30% !important;
    }
    
     .slider {
width: 100%;
height: auto !important;
text-align: center;
overflow: inherit !important;
position: relative !important;
left: 0;
}
    
    .lastcontent ul li {
width: 48%;
text-align: left;
float: left;
margin-left: 2%;
           font-size: calc(10px + (16 - 10) * ((100vw - 320px) / (2000 - 320)));
line-height: calc(17px + (28 - 17) * ((100vw - 320px) / (2000 - 320)));
}
    #slides__3 .lastcontent {
width: 48% !important;
position: absolute;
right: 2% !important;
top: 15% !important;
visibility: hidden;
}

 #topicsection1 {
       background-color:#ffffff !important;
position: absolute !important;
width: 100% !important;
display: block !important;
align-items: inherit !important;
justify-content: inherit !important;
       height:auto !important;
    
}
    
     
    .lastitems {
        height:600px !important;
    }


 .lastcontent img {
    
    max-width:80% !important;
        width: inherit !important;
    height:auto !important;
      visibility: visible !important
}
    
.lastimg {
        background-position: top center !important;}
    

.lastitems:nth-child(odd) .lastimg {
 height:500px !important;
float:none;
    width:100%;
background-size: cover; 
      visibility: hidden;
    background-position: center center;
}

    footer {
        clear:Both !important;
        height:auto !important
    }

.lastitems:nth-child(odd) .lastcontent {
    width:90% !important;
text-align: center;
    margin-left:5%;
    float:none;
      visibility: hidden;
     height:auto !important;
    padding-top:110px !important;
    box-sizing: border-box;
}
.lastitems:nth-child(even) .lastimg {
 height:500px !important;
float:none;
    width:100%;
background-size: cover; 
      visibility: hidden;
    background-position: center center;
}


.lastitems:nth-child(even) .lastcontent {
    width:90% !important;
text-align: center;
    margin-left:5%;
    float:none;
      visibility: hidden;
         height:auto !important;
    padding-top:110px !important;
    box-sizing: border-box;
}
  

    
.lastcontent ul li {
    width:90% !important;
    text-align: left;
    float:none;
    margin-left:5%;
    padding-bottom:8px !important
}
    
}

@media (max-width:800px) and (orientation: portrait) {
    
    
    .lastitems {
        height:auto !important;
    }


 .lastcontent img {
    
    max-width:80% !important;
        width: inherit !important;
    height:auto !important;
      visibility: visible !important
}
    
.lastimg {
        background-position: top center !important;}
    

.lastitems:nth-child(odd) .lastimg {
 height:500px !important;
float:none;
    width:100%;
background-size: cover; 
      visibility: hidden;
    background-position: center center;
}

    footer {
        clear:Both !important;
        height:auto !important
    }

.lastitems:nth-child(odd) .lastcontent {
    width:90% !important;
text-align: center;
    margin-left:5%;
    float:none;
      visibility: hidden;
     height:auto !important;
    padding-top:20px !important;
    box-sizing: border-box;
}
.lastitems:nth-child(even) .lastimg {
 height:500px !important;
float:none;
    width:100%;
background-size: cover; 
      visibility: hidden;
    background-position: center center;
}


.lastitems:nth-child(even) .lastcontent {
    width:90% !important;
text-align: center;
    margin-left:5%;
    float:none;
      visibility: hidden;
         height:auto !important;
    padding-top:20px !important;
    box-sizing: border-box;
}
  

    
.lastcontent ul li {
    width:90% !important;
    text-align: left;
    float:none;
    margin-left:5%;
    padding-bottom:8px !important
}
    
    .nextsection {
        display:none !important
    }
    
  #mod-custom129 {
        background-image:url("images/adults-kl.jpg") !important
    }
    #start {
    background-image: url("images/mobile-start.webp") !important;
    background-image: image-set(
    url("images/mobile-start.webp") 2x) !important;
   
}
    
    body, html {
        display:block !important;
        
        width:100% !important
    }
    
  
   
    
    p, #sitesofaction ul, li {
        font-size:16px !important;
        line-height:30px !important;
    }
    
    sub span {
        line-height:12px !important;
    font-family: 'regular', sans-serif;
        color:#666;
       
    }
    .folderp {
         padding-top:25px !important
    }
    #mobilehead {
        background-color:#fff !important;
        height:80px;
        top:0px;
        left:0;
        position: fixed;
        width:100%;
        visibility: hidden;
    z-index: 100000001 !important;
    }
    
  
    
   #topicsection1 {
       background-color:#ffffff !important;
position: absolute !important;
width: 100% !important;
display: block !important;
align-items: inherit !important;
justify-content: inherit !important;
       height:auto !important;
}
    .slider {
width: 100%;
height: auto !important;
text-align: center;
overflow: inherit !important;
position: relative !important;
left: 0;
}
   
    
    #factbox {
        width:92% !important;
        right:2% !important; 
        bottom:0px !important
    }
    #factbox img {
        bottom:40px !important
    }
    
    .hinweisfacts{
        bottom:15px !important
    }
   
    
    #nitebanner {
        bottom:35% !important;
        left:50%;
        margin-left:-125px !important;
    }
    
   
    
    #videobox {
        display:none !important
    }
    
    #medicinal {
        position: absolute !important;
      top:100%;
        height:auto !important;
        overflow-y:hidden !important;
        overflow-x:visible !important
 
    }
    
    .content_medicinal br {
        display:none !important
    }
    .content_medicinal {
        position: relative !important;
        margin-top:0px !important;
        width:80% !important;
        left:10% !important;
        top:inherit !important
        
    }
    
    .consumerfolder::after {
font-family: 'Font Awesome 6 Pro';
content: "\f56d";
margin-left: 15px !important;
font-weight: 700;
font-size: 20px !important;
}
    
    #medicinal .productfamily {
float:none !important;
        width:120% !important;
        margin-top:30px !important;
        position: inherit !important;
        height:auto !important;
        margin-left:-10% !important;
}
    
    .consumerfolder {
        margin-top:30px !important
    }
    
    .mann, #elipse {
        display:none !important
    }
    
    .openbutton {
     font-size:35px !important;background-color:transparent
    }
    
     #purely {
         height:auto !important;
         position: absolute !important;
    }
    
    
    .flascherl, .flascherl2 {
        top: 10% !important;
        width:170px !important;
        margin-left:-85px !important;
        display:none !important;

}
	
	
    .flascherl-mobile {
        width:300px !important;
		height:auto !important;
       left:50% !important;
     	margin-left:-150px !important;
        visibility: hidden;
		margin-top:30px !important;
        position: inherit !important;

		top:0 !important
    }
    
    .content_purely {
        position: relative !important; 
        margin-top:370px !important;
        width:90% !important;
        top:1% !important;
        left:5% !important;
        max-width: inherit!important;
padding-left: inherit !important;
box-sizing: border-box;
right: inherit !important;
margin-right: inherit !important;
    }
      .content_purely_marshmallow {
        width:90% !important;
        top:80% !important;
   
    }
    
    .himbeeren {
   display:none;
}
.thyme {
 
   display:none;
}
.marshmallow {
   
   display:none;
}
    
    .content_purely_thyme {
position: relative;
        left:inherit !important;
        right:inherit !important;
width: 90%!important;
margin-left: 5% !important;
z-index: 100000 !important;
visibility: hidden;
        padding-bottom:25px !important;
        padding-top:25px !important;
}
    .content_purely_marshmallow {
position: relative;
        left:inherit !important;
        right:inherit !important;
width: 90%!important;
margin-left: 5% !important;
z-index: 100000 !important;
       padding-left:0 !important;
        visibility: hidden;
}
    .content_purely_raspberry {
position: relative;
        left:inherit !important;
        right:inherit !important;
width: 90%!important;
margin-left: 5% !important;
z-index: 100000 !important;
visibility: hidden;
}

    
    #purely h2 {
        font-size:20px !important
    }
    .purelylink:link, .purelylink:visited {
        margin-top:0 !important;
        transform: scale(0.8);
            float:none !important;
    }
    #howworks {
    background-color:#f8eff6;
    height:auto !important;
    z-index: 100000 !important;
    width:100%;

  
}
    
    .content_how {
      position: relative !important;
        top:25px !important
    }
    #sitesofaction .content_sites_action h1,

    .content_how h1 {position: relative !important;
color: rgba(189,120,169,1.00) !important;
font-family: 'blackItalic', sans-serif !important;
font-size: 25px !important;
        margin-top:24px !important
    }
    
    .content_sites_action_marshmallow, .content_sites_action_thyme {
top:inherit !important;
        position: relative !important;
width: 90%!important;
left: 5% !important;
z-index: 100000 !important;
visibility: hidden;
text-align: left;
}

#howworks .content_how strong {
color: rgba(189,120,169,1.00) !important;
font-family: 'boldItalic', sans-serif !important;
font-size: 18px !important;
}
#howitworks_animation {
    position: relative !important;;
    bottom:inherit !important;
    padding-top:30px;
    height:280px !important;
    width:100% !important;
left: inherit !important;
margin-left: inherit !important;
    z-index: 1 !important;
    visibility: hidden

}
    
    .content_how_thyme {
position: relative;
top:0 !important;
width: 90%!important;
left: 5% !important;
        right:inherit !important;
        bottom:inherit !important;
z-index: 100000 !important;
visibility: hidden;
}
    .content_how_marshmallow {
position: relative;
top:0 !important;
width: 90%!important;
left: 5% !important;
        right:inherit !important;
        bottom:inherit !important;
z-index: 100000 !important;
visibility: hidden;
}    

    #howworks h2,    #sitesofaction h2, .lastitems h3 {
font-size: 20px !important;
        margin-bottom:0 !important;
}
    
    .marshmallow2, .thyme2 {
display:none
}
    
    #howworks p {
margin-top: 0;
}
    #sitesofaction {

background-color: #ffffff;
position: absolute!important;
width: 100%;
    height:auto !important;
}

    

.content_sites_action {
    position:relative !important;
    top:7% !important;
    width:100%!important;
    z-index: 100000 !important;
    visibility: hidden;
    text-align: center;
  
}
.content_sites_action_thyme {
   position: relative !important;
    top:inherit !important;
    width:90% !important;
    margin-left:5% !important;
    right:inherit !important;
    z-index: 100000 !important;
    visibility: hidden;
    margin-top:10%;
  
}
.content_sites_action_marshmallow {
    position: relative !important;
    top:inherit !important;
    width:90% !important;
    margin-left:5% !important;
    right:inherit !important;
    z-index: 100000 !important;
    visibility: hidden;
    padding-top:40px !important;
  bottom: 0% !important;
text-align: left !important;
margin-right: inherit !important;
}
    
    	.subheadaction {

	font-family: 'boldItalic', sans-serif !important;
	
	letter-spacing:0px !important;
	color:#CF82B8 !important;
	line-height:35px !important;}

.sitesofactionanimation {
    position: relative !important;
    width:100% !important;
    left:0!important;
    margin-left:0 !important;
    height:350px;

    background-color:#fff !important;
bottom:0;
    z-index: 1000 !important
}


#sitesofactioncontainer {
    width:100%;
    float:right;
    height:55% !important;
    margin-top:0%;
    position: relative !important;
    z-index: 10000 !important;
    bottom:0 !important;
}
    
    .slide__next1 {
        display:none !important
    }
    
    #slides__1 .lastimg,#slides__2 .lastimg,#slides__3 .lastimg {
height: 400px !important;
left: 0%;
width: 100% !important;
bottom: inherit !important;
        position: relative !important; 
background-size: cover;
        background-position: center center;
visibility: hidden;
        overflow:visible !important;
}
    
    #slides__2 .lastimg {
        background-position: top center !important;}
    
    #slides__1 .lastcontent,#slides__2 .lastcontent,#slides__3 .lastcontent {
width: 90% !important;
position: relative !important;
left: 5% !important;
top: 0% !important;
visibility: hidden;
}
 #slides__1, #slides__2, #slides__3 {
position: relative !important;
left: 0;
width: 100%;
height: auto;
}    

.lastcontent ul li {
    width:90% !important;
    text-align: left;
    float:none;
    margin-left:5%;
    padding-bottom:8px !important
}

 

    
    .footerleft, .footerright {
        width:100% !important;
        display: block !important;
        float:none !important;
        text-align: center !important;
        position: relative!important;
         right:inherit !important;
        left:inherit !important
        
    }
    
    #slides__1 .lastcontent img, #slides__2 .lastcontent img, #slides__3 .lastcontent img {
        width:100% !important;
        height:auto !important
    }

    .footerright {
   
        border-top:1px solid #fff
    }
  
    .footerright {

    }



}