/*
Theme Name: Galenus-Apotheke-Oldenburg
Theme URI: http://www.staude.de
Author: Das Staude Team
Author URI: http://www.staude.de
Description: Galenus-Apotheke-Oldenburg
Version: 2021.8
Tags: staude, kundendesign
*/

body {	
	color: #3e3e3e;
	font-size: 19px;
	line-height:1.4em;
	font-family: var(--sec-font);
	font-weight: 400;	
}

body::before{content:"";background-color: #fff;; 
	background-size: cover;
	background-repeat: no-repeat;position: fixed;top:0px;left:0px;width:100vw;height:100vh;z-index:-1;opacity:0.5;}

/***************************/
/********* Header **********/
/***************************/

header {
	width: 100%;
	position:fixed;
	top:0px;
	z-index:9996;
	background-color: #fff;
	transition: all 0.33s ease-in-out; 
	vertical-align: middle;	
}

header.abdocken{max-width:1750px;margin:15px auto 0px auto;border-radius: var(--b-radius);-webkit-box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.3); box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.3);}

@media( max-width:  767px ) {
	header.abdocken{left: 5px;width: calc(100% - 10px);}
}

@media( min-width:  1750px ) {
	header.abdocken{left: calc(50% - 875px);}
}

body.down header {background-color: rgba(255, 255, 255,);backdrop-filter: blur(10px);}

#header-top{background-color:transparent;font-size:0.9em;border-bottom: 1px solid #cecece;}

.header-kontakt, .header-icons{display: inline-block;}

@media( max-width:  1200px ) {
	.header-kontakt.left, .header-kontakt.right  {
		display: none;
	}
}

#header-top .icon-left-custom {display: inline-block;}

#header-navigation {	
	width: 100%;	
	transition: all 0.33s ease-in-out;
	background-color: var(--main-color);
}

#logo {
    width: 100%;
    transition: all 0.33s ease-in-out;
    position: relative;
    display: inline-block;
    max-width: 550px;
    padding: 15px 0px;
    text-align: center;
    margin: 0 auto;
}
#sn-menu #logo {
    max-width: 300px;
    text-align: center;
    margin: 0 auto;
    position: static;
    display: block;
}


#logo img {width:100%;height:auto;}
.logo-text {height: auto; width: 70%;}
@media( max-width:  767px ) {
header {position:absolute;}
#quick-actions {display:block;}
}

@media( min-width:  768px ) { 
header {position:fixed;}
#quick-actions {display:none;}
}

/******************* SUCHE *************************/

#s, #searchsubmit {
	background-color: var(--sec-color);
	padding: 5px;
	font-family: 'Lato', sans-serif;
	display: inline-flex;
	flex-direction: column;
	border-width: 1px;
	border-style: solid;
	border-color: var(--sec-color);
	border-image: none;
	width: 100%;
	border-radius: 15px;
	color: #fff;
	outline: none;
}

#searchsubmit {
	box-sizing: content-box;
	margin-top: 15px;
	align-items: center;
	background-color: var(--main-color);
	color: #fff;
	cursor: pointer;
	border-color: var(--main-color);
}

/*******************************/
/********* Navigation **********/
/******************************/

/** Navigation Oben **/
#nav_oben, #nav_mobil { 
	display: inline-block; 
	z-index: 99; 
	width:  100%;
	vertical-align: middle; 
}
#sn-menu.details.open, .details.transparent.open, .details.transparent.open {
    background-color: #fff;
	color: var(--main-color);
}
.sn-btn-detail {
    color: var(--main-color);
}
.sn-btn-detail::before {
    background-color: var(--main-color);
}
.sn-btn-detail:hover {
    color: var(--sec-color);
}
.sn-btn-detail::after {
    border-radius: 50%;
	border: 1px solid var(--main-color);
}
#nav_oben > li.menu-item, #nav_mobil > li.menu-item {float:left; display: block;}
#nav_oben > li + li.menu-item, #nav_mobil > li + li.menu-item { padding-left: 0; margin-left: 0; }

#nav_oben > li.menu-item a, #nav_mobil > li.menu-item a{
	display: block;
	color: #fff;
	background-color: transparent;
	font-size:0.95em;
	transition: all 0.33s ease-in-out;	
	font-weight: bolder;
}
#nav_oben > li.menu-item-has-children > a:after {
    content: "";
    display: inline-block;
    width: 9px;
    height: 5px;
    background-image: url("images/arrow-white.png");
    background-size: cover;
    margin-left: 5px;
    position: relative;
    top: -4px;
}
/************ Navigation mit Icons links ****************/

#nav_oben.icon-nav-left > li.menu-item{position: relative;}
#nav_oben.icon-nav-left > li.menu-item a{padding-left: 55px;}
#nav_oben.icon-nav-left > li.menu-item::before{content: '';background-color: var(--main-color);-webkit-mask-size: contain;mask-size: contain;width: 30px;height: 30px;display: inline-block;-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-position: center center;mask-position: center center;vertical-align: middle;position:absolute;   top: calc(50% - 15px); left: 15px;transition: all 0.33s ease-in-out;z-index: -1;	}
.header-icons .btn-icon::before {
    background-color: #fff;
}
/************ Navigation mit Icons oben ****************/

#nav_oben.icon-nav-top  > li.menu-item{position: relative;}
#nav_oben.icon-nav-top > li.menu-item a{padding-top: 60px;padding-bottom: 15px;}
#nav_oben.icon-nav-top > li.menu-item::before{content: '';background-color: var(--main-color);-webkit-mask-size: contain;mask-size: contain;width: 30px;height: 30px;display: inline-block;-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-position: center center;mask-position: center center;vertical-align: middle;position:absolute; top: 23px; left: calc(50% - 15px);transition: all 0.33s ease-in-out;z-index: -1;	}

/************ Navigation Linie unten ****************/

#nav_oben.bottom-line > li.menu-item{border-bottom: 2px solid transparent;}
#nav_oben.bottom-line > li.menu-item:hover{border-bottom: 2px solid var(--main-color);}

/************ Navigation Linie oben ****************/

#nav_oben.top-line > li.menu-item{border-top: 2px solid transparent;}
#nav_oben.top-line > li.menu-item:hover{border-top: 2px solid var(--main-color);}

/************ Navigation Trennstich ****************/

#nav_oben.right-line > li.menu-item{border-right: 1px solid #efefef;}

/************ Navigation Vollflaechig ****************/

#nav_oben.full-color > li.menu-item{background-color: transparent;transition: all 0.33s ease-in-out;}
#nav_oben.full-color > li.menu-item:hover{background-color: var(--sec-color);}
#nav_oben.full-color > li.menu-item a:hover {color:#fff; border-bottom: 2px solid #fff;}

#nav_oben.full-color.icon-nav-left > li.menu-item:hover::before, #nav_oben.full-color.icon-nav-top > li.menu-item:hover::before{background-color: #fff;}

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

#nav_oben ul.sub-menu {display:none;position: absolute;}

#nav_oben.dropdown li.menu-item:hover > ul.sub-menu,
#nav_oben li.page_item:hover > ul.children {
	display:block;
	z-index: 109;
}

#navigation .dropdown ul.sub-menu li:hover a::after,
#navigation .dropdown ul.children li:hover a::after {
	float:left;
	display: block;
	content: "";
}


/*Unternavigation*/
#nav_oben > li > ul.sub-menu > li > a, 
#nav_oben > li > ul.sub-menu > li > ul.sub-menu > li > a { padding: 5px 15px!important;  color:#fff; text-align: left; font-size:0.9em;}

#nav_oben > li > ul.sub-menu > li, 
#nav_oben > li > ul.sub-menu > li, #nav_oben > li > ul.sub-menu > li > ul.sub-menu > li {background-color: var(--main-color);transition: all 0.33s ease-in-out;}

#nav_oben > li > ul.sub-menu > li:hover > a, 
#nav_oben > li > ul.sub-menu > li > ul.sub-menu > li:hover > a { color: #fff; }

#nav_oben > li > ul.sub-menu > li:hover, 
#nav_oben > li > ul.sub-menu > li > ul.sub-menu > li:hover{ background-color: var(--sec-color); }

@media( min-width:  992px ) {
	#nav_oben > li.menu-item a {padding: 10px 10px;width:  auto;font-size: clamp(0.8rem,1.1vw,1.1rem);}
}

.details.transparent.open .close::after, .details.transparent.open .close::before {
    background-color: var(--main-color);
}

/**** Mobile Navigation ******/

#nav_mobil > li.menu-item a {
	padding: 10px 15px;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 1.4em;
	color:var(--main-color);
	border-bottom: 1px solid #202020;
}
#nav_mobil > li.menu-item-has-children > a:after {
    content: "";
    display: inline-block;
    width: 9px;
    height: 5px;
    background-image: url("images/arrow-blue.png");
    background-size: cover;
    margin-left: 5px;
    position: relative;
    top: -4px;
}
#nav_mobil > li.menu-item-has-children:hover > a:after {
background-image: url("images/arrow-white.png");
}
#nav_mobil > li.menu-item-has-children:active > a:after {
background-image: url("images/arrow-white.png");
}
#nav_mobil > li.menu-item.current-menu-item  > a, 
#nav_mobil > li.menu-item:hover > a{
	background-color:var(--main-color);
	border-left: 2px solid var(--main-color);
	color: #fff;
	font-weight: bolder;
}

