@font-face {
font-family: 'Roboto';
	font-display: fallback;
src: 
url('fonts//Roboto-Regular.ttf') format('ttf')}

@font-face {
font-family: 'regular1';
	font-display: fallback;
src: 
url('fonts//Panton-Regular.woff') format('woff')}

@font-face {
font-family: 'bold1';
	font-display: fallback;
	src: url('fonts//Panton-Bold.woff') format('woff');}


@font-face {
font-family: 'bolditalic1';
	font-display: fallback;
	src: url('fonts//Panton-BoldItalic.woff') format('woff');}


@font-face {
font-family: 'blackitalic1';
	font-display: fallback;
	src: url('fonts//Panton-BlackitalicCaps.woff') format('woff');}




@font-face {
font-family: 'italic1';
	font-display: fallback;
	src: url('fonts//Panton-Italic.woff') format('woff');}


@font-face {
font-family: 'black1';
	font-display: fallback;
	src: url('fonts//Panton-BlackCaps.woff') format('woff');}


.cc-window {
	width:360px !important;
	max-width:90% !important;
	margin:10px !important;
	border:0px solid #000 !important;
	border-radius:5px !important; 
	position:fixed;
	margin-left:-180px !important;
	padding:10px !important;
	background-color:rgba(255,255,255,0.90) !important;
		font-family: 'regular', sans-serif !important;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.9);
-moz-box-shadow:    0px 0px 10px 0px rgba(50, 50, 50, 0.9);
box-shadow:         0px 0px 10px 0px rgba(50, 50, 50, 0.9);

}

  .ui.error.message {
        background-color:rgba(255,215,215,1.00) !important;
        color:#ff0000 !important;
 font-size:18px !important; 
    line-height:30px !important;
    }

.ui.message .list:not(.ui) li {
   font-size:18px !important; 
    line-height:30px !important;
}

@media (max-width:700px) {
    .cc-window {
     margin-left:15px !important;
    left:0% !important;
    }}
.cc-center {
    top:15% !important
}
.cc-revoke {
    top:inherit !important
}

.cc-message {
	width:100% !important;
	font-size:13px !important;
	
	line-height:19px !important
}

.cc-close {
    display: none !important;
}

.cc-deny {
	color:rgba(255,0,4,1.00) !important;
background-color:transparent!important;
	border:none !important;
	font-weight:normal !important;
	border-radius:5px !important;
	display:inline-block !important;
	font-size:13px !important; 
	padding:7px 10px !important;margin-left:10px !important;margin-top:10px !important
}

div.cc-checkboxes-container.cc-checkboxes-filled input.cc-cookie-checkbox:checked+span:after{
	width:3px !important;
	height:8px !important;
	left:5px !important;
top:2px !important}

div.cc-checkboxes-container.cc-checkboxes-filled input.cc-cookie-checkbox:checked+span:before, div.cc-checkbox-container.cc-checkboxes-filled input.cc-cookie-checkbox:checked+span:after {
	left:0px !important;
	background-color:#7a0d5e !important;
	border-color:#7a0d5e !important;
}

a.cc-link label {
	font-size:14px !important
}

.cc-link.cc-cookie {
	display:none !important
}

.cc-allowall {
background-color:#702283 !important;
color:#fff!important;
	border:none !important;
	font-weight:normal !important;
	border-radius:5px !important;
	display:inline-block !important;
	font-size:13px !important;
	padding:12px 10px 5px 10px !important;
	line-height:13px !important;
	margin-top:10px !important;
}

.cc-compliance {
	display:block  !important;
	text-align:center !important
}


.cc-allow {
	background-color:#702283 !important;
color:#fff!important;
	border:none !important;
	font-weight:normal !important;
	border-radius:5px !important;
	display:inline-block !important;
	font-size:13px !important;
	padding:12px 10px 5px 10px !important;
	line-height:13px !important;
}

.cc-deny:hover {
 	opacity: 0.6!important;
	
	border:none !important;
	font-weight:normal !important;
}

.cc-allowall:hover {
	opacity:0.7 !important;
color:#fff!important;text-decoration:None !important;
	border:none !important;
	font-weight:normal !important;
}

.cc-allow:hover {
	opacity:0.7 !important;
color:#fff!important;text-decoration:None !important;
	border:none !important;
	font-weight:normal !important;
}

.cc-settings-label {
	padding:5px !important;
	background-color:#fff !important;

	font-size:14px !important;
	margin-bottom:11px !important;
	font-weight:bold !important;
	margin-left:-19px !important;
	padding-right:14px !important;
	margin-right:0 !important;
}
div.cc-checkbox-container:not(:last-child) a {
	border:none !important
}

.cc-checkbox-container {
	padding-left:10px !important;
}