#nav_mobil > li.menu-item { 	
	display: block;
	width: 100%;
	text-align:left; }

#nav_mobil { width:  100%; }

#nav_mobil.dropdown li.menu-item > ul.sub-menu,
#nav_mobil li.page_item > ul.children, li.page_item:hover > ul.children {display: none;position: static;}

#nav_mobil.dropdown li.menu-item:hover > ul.sub-menu,
#nav_mobil li.page_item:hover > ul.children {
	display:none;
	z-index: 109;
}

/*Unternavigation*/
#nav_mobil > li > ul.sub-menu > li > a, 
#nav_mobil > li > ul.sub-menu > li > ul.sub-menu > li > a { font-size:1em;padding: 10px 15px!important; color: #fff; text-align: left;}

#nav_mobil > li > ul.sub-menu > li, 
#nav_mobil > li > ul.sub-menu > li > ul.sub-menu > li{ background-color: #363636; }

#nav_mobil > li > ul.sub-menu > li:hover > a, 
#nav_mobil > li > ul.sub-menu > li > ul.sub-menu > li:hover > a { color: #fff; }

#nav_mobil > li > ul.sub-menu > li:hover, 
#nav_mobil > li > ul.sub-menu > li > ul.sub-menu > li:hover{ background-color: #202020; }

/************ Navigation mit Icons links ****************/

#nav_mobil.icon-mobil-left > li.menu-item{position: relative;}
#nav_mobil.icon-mobil-left> li.menu-item a{padding-left: 55px;}
#nav_mobil.icon-mobil-left > li.menu-item::before{content: '';background-color: #fff;-webkit-mask-size: contain;mask-size: contain;width: 24px;height: 24px;display: inline-block;-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-position: center center;mask-position: center center;vertical-align: middle;position:absolute;   top: 10px; left: 13px;transition: all 0.33s ease-in-out;	}

/************ Kacheln ****************/

#nav_mobil.kacheln > li.menu-item{display:inline-block;width:50%;text-align: center;position: relative;border-right:1px solid #202020;box-sizing: border-box;}
#nav_mobil.kacheln > li.menu-item a{padding: 60px 15px 15px 15px;font-size: 1.1em;}
#nav_mobil.kacheln > li.menu-item::before{content: '';background-color: #fff;-webkit-mask-size: contain;mask-size: contain;width: 24px;height: 24px;display: inline-block;-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-position: center center;mask-position: center center;vertical-align: middle;position:absolute;   top: 20px; left: calc(50% - 12px);transition: all 0.33s ease-in-out;	}

/************ Kacheln Abstand ****************/

#nav_mobil.kacheln-abstand > li.menu-item{display:inline-block;width: calc(50% - 20px);margin:10px;text-align: center;position: relative;box-sizing: border-box;overflow: hidden;background-color: var(--main-color);border-radius: var(--b-radius);z-index:10;}
#nav_mobil.kacheln-abstand > li.menu-item a{padding: 60px 15px 15px 15px;font-size: 1.1em;z-index:20;position: relative;border-bottom: 0px solid #fff;}
#nav_mobil.kacheln-abstand > li.menu-item::after{
	content:"";
	position: absolute;
	top:0px;left:0px;width: 100%;height:100%;
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
	opacity:0.25;
	border-radius: var(--b-radius);
	z-index:10;
}
#nav_mobil.kacheln-abstand > li.menu-item::before{content: '';background-color: #fff;-webkit-mask-size: contain;mask-size: contain;width: 24px;height: 24px;display: inline-block;-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-position: center center;mask-position: center center;vertical-align: middle;position:absolute;   top: 28px; left: calc(50% - 12px);transition: all 0.33s ease-in-out;z-index:30;}


#nav_mobil.kacheln-abstand > li.menu-item.current-menu-item  > a, 
#nav_mobil.kacheln-abstand > li.menu-item:hover > a{
	background-color:var(--sec-color);
	border-left: 0px solid #fff;
}

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

.btn-menu{
	display:block;
	width: 30px;
	height:25px;
	position:relative;
	transition: all 0.33s ease-in-out;
	margin: 15px 0px;
}

.btn-menu .line-1, .btn-menu .line-2, .btn-menu .line-3 {
	width:  100%;
	height: 1px;
	background-color: #fff;
	position:absolute;
	transition: all 0.33s ease-in-out;
	
}

.btn-menu .line-1{left:0%;top:0%;}
.btn-menu .line-2{left:0%;top:50%;}
.btn-menu .line-3{left:0%;top:100%;}


@media( max-width:  767px ) {
	.btn-menu {
		display: none;
	}
	.btn-menu.alwayson{display:none;}
}

@media( min-width:  768px ) { 
	.btn-menu{display:block;}
	.btn-menu.alwayson{display:block;}
}

@media( min-width:  992px ) {
	.btn-menu{display:none;}
	.btn-menu.alwayson{display:block;}
}

@media( min-width:  1200px ) {
	.btn-menu{display:none;}
	.btn-menu.alwayson{display:block;}
}

.details {
	opacity: 0;
	height: calc(100vh - 50px);
	width: 25vw;
	position: fixed;
	font-size: 1rem;
	top: -100vh;
	transition: all .33s ease-in-out;
	z-index: 99999;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/* border-radius: var(--b-radius); */
}

.details.open {
	background: rgba(255, 255, 255, 0.8);
	overflow: hidden;
	opacity: 1;
	top: 0px;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
}

.details .close, .boxzilla-close-icon {
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	border-radius: var(--b-radius);
	z-index: 10000;	
	display: block;
	width: 40px;
	height: 40px;
	color: var(--main-color);
	padding: 5px !important;
	border: 1px solid var(--main-color);
	cursor: pointer;
	position: absolute;
}

.boxzilla-close-icon {
	font-size: 0px !important;	
	right: 5px !important;
	top: 5px !important;
}

.details .close::after, .details .close::before, .boxzilla-close-icon::after, .boxzilla-close-icon::before{
	content:"";
	position:absolute;
	width:80%;
	height:2px;
	margin:10% 0%;
	background-color: var(--sec-color);
	left: 10%;
	top: 41%;
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
}

.details .close::after, .boxzilla-close-icon::after{transform: rotate(45deg);}
.details .close::before, .boxzilla-close-icon::before{transform: rotate(-45deg);}
 
.details .close:hover::after, .details .close:hover::before, .boxzilla-close-icon:hover::after, .boxzilla-close-icon:hover::before{background-color: var(--main-color);}
.details .close:hover::after, .boxzilla-close-icon:hover::after {transform: rotate(-45deg);}
.details .close:hover::before, .boxzilla-close-icon:hover::before {transform: rotate(45deg);}

#empfehlen, #sprechzeiten, #sprachauswahl, #search {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	z-index: 9999;
	right: calc(-25vw - 50px);
	top: 0px;
	margin: 25px;
	padding: 10px;
}

@media (max-width: 767px) {
	.details .close {
		top: 25px;
		right: 15px
	}
	.smart-container {
		display: flex;
		position: relative;
		width: calc(100% - 45px);
		box-sizing: border-box;
		top: -5px;
		left: 7px
	}
	.smart-search {
		flex-basis: calc(100% - 50px);
		margin-right: 0;
		margin-left: -35px
	}
	#empfehlen.details.open, #sprechzeiten.details.open, #smartnav.details.open, #sprachauswahl.details.open, #search.details.open {
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		right: 0;
		padding: 25px;
		margin: 0px;
		border-radius: 0px;
	}
}

@media (min-width: 768px) {
	.details.open {
		width: 100%;
		overflow: hidden
	}
	#empfehlen.details.open, #sprachauswahl.details.open, #search.details.open {
		width: 50%;
		height: calc(100vh - 50px);
		overflow: hidden;
		right: 0px;
	}
	.details .close {
		top: 20px;
		right: 20px
	}
}

@media (min-width: 992px) {
	#empfehlen.details.open,  #sprachauswahl.details.open, #search.details.open {
		width: 25%
	}
}

/*********************************************/
/**************** DISPLAY POST ***********************/
/*********************************************/

#content .display-posts-listing{display:block;}

#content .excerpt-dash{display: none;}

#content .listing-item{
	padding: 0px;
	box-sizing: border-box;	
	text-align:left;
}
	
#content .listing-item a.title, #content .listing-item span.title {
	display:block;
	color: #3e3e3e;
	font-size: 1em;
	font-weight: 400;
	text-align:left;
	margin-bottom:0px;	
	transition: all 0.33s ease-in-out; 
	padding: 2px 0px 5px 20px;
	position: relative;
}


#content .listing-item a.title::after{content: '';background-color: var(--main-color);-webkit-mask-size: contain;mask-size: contain;width: 15px;height: 15px;display: inline-block;-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-position: center center;mask-position: center center;	vertical-align: middle; position:absolute;top: 7px;	left: 0px;-webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-arrow-3.svg");mask-image: url("https://cdn.staude.info/css/icons/icon-arrow-3.svg");}

#content .listing-item:hover a.title{padding: 2px 0px 5px 30px;color: var(--main-color);}
	
#content .listing-item span.excerpt {
	display:block;
	padding:15px;
	text-align:center;
	position:absolute;
	top:50%;
	opacity:0;
	color:#fff;
	width:  calc(100% - 30px);
	transition: all 0.33s ease-in-out;
}
	
#content .listing-item .image{ 
	display:none;
	position:relative;
	width:  100%;
	margin:0%;
	transition: all 0.33s ease-in-out;
}

#content .listing-item a.excerpt-more{
	display: block;
	padding: 7px 15px;
	border: 1px solid #fff;
	color: #fff;
	text-transform: uppercase;
	font-size: 0.9em;
	font-weight: 400;
	background-color: transparent;
	margin-top:15px;
	text-align:center;
}
	
#content .listing-item a.excerpt-more:hover{
	
	color: var(--main-color);
	background-color: #fff;
}

.html_table_striped tr:nth-child(2n) {
    background: #f2f2f2;
}

.html_table_striped th, .html_table_striped td {
    margin: 0px;
    padding: 4px;
}


.carousel-slider .slick-prev, .carousel-slider .slick-next{
	width:  45px;
	height: 45px;
	border-radius: 50%;
	overflow: hidden;
	background-color: var(--sec-color);
}
	
.carousel-slider .slick-prev::before, .carousel-slider  .slick-next::before{content: '';background-color: #fff;-webkit-mask-size: contain;mask-size: contain;width: 20px;height: 20px;display: inline-block;-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-position: center center;mask-position: center center;vertical-align: middle;position:absolute;top: calc(50% - 10px);left: calc(50% - 10px);font-size: 0px;-webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-arrow-1.svg");mask-image: url("https://cdn.staude.info/css/icons/icon-arrow-1.svg");}

.carousel-slider .slick-prev{left: 0px;z-index: 2;}
.carousel-slider .slick-next{right: 0px;}

.carousel-slider .slick-prev::before{transform: rotate(180deg);}
.carousel-slider .slick-next::before{transform: rotate(0deg);}

.slick-slide:focus{outline:none;}

#content .slick-initialized .slick-slide {
	display: block;
	width:  300px;
	margin: 20px;
	transform: scale(0.9); 
	transition: all 0.33s ease-in-out;
}

#content .slick-slide {height: auto;}
#content .slick-track{display: flex; flex-wrap: wrap;}
#content .slick-initialized .slick-slide{display: flex;}

@media( max-width:  767px ) {
	.carousel-slider .slick-prev,.carousel-slider .slick-next{width:  30px;height: 30px;}
	#content .slick-initialized .slick-slide {width:  300px;}
}

@media( min-width:  768px ) {
	.carousel-slider .slick-prev,.carousel-slider .slick-next{width:  35px;height: 35px;}
	#content .slick-initialized .slick-slide {width:  325px;}
}

@media( min-width:  992px ) {
	.carousel-slider .slick-prev,.carousel-slider .slick-next{width:  40px;height: 40px;}
	#content .slick-initialized .slick-slide {width:  350px;}
}

@media( min-width:  1200px ) {
	.carousel-slider .slick-prev,.carousel-slider .slick-next{width:  40px;height: 40px;}
	#content .slick-initialized .slick-slide {width:  400px;}
	#team.slick-initialized .slick-slide {width:  500px;}
}

/*************************************/
/********* Service Übersicht ***********/
/*************************************/


#service-uebersicht-wrapper{width:100%;height:auto;margin-top:200px;}

#service-uebersicht-wrapper .listing-item {
    padding: 0px;
    box-sizing: border-box;
    text-align: left;
    display: inline-block;
	margin: 0px 25px 25px 0px;
	background-color: var(--main-color);
	border-radius: var(--b-radius);
	overflow: hidden;
}

#service-uebersicht-wrapper .listing-item a.title, 
#service-uebersicht-wrapper .listing-item span.title {
    display: block;
    color: #fff;
    font-size: 1em;
    font-weight: 400;
    text-align: center;
    margin-bottom: 0px;
    transition: all 0.33s ease-in-out;
    padding: 0px 0px 0px 0px;
    position: absolute;
}

#service-uebersicht-wrapper .listing-item a.title::after {display:none;}

#service-uebersicht-wrapper .listing-item .image {
    display: block;
    width: 100%;
	height:auto;
    transition: all 0.33s ease-in-out;
	opacity:0.8;
}

@media( max-width:  767px ) {
	#service-uebersicht-wrapper .listing-item {width: 100%;margin: 0px 0px 25px 0px;}	
}

@media( min-width:  768px ) {
	#service-uebersicht-wrapper .listing-item {width: calc(50% - 25px);}	
}

@media( min-width:  992px ) {
	#service-uebersicht-wrapper .listing-item {width: calc(33% - 25px);}
}

@media( min-width:  1200px ) {
	#service-uebersicht-wrapper .listing-item {width: calc(25% - 25px);}
}

/*************************************/
/************ Pdf Formular ***********/
/*************************************/
span.fa-plus.flipbook-icon-fa.flipbook-menu-btn.skin-color.fa.flipbook-color-light, span.fa-minus.flipbook-icon-fa.flipbook-menu-btn.skin-color.fa.flipbook-color-light, span.fa-print.flipbook-icon-fa.flipbook-menu-btn.skin-color.fa.flipbook-color-light, span.fa-expand.flipbook-icon-fa.flipbook-menu-btn.skin-color.fa.flipbook-color-light, span.fa-compress.flipbook-icon-fa.flipbook-menu-btn.skin-color.fa.flipbook-color-light{
    transform: scale(1.8);
}


/*************************************/
/********* Service (KREIS) ***********/
/*************************************/


@keyframes ani-service {
	0% { transform: scale(0) rotate(0deg); }
	100% { transform: scale(1) rotate(360deg); }  
  }

#service-wrapper{width:700px;height:700px;position: relative;margin:auto;animation: ani-service 2s forwards;}