.cc-checkboxes-container {
	padding-left:10px !important;
	margin-right:-10px !important
}

.cc-cookie-checkbox {
	font-size:14px !important}


@media (max-width:670px) {
    
    .cc-window.cc-banner, .cc-window.cc-left, .cc-window.cc-right {
        right:0 !important;
        left:inherit !important
    }
}


html {
	/* scrollbar fix (prevent ugly left pull for lower content sites) */
	overflow-y: scroll;
    height:100%;
        overflow-x:hidden !important
}

body {
    font-family: 'Roboto', sans-serif;
    color:#000;
    width:100% !important;
	margin:0 !important;
    height:100%;
    font-weight:300;
    
    padding:0 !important
}

header {
   
    position: fixed;
   
    z-index: 100;
    top:0;
    width:100%;
    left:0;
    transition: 0.5s
}

.headerscroll {
     background-color:#fff !important;
     box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.50) !important
}

.headermenu {
     background-color:#fff !important;
    border-bottom:1px solid #ddd !important
}

#hero {
    width:100% !important;
    position: fixed;
    z-index:-1;
    background-image:url("images/gastrobalance-reflu-hero.jpg");
    background-position: center center;
    background-size:cover;
    height:90%;
    top:0;
    left:0;
}

#herointro {
 position: absolute;
    bottom:80px;
    width:100%;
}
#herointro .big {
    font-family: 'black1', sans-serif !important;
    font-size:110px;
   position: absolute;
left: 50%;
transform: translateX(-50%);
    bottom:80px;
    z-index: 2;
color:#fff;
}

#herointro .big.shadow {
        text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.7);
    z-index: 0;
}

#herointro .small {
    font-family: 'bold1', sans-serif !important;
    font-size:80px;
color:#fff;
margin:-25px auto 0 auto !important;
    display:table-cell;
background-color:#702283;
    padding:0px 25px !important;
      position: absolute;
   left: 50%;
transform: translateX(-30%);
    bottom:20px;
    z-index: 1;
}

#stickreversed {
  
    margin-top:5px;
    float:left;
    width:160px;
    
    
}

#stickreversed img {
    width:100%;
}

nav {
float:right;
    margin-right:100px !important;
    top:0

    
}


.dj-megamenu {
    list-style: none;
    zoom: 1;
    margin: 0;
    padding: 0;
    font-size: 20px !important;
    letter-spacing: 1px !important;
    width: 100% !important;
    font-family: 'regular1', sans-serif !important;
}


.dj-megamenu:before, .dj-megamenu:after {
    content: " ";
    display:table
}

.dj-megamenu:after {
    clear:both
}

.dj-megamenu ul {
    list-style: none;
    width:100%
}



.dj-megamenu-clean li a.dj-up_a {
    color: #fff !important;
    transition: 0.6s !important;
    padding: 22px 0 !important;
    text-decoration: none;
    font-family: 'regular1', sans-serif !important;
    height:inherit !important;
    margin-right:55px !important;
    font-size:17px !important;
    border-bottom:2px solid rgba(255,255,255,0.00)
}

.headerscroll .dj-megamenu-clean li a.dj-up_a {
    color:#702283 !important
}

.dj-megamenu-clean li.itemid113 a.dj-up_a {
    padding:22px 20px !important;
    margin-right:0 !important
}.itemid101 {
    display:none;
}

#wissenswertesinner a {
    text-decoration:none !important
}

.dj-megamenu-clean li a.dj-up_a > span {
    padding:0 !important
}

.headerscroll .dj-megamenu-clean li a.dj-up_a {
    color:#702283;
}

.headerscroll .dj-megamenu-clean li.itemid113 a.dj-up_a {
    color:#fff !important;
}

.reflux-und-sodbrennen .dj-megamenu-clean li a.dj-up_a {
    color:#702283 !important;
}

.dj-megamenu-clean li div.dj-subwrap .dj-subwrap-in {
    background-color:rgba(255,255,255,0.90) !important
}


.dj-megamenu-clean li ul.dj-submenu > li > a {
    color:#000 !important;
    font-size:15px !important;
    padding:8px 15px !important;
}

.dj-megamenu-clean li ul.dj-submenu > li > a:hover {
    color:rgba(112,34,131,1.00) !important;
    background-color:transparent !important
}

.dj-megamenu-clean li ul.dj-submenu > li > a:hover, .dj-megamenu-clean li ul.dj-submenu > li > a.active {
    background-color:transparent !important;
    color:rgba(112,34,131,1.00) !important
}

 .dj-megamenu-clean li a.dj-up_a:hover,