.inner-circle{width:40%;height:40%;position: absolute;top: calc(50% - 20%);left: calc(50% - 20%);background-color:var(--main-color);border:8px solid #e0e6ec;z-index:20;border-radius: 50%;box-sizing: border-box;}

.outer-circle{width:90%;height:90%;top: calc(50% - 45%);left: calc(50% - 45%);z-index:10;border-radius: 50%;position: relative;overflow:hidden;}

.outer-circle li{
	position: absolute;
	top: 0%;
	left: 0%;
	overflow: hidden;
	width: 50%;
	height: 50%;
	-webkit-transition: all ease 0.4s;
	-moz-transition: all ease 0.4s;
	transition: all ease 0.4s;
	transition-delay: 0s;
	-webkit-transform: rotate(90deg) skewX(5deg) skewY(5deg);
	-moz-transform: rotate(90deg) skewX(5deg) skewY(5deg);
	-ms-transform: rotate(90deg) skewX(5deg) skewY(5deg);
	transform: rotate(90deg) skewX(5deg) skewY(5deg);
	-webkit-transform-origin: 100% 100%;
	-moz-transform-origin: 100% 100%;
	transform-origin: 100% 100%;
	background-color: var(--main-color);
	visibility: visible;
	opacity: 1;
}

.outer-circle li:hover{background-color: var(--sec-color);}

.outer-circle li .icon-top-custom{
	padding-top: 45px;
	font-size: 0.75em;
	line-height:1em;
    left: calc(50% - 62px);
    position: relative;
    top: calc(50% - 62px);
    height: 28px;
}

.outer-circle li:nth-child(1) .icon-top-custom{transform: rotate(0deg);}
.outer-circle li:nth-child(2) .icon-top-custom{transform: rotate(-32.73deg);}
.outer-circle li:nth-child(3) .icon-top-custom{transform: rotate(-65.45deg);}
.outer-circle li:nth-child(4) .icon-top-custom{transform: rotate(-98.18deg);}
.outer-circle li:nth-child(5) .icon-top-custom{transform: rotate(-130.90deg);}
.outer-circle li:nth-child(6) .icon-top-custom{transform: rotate(-163.63deg);}
.outer-circle li:nth-child(7) .icon-top-custom{transform: rotate(-196.36deg);}
.outer-circle li:nth-child(8) .icon-top-custom{transform: rotate(-229.09deg);}
.outer-circle li:nth-child(9) .icon-top-custom{transform: rotate(-261.81deg);}
.outer-circle li:nth-child(10) .icon-top-custom{transform: rotate(-294.54deg);}
.outer-circle li:nth-child(11) .icon-top-custom{transform: rotate(-327.27deg);}

.outer-circle li .icon-top-custom::before{background-color: #fff;width: 34px;height: 34px;left: calc(50% - 17px);top:0px;}


.outer-circle li a{width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	transform: rotate(0deg) skew(-60deg);
	color: #fff;
	top: 38%;
	right: 36%;}

.outer-circle li img{
	position: absolute;
	width: 100%;
	height: auto;
	max-width: 100%;
	transform: scale(1) skew(-60deg);opacity:0.25;
	top: 49%;
	right: 3%;
	transition: all 0.33s ease-in-out;
}

@media( max-width:  767px ) {

	.outer-circle li{transform: rotate(0deg) skew(0deg)!important;}

	.inner-circle{display: none;}

	.outer-circle{width: 100%;height: 100%;position: static;overflow: visible;	border-radius: 0px;}

	.outer-circle li {position: relative;border-radius: var(--b-radius);overflow:hidden;padding-top:25px;margin: 0px 22px 25px 0px;display: inline-block;width: calc(50% - 25px);height: auto;}

	.outer-circle li a {position: static;transform: rotate(0deg) skew(0deg);}

	#content .outer-circle li img {position: absolute;	transform: scale(1) skew(0deg);top:0px;left:0px;width: 135%;max-width: 135%;}

	.outer-circle li .icon-top-custom {transform: rotate(0deg)!important;top:0px;left:0px;}

	#service-wrapper{width: 100%;height: auto;}



	@keyframes ani-service {
		0% { transform: scale(1) rotate(360deg); }
		100% { transform: scale(1) rotate(360deg); }  
	  }
	
}

@media( min-width:  768px ) {
	#service-wrapper {width: 700px;	height: 700px;}
	
}

@media( min-width:  992px ) {
	#service-wrapper {width: 800px;	height: 800px;}
}

@media( min-width:  1200px ) {
	#service-wrapper {width: 900px;	height: 900px;}
}


/*****************************************/
/********* Service (HALBKREIS) ***********/
/*****************************************/

#service-wrapper-2{width:100%;height:700px;position: relative;overflow:hidden;}

.halfcircle{width:250px;height:250px;border: 5px solid var(--main-color);position: absolute;bottom:-125px;left: calc(50% - 100px);border-radius: 50%;z-index:10;}

.halfcircle::before, .halfcircle::after{content:"";position: absolute;border: 2px solid #fff;border-radius: 50%;}

.halfcircle::before{width:500px;height:500px;top: calc(50% - 250px);left: calc(50% - 250px);opacity:0.5;}
.halfcircle::after{width:750px;height:750px;top: calc(50% - 375px);left: calc(50% - 375px);opacity:0.25;}

.btn-half-circle{display:block;position:absolute;width:35%;padding:10px;bottom:0px;left: 15%;z-index:20;}

#service-wrapper-2 .icon-left-custom, #service-wrapper-2 .icon-right-custom{display: inline-block;transition: all 0.33s ease-in-out;color:#3d3d3d;}

#service-wrapper-2 .icon-right-custom{transform: translateX(0px) rotate(180deg);}

#service-wrapper-2  .btn-half-circle:hover .icon-left-custom{transform: translateX(10px);}
#service-wrapper-2  .btn-half-circle:hover .icon-right-custom{transform: translateX(10px) rotate(180deg);} 

.rotater{width: 100%;height: 100%;position: absolute;top: 0px;right: 0px;z-index: 20;}

@media( max-width:  767px ) {
	.halfcircle{right:-125px;left:auto;top: calc(50% - 125px);}
	.rotater{transform: rotate(-90deg);    max-width: 364px;}
	.btn-half-circle {width: 85%;bottom: 25%;left: -43%;font-size:0.9em;}
	#service-wrapper-2 .icon-right-custom {transform: translateX(0px) rotate(0deg);padding: 10px 5px 10px 40px;}
	#service-wrapper-2 .icon-right-custom::before{right: 85%;}
	#service-wrapper-2  .btn-half-circle:hover .icon-right-custom{transform: translateX(10px) rotate(0deg);} 
}


@media( min-width:  768px ) {
	#service-wrapper-2 {height: 536px;}
	.btn-half-circle {width: 43%;left: 8%;bottom:0px;font-size:1em;}
	.rotater{transform: rotate(0deg);    max-width: 100%;}
	#service-wrapper-2 .icon-right-custom {transform: translateX(0px) rotate(180deg);}
	#service-wrapper-2  .btn-half-circle:hover .icon-right-custom{transform: translateX(10px) rotate(180deg);} 


}

@media( min-width:  992px ) {
	#service-wrapper-2 {height: 700px; }
	.btn-half-circle {width:35%;left: 15%;bottom:0px;}	
}

/*************************************/
/********* Service (SLIDER) ***********/
/*************************************/

.service-item{background-color:rgba(255,255,255,0.0);border-radius: var(--b-radius);overflow:hidden;transition: all 0.33s ease-in-out;position: relative;border: 1px solid var(--main-color);}
.service-item .img-wrapper{overflow:hidden;}
.category-20 #content img.wp-post-image {
    width: auto;
    height: 200px;
    margin: 0 auto;
    text-align: center;
}
.category-20 .service-item .img-wrapper {
    overflow: hidden;
    text-align: center;
}
.service-item .text-wrapper{padding:15px;}

.service-item .img-wrapper img{width:100%;height:auto;}

#content .service-item img.wp-post-image {
    border-radius: 0px;
	transition: all 0.33s ease-in-out;
	position: relative;
	z-index:10;
}

.service-item .icon-top-custom{position: absolute;top:15px;right:15px;width:60px;border-radius: 50%;background-color: var(--main-color);transition: all 0.33s ease-in-out;z-index:20;}
.service-item .icon-top-custom::before{background-color: #fff;top: calc(50% - 17px);left: calc(50% - 17px);width:34px;height:34px;}

.service-item:hover{background-color:rgba(255,255,255,1); transform: scale(1.1);}
.service-item:hover .icon-top-custom{transform: scale(1.1) rotate(360deg);}
#content .service-item:hover img.wp-post-image{transform: scale(1.1);opacity:0.75;}

.rotate:hover {
    transform: scale(1.1);
}
/*************************************/
/********* Service (SLIDEUP) ***********/
/*************************************/

.text-wrap{width:100%;height:600px;position: relative;}

.text{width:100%;right:-100vw;position: absolute;background-color:#fff;border-radius: var(--b-radius);top:0px;transition: all 0.33s ease-in-out;vertical-align: top;overflow: hidden;height:600px;}

.text.active{right:0vw;}

.text .img-wrapper{width:33%;height:600px;overflow: hidden;border-top-right-radius: var(--b-radius);border-bottom-right-radius: var(--b-radius);display: inline-block;vertical-align: top;bottom:-50%;opacity: 0;transition: all 0.5s ease-in-out;transition-delay: 0.33s; position: relative;}
#content .text .img-wrapper img.wp-post-image, #content .text .img-wrapper img{width:250%;max-width: 250%;position: relative;left:-90%;}
.text .text-wrapper{padding:25px;display: inline-block;width:65%;box-sizing: border-box;vertical-align: top;height:100%;overflow: auto;top:-50%;opacity: 0;transition: all 0.5s ease-in-out;transition-delay: 0.33s; position: relative;}

.text.active .text-wrapper{top:0px;opacity: 1;}
.text.active .img-wrapper{bottom:0px;opacity: 1;}

.navigation .icon-left-custom{color:#3d3d3d;}
.navigation .icon-left-custom:hover{padding: 10px 5px 10px 50px;}

@media( max-width:  767px ) {
	.text .img-wrapper{width:100%;height:200px;}
	.text .text-wrapper{padding:20px;width:100%;height:100%;}
	#content .text .img-wrapper img.wp-post-image, #content .text .img-wrapper img{width:100%;max-width: 100%;left:0%;}
	.navigation .title{display: none;}
	.navigation li{display: inline-block;}
	.navigation .icon-left-custom{padding: 40px 0px 40px 80px;background-color: var(--main-color);margin-right:10px;border-radius: 50%;}
	.navigation .icon-left-custom::before{background-color: #fff;width: 40px;height: 40px;top: calc(50% - 20px);left: calc(50% - 20px);}
	.navigation .icon-left-custom:hover{padding: 40px 0px 40px 80px;}
}


@media( min-width:  768px ) {
	.text .img-wrapper{width:100%;height:200px;}
	.text .text-wrapper{padding:20px;width:100%;height:100%;}
	#content .text .img-wrapper img.wp-post-image, #content .text .img-wrapper img{width:100%;max-width: 100%;left:0%;}
	.navigation .title{display: block;}
	.navigation li{display: block;}

}

@media( min-width:  992px ) {
	.text .img-wrapper{width:100%;height:200px;}
	.text .text-wrapper{padding:20px;width:100%;height:100%;}
	#content .text .img-wrapper img.wp-post-image, #content .text .img-wrapper img{width:100%;max-width: 100%;left:0%;}
	.navigation .title{display: block;}
	.navigation li{display: block;}
}


@media( min-width:  1200px ) {
	.text .img-wrapper{width:33%;height:600px;}
	.text .text-wrapper{padding:25px;width:65%;height:100%;}
	#content .text .img-wrapper img.wp-post-image, #content .text .img-wrapper img{width:250%;max-width: 250%;left:-90%;}
	.navigation .title{display: block;}
	.navigation li{display: block;}
}



/*************************************/
/********* TEAM (SLIDER) *************/
/*************************************/

.team-item{width:100%;position: relative;z-index: 10;}
.team-item .img-wrapper{overflow:hidden;}
.team-item .text-wrapper{padding:15px 15px 0px 15px;text-align: center;position: absolute;bottom:0px;left:0px;opacity: 0;transition: all 0.33s ease-in-out;box-sizing: border-box;width:100%;background-color: #fff; border-radius: var(--b-radius); border: 1px solid var(--main-color);color:var(--main-color);z-index: 20;}
.team-item .text-wrapper h3{color:var(--main-color);}

.team-item:hover .text-wrapper{opacity:1;bottom:25px;}

.team-item .img-wrapper img{width:100%;height:auto;}

#content .team-item img.wp-post-image {
    border-radius: 0px;
	transition: all 0.33s ease-in-out;
	position: relative;
	z-index:10;
}

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

.team-item .icon-top-custom{position: absolute;top:15px;right:15px;width:60px;border-radius: 50%;background-color: var(--main-color);transition: all 0.33s ease-in-out;z-index:20;}
.team-item .icon-top-custom::before{background-color: #fff;top: calc(50% - 17px);left: calc(50% - 17px);width:34px;height:34px;}

#content #team .slick-initialized .slick-slide{margin: 0px;}

@media( max-width:  767px ) {
	#team.carousel-slider{margin-bottom: -85px;}
}


@media( min-width:  768px ) {
	#team.carousel-slider{margin-bottom: -88px;}
}

@media( min-width:  992px ) {
	#team.carousel-slider{margin-bottom: -88px;}
}


@media( min-width:  1200px ) {
	#team.carousel-slider{margin-bottom: -96px;}
}


/*************************************/
/********* TEAM (KACHELN) ************/
/*************************************/

#team-2 .team-item{position: relative;width:100%;background-color: rgba(255,255,255,0.0);border-radius: var(--b-radius);overflow: hidden;border: 1px solid #fff;}
.team-overlay{position: absolute;bottom:-100%;left:0px;width:100%;height:100%;opacity:0;z-index:10;transition: all 0.33s ease-in-out;border-radius: 50%;box-sizing: border-box;}

#team-2 .team-item:hover .text-wrapper{opacity:1;bottom:0px;}

#team-2 .team-item img{transform: translateY(30px) scale(0.85);transition: all 0.33s ease-in-out;}

#team-2 .team-item:hover img{transform: scale(1);}
#team-2 .team-item:hover .team-overlay{opacity: 1;bottom:-25%;}

#team-2 .team-item:hover{background-color: rgba(255,255,255,0);}


/*************************************/
/********* TEAM (CARDS) **************/
/*************************************/

.team-cards {
	position: relative;  
	list-style-type: none;
	padding: 0;
	max-width: 34em;
	margin: 50px auto 100px auto;
  }
  
  .team-card {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	
	background: #efefef;
	border-radius: var(--b-radius);
	padding: 0px;
	box-shadow: 0 0 40px rgba(0,0,0,0.25);
	transform: translateY(0) rotate(4deg) translateX(25px) scale(1);
	transform-origin: 0 0;
	
	transition: transform 0.6s cubic-bezier(.8,.2,.1,0.8) 0.1s,
	  background 0.4s linear;
	
	cursor: pointer;
	user-select: none;
  }

  .team-card:last-child { margin-bottom: 0; }

  #content .team-card img.wp-post-image {
    width: 100%;
    height: auto;
    position: relative;
    bottom: -10px;
}

.team-card .text-wrapper{width:100%;padding:15px;box-sizing: border-box;}
  
  .card--next { 
	z-index: 5; 
	transform: translateY(-25px) rotate(4deg) translateX(25px) scale(1);
  }
  
  .card--out {
	animation: card-out 0.6s cubic-bezier(.8,.2,.1,0.8);
	transform: translateY(-50px) rotate(8deg) translateX(55px) scale(0.95);
	z-index: 1;
	background: #bbb;
  }
  
  @keyframes card-out {
	0% { z-index: 20; transform: translateY(0px) rotate(-4deg); }
	50% { transform: translateY(-120%) rotate(-5deg) translateX(-40px); }
	80% { z-index: 1; }
	100% { transform: translateY(-50px) rotate(8deg) translateX(55px) scale(0.95); }
  }
  
  .card--current {
	cursor: auto;
	user-select: auto;
	position: relative;
	z-index: 10;
	opacity: 1;
	background: #fff;
	transform: rotate(-1deg) translateX(0%) scale(1);
  }

/*************************************/
/********* TEAM (PILLS) **************/
/*************************************/

#team-3 .team-item-wrapper{position: relative;width:100%;height:455px;padding:25px;box-sizing: border-box;}
#team-3 .team-item{position: relative;width:100%;height:400px;z-index: 10;transition: all 0.33s ease-in-out;}

#team-3 .team-item img{width:100%;max-width: 200px;margin:auto;display: block;}

#team-3 .team-item::before{content:"";width:175px;height:200px;position: absolute;top:50%;left: calc(50% - 87px);border-bottom-left-radius: 50%;border-bottom-right-radius: 50%;background-color: #fff;z-index:20;}
#team-3 .team-item::after{content:"";width:175px;height:200px;position: absolute;bottom:50%;left: calc(50% - 87px);border-top-left-radius: 50%;border-top-right-radius: 50%;background-color: var(--main-color);z-index:20;transition: all 0.33s ease-in-out;}

#team-3 .team-item:hover::after{bottom:120%;left:-50px;transform: rotate(-20deg);opacity:0;}

#team-3 .team-item:hover{transform: scale(1.1) translateY(-30px);}


#team-3 .team-item-wrapper .shadow{background-image: url('https://cdn.staude.info/themes/images/shadow.png');bottom: 0px;width:189px;height:22px;position: absolute;left: calc(50% - 95px);transition: all 0.33s ease-in-out;}
#team-3 .team-item-wrapper:hover .shadow{transform: scale(1.1);}


/*************************************/
/********* TEAM (SLIDEUP) **************/
/*************************************/


#team-4.slideup .navigation li{display: inline-block;width:100px;height:100px;margin-right:15px;margin-bottom: 15px;position: relative;}
#team-4.slideup .navigation li a.team-item{display:block;width:100%;height:100%;background-color: var(--main-color);border-radius: 50%;overflow:hidden;position: relative;}
#team-4.slideup .navigation li a.team-item img{width:84%;height:auto;margin: 16% 8% 0% 8%;}
#team-4.slideup .navigation li a.team-item:hover, #team-4.slideup .navigation li a.team-item.active{background-color: var(--sec-color);transform: scale(1.1) rotate(360deg);}

.text {
 height: auto;
 display: flex;
flex-wrap: wrap;
}

#team-4.slideup .text-wrap {
    width: 100%;
    height: 600px;
    position: relative;

}

#team-4.slideup .text-wrap .flex-col{flex-direction: column;justify-content: center;}
#team-4.slideup .text .img-wrapper {height: 100%;}
#team-4.slideup .text .text-wrapper {height: 100%;}

/********************************************/
/********** Scroll *************************/
/********************************************/

#scroll-down{ 
	width: 160px;
	position:absolute;
	bottom: 50px;
	left: calc(50% - 80px);
	font-size:0.8em;
	color: #fff;
	opacity:1;
	transition: all 0.33s ease-in-out;
	text-transform: uppercase;
	font-weight:700;
	text-align: center;
}
#scroll-down p {
    margin: 0;
}

body.down #scroll-down{opacity:0;}

.scroll-circle{width: 40px;height:40px;margin:auto;border-radius:100%;border:1px solid #fff;position:relative;}
.scroll-circle::after{content:">";position:absolute;right:8px;top:13px;width: 14px;height:14px;background-image: url(images/bg-check.png);animation: scroll-down 2s infinite;animation-timing-function: linear;transform: rotate(90deg);}

.scroll-line{width: 1px; height: 30px; margin: auto; border-left: 1px dashed var(--sec-color);animation: scroll-down-color 2s infinite;animation-timing-function: linear;}
.scroll-small-circle{width: 15px;height:15px;margin:auto;border-radius:100%;border:1px solid #fff;position:relative;}

@keyframes scroll-down {
  0% { top:13px; }
  10% { top:13px; }  
  40% { top:74px; }
  60% { top:74px; }
  90% { top:13px; }
  100% { top:13px; }
}

@keyframes scroll-down-color {
  0% { border-left: 1px dashed #fff; }
  10% { border-left: 1px dashed #fff; }  
  40% { border-left: 1px dashed v#fff; }
  60% { border-left: 1px dashed v#fff; }
  90% { border-left: 1px dashed #fff; }
  100% { border-left: 1px dashed #fff; }
}

/*******************************************************/
/********** CONTENT / SECTIONS *************************/
/*******************************************************/
.btn {
    border: 2px solid var(--main-color);
    background-color: var(--main-color);
    color: #fff;
}
.rotate:hover:after {
    background: var(--sec-color);

}
#vorbestellen{margin-top:0px;}

#content hr{background-color: #efefef;border: 0;height: 1px;margin: 25px auto;width: 100%}

.bg-box{padding:15px;border-radius: var(--b-radius);border:1px solid var(--main-color);width: 100%;	box-sizing: border-box;margin-bottom: 25px;}

.bg-box.white{background-color: rgba(255,255,255,0.9);-webkit-box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.3);	box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.3);}

.bg-box.main-color{background-color: var(--main-color);color:#fff;}

.bg-box.sec-color{background-color: var(--sec-color);color:#fff;}

.bg-box a{color: #3e3e3e}

.bg-box.main-color .icon-left-custom::before, .bg-box.sec-color .icon-left-custom::before{background-color:#fff;}

.bg-box.main-color a, .bg-box.sec-color a{color: #fff}

.bg-box .icon-left-custom:before{width: 22px;height: 22px;top: 13px;}
.bg-box .icon-left-custom{padding: 10px 5px 10px 35px;}

.bg-box.main-color h3, .bg-box.sec-color h3{color:#fff;}

#content .bg-box.main-color .listing-item a.title::after, #content .bg-box.sec-color .listing-item a.title::after{background-color: #fff;opacity:0.5;}
#content .bg-box.main-color .listing-item a.title, #content .bg-box.sec-color .listing-item a.title{color:#fff;}

.bg-box .btn{color:#fff;}
.bg-box .btn:hover{color:#fff;}

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

.breadcrumb{padding: 25px 0px 20px;font-size: 0.9em;}



button{
	display:inline-block;
	padding: 10px;
	color: #fff;
	margin-top:25px;
	box-sizing: border-box;	 		
	font-weight:600;	
	transition: all 0.33s ease-in-out;	  
	text-transform:uppercase;
	letter-spacing: 0.1em;
	cursor: pointer;
	font-size: 1em;	
	background-color: var(--main-color);
	border: 1px solid var(--main-color);
	border-radius: var(--b-radius);
	font-family: var(--main-font);
	outline: none;
}

button:hover{
	color: var(--main-color);	
	background-color: transparent;
	border: 1px solid var(--main-color);
}

.img-sub-title{display:block;padding:5px;background-color: #f8f8f8;margin-bottom:25px;}

#content { line-height:1.4em;width: 100%;max-width: 100%;}

h1 , h2, h3, h4 {font-family: var(--main-font);line-height: 1.15;color: var(--main-color);font-weight:400;margin-bottom: 25px;text-transform:uppercase;}
h1 {font-size: 2em;letter-spacing: 0.05em;}
h2 {font-size: 2em;letter-spacing: 0.1em;}
h3 {font-size: 1.6em;}
h4 {font-size: 1.5em;}

.center{text-align:center;}

#site-content { padding-top: 100px;position: relative;width: 100%;overflow: hidden;}

@media( max-width:  767px ) {
	h1 {font-size: 1.75em;}
	h2 {font-size: 1.5em;}
	h3 {font-size: 1.2em;}
	h4 {font-size: 1.1em;}
	
	#site-content { padding-top: 150px; }
	body.home #site-content, body.single-post #site-content{ padding-top: 70px; }
}

@media( min-width:  768px ) { 
	h1 {font-size: 1.8em;}
	h2 {font-size: 1.5em;}
	h3 {font-size: 1.2em;}
	h4 {font-size: 1.1em;}
	
	#site-content { padding-top: 208px; }
	body.home #site-content, body.single-post #site-content{ padding-top: 140px; }
}

@media( min-width:  992px ) {
	h1 {font-size: 2em;}
	h2 {font-size: 1.8em;}
	h3 {font-size: 1.25em;}
	h4 {font-size: 1.15em;}	
	
	#site-content { padding-top: 208px; }
	body.home #site-content, body.single-post #site-content{ padding-top: 185px; }
}

@media( min-width:  1200px ) {
	h1 {font-size: 2.2em;}
	h2 {font-size: 1.8em;}
	h3 {font-size: 1.25em;}
	h4 {font-size: 1.2em;}
	
	#site-content { padding-top: 208px; }
	body.home #site-content, body.single-post #site-content{padding-top: 185px;}
}

/*********************************************/
/**************** HOME ***********************/
/*********************************************/

#home {
	width: 100vw;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
	#home h1::before, #home h2::before {display: none;}
	#home p {text-align: center;}
	.fullscreen-video-wrap {
	box-sizing: border-box;
	position: absolute;
	width: 100vw;
	height: 100vh;
	top: 0px;
	left: 0px;
	overflow:hidden;
	}
	.fullscreen-video-wrap video {
	min-width: 100%;
	min-height: 100%;
	max-width: 1000%;
	top: -36px;
	position: relative;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	}

#home h1{color: var(--sec-color);text-align:center;letter-spacing: 0.1em;}
.claim {
    color: var(--main-color);
    text-align: center;
    font-weight: 600;
    text-transform: none;
    line-height: 1;
}
.welcome {
    font-size: 1.2rem;
    margin-bottom: 5px;
}

#willkommen, #apotheke {
    position: relative;
    background-color: #efefef;
    padding: 25px 0px;
    margin-bottom: 53px;
}
.bild-shadow {
    -webkit-box-shadow: 14px 14px 0px 5px #164193;
    box-shadow: 14px 14px 0px 5px #164193;
}
.herzlich{
	margin-top: -100px;
}
@media( max-width:  767px ) {
#home .pre-title{font-size: 5vw;margin-bottom:0px;text-align:center;}
#home h1{font-size: 7vw;}
.claim{font-size: 2em;}
.herzlich{font-size: 1em;}
#home{min-height:90vh; background-image: url(/wp-content/themes/galenus-apotheke-oldenburg/images/home-mobil.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.herzlich {color:#fff;}
#home #logo {
    background-color: #ffffff40;
    margin-bottom: 20px;
    padding: 20px;
    width: 80%;
}
.welcome {
    font-size: 1.2rem;
  
}
#scroll-down{display:none;}
}

@media( min-width:  768px ) {
#home .pre-title{font-size: 2vw;margin-bottom:0px;text-align:center;}
#home h1{font-size: 6vw;}
.claim{font-size: 4em;}
.herzlich{font-size: 1.5em;}
#home{min-height:85vh;}
#home #logo {
    background-color: none;
	margin-bottom: 20px;
}
.welcome {
    font-size: 1.2rem;
}
.herzlich {color:#000;}
#scroll-down{display:none;}
}

@media( min-width:  992px ) {
#home .pre-title{font-size: 1vw;margin-bottom:0px;text-align:left;}
#home h1{font-size: 5vw;}
.claim{font-size: 4em;}
#home{min-height: 80vh;}
.herzlich {font-size: 1.5em;}
#scroll-down{display:block;}
}

@media( min-width:  1200px ) {
#home .pre-title{font-size: 1vw;margin-bottom:0px;text-align:left;}
#home h1{font-size: 4vw;}
.claim{font-size: 4em;}
.herzlich {font-size: 1.5em; margin: 0;}
#home{min-height: 80vh;}

#scroll-down{display:block;}
}

/*****************************************************/
/**************** Vorbestellen ***********************/
/*****************************************************/

.btn-vbs{display: block;width:100%;border-radius: var(--b-radius);background-color: var(--main-color);color:#fff;position:relative;-webkit-box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.3); 	box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.3);overflow:hidden;transition: all 0.33s ease-in-out;}

.btn-vbs img{width:100%;max-width: 380px;height:auto;display: inline-block;position: relative;bottom:-25px;bottom: -30px;right: 25px;}

.icon-vbs{position: absolute;width:60px;height:60px;border-radius: 50%;background-color: #fff;top:25px;left:25px;transition: all 0.33s ease-in-out;}
.icon-vbs::before{content: '';background-color:var(--main-color);-webkit-mask-size: contain;mask-size: contain;width: 34px;height: 34px;display: inline-block;-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-position: center center;mask-position: center center;vertical-align: middle;position:absolute;top: calc(50% - 17px);left: calc(50% - 17px);}

.btn-vbs-upper{text-align:right;}

.btn-vbs-lower{background-color: rgba(255,255,255,0.9);padding: 25px 25px;color:#3d3d3d;}

.btn-vbs:hover .icon-vbs{transform: rotate(360deg);}
.btn-vbs:hover {transform: scale(1.05); background-color: var(--sec-color);
}
#fancybox-right span {
    left: auto;
    right: 20px;
}
#fancybox-left span {
    left: 20px;
}.mfp-bottom-bar {
    margin-top: -36px;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    display: none;
    cursor: auto;
}.robo-gallery-wrap-id870:not(#no-robo-galery) .rbsTitle {
    font-size: 12px;
    line-height: 100%;
    color: #fff;
    font-weight: bold;
    display: none;
}
/*********************************************/
/**************** Aktuelles ***********************/
/*********************************************/

.gesundheitsnews-btn-search .search-btn-icon {
    display: inline-block;

    background-repeat: no-repeat;
    float: none;
    position: static;
    transition: all .33s ease-in-out;
    background: 0 0;
    width: auto;
    height: auto;
    margin-right: 0;
    margin-top: 0;
}

#news .display-posts-listing{display: flex; flex-wrap: wrap; flex-direction: row;}

#news .excerpt-dash{display: none;}

#news .listing-item{
	padding: 0px 25px 25px 25px;
	box-sizing: border-box;	
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;	
	flex-direction: column; 	
	position:relative;
	vertical-align: top;
	text-align:center;
}
	
#news .listing-item{margin:auto}

#news .listing-item a.title{
	display:block;
	color: var(--main-color);
	font-size: 1.5em;
	font-weight: 400;
	margin-bottom:25px;	
	text-align:center;
	opacity:1;
	transition: all 0.33s ease-in-out;
	top:0px;
	position:relative;
}
	
#news .listing-item span.excerpt{
	opacity:0;
	transition: all 0.33s ease-in-out;
	top:-50px;
	position:relative;
}
	
#news .listing-item:hover a.title{opacity:1;top:0px;}

#news .listing-item:hover span.excerpt{opacity:1;top:0px;}
	
#news .listing-item a.image{
	display:block;
	position:relative;
	width:  90%;
	margin:5%;
	transition: all 0.33s ease-in-out;
}

#news .listing-item:hover a.image{width:  100%;margin:0%;}

#news img.wp-post-image {
    width:  100%;	
	height:auto;
    margin-bottom: 15px;
	opacity:1;
	transition: all 0.33s ease-in-out;
}

#news .listing-item a.excerpt-more{
	display:block;
	padding:10px 25px;
	color: #fff;
	margin-top:25px;
	box-sizing: border-box;
	border-radius: var(--b-radius); 
	font-weight:700;	
	background: var(--main-color);
	box-shadow: 3px 3px 7px 0px rgba(89,192,191,0.4);
	background-position: top left;
	background-size: 100% 100%;
}
	
#news .listing-item a.excerpt-more:hover {
	color:#fff;
	background-size: 200% 200%;	
}
	
@media( max-width:  767px ) {
	#news .listing-item{width:  100%;}
	#news .listing-item span.excerpt, #news .listing-item span.excerpt, #news .listing-item span.title{opacity:1; top:0px;}
}

@media( min-width:  768px ) { 
	#news .listing-item{width:  50%;}
	#news .listing-item span.excerpt, #news .listing-item span.excerpt, #news .listing-item span.title{opacity:0; top:-50px;}
}

@media( min-width:  992px ) {
	#news .listing-item{width:  50%;}
	#news .listing-item span.excerpt, #news .listing-item span.excerpt, #news .listing-item span.title{opacity:0; top:-50px;}
}

@media( min-width:  1200px ) {
	#news .listing-item{width:  25%;}
	#news .listing-item span.excerpt, #news .listing-item span.excerpt, #news .listing-item span.title{opacity:0; top:-50px;}
}

/********************************************/
/*************** SECTIONS ****************************/
/********************************************/

#bg-main-color{padding:50px 0px;background-color: #e9e9e9;}

#bg-sec-color{padding:25px 0px;background-color: var(--sec-color);color:#fff;border-bottom: 4px solid var(--main-color);}

#bg-sec-color h1, #bg-sec-color h2, #bg-sec-color h3, #bg-sec-color h4{color: #fff;opacity:0.5;}

#bg-sec-color a, #bg-sec-color a:hover{color:#fff;}

.header-leistungen-wrapper{width: 100%;height:60vh;position:relative;overflow:hidden;}
.header-leistungen{width: 100%;height:100%;position:absolute;top:0px;left:0px;background-repeat: no-repeat;background-position: top;background-size:cover;background-attachment: scroll;}

@media( max-width:  767px ) {
	.header-leistungen-wrapper{height:30vh;}
}

@media( min-width:  768px ) { 
	.header-leistungen-wrapper{height:40vh;}
}

@media( min-width:  992px ) {
	.header-leistungen-wrapper{height:40vh;}
}

@media( min-width:  1200px ) {
	.header-leistungen-wrapper{height:50vh;}
}

/*********************************/
/********** Gallery **************/
/*********************************/

#content #gallery-1 .gallery-item {    
    margin-top: 0px;
	position: relative;
	box-sizing: border-box;
	padding: 10px;
}

#content .gallery-item a {
    display: block;
	overflow: hidden;
	padding:0px;	
	width: 100%;	
	box-sizing: border-box;	
	background: transparent;	
}

#content .gallery-item a, .gallery-caption {
    width:  100%;
}

#content .gallery .gallery-icon img {
    height: auto;
    max-width: 100%;
    padding: 0%;
    width: 100%;
    position: relative;
    display: block;
    transition: all .5s ease-in-out;
    border: 0px solid #3e3e3e;
    transform: scale(1);
    border-radius: var(--b-radius);
}

#content .gallery-item a:hover > img{transform: scale(1.1);}

#content .gallery-item a{position:relative;display:block;width:  100%;max-width:  100%;overflow: visible;}

#content .wp-caption .wp-caption-text, #content .gallery-caption, #content .entry-caption {
    font-style: normal;
    font-size: 100%;
    line-height: 1.25;
    color: #fff;
    margin-top: -55px;
    position: relative;
    padding: 0px 15px 15px;
    text-align: left;
	text-shadow: 1px 1px 2px rgba(150, 150, 150, 0.5);
}

@media( max-width:  767px ) {
	#content #gallery-1 .gallery-item {width:  50%;}	
}

@media( min-width:  768px ) { 
	#content #gallery-1 .gallery-item {width:  50%;}
}

@media( min-width:  992px ) {
	#content #gallery-1 .gallery-item {width:  25%;}

}

@media( min-width:  1200px ) {
	#content #gallery-1 .gallery-item {width:  25%;}
}


/********************************************/
/********** NEWS ****************************/
/********************************************/

#content #staude_gesundheits_suche {
    background-color: transparent;
}

#content #staude_search_header {
    height: 100px;
	background-color: transparent;
	box-shadow: 0 .2em .2em rgba(33,33,33,.0);
}

#content #staude_search_bar {
    left: 4%;
    width:  92%;
    height: 50px;
}

#content #staude_btn_search {   
    float: right;
    height: 100%;
    margin: 0;
    padding: 0;
    width:  21.58%;
	color: #324c3b;
	text-transform: uppercase;
	background-color: transparent;
	border: 1px solid var(--main-color);	
	transition: all 0.33s ease-in-out;
	text-decoration: none;
	background: linear-gradient( to bottom,transparent,transparent 0%,transparent 0% );
	cursor: pointer;
}