.dj-megamenu-clean li.active a.dj-up_a {
    color: #fff;
    background-color:none;
    padding: 15px 0 25px 0px;
    border-bottom:2px solid #fff !important
}
.headerscroll .dj-megamenu-clean li a.dj-up_a:hover,
.headerscroll .dj-megamenu-clean li.active a.dj-up_a {
    color:rgba(112,34,131,1.00) !important;
    background-color:none;
    padding: 15px 0 25px 0px;
    border-bottom:2px solid rgba(112,34,131,1.00) !important
}
.headerscroll .dj-megamenu-clean li.itemid113 a.dj-up_a:hover,
.headerscroll .dj-megamenu-clean li.itemid113.active a.dj-up_a {
    color:#fff !important;
    border-bottom:2px solid rgba(142,99,152,1.00) !important;
}

.dj-megamenu-clean li a.dj-up_a .arrow {
    display:none !important;
}

.dj-megamenu-clean li a.dj-up_a > span {
    height:inherit !important;
    padding: 0 !important
}

.dj-megamenu-select-light .dj-mobile-open-btn,.mobile-close-btn, .dj-megamenu-offcanvas-light .dj-mobile-open-btn, .dj-megamenu-accordion-light .dj-mobile-open-btn {
    background:none !important;
    color:rgba(112,34,131,1.00) !important;
    margin-top:10px !important;
    margin-right:10px !important;
    font-size: 42px !important;
    transition:0.5s !important
}

.dj-megamenu-select-light .dj-mobile-open-btn, .dj-megamenu-offcanvas-light .dj-mobile-open-btn, .dj-megamenu-accordion-light .dj-mobile-open-btn {
    text-align:right !important
}

.dj-accordion {
    
    transition:0.5s !important
}

.toggleoverlay {
    display:none;
    position:fixed !important;
    top:0;
    left:0;
    width:100% !important;
    height:100% !important;
    z-index: 99 !important;
    background-color:rgba(255,255,255,0.90) !important
}

ul.dj-mobile-light li.dj-mobileitem.parent>a span.toggler::before {
    content: "\f107" !important;
    color:rgba(112,34,131,1.00) !important;
    font-size:20px !important
}

ul.dj-mobile-light li.dj-mobileitem.parent.active>a span.toggler::before{
    content: "\f106" !important;
}

.dj-accordion-light .dj-accordion-in {
    margin:0 !important
}

.hideelement {
    display:none!important
}

.showelement {
    display:block !important
}

.mobile-close-btn {
    display:none;line-height: 1;
padding: 3px 8px !important;
    margin-top:10px !important;
background: #e4e4e4;
color: #434343;
text-align: right;
border-radius: 3px;


}

.dj-megamenu-wrapper.jmoddiv.jmodinside,
.dj-accordion.dj-accordion-light {
    width:100% !important;
}

@media (max-width:940px) {
    .dj-megamenu-clean li div.dj-subwrap .dj-subwrap-in {
    background-color:rgba(255,255,255,0.00) !important
}

    nav {   width:100%!important;
    position: absolute !important;
    top:0 !important;
    text-align: right !important}
    
    .dj-megamenu-accordion-light {
        text-align: right !important
    }
    
    .dj-accordion-in {
        width:100% !important;
        text-align: center !important;
    }
    
    .dj-pos-absolute .dj-accordion-light {
        top:60px !important;
    }
    
    .dj-accordion-light .dj-accordion-in {
        background:rgba(255,255,255,0.00) !important;
        height:100% !important;
    }
    
    #testmusterbuttonmenu {
        border-radius:3px !important;
        margin:0 auto !important
    }
    
    .itemid-113 {
        display:none !important
    }
    
    ul.dj-mobile-light li.dj-mobileitem>a {
        background:transparent !important;
        text-align:center !important;
        color: #702283 !important;
text-align: center;
font-size: 25px !important;
font-family: 'bold1', sans-serif !important;
letter-spacing: 0 !important;
                border:none !important
}
    ul.dj-mobile-light li.dj-mobileitem:hover>a, ul.dj-mobile-light li.dj-mobileitem.active>a {
        color:rgba(142,99,152,1.00) !important;
        border:none !important
    }
    
    ul.dj-mobile-light li.dj-mobileitem.parent>a {
        padding-left:40px !important;
        padding-right:40px !important;
                border:none !important
    }
    
    .dj-mobile-nav-child li.dj-mobileitem a.dj-up_a {
        font-size:18px !important;
        color:#000 !important;
        padding:10px 0 !important;
font-family: 'regular1', sans-serif !important;
                border:none !important
    }
    
    .mobile-close-btn .fa.fa-bars:before {
        content:"\f00d" !important
    }

    
}

.itemid113 {
    background-color:rgba(112,34,131,1.00);
    padding:26px 15px;
    transition: 0.3s !important;
    border-bottom:0 !important;
    color:#fff !important
}
.dj-megamenu-clean li.itemid113 a.dj-up_a:hover,
.itemid113 a:hover {
    background-color:#8e6398;
    padding:26px 15px;
        border-bottom:2px solid rgba(142,99,152,1.00)  !important;
}


a:hover {
    cursor:pointer !important
}


#contentarea {
    
    margin:15px auto;
    width:100% !important;
    position:absolute !important;
    top:90% !important;
    left:0 !important;
    background-color:#fff !important;
}

.introleft {
    width:98%;
    max-width:1200px;
    margin:0 auto;
    padding:40px 0
    
}

.introleft img {
    float:left;
    margin-left:2.5%;
    width:30%;
}

.introleft .introcontent {
    width:50% !important;
    float:left;
    margin-left:10%;
}

.introleft p {
    margin-bottom:35px;
    margin-top:15px;
}
.introright {
    width:100%;

    padding:20px 0 0 0;
    background-color:#eee;
    height:480px;
    margin-top:60px !important;
}



.introrightinner {
     max-width:1200px;
        width:100%;
 
    margin:0 auto;
}

.introright img {
    float:right;
    margin-right:0%;
    width:50%;
    margin-top:0px;
}

.introright .introcontent {
    width:35% !important;
    float:left;
    margin-right:10%;
    margin-left:1.5%;
}

.introright p {
    margin-bottom:35px;
    margin-top:15px;
}

.introright ul {
    padding-left:0;
    list-style:square;

}

.introright ul li {
    color:#702283 !important;
    font-size:20px !important;
     font-family: 'bold1', sans-serif !important;
    margin-bottom:8px !important;
    list-style-position: inside;

    
}


.clear {
    clear:both;
    width:100%;
}

h1,h2 {
    color:#702283;
    font-family: 'bold1', sans-serif !important;
    font-size:48px;
    line-height:52px;
    margin-bottom:15px;
    font-weight:200 !important
}

p {
 font-size:17px;
    line-height:28px;
}

.readmore:link,
.readmore:visited {
    font-family: 'bold1', sans-serif !important;
    font-weight:200;
    background-color:#702283;
    color:#fff;
    padding:15px 25px;
    font-size:17px;
    text-decoration: none;
    transition:0.3s;
    border-radius:3px
}

.readmore:hover,
.readmore:active {
    background-color:#8e6398;
}



button.readmore {
font-family: 'bold1', sans-serif !important;
font-weight: 200;
background-color: #702283;
color: #fff;
padding: 15px 25px;
font-size: 20px;
text-decoration: none;
transition: 0.3s;
border-radius: 3px !important;
    outline:none !important;
    border:0 !important

}

#risikofaktoren {
    width:100% !important;
    position: relative;

    padding-bottom:60px;
    border-bottom:1px solid #ccc;
    margin-bottom:60px;
}

#risikofaktoren .balken {
    height:40px !important;
    background-color:rgba(112,34,131,1.00);
    position: absolute;
    width:100%;
    top:50%;
    margin-top:-40px !important;
    z-index: 0;
}

.risikofaktoreninner {
    width:100%;
    max-width:1200px;
    margin:0 auto !important;
    z-index: 1;
    position: relative;
  padding-top:40px !important;
}

.risikofaktoreninner ul {
    list-style:none;
    padding:0!important;
}

.risikofaktoreninner ul li {
    width:18% !important;
    margin:0 7.5%;
    float:left;
    text-align: left;
    
}
.risikofaktoreninner p {
    margin:5px 0 !important
}

.risikofaktoreninner img {
    border-radius:50%;
    border:4px solid rgba(112,34,131,1.00);
    transition: 0.5s;
    width:130px;
}
 .risikofaktoreninner h2 {
    
    margin-bottom:50px;
}
.risikofaktoreninner svg {
    width:120px;
    height:120px;
}

.risk4 img {
    transition:0.3s !important;
}

.risk4 .mod-articles-category-title:hover img {
	content:url("images/akute_beschwerden-2.svg");
}

.risk5 .mod-articles-category-title:hover img  {
	content:url("images/stress-2.svg");
}
.risk6 .mod-articles-category-title:hover img  {
	content:url("images/ueppiges_essen-2.svg");
}


#apotheke_inner iframe {
    overflow: hidden !important;
    height:440px !important
 
}

#testmuster iframe {
    overflow: hidden !important;
  height:800px !important;
	 width:100% !important;
    border:none !important;
    outline: none !important;
 
}

@media (max-width:600px) {
	#testmuster iframe {
    overflow: hidden !important;
  height:100% !important;
	 width:100% !important;
    border:none !important;
    outline: none !important;
 
}
	
}


.ba__title,
.mod-articles-category-title .title,
.ba__description div p strong {
    text-transform: uppercase;
    font-family: 'bold1', sans-serif !important;
font-size:20px !important;
    font-weight:200 !important;
color:#702283!important;
margin:15px 0 0 0 !important;
line-height:30px !important}