#content .gesundheitssuche.matches {
    background-color: transparent;
    padding: 1em;
    box-shadow: .2em .2em .2em rgba(33,33,33,.0);
    width:  92%;
    box-sizing: border-box;
    margin: 0 auto;
    position: relative;
}

#content #staude_search_wrapper .matches .rss-title a {
    color: var(--main-color);
    text-decoration: none;
	font-size: 1.2em;
	font-weight:400;
}

#content #staude_search_wrapper .rss-item{
	padding-top:15px;
	margin-bottom:15px;
	border-bottom:1px solid #efefef;
}

#content #staude_search_header .deko {
    height: 18%;
    width:  92.2%;
    position: absolute;
    bottom: 0;
    left: 3.9%;
    box-sizing: border-box;
    border-top: 0px solid;
	border-top-color: currentcolor;
    border-left: 0px solid;
	border-left-color: currentcolor;
    border-right: 0px solid;
	border-right-color: currentcolor;
    border-color: #999;
	border-bottom-color: rgb(153, 153, 153);
    background-color: transparent;
    border-bottom: 0;
    font-weight: 700;
    font-size: .85em;
    line-height: 2.5em;
    text-align: center;
    z-index: -1;
}

#content #staude_btn_search:hover {   
	color:var(--main-color);	
	border: 1px solid var(--main-color);
	background-color: transparent;
}

#content #staude_search_image { display: none; }

#content #staude_gesundheits_suche {
    background-color: transparent;
	font-family: var(--main-font);
}

#content.sitemap ul{
	list-style-type: disc;
	padding-left: 2em;
}

.btn-social{display: inline-block;width:35px;height:35px;border:1px solid var(--sec-color);margin-right:10px;border-radius: 50%;position: relative;transition: all .33s ease-in 0s;}
.btn-social::before{
	content: '';
	background-color: var(--sec-color);
	-webkit-mask-size: contain;
	mask-size: contain;
	width: 20px;
	height: 20px;
	top: calc(50% - 10px);
	left: calc(50% - 10px);
	display: block;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	position:absolute;
	transition: all .33s ease-in 0s;
}

.btn-social.full{background-color: var(--sec-color);border:1px solid var(--sec-color);}
.btn-social.full::before{background-color: #fff;}

.btn-social:hover{border:1px solid var(--main-color);transform: rotate(360deg);}
.btn-social:hover::before{background-color: var(--main-color);}

.btn-social.full:hover{background-color: var(--main-color);}
.btn-social.full:hover::before{background-color: #fff;}

.btn-arrow{display: inline-block;padding: 15px 30px 15px 0px;position: relative;text-transform: uppercase;color: var(--main-color);line-height: 1;}
.btn-arrow::before{
	content: '';
	background-color: #676767;;
	-webkit-mask-size: contain;
	mask-size: contain;
	width: 14px;
	height: 14px;
	top: calc(50% - 7px);
	right: 0px;
	display: block;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	position:absolute;
	-webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-arrow-1.svg");
	mask-image: url("https://cdn.staude.info/css/icons/icon-arrow-1.svg");
	transition: all .33s ease-in 0s;
}

.social-wrapper{height: 50px;display: flex;	line-height: 50px;align-content: center;justify-content: right;margin-bottom:0px;margin-top:50px;}
.social-wrapper span{margin-right: 25px;text-transform: uppercase;font-size: 0.9em;}

.btn-footer{display:block;background-color: transparent;padding:25px;border-radius: var(--b-radius);color:#676767;transition: all .33s ease-in 0s;width: 100%; }
.btn-footer:hover{background-color:rgba(255,255,255,0.25);color:#fff;}

.btn-footer.line-height{line-height:2.5em;}

.btn-footer:hover .btn-arrow::before{right: -10px;}
.btn-footer .icon-top-custom::before{transition: all .33s ease-in 0s;}
.btn-footer:hover .icon-top-custom::before{transform: rotate(10deg);}

footer {
    background-color: var(--main-color);
    color: #fff;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    position: relative;
    margin-top: 150px;
}
footer::before {
    content: "";
    background-image: url(images/stadt.svg);
    height: 185px;
    top: -184px;
    width: auto;
    display: block;
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
}
#footer-b {
    margin-top: -200px;
}
footer.abdocken{max-width:1750px;margin:50px auto 25px auto;border-radius: var(--b-radius);overflow:hidden;-webkit-box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.3); 	box-shadow: 0px 0px 25px 0px rgba(0,0,0,0.3);}

@media( max-width:  767px ) {
	footer.abdocken{left: 1px;width: calc(100% - 10px);position: relative;}
}

footer a {
    color: #fff;
}

footer a:hover {
    color: var(--main-color);
}

#footer-a, #footer-b {
    padding: 50px 0px;
    border-bottom: 1px solid #cecece;}

#footer-a {
    text-align: center;
}

#footer-b .icon-top-custom {
    text-align: left;
}