.carousel-item-inside:hover .ba__title,
.mod-articles-category-title:hover .title,
.carousel-item-inside:hover .ba__description div p strong{
      color:#8e6398 !important;
}
.ba__title,
.mod-articles-category-title:link,
.mod-articles-category-title:visited {
    color:#000;
    text-decoration: none;
    transition:0.3s;

}

.ba__carousel-item a {
    text-decoration:none !important
}
.ba__title:hover,
.mod-articles-category-title:hover,
.mod-articles-category-title:active,
.mod-articles-category-title:hover img,
.mod-articles-category-title:active img{
    color:#8e6398;
    text-decoration: none;
    border-color:#8e6398 !important
}

#wissenswertes {
        border-bottom:1px solid #ccc !important;
    padding-bottom:60px;
    margin-bottom:60px;
}

#wissenswertesinner {
    width:1200px;max-width:90%;
    margin:0px auto 0px auto !important;

}

.mx-news-3 .shownews-item:hover {
    box-shadow:none !important
}

.mx-news-3 .shownews-item:hover .shownews-img:before {
    background:transparent !important;
    opacity: 0.0 !important;
}

.mx-news-3 .shownews-item .shownews-img:before {
    display:none !important
}


.owl-carousel .owl-nav .owl-next {
    background:none !important;
    right:40px !important;
    
}

.owl-carousel .owl-nav .owl-prev {
    background:none !important;
    left:40px !important;
    
}
.owl-carousel .owl-nav .owl-next:after {
      font-family: 'Font Awesome 6 Pro';
  content: "\f054";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
font-weight:400;color:#ffffff;
    padding-left:5px;/* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
    width: 1em;
    padding-right:15px !important;
font-size:35px !important}
.owl-carousel .owl-nav .owl-prev:after {
      font-family: 'Font Awesome 6 Pro';
  content: "\f053";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
font-weight:400;color:#ffffff;
    padding-left:5px;/* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
    width: 1em;
    padding-right:15px !important;
font-size:35px !important}
/* Also needed for space (tweak if needed) */
  /* Also needed for space (tweak if needed) */
    .nav-rounded .owl-nav .owl-prev, .nav-rounded .owl-nav .owl-next {
        border:none !important
    }



.weiterreadmore {
    color:#000 !important;
    text-decoration: none !important
}


.weiterreadmore {
    font-weight:400 !important;
    font-size:18px !important
}

.weiterlink:active .weiterreadmore, .weiterlink:hover .weiterreadmore {
    color:#8E6398 !important
}

.weiterreadmore span:after {
    font-family: 'Font Awesome 6 Pro';
  content: "\f178";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
font-weight:400;color:rgba(112,34,131,1.00);
    padding-left:5px;/* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em;
/* Also needed for space (tweak if needed) */
  /* Also needed for space (tweak if needed) */
}
.weiterlink:link h2.shownews-title,
.weiterlink:visited h2.shownews-title,
.mod-articles-category-title .title,
.items-row h2 a:link,
.items-row h2 a:visited
{text-decoration: none !important;
    text-transform: uppercase;
    font-family: 'bold1', sans-serif !important;
font-size:17px !important;
    font-weight:200 !important;
color:#702283 !important;
margin:15px 0 0 0 !important;
line-height:28px !important;
text-decoration: none !important}

.mx-news-3 a {
    text-decoration:none !important;
}

.shownews-img {
    margin-bottom:25px !important
}

.shownews-desc p {
font-size: 17px;
margin: 10px 0 15px 0 !important;
}


.readmore .btn {
    color:#000 !important;
    text-decoration: none !important
}




.mx-news-3 a p {
    color:#000 !important
}


.weiterlink:active h2.shownews-title,
.weiterlink:hover h2.shownews-title {
    
    color:#8e6398 !important
    
}

.shownews-desc {
    padding:0 !important
}

.mx-news-3 .shownews-item {
    border:none !Important
}


@media (min-width:575px) {
.wissenswertesinner ul li {
    width:23% !important;
    margin:0 1.5%;
    float:Left !important;
}

.ba__carousel-item,
    .wissenswertesinner ul li {
    margin:0 1.5% 0 0 !important;
    float:Left !important;
}
.wissenswertesinner ul li:last-child {
    width:23%;
    margin:0 0 0 1.5%;
    float:Left !important;
}
}
.baCarouselWrap .ba__arrow {
    background-color:rgba(255,255,255,0.70) !important;font-size:30px !important;color:#702283 !important;
}

.baCarouselWrap .ba__arrow:hover {
    color:#8E6398 !important;
}
@media (max-width:575px) {
    
    .ba__image {
    width:100% !important;
    height:calc(width) !important
    }
    

    }

.wissenswertesinner ul li img {
    width:100% !important
}

.wissenswertes-introtext {
    color:#000 !important;
    
    margin:8px 0 !important;
    
}

sup {
 vertical-align: top; font-size: 0.5em;
    margin-top:-2px !important
    
}

.ba__description {
    max-width:400px !important
}
.ba__description p {
    font-size:20px;
    margin:10px 0 15px 0 !important
}

.ba__image {
    margin-bottom:15px !important
}

.baCarouselWrap .ba__title {
    padding:0 !important
}

.moreitems {
    text-align:center !important;
    margin-top:30px !important;
    
}

p.ba-readmore,
.risiko-readmore {
    font-weight:400 !important;
    font-size:17px !important
}
.carousel-item-inside:hover p.risiko-readmore,
p.risiko-readmore a:hover {
    color:#8E6398 !important
}

.ba-readmore::after,
.risiko-readmore::after {
    font-family: 'Font Awesome 6 Pro';
  content: "\f178";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
font-weight:400;color:rgba(112,34,131,1.00);
    padding-left:5px;/* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em;
/* Also needed for space (tweak if needed) */
  /* Also needed for space (tweak if needed) */
}

#apotheke {
    width:100%;
    max-width:1200px;
    margin:0 auto;
    box-sizing: border-box;
}