#footer-b .icon-top-custom::before {
    background-color:#fff;
    width: 40px;
    height: 40px;
    top: 0px;
    left: 0px;
}
footer h3, footer a, .btn-footer, .btn-arrow, .btn-footer:hover, footer a:hover {
    color: #fff;
    font-size: 0.9em;
}

footer .btn-arrow::before {
  
    background-color: #fff;

}

#footer-b .icon-left-custom::before {
    background-color: #fff;
}

#footer-c {
    padding: 25px 0px 80px 0px;
}

#social_icons a{color:#fff;}

.footer-kontakt{display:inline-block;width: 75px;font-size:0.9em;opacity:0.5;} 

@media( max-width:  767px ) {
#footer-b {padding: 50px 0px 0px;}
#footer-c {padding: 0px 0px 80px 0px;}
#social_icons {margin: 25px auto;display: inline-block;}
}

@media( min-width:  768px ) {
#footer-b {padding: 50px 0px;}
#footer-c {padding: 0px 0px;}
#social_icons {margin: 25px auto;display: inline-block;}
}

@media( min-width:  992px ) {
#footer-b {padding: 50px 0px;}
#footer-c {padding: 0px 0px;}
#social_icons {margin: 5px 0px;display: block;}
}

@media( min-width:  1200px ) {
#footer-b {padding: 50px 0px;}
#footer-c {padding: 0px 0px;}
}