footer {
    width:100% !important;
    border-bottom:1px solid #ddd !important;
    padding-bottom:0px;
}

.footerinner {
    width:100%;
    max-width:1200px;
    margin:50px auto;
    padding:10px 0 0 0 !important
}

.stickbottom {
    width:90%;
    max-width:360px !important;
    float:left !important;
}


#footerright ul {
   list-style: none;
    padding-left:0;
}

#footerright ul li {
    padding-top:5px !important;
    float:left !important;
    margin-right:15px !important;
}

#footerright a:link,
#footerright a:visited {
    color:#000;
    text-decoration: none;
    transition:0.3s;
    font-size:13px !important;
}

.risikofaktoreninner a {
    text-decoration: none !important
}

#footerright a:hover,
#footerright a:active {
    color:#8E6398;
    text-decoration: none;
}

#footerright p {
    margin-top:0 !important;
    margin-bottom:0 !important;
    font-size:12px !important
}

#footerright {
    width:auto;
   float:right;
    text-align: right;


}

#footerright img {
    width:100px;
    height:auto;
    margin-top:10px;
}

.referenzen {
    width:100%;
    max-width:1200px;
    margin:0 auto;
    font-size:12px;
    color:#999;
    padding:10px !important
}
.referenzen p {
        font-size:12px;
    color:#999;
    line-height:14px;
    text-align: justify;
    margin:2px 0;
}
.referenzen a:link,
.referenzen a:visited {
    color:#666;
}
#testmuster {
    background-color:rgba(112,34,131,1.00); 
    width:100%;
    max-width:800px;
    position: fixed;
    left:50%;
    top:50%;
    margin: -400px 0 0 -400px;
    z-index: 10001;
    box-sizing: border-box !important; display:none;
}

.testmuster-anfordern #testmuster {
	display:block
}

.testmuster-anfordern #testmusteroverlay {
	display:block
}

@media (max-height:800px) {

#testmuster {
 max-height:100% !important;
    top:0 !important;
    margin-top:0 !important;
    overflow:scroll !important
}
}

.close {
    width:100% !important;
    text-align: right !important;
    color:#fff;
    font-size:30px;
    padding:20px;
    box-sizing:border-box;
    position: absolute;
    right:0;
    top:0;
}

#testmusteroverlay {
    background-color:rgba(0,0,0,0.70);
    position: fixed;
    width:100%;
    height:100%;
    z-index: 10000;
    top:0;
    left:0;
   display:none
}

#testmuster h2 {
    color:#fff;
    font-size:45px !important;
    line-height:50px !important;
    padding:50px 0 15px 50px;
    margin-top:0 !important
  
}

#testmuster .formular {
    width:60%;
    float:left;
    padding:0px 0 40px 50px;
    box-sizing: border-box
}

#testmuster .formular .field {
    width:44% !important;
    float:left !important;
    box-sizing:inherit !important;
    clear:inherit !important;
    margin-right:3%;
    
}

#testmuster .formular .field.nachname,
#testmuster .formular .field.strasse {
    width:91.5%!important
}

#testmuster .formular .field input{
    border-radius:0 !important;
    padding:5px 8px !important;
    min-height:29px !important;
    font-family: 'regular1', sans-serif !important;
}

#testmuster .formular .ui.form .grouped.fields>label {
    width:100% !important;
    float:none !important;
    color:#fff !important;
    clear:both !important;
  	display:block !important;
    padding-top:10px !important;
  
    
}


.ui.selection.dropdown{
    border-radius:0 !important;
    padding:0px 8px !important;
    min-height:29px !important;
    font-family: 'regular1', sans-serif !important;
}
.ui.selection.dropdown>.delete.icon, .ui.selection.dropdown>.dropdown.icon, .ui.selection.dropdown>.search.icon {
    top:5px !important
}

.ui.dropdown>.text {
    padding-top:5px !important
}

.field.required.error input {
    border:1px solid #ff000 !important;
    background-color:rgba(209,10,17,0.30) !important;
    font-family: 'regular1', sans-serif !important;
}
.ui.form .field .prompt.label {
    display:none !important
}

.ui.form .field>label, .ui.checkbox input.hidden+label {
    color:#fff !important;
    font-weight:200 !important;
    font-size:12px !important;
}

.ui.checkbox input.hidden+label a {
    color:#fff !important;
    text-decoration: underline !important
}

.ui.form .required.field>.checkbox:after, .ui.form .required.field>label:after, .ui.form .required.fields.grouped>label:after, .ui.form .required.fields:not(.grouped)>.field>.checkbox:after, .ui.form .required.fields:not(.grouped)>.field>label:after {
    color:#fff !important
}

#testmuster img {
    width:30% !important;
    margin-bottom:100px !important;
    float:right;
    margin-right:5% !important
}

#testmuster small {
    color:#fff !important;
}

.ui.message.success {
    background-color:#702283 !important;
    border: none !Important;
    padding:0 !important;
    color:#fff !important;
    box-shadow:none !important
}

.ui.green.button, .ui.green.buttons .button {
    background-color:rgba(112,34,131,1.00) !important;
    border:1px solid #fff !important;
    border-radius:0 !important;
    font-family: 'bold1', sans-serif !important;
    margin-top:10px !important;
    margin-bottom:50px !important; 
    transition: 0.5s !important;
    font-size:17px !important;
    font-weight:200 !important;
}

.ui.green.button::after {
    font-family: 'Font Awesome 6 Pro';
  content: "\f178";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
font-weight:400;
    padding-left:20px;
    padding-right:10px;/* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em;
}

.ui.green.button:hover {
    color:#702283 !important;
    background-color: #fff !important;
}
/* MEDIA QUERIES
*********************************************/

/* Extra small devices (phones, less than 768px) */
/* No media query -> mobile first strategy */

/* Small devices (tablets, 768px and up) */
@media (max-width: 1200px) {
    nav {
    margin-right:0 !important
    }
    
    
    #stickreversed {
        width:160px !important
    }
    
    .referenzen {
        box-sizing:border-box
    }
    
    h1, h2 {
        font-size:35px;
        line-height:40px !important
    }
    
    .introright {
        height:400px !important
    }
    .introleft img {
        width:40% !important;
      
    }
 
    
    .introright .introcontent {
        margin-right:0 !important;
        margin-left:10% !important;
    }
    
    .introleft .introcontent {
        margin-left:0 !important;
        float:left !important;
        width:40%;
    }
    
    #risikofaktoren {
        margin-top:0 !important
    }
    
     .risikofaktoreninner h2{
   margin-left:15px !important
}
    
    .wissenswertesinner {
        padding:15px !important;
        box-sizing: border-box
    }
    .footerinner {
        padding:15px !important;
        box-sizing: border-box;
        text-align: center !important;
    }
    
    
}

/* Medium devices (desktops, 992px and up) */
@media (max-width: 920px) {

    #herointro {
        transition:0.5s;
        transform: scale(0.7) !important;
         -webkit-transform: scale(0.7) !important;
        bottom:25px !important;
        left:-2% !important
    }
    
       #item-101 {
        display:block !important}


}

/* Large devices (large desktops, 1200px and up) */
@media (max-width: 800px) {
    .introleft img {
        display:none !important
    }
    
    .introleft .introcontent {
        width:90% !important;
        margin-left:5% !important;
        float:none !important;
    }
    
    .introright {
        height:auto !important;
        
    }
    
    
    
    #risikofaktoren,
    #wissenswertes,
    #apotheke {
        margin-top:80px !important;
        width:90% !important;
        margin-left:5% !important;
    }
    
    #risikofaktoren h2,
    #wissenswertes h2 {
        margin-top:0 !important
    }
    
    .wissenswertesinner {
        padding-top:0 !important
    }
    
    .introright img {
        width:90%;
        margin-left:5%;
        float:none;
    }
    
    .introright .introcontent {
        width:90% !important;
        margin-left:10% !important
    }
    
    .wissenswertesinner ul li:first-child {
        width:97% !important;
        margin-left:1.5% !important
    }
    
    .wissenswertesinner ul li {
width: 47% !important;
margin: 0 1.5% !important;
float: Left !important;
}
    
    .wissenswertesinner ul li:last-child {
        width: 47% !important;
margin: 0 0 0 1.5% !important;
float: Left !important;
}
    
    iframe {
        height:800px
    }
        
    .moreitems {
        margin-bottom:15px !important
    }
    
    #testmuster {
        width:100% !important;
        height:100% !important;
        top:0;
        left:0 !important;
        margin:0;
        max-width:100% !important;
        overflow:scroll !important;
    }
    
    #testmuster .formular {
        width:100% !important;
        float:right !important;
        padding:15px !important;
    }
    
    #testmuster .formular .field.nachname,