#nav_footer{ float: right; }
#nav_footer > li.menu-item{ display: inline-block;padding:10px; }

#nav_footer > li.menu-item a{color:#fff;text-transform:uppercase;font-size:0.9em;}
#nav_footer > li.menu-item a:hover{transform: scale(1.1);}

#empfehlen #social_icons {margin: 25px auto;display: inline-block;}

#content #kontakt iframe {width: 100%; border-radius: var(--b-radius); height: 300px;}
/******Buttons**********/

.nav-hover{
	color: #fff;
	background-color: var(--main-color);
	transition: all 0.33s ease-in-out !important;
	text-transform: none ;
	font-weight: bolder;
}
.nav-hover:hover{
	background-color: var(--sec-color);
	color: #fff;
	
}
/************ Show & Hide *******************/

.hide-xs-flex, .hide-sm-flex, .hide-md-flex, .hide-lg-flex{display:flex;}
.hide-xs, .hide-sm, .hide-md, .hide-lg{display:block;}
.show-xs, .show-sm, .show-md, .show-lg, .hide-xs-flex, .hide-sm-flex, .hide-md-flex, .hide-lg-flex{display:none;}

@media( max-width: 767px ) {
	.hide-xs, .hide-sm, .hide-md, .hide-lg, .hide-xs-flex, .hide-sm-flex, .hide-md-flex, .hide-lg-flex{display:none;}
	.show-xs, .show-sm,	.show-md, .show-lg{display:block;}
	.show-xs-flex, .show-sm-flex, .show-md-flex, .show-lg-flex{display:block;}
	footer::before {
		top: -125px;
	}
}

@media( min-width: 768px ) { 
	.hide-xs{display:block;}
	.hide-xs-flex{display:flex;}
	.hide-sm, .hide-sm-flex, .hide-md, .hide-md-flex, .hide-lg, .hide-lg-flex, .show-xs, .show-fx-flex{display:none;}
	.show-sm, .show-md, .show-lg{display:block;}
	.show-sm-flex, .show-md-flex, .show-lg-flex{display:flex;}
	footer::before {
		top: -147px;
	}
}

@media( min-width: 992px ) {	
	.hide-xs, .hide-sm{display:block;}
	.hide-sm-flex, .hide-xs-flex{display:flex;}
	.hide-md, .hide-md-flex, .hide-lg, .hide-lg-flex{display:none;}
	.show-xs, .show-xs-flex, .show-sm, .show-sm-flex{display:none;}
	.show-md, .show-lg{display:block;}
	.show-md-flex, .show-lg-flex{display:flex;}
	footer::before {
		top: -160px;
	}
}

@media( min-width: 1200px ) {
	.hide-xs, .hide-sm, .hide-md{display:block;}
	.hide-xs-flex, .hide-sm-flex, .hide-md-flex{display:flex;}
	.hide-lg, .show-xs,	.show-sm, .show-md, .hide-lg-flex, .show-xs-flex, .show-sm-flex, .show-md-flex{display:none;}
	.show-lg{display:block;}
	.show-lg-flex{display:flex;}
	footer::before {
		top: -160px;
	}
}

/* Icons */

.icon-left-custom {
    display: block;
    padding: 10px 5px 10px 40px;
    position: relative
}

.icon-left-custom::before {
    content: '';
    background-color: var(--main-color);
    -webkit-mask-size: contain;
    mask-size: contain;
    width: 30px;
    height: 30px;
    display: inline-block;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center;
    vertical-align: middle;
    position: absolute;
    top: 10px;
    left: 0;
    flex-shrink: 0
}

.icon-top-custom {
    display: block;
    width: 100%;
    padding-top: 60px;
    margin-bottom: 25px;
    position: relative;
    text-align: center
}

.icon-top-custom::before {
    content: '';
    background-color: var(--main-color);
    -webkit-mask-size: contain;
    mask-size: contain;
    width: 50px;
    height: 50px;
    display: block;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    position: absolute;
    top: 0;
    left: calc(50% - 25px);
    flex-shrink: 0
}

.icon-right-custom {
    display: inline-block;
    padding: 10px 40px 10px 5px;
    position: relative;
    margin-bottom: 0
}

.icon-right-custom::before {
    content: '';
    background-color: var(--main-color);
    -webkit-mask-size: contain;
    mask-size: contain;
    width: 30px;
    height: 30px;
    display: inline-block;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center;
    vertical-align: middle;
    position: absolute;
    top: 10px;
    right: 0;
    flex-shrink: 0
}

/* E-Rezept */

#e-rezept .text-wrap {
	width: auto;
}

  
#e-rezept .btn.download {
	transition: all 0.5s ease-in-out;
	padding: 15px 25px 15px calc(2 * 25px + 25px);
	border: 1px solid var(--main-color);
	color: #fff;
	text-decoration: none;
	font-weight: 600;
	background: var(--main-color);
	cursor: pointer;
	position: relative;
	display: inline-block;
	text-align: center;
	margin-bottom: 15px;
	border-radius: 25px;
	opacity: 1;
}

#e-rezept .btn.download:after,
#e-rezept .btn.download:before {
	content: "";
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center center;
	mask-position: center center;
	display: block;
	background-color: #fff;
	width: 25px;
	height: 25px;
	top: 15px;
	left: 25px;
	position: absolute;
}

#e-rezept .btn.download:hover {
	color: #3e3e3e;
	background: transparent;
	transform: scale(1.05);
}

#e-rezept .btn.download:hover:after,
#e-rezept .btn.download:hover:before {
	background-color: #3e3e3e;
}

#e-rezept .btn.download:hover:before {
	-webkit-animation: download 1s infinite;
	animation: download 1s infinite;
}