#testmuster .formular .field.strasse {
    width:100% !important
}
    
    #testmuster img {
        width:50% !important;
        margin-left:25%!important;
        float:left !important;
        margin-top:15px !important;
        margin-bottom:25px !important
    }
    
    #testmuster .close {
        position:fixed !important;
        background-color:rgba(112,34,131,0.80) !important;
        width:60px !important;
        height:60px !important;
        right:0;
        top:0;
        z-index: 1000000 !important
    }
    
    #testmuster .formular .field {
        width:100% !important
    }
    
    #testmuster h2 {
        font-size:35px !important;
        text-align: center;
        padding-left:0 !important;
        color:#fff !important
    }
    
#testmuster .formular .field input{
    border-radius:0 !important;
    padding:15px 8px !important;
    font-size:18px !important;
    min-height:45px !important;
    font-family: 'regular1', sans-serif !important;
}

.ui.selection.dropdown{
    border-radius:0 !important;
    padding:8px 8px !important;
    font-size:18px !important;
    min-height:55px !important;
    font-family: 'regular1', sans-serif !important;
}
.ui.selection.dropdown>.delete.icon, .ui.selection.dropdown>.dropdown.icon, .ui.selection.dropdown>.search.icon {
    top:15px !important
}

.ui.dropdown>.text {
    padding-top:10px !important
}

.field.required.error input {
    border:1px solid #ff000 !important;
    background-color:rgba(209,10,17,0.30) !important;
    font-family: 'regular1', sans-serif !important;
}
    
    .ui.green.button, .ui.green.buttons .button {
    background-color:rgba(112,34,131,1.00) !important;
    border:1px solid #fff !important;
    border-radius:0 !important;
        display:block !important;
    font-family: 'bold1', sans-serif !important;
    margin-top:50px !important;
    transition: 0.5s !important;
        width:100% !important;
        font-size:20px !important;
        padding:15px !important
}
    
    .ui.form .field>label, .ui.checkbox input.hidden+label {
        font-size:16px !important;
    }

.ui.green.button::after {
    font-family: 'Font Awesome 6 Pro';
  content: "\f178";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
font-weight:200;
    padding-left:20px;
    padding-right:10px;/* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em;
}

    iframe {
        height:800px !important
    }
    
    


}

@media (max-width:575px) {
    
    h1, h2 {
        font-size:25px !important;
        line-height:30px !important
    }
    .mod-articles-category-title .title {
        font-size:18px !important
    }
    .readmore {
        width:100% !important;
        display:block !important;
        box-sizing: border-box;
        font-size:18px !important;
    font-family: 'bold1', sans-serif !important;
        text-align: center;
        padding:20px !important
    }
    
    button.readmore {
    font-family: 'bold1', sans-serif !important;
    width:95% !important;}
    
    p {
 font-size:18px;
    line-height:30px;
}
    #risikofaktoren .balken {
        display:none;
    }
    
    .risikofaktoreninner ul li {
        width:100% !important;
        margin:0 !important;
        text-align: center !important;
        margin-bottom:20px !important
    }
    
        .wissenswertesinner ul li {
width: 100% !important; 
margin: 0 !important;
float: Left !important;
}
    
    .wissenswertesinner ul li:last-child {
        width: 100% !important;
margin: 0 0 0 0% !important;
float: Left !important;
}
    
    #footerleft, #footerright {
        width:100% !important;
        text-align: center !important;
        font-size:18px !important
    }
    
    #footerleft ul li a {
        font-size:18px !important
    }
    
    .stickbottom {
        max-width:70% !important;
        margin:0 auto 30px auto !important;
        float:none !important
    }
    
    .risikofaktoreninner img {
        width:170px !important
    }
    
    #herointro {
        transform: scale(0.5) !important;
         -webkit-transform: scale(0.45) !important;
        bottom:25px !important;
        left:-2% !important
    }
    
    #hero {
        height:50% !important;
        transition:0.5s;}
    
    #contentarea {top:50% !important;
        transition:0.5s;}
    
}

/* for higher resolutions (android and retina) */
@media screen and (-webkit-min-device-pixel-ratio: 1.5), screen and (max--moz-device-pixel-ratio: 1.5) {
  
}