:root{
	--app-height: 100vh;
	
	--header-height: 65px;
	--footer-height: 310px;
	--app-page-height: var(--app-height) - var(--header-height);
	
	--sidebar-width: 220px;

	--safe-area-inset-top: env(safe-area-inset-top);
  	--safe-area-inset-bottom: calc(env(safe-area-inset-bottom) + 10px);
  	--safe-area-inset-left: env(safe-area-inset-left);
  	--safe-area-inset-right: env(safe-area-inset-right);
}

@media (min-width: 0px) {
	:root {
/*
		--site-edge: calc(2vw + max(var(--safe-area-inset-left), var(--safe-area-inset-right)));
		--site-width: calc(96vw - var(--safe-area-inset-left) + var(--safe-area-inset-right));
		
		--site-edge-medium: calc(2vw + max(var(--safe-area-inset-left), var(--safe-area-inset-right)));
		--site-width-medium: calc(96vw - var(--safe-area-inset-left) - var(--safe-area-inset-right));
*/
		
		--site-edge: 2vw;
		--site-width: 96vw;
		
		--site-edge-medium: 2vw;
		--site-width-medium: 96vw;
		
		--site-edge-small: 2vw;
		--site-width-small: 96vw;
	}
}

@media (min-width: 500px) {
	:root {
		
		--site-width-small: calc(500px);
		--site-edge-small: calc((100vw - var(--site-width-small)) / 2);
	}
}

@media (min-width: 1023px) {
	:root {

/*		--site-width-medium: calc(900px);*/
		--site-width-medium: calc(1000px);
		--site-edge-medium: calc((100vw - var(--site-width-medium)) / 2);
	}
}

@media (min-width: 1510px) {
	:root {
		--site-edge: 5vw;
		--site-width: 90vw;
	}
}

@media (min-width: 1510px) {
	:root {
		--site-width: 1450px;
		--site-edge: calc((100vw - var(--site-width)) / 2);
	}
}

/*
@media (min-width: 1555px) {
	:root {
		--site-edge: calc((100vw - (2500px * 0.8)) / 2);
		--site-width: calc(2500px * 0.8);
	}
}
*/

*{
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: none;
}

body {
	margin: 0;
	padding: 0;

	font-size: 15px;
	font-family: var(--font-family);
	color: var(--text-color);
/*	line-height: 1.6;*/
/*	line-height: 1.4;*/
	line-height: 1.7;
	position: relative;
	background-color: var(--section-box-color);
	
	word-wrap: break-word;
}

@media screen and (min-width: 868px) {
	body {
		background-color: var(--background-body-color);
	}
}

*:focus {
	outline: 0;
}

a[href]{
	text-decoration: none;
	color: inherit;
}

img {
	color: transparent;
}

h1, h2, h3, h4, h5, h6{
	font-weight: 600;
}

b{
	font-weight: 600;
}

hr{
	border: 0.5px solid var(--grey-color);
	border-radius: 50px;
}

/*To avoid Layout Shift while loading swiper.css*/
.swiper-container{
	overflow: hidden;
}

.swiper-wrapper {
/*
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
*/
    display: flex;
/*
    transition-property: transform;
    box-sizing: content-box;
*/
/*	overflow: hidden;*/
}

.background-layer + .page{
/*	background-color: var(--background-layer-white);*/
}

.background-layer.lightorange + .page{
/*	background-color: var(--background-layer);*/
	transition: 0.8s;
}

.background-layer.grey + .page{
/*	background-color: var(--background-layer-grey);*/
}

@media screen and (min-width: 868px) {
	.background-layer + .page{
		background-color: var(--background-layer);
	}
	
	.background-layer.white + .page{
		background-color: var(--background-layer-white);
	}
}

@media screen and (min-width: 750px) {
	.page {
/*		padding-bottom: 450px;*/
	}
}


@media screen and (min-width: 1040px) {
	.page {
		min-height: calc(100vh - 310px);
/*		padding-bottom: 310px;*/

	}
}

@media screen and (min-height: 3000px) {
	.page {
		min-height: calc(100vh - 700px);
/*		padding-bottom: 700px;*/
	}
}
*/

.page.fixed{
	position: fixed;
	overflow: hidden;
}

/*________COONSENT MANAGER________*/

.consent_manager {
	position: fixed;
	min-height: 100%;
	width: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.55);
	display: block;
	z-index: 1500;
	overflow: auto;
}

.consent_manager .popup {
/*	max-width: 850px;*/
/*	width: 80%;*/
	padding: 28px 28px 5px 28px;
	position: relative;
	background-color: var(--box-color);
	margin-top: 30px;
	margin-bottom: calc(30px + var(--safe-area-inset-bottom));
	border-radius: 3px;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.2);
	
	width: calc(var(--site-width-medium) + 5px);
	margin-left: calc(var(--site-edge-medium) - 2.5px);
	margin-right: calc(var(--site-edge-medium) - 2.5px);
	
	box-sizing: border-box;
}

.consent_manager .popup.hidden {
	display: none;
}

.consent_manager .popup h2 {
	font-size: 20px;
	line-height: 28px;
	margin-bottom: 16px !important;
	margin-bottom: 1rem !important;
	margin-top: 0px;
}

.consent_manager .popup .text {
	padding: 0;
	margin: 0;
	color: var(--text-color-grey);
    font-size: 90%;
	line-height: 1.8em;
}

.consent_manager .popup .text a{
/*	text-decoration: underline;*/
	color: var(--green-color);
	cursor: pointer;
}

.consent_manager .popup .secure {
	color: var(--green-color);
	font-weight: 600;
}

.consent_manager .popup .button-box {

	margin-top: 10px;
	display: flex;
	width: auto;
	float: right;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;

	padding-bottom: 10px;
	width: 100%;
	
/*
	display: grid;
	grid-auto-flow: column;
	grid-gap: 0 20px;
*/
	
/*	grid-template-rows: 1fr 1fr;*/
/*	grid-template-columns: 100%;*/
}

.consent_manager .popup .button-box .button {
	width: 100%;
	min-width: inherit;
}

.consent_manager .popup .button-box .textbutton {
	color: var(--text-color-grey);
    font-size: 80%;
	line-height: 1.8em;
	padding: 0px;
	margin: 13px 0 5px 0;
	cursor: pointer;
}

.consent_manager .popup .setup-box {
	color: var(--text-color-grey);
    font-size: 90%;
	line-height: 1.8em;
}



.consent_manager .popup .setup-box form {
	padding-top: 15px;
	display: flex;
	width: 100%;
	align-content: space-between;
	justify-content:  flex-start;
	position: relative;
	flex-wrap : wrap
}

.consent_manager .popup .setup-box form > div{
	padding-bottom: 20px;
	width: 50%;
}

@media screen and (min-width: 450px) {
	.consent_manager .popup .setup-box form {
		flex-wrap : nowrap;
		justify-content:  space-around;
	}
	
	.consent_manager .popup .setup-box form div{
		padding: 0px;
		width: auto;
	}
}

.consent_manager .popup .setup-box form .checkboxcontainer div{
	margin-top: 0px!important;
	line-height: 26px;
}


.consent_manager .popup .setup-box .consent_details {
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: -moz-none;
	-ms-user-select: none;
	user-select: none;
}

.consent_manager .popup .setup-box .consent_details.active {
	text-decoration: underline;
}

.consent_manager .popup .setup-box .option-info {
	width: 100%;
/*
	max-height: 300px;
	overflow-y: auto;
*/
}

.consent_manager .popup .setup-box .option-info .option-info-box{
	padding-top: 10px;
}

.consent_manager .popup .setup-box .option-info .hidden{
	display: none;
}


@media screen and (min-width: 750px) {

	.consent_manager .popup .button-box {
		align-items: center;
	}
	
	.consent_manager .popup .button-box {
		width: auto;
	}
	
	.consent_manager .popup .button-box .button {
		width: auto;
		min-width: 300px;
	}
}


.consent_manager .popup .additional-info {
	padding: 0px;
	margin: 10px 0 15px 0;
	clear: both;
	clear: both;
}

.consent_manager .popup .additional-info .textbutton{
	color: var(--text-color-grey);
    font-size: 80%;
	line-height: 1.8em;
	cursor: pointer;
	text-decoration: none;
}



/*_________END CONSENT MANAGER_______*/
/*===============================================*/

.header-section{
	box-sizing: border-box;
	height: 65px;
	width: 100%;
}

.header{
	position: fixed;

	width: 100%;
	z-index: 1200;


	display: flex;
	justify-content: flex-start;
	flex-direction: column;
	
	-ms-user-select: None;
	-moz-user-select: None;
 	-webkit-user-select: None;
 	user-select: None; 
	
	transition: transform .4s 0s ease-in-out;
}

.down .header {
   transform: translate3d(0, -100%, 0);
}

@media screen and (min-width: 868px) {
	.header{
		background-color: var(--header-color);
/*		box-shadow: var(--header-shadow);*/
	}
	
	.down .header {
	   transform: inherit;
	}
}



.header .header-status-bar{
	width: 100%;
	background-color: var(--admin-color);
	z-index: 5;
	padding-top: 2px;
	padding-bottom: 2px;
	color: white;
	font-size: 13px;
}

.header .header-status-bar.green{
	background-color: var(--green-color);
}

.header .header-status-bar .status-bar-wrapper{
	margin-left: calc(var(--site-edge));
	margin-right: calc(var(--site-edge));
/*	width: calc(var(--site-width));*/
}

@media screen and (min-width: 868px) {
	.header .header-status-bar .status-bar-wrapper{
		margin-left: calc(var(--site-edge) + 20px);
/*		margin-right: calc(var(--site-edge) + 20px);*/
		width: calc(var(--site-width) - 40px);
	}
}

.header .header-status-bar a {
	color: white;
	font-size: 15px;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.header .header-status-bar .left-status a {
	width: calc(100% - 100px);
	float: left;
}

.header .header-status-bar .right-status {
	float: right;
	text-align: right;
}

.header .header-inside{
	width: 100%;

	display: flex;
	justify-content: space-between;
	flex-direction: column;
}

@media screen and (min-width: 868px) {
	.header .header-inside{
		margin-left: calc(var(--site-edge) + 20px);
		width: calc(var(--site-width) - 40px);

		flex-direction: row;
	}
}

.header .left{
	background-color: var(--header-color);
	display: flex;
	align-items: center;
	justify-content: space-between;

	padding-left: calc(var(--site-edge) + 10px);
	padding-right: calc(var(--site-edge) + 10px);
/*	width: calc(var(--site-width) - 20px);*/
/*	box-shadow: var(--header-shadow);*/
	z-index: 105;

	height: var(--header-height);
}

@media screen and (min-width: 868px) {
	.header .left{
		background-color: inherit;
		align-items: center;
		width: auto;
		margin-left: 0px;
		padding: 0px;
		box-shadow: none;
	}
}

.header .left .block-left{
	display: flex;
	align-items: center;
}

.header img{
	height: 36px;
	min-width: 43px;
}

.header a.img_href{
	line-height: 0px;
}

.header .left .selection {
	overflow: visible;
	height: 45px;
}

.header .left .selection .selectedfield{
	margin-top: 6px;
	margin-bottom: 5px;
	border-radius: 6px;
	border: 1.5px solid var(--header-text-color);
	padding: 3px 10px;
	overflow: hidden;
	cursor: pointer;
	margin-left: 20px;
}

@media screen and (min-width: 868px) {
	.header .left .selection .selectedfield{
		margin-left: 20px;
	}
}

.header .left .selection .selectedfield .selection-element{
	display: flex;
	align-items: center;
	color: var(--header-text-color);
	font-size: var(--header-font-size);
}

.header .left .selection .selectedfield .selection-element a{
	white-space: nowrap;
}

.header .left .selection .selectedfield .selection-element a span{
	min-width: 20px;
	padding-right: 9px;
	text-align: center;
	display: inline-block;
}


.header .left .selection .selectedfield.no-pointer{
	cursor: default;
}

.header .left .selection .selectionfield{
	display: none;

	background-color: var(--box-color);
	margin-left: 20px;

	border-radius: 6px;
/*	border: 1.5px solid white;*/
/*	padding: 5px 0;*/

	position: absolute;
	z-index: 100;
	box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
	
	max-height: calc(90vh - 65px);
	overflow-x: hidden;
	overflow-y: auto;

}

@media screen and (min-width: 550px) {
	.header .left .selection .selectionfield{
		margin-left: 20px;
	}

}

.header .left .selection .selectionfield .selection-area{
/*	padding: 5px 0;*/
	padding: 5px 6px;
}

.header .left .selection .selectionfield .selection-area.bg-grey{
	background-color: rgba(206, 206, 206, 0.10);
}

.header .left .selection .selectionfield .selection-area:not(:last-of-type){
	border-bottom: 1px solid #c6c6c6;
	
}

.header .left .selection .selectionfield .selection-label{
	text-transform: uppercase;
/*	font-weight: 600;*/
	font-size: 14px;
	padding: 12px 15px 6px 15px;
	display: block;
	color: var(--icon-color);
}

.header .left .selection .selectionfield .selection-element{
	height: 100%;
	display: flex;
	align-items: center;
	color: var(--header-text-color);
	font-size: var(--header-font-size);
	transition: 0.16s;
/*	background-color: var(--box-color);*/
	border-radius: 5px;
}

.header .left .selection .selectionfield .selection-element:hover{
/*	background-color: rgba(0, 0, 0, 0.02);*/
	background-color: var(--hover-color-2);
/*	background-color: #eeeeee;*/
}

.header .left .selection .selectionfield .selection-element.selected{
	font-weight: 600;
}

.header .left .selection .selectionfield .selection-element:last-of-type{
	border-bottom: 0;
}

.header .left .selection .selectionfield .selection-element a{
	color: var(--text-color);
	text-decoration: none;
	cursor: pointer;
	padding: 6px 12px;
	display: block;
	width: 100%;
	
}

.header .left .selection .selectionfield .selection-element a span{
	min-width: 20px;
	padding-right: 9px;
	text-align: center;
	display: inline-block;
	margin-left: -3px;
	color: var(--icon-color);
	
}

.header .left .selection .selectionfield .selection-element.selected a span{
	color: var(--header-icon-selected-color);
}

.header .left .selection .selectionfield .selection-line{
	width: 100%;
	height: 1.0px;
	background-color: #c6c6c6;
	
/*	margin: 5px 0;*/
}

.header .left .menu-toogler{
/*	width: 43px;*/
	font-size: 25px;
	text-align: right;
	cursor: pointer;
	color: var(--header-text-color);
	padding: 15px 13px; /*for larger touchpoint*/
	margin: 0 -10px; 
}

@media screen and (min-width: 868px) {
	.header .left .menu-toogler{
		display: none;
	}
}

.header .right{
	padding-left: var(--site-edge);
	padding-right: var(--site-edge);
	width: calc(var(--site-width) + var(--site-edge) + var(--site-edge));

	background-color: var(--box-color);
	display: none;
	box-shadow: var(--header-shadow);
}

@media screen and (min-width: 868px) {
	.header .right{
		box-shadow: none;
	}
}

.header .right .right-wrapper{
/*
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	align-content: space-around;
*/
	
		
	display: grid; 
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); 
	grid-template-rows: auto; 

	grid-gap: 0px 15px; 

	width: 100%;

	margin: 10px 0 20px 0;

}


.header .right .right-wrapper div{
	width: 100%;
	height: 100%;
	
	display: flex;
	align-items: center;
	
	padding: 0  10px;
	box-sizing: border-box;
	margin: 0px 15px 0px 0px;
	border-bottom: 1px solid var(--main-color);

}

@media screen and (min-width: 868px) {
	.header .right{
		width: auto;
		padding: 0px;
		background-color: var(--header-color);
		color: white;
/*			margin-left: 0px;*/
		display: block !important;
		visibility: visible!important;
	}

	.header .right .right-wrapper{
		margin: 0;
		
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		align-content: space-around;
		
		height: var(--header-height);

		padding: 5px 0;
		box-sizing: border-box;
	}

	.header .right .right-wrapper div{
		margin-left: 25px;
		margin-right: 0px;
		width: auto;
		height: auto;
		border-bottom: none;
		padding: 0px;
	}
}

.header .right .right-wrapper div a{
	text-decoration: none;
	font-size: var(--header-font-size);
	cursor: pointer;
	color: var(--header-text-color-2);
	display: inline-block;
	width: 100%;
	padding: 10px 0;
}

@media screen and (min-width: 868px) {
	.header .right .right-wrapper div a{
		color: var(--header-text-color);
		padding: 0;
	}

}

.spacing-for-statusbar{
	height: 30px;
}


.overlay {
	position: fixed;
	height: 100%;
	width: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.65);
	display: none;
	z-index: 2000;
}

.overlay .close {
	position: absolute;
	top: 20px;
	right: 20px;
	cursor: pointer;
	color: #000;
	font-size: 150%;
}

.overlay .popup {
	max-width: 600px;
	width: 80%;
	max-height: calc(100vh - var(--header-height));
	padding: 20px;
	position: relative;
	background-color: var(--box-color);
	margin: 40px auto;
	border-top: 7px solid var(--main-color);
	overflow-y: auto;
}

.overlay .popup .center {
	text-align: center;
}

/*===============================================*/

.notification-box{
	z-index: 500;
	width: 100%;
	
	margin: 0 auto;
	
	padding: 10px 15px;
	
	height: auto;
	position: relative;
	box-sizing: border-box;
	
	background-color: var(--section-box-color);
	text-align: center;
	box-shadow: var(--shadow-elevation-0);
}

.notification-box .wrapper{
	max-width: 800px;
	position: relative;

	display: grid;
	grid-gap: 20px 32px;
	grid-template-columns: 100%; 
	grid-template-rows: auto; 
	
	align-items: center;
	justify-content: center;
	
	overflow: hidden;
	padding: 20px 20px;
	margin-top: 20px;
	
	background-color: var(--box-color);
	border: 2px solid var(--green-color);
	
	box-shadow: var(--shadow-elevation-3);
	border-radius: 10px;
}

.notification-box.red .wrapper{
	border-color: var(--red-color);
}


.notification-box .wrapper svg{
	display: block;
	
	width: 100px!important;
	flex-shrink: 0;
	padding: 1px;

}

.notification-box .wrapper .message{
	width: 100%;
	flex-shrink: 1;
}

.notification-box .wrapper a{
	display: block;
	text-align: center;
	
    font-size: 120%;
}

@media screen and (min-width: 480px) {
	.notification-box .wrapper{
		grid-template-columns: 102px minmax(0, 1fr); 
		padding: 30px 20px;
	}

	.notification-box .wrapper a{
		text-align: left;
	}
}

@media screen and (min-width: 868px) {
	.notification-box{
/*
		border-radius: 5px;
		margin-top: 30px;
		margin-bottom: 0px;
		padding: 0;
		border: 1px solid var(--section-box-border);
*/
	}
	
	.notification-box.medium{
		width: var(--site-width-medium);
	}
	
	.notification-box .wrapper{
		box-shadow: none!important;
		grid-template-columns: 102px auto;
		margin: 0 auto;
		
/*		background-color: var(--section-box-color);*/
		border: none;
	}
}

/*===============================================*/



.info-table{
	width: 100%;
	margin-top: 20px;
	overflow-y: auto;
}
 .info-table table{
	min-width: 100%;
	border-collapse: collapse; 
}

.info-table thead{
	text-align: left;
}

.info-table thead th{
	border-bottom: 1.5px solid #d8d8d8;
}

.info-table td,
.info-table th{
	padding: 5px;
	vertical-align: top;
}

.info-table td{
	border-bottom: 1px solid #d8d8d8;
}

/*===============================================*/

h1{
	font-size: 21px;
}

h2{
	margin: 15px 0 25px 0;
	font-size: 21px;
}

p{
	line-height: var(--paragraph-line-height);
	word-wrap: break-word;
	margin: 0 0 1rem 0;
}

a.return-link{
	color: var(--main-color)!important;
	margin-top: 5px;
	margin-bottom: -5px;
	display: inline-block;
}

.bg--orange{
	background-color: var(--main-color);
}

.bg--blue{
	background-color: var(--blue-color);
}

.paragraph{
	line-height: var(--paragraph-line-height);
	word-wrap: break-word;
}

.paragraph  ul li{
	margin-bottom: 1rem;
}

.max-width-720{
	display: block;
	max-width: 720px;
}

.max-width-900{
	display: block;
	max-width: 900px;
}

.bg--fancy-lila{
	background-image: linear-gradient(170deg,rgba(77, 3, 180, 1), #832595, #c7506d);
	background-size: cover;
	background-position: bottom;
}

		
.fancy-button {
	padding: 10px 15px;
	border: 1px solid white;
	border-radius: 5px;
	transition: 0.3s;
	font-size: calc(19px + (22 - 19) * ((100vw - 320px) / (1400 - 320)));
	font-weight: normal;
	color: white!important;
	margin: 0;
}

.fancy-button:hover{
	background-color: white;
	color: #923c9b!important;
}

/*===============================================*/

.content-wrapper {
	position: relative;
/*	min-height: calc(100vh - var(--footer-height));*/
	min-height: calc(100vh - var(--header-height));
	width: 100%;
}

section{
/*	overflow: auto;*/
	width: 100%;
}

.section--full-screen {
	min-height: var(--app-page-height);
	height: var(--app-page-height);
}

.section__box{
	height: auto;
	position: relative;
	background-color: var(--section-box-color);
	overflow: hidden;
}

@media screen and (min-width: 868px) {
	.section__box{
		background-color: var(--section-box-color);
		border-radius: 7px;
		border: 1px solid var(--section-box-border);
	}
}

.section__box--spacing-small,
.section__box--spacing-medium,
.section__box--spacing{
	width: 100%;
	display: block;
}

@media screen and (min-width: 868px) {
	.section__box--spacing,
	.section__box--spacing-small,
	.section__box--spacing-medium{
		margin-top: 30px;
		margin-bottom: 25px;
	}
	
	.section__box--spacing{
		width: calc(var(--site-width));
		margin-left: var(--site-edge);
		margin-right: var(--site-edge);
	}
	
	.section__box--spacing-medium{
		width: var(--site-width-medium);
		margin-left: auto;
		margin-right: auto;
	}
	
	.section__box--spacing-small{
		width: var(--site-width-small);
		margin-left: auto;
		margin-right: auto;
	}
}

.section__box--padding{
	padding: 10px 20px 20px 20px;
}

.section__box--padding-equal-large{
	padding: 20px;
}


/*Sofern Sidebar aktiv und vorhanden: die Breite anpassen*/

.default-middle-wrapper:not(.no-sidebar) .section__box{
	margin-left: 0;
	margin-right: 0;
	width: 100%;
}

.default-middle-wrapper:not(.no-sidebar) .section__box--spacing{
	margin-left: 0;
	margin-right: 0;
	width: 100%;
}




.section__hero-image{
	width: 100%;
	position: relative;
	overflow: hidden;
	height: 250px;
}

.section__hero-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}

@media screen and (min-width: 868px) {
	.section__hero-image{
		border-radius: 5px 5px 0 0;
		height: 125px;
	}
}

.grid-4{
	display: grid;
	width: 100%;

	grid-template-columns: repeat(auto-fill, minmax(263px, 1fr)); 
	grid-gap: 40px 35px;
	grid-template-rows: auto; 
}

.grid-2 div:first-of-type{
	grid-area: text-img-grid-img;
	margin-bottom: 15px;
}

.grid-2 div:nth-of-type(2){
	grid-area: text-img-grid-text;
}

.grid-2 img{
	width: 100%;
}

@media screen and (min-width: 868px) {
	.grid-2{
		display: grid;
		grid-template-columns: 1fr 1fr; 
		grid-template-rows: auto; 
		grid-template-areas:  
			"text-img-grid-text text-img-grid-img" 
		;
		
		grid-gap: 60px;
	}
	
	.grid-2 div:first-of-type{
		grid-area: text-img-grid-img;
		margin-bottom: 0px;
	}
}


.grid-2-with-divider{
	display: grid;
	grid-template-rows: auto; 
	grid-template-columns: 100%; 
	
	grid-gap: 20 0; 
}

.grid-2-with-divider .divider-line{
	display: none;
}


@media screen and (min-width: 868px) {
	.grid-2-with-divider{
		grid-template-rows: auto; 
		grid-template-columns: calc(50% - 0.5px - 30px) 1px calc(50% - 0.5px - 30px); 
		grid-gap: 0 30px; 
	}
	
	.grid-2-with-divider .divider-line{
		display: block;
		border-left: 1px solid var(--main-color);
	}
}


/*=================== SIDEBAR ====================*/

/*MOBIL VOLLE BREITE*/
/*

.middle-wrapper{
	width: 100%;
	display: block;
}
*/

/*Immer Seitenabstand vorhanden*/

/*
.static-middle-wrapper{
	width: calc(100% - 2*var(--site-edge));
	margin-left: auto;
	margin-right: auto;
	display: block;
}
*/

.default-middle-wrapper{
	width: 100%;
	display: block;
}

.default-middle-wrapper.no-sidebar{
	display: block;
}

@media screen and (min-width: 868px) {
	.default-middle-wrapper{

		width: calc(var(--site-width));
		margin-left: var(--site-edge);
		margin-right: var(--site-edge);

		display: grid;
		grid-template-columns: 250px auto;
		grid-auto-flow: row;
		grid-gap: 0 40px;
	}
	
	.page.fullscreen .default-middle-wrapper{

		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	
	.static-middle-wrapper,
	.middle-wrapper{
		width: calc(var(--site-width));
		margin-left: var(--site-edge);
		margin-right: var(--site-edge);
	}
}



.default-middle-wrapper .sidebar{
	
	box-shadow: var(--shadow-elevation-0);
	border-radius: 7px;
	margin-top: 30px;
	border: 1px solid var(--section-box-border);
	box-sizing: border-box;
	background-color: var(--box-color);
	
	align-self: start;
}



.sidebar .selection-area{
	padding: 5px 6px;
}

.sidebar .selection-area.bg-grey{
	background-color: rgba(206, 206, 206, 0.10);
}

.sidebar .selection-area:not(:last-of-type){
	border-bottom: 1px solid #c6c6c6;
	
}

.sidebar .selection-label{
	text-transform: uppercase;
	font-size: 14px;
	padding: 12px 15px 6px 15px;
	display: block;
	color: var(--icon-color);
}

.sidebar .selection-element{
	height: 100%;
	font-size: var(--header-font-size);
	border-radius: 5px;
	padding-top: 1px;
}

.sidebar .selection-element.selected .label,
.sidebar .selection-element .label:hover{
	background-color: var(--hover-color-2);
}

.sidebar .selection-element.selected .label{
	font-weight: 600;
}

.sidebar .selection-element:last-of-type{
	border-bottom: 0;
}

.sidebar .selection-element .label{
	color: var(--text-color);
	text-decoration: none;
	cursor: pointer;
	
	display: block;
	width: 100%;
	
	padding: 5.5px 12px;
	box-sizing: border-box;
	border-radius: 5px;
	cursor: pointer;
	transition: 0.16s;
	
}

.sidebar .selection-element .label span{
	min-width: 20px;
	padding-right: 9px;
	text-align: center;
	display: inline-block;
	margin-left: -3px;
	color: var(--icon-color);
	
}

.sidebar .selection-element.selected .label span{
	color: var(--header-icon-selected-color);
}

.sidebar .selection-element .sub-navigation{
	box-sizing: border-box;
	
	font-size: 0;
    margin: 0;
    opacity: 0;
    padding: 0;
    transition: opacity .25s,
                font-size .5s .25s,
                margin .5s .25s,
                padding .5s .25s;
}

.sidebar .selection-element.selected .sub-navigation{
	padding: 3px 0 3px 0;
	font-size: 14px;
	color: var(--icon-color);
	opacity: 1;
	
    transition: font-size .25s,
                margin .25s,
                padding .25s,
                opacity .5s .25s;
}

.sidebar .selection-element .sub-navigation a{
	display: block;
	border-radius: 5px;
	transition: opacity .25s,
                font-size .5s .25s,
                margin .5s .25s,
                padding .5s .25s;
	
}

.sidebar .selection-element.selected .sub-navigation a{
	padding: 5px 10px 5px 38px;
	
    transition: font-size .25s,
                margin .25s,
                padding .25s,
                opacity .5s .25s;
}

.sidebar .selection-element .sub-navigation a:hover{
	background-color: var(--hover-color-3);
}

.sidebar .selection-element .sub-navigation a span{
	display: block;
	color: var(--icon-color);
}

.sidebar .selection-element .sub-navigation a.is_selected span{
	color: var(--text-color);
	font-weight: 600;
}

.sidebar .selection-line{
	width: 100%;
	height: 1.0px;
	background-color: #c6c6c6;
}

/*=======================================*/

.page-content{
	overflow: hidden;
}

.page-box{
	margin-bottom: 20px;

	height: auto;
	position: relative;
	box-sizing: border-box;

	background-color: var(--section-box-color);
	
	border-radius: 7px;
	margin-top: 30px;
	border: 1px solid var(--section-box-border);
}


.page-element {
	margin-bottom: 40px;
	
	padding: 20px 17px 20px 17px;

	height: auto;
	position: relative;
	box-sizing: border-box;

	background-color: var(--section-box-color);
}

.page-element-wrapper{
	width: 100%;
}

@media screen and (min-width: 868px) {
	.page-element {
		border-radius: 7px;
		margin-top: 30px;
		padding: 10px 20px 20px 20px;
		border: 1px solid var(--section-box-border);

	}
	
	.page-element.medium{
		width: var(--site-width-medium);
		margin-left: auto;
		margin-right: auto;
	}
	
	.page-element.small{
		width: 400px;
	}
}

.page-element.full-screen {
	border-radius: 0px;

	margin: 0;
	padding: 0;

	width: 100%;
	border: 0;
	
	box-shadow: var(--shadow-elevation-0);

	min-height: var(--app-page-height);
	height: var(--app-page-height);
}



.page-element h1{
	margin-top: 20px;
	margin-bottom: 12px;
	font-size: 21px;
	line-height: var(--paragraph-line-height);
}


.page-element h2{
	margin: 15px 0 25px 0;
	font-size: 21px;
}


.page-element .mini-info-section{
	width: 100%;
	min-height: 20px;
	padding: 10px 0;
	box-sizing: border-box;
}

/*
.page-element .mini-info-section .min-nav{
	font-size: 13px;
	color: var(--text-color-grey);
}

.page-element .mini-info-section .min-nav i{
	margin: 0px 3px;
	font-size: 10px;
}
*/

.section__box .grid{
	width: 100%;
	
	display: grid; 

	grid-template-rows: auto; 

	grid-gap: 30px 30px; 
	padding: 15px 0 0 0;
}
.section__box .grid.col-1{
	grid-template-columns: 1fr; 
}

.section__box .grid.col-2{
	grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); 
}

.section__box .grid.col-3{
	grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); 
}

.section__box .grid.col-4{
	grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); 
}

.section__box .grid > *{
	width: 100%;
	border-radius: 8px;
	padding: 12px 12px 14px 12px;
	box-sizing: border-box;
	border: 1.0px solid rgba(34, 34, 34, 0.15);
	background-color: rgba(206, 206, 206, 0.15);
	overflow: hidden;
}

.section__box .grid img{
	box-sizing: border-box;
	max-width: 100%;
	max-height: 100%;
	width: 100%;
}






/*
.people{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); 
	grid-template-rows: auto; 

	grid-gap: 0 30px;
	margin-bottom: 20px;
	
	max-width: 900px;
	margin: 0 auto;
}

.people .person{
	display: grid;
	place-items: center;
	margin-top: 10px;
}

.people .person h2{
	margin-bottom: 0px;
}

.people .person .picture{
	max-width: 500px;
	position: relative;
	overflow: hidden;
}

.people .person .picture img{
	width: 100%;
	cursor: pointer;
}

.people .person .picture img:nth-of-type(2){
	position: absolute;
	left: 0;
	opacity: 0;
}

.people .person .picture img:nth-of-type(2):hover{
	opacity: 1;
	transition: opacity 0.2s ease-in-out;
}
*/


.pe-head{
	width: 100%;
	margin: 10px 0 0 0;

	display: grid;

	grid-template-rows: auto auto auto; 
	grid-template-columns: 100%; 
	grid-template-areas:  
		"preline" 
		"title" 
		"icons" 
	; 
	grid-gap: 0 0; 
}

@media screen and (min-width: 580px) {
	.pe-head{
		grid-template-rows: auto auto; 
		grid-template-columns: calc(100% - 270px) 270px; 
		grid-template-areas:  
			"preline 	icons" 
			"title 		icons" 
		; 
		
/*
		position: sticky;
		top: 0px;
*/
	}
	
	.pe-head.full-width{
		grid-template-rows: auto auto; 
		grid-template-columns: 100%; 
		grid-template-areas:  
			"preline" 
			"title" 
		; 
	}

}

/*
@media screen and (min-width: 868px) {
	.pe-head{
		position: relative;
		top: 0px;
	}
}
*/

.pe-head .preline{
	text-decoration: none;
	color: var(--main-color);
	grid-area: preline; 
}

.pe-head .title{
	font-size: 24px;
	margin: 5px 0 0 0;
	grid-area: title; 
}

.pe-head .icons{
	align-self: center; 
	grid-area: icons;

	display: flex;
	justify-content: space-around;
	align-items: center;

	margin: 15px 0 0 0;
}

@media screen and (min-width: 580px) {
	.pe-head .icons{
		margin: 0;
	}
}

.pe-head .icons img{
	height: 50px;
}

.pe-main{
	margin: 20px 0 0 0;
	display: grid; 

	grid-template-rows: auto auto auto; 
	grid-template-columns: 100%; 
	grid-template-areas:  
		"content" 
		"items"
		"side"
	; 
	grid-gap: 30px 0; 
}

@media screen and (min-width: 1200px) {
	.pe-main{
		grid-template-rows: auto auto; 
		grid-template-columns: calc(100% - 270px - 50px) 270px; 
		grid-template-areas:  
			"content side" 
			"items items" 
		; 
		grid-gap: 20px 50px; 
	}
}

@media screen and (min-width: 1200px) {
	.pe-main{
		grid-template-areas:  
			"content side" 
			"items side" 
		; 
		grid-gap: 20px 50px; 
	}
}

.pe-main .pe-content{
	line-height: var(--paragraph-line-height);
	grid-area: content; 
}

.pe-main .pe-items .item-wrapper{
	display: grid; 

	grid-template-columns: repeat(auto-fill, minmax(344px, 1fr)); 
	grid-template-rows: auto; 

	grid-gap: 10px 30px; 
	
}

@media screen and (min-width: 900px) {
	.pe-main .pe-items .item-wrapper{
		grid-template-columns: 1fr 1fr; 
	}
}

.itembox {
	height: auto;
	margin-top: 20px;
	padding: 7px !important;

	border: 0.5px solid var(--main-color);
/*	box-shadow: var(--shadow-elevation-3);*/
	box-shadow: var(--shadow-box);
	background-color: var(--box-color);
	border-radius: 8px;
	display: flex;
	align-items: center;
	border: none;
	float: left;

	border: none !important;

	position: relative;

	width: 100%;

	min-height: 140px;

/*	background-color: var(--color-blue-pastel);*/
	box-sizing: border-box;

}

.itembox a{
	display: block;

}

.itembox .imgbox {
	max-width: 140px;
	min-width: 140px;
	width: 550px;
	
/*	height: 100%;*/
	height: 140px;
	box-sizing: border-box;

	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;

	display: flex;
	align-content: center;
	justify-content: center;
	border-radius: 8px 0 0 8px;
	border-radius: 3px;
}

.itembox .imgbox img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 8px 0 0 8px;
	border-radius: 3px;
}

.itembox .content-box {
	padding: 5px 15px 5px 17px;
	width: calc(100% - 140px);
	margin: 0px;
	float: inherit;

	hyphens -moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;

	word-wrap: break-word;

	border: none !important;
	
/*
	height: 100%;
	display: flex;
	justify-content: space-around;
	flex-direction: column;
*/

}

.itembox .content-box h4 {
	margin: 0;
	padding: 0 !important;
	font-size: 13px;
	text-decoration: none;
	color: inherit;
}

.itembox .content-box h4 a{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	-webkit-box-orient: vertical;
	
	margin: 0 0 3px 0;
	padding: 0;
	font-size: 14px;
	text-decoration: none;
	color: inherit;
}

.itembox .content-box a.content {
	
	margin: 0 0 1px 0;
	padding: 0;
	font-size: 14px;
	text-decoration: none;
	color: inherit;
	
	margin-bottom: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	-webkit-box-orient: vertical;
	
	line-height: var(--paragraph-line-height);
}

.news-info{
	position: absolute;
	top: -22px;
	left: 20px;

	background-color: var(--main-color);
	color: white;
	border-radius: 9px 9px 0px 0px;
	font-size: 11px;
	font-weight: 600;

	box-sizing: border-box;
	height: 22px;

	padding: 2px 8px 2px 8px !important;
	margin: 0!important;

	display: flex!important;
	align-content: center;
	justify-content: center;

	overflow: hidden;
	max-width: 100%;

	text-overflow: ellipsis;

	white-space: nowrap;
	max-width: 100%;
}

.news-info span i{
	margin-right: 3px;
}

.news-info span{
	overflow: hidden;
	color: #ffffff;
}

.pe-main .pe-items{
	width: 100%;
	grid-area: items; 
}

.pe-main .pe-side{
	width: 100%;
	height: auto;
	margin-top: 20px;
	overflow: hidden;
	
	align-self: start; 
	grid-area: side;

	display: grid; 
	grid-template-rows: auto auto; 
	grid-template-columns: 100%; 
	grid-template-areas:  
		"contact-image"
		"contact-details"
	; 
	grid-gap: 0px 0; 

	border-radius: 8px;
/*	box-shadow: var(--shadow-elevation-3);*/
	box-shadow: var(--shadow-box);
	background-color: var(--box-color);

/*	background-color: var(--color-green-pastel);*/
	
}

@media screen and (min-width: 580px) {
	.pe-main .pe-side{
		width: 100%;
		height: auto;

		display: grid; 

		grid-template-rows: auto; 
		grid-template-columns: 50% 50%; 
		grid-template-areas:  
			"contact-image contact-details" 
		; 
		grid-gap: 0 0; 
		position: relative;
	}
}

@media screen and (min-width: 1200px) {
	.pe-main .pe-side{
		width: 100%;
		height: auto;
		align-self: start; 
		overflow: hidden;

		display: block;
		margin-top: 0;

	}
	
	.pe-main .sticky{
				
		position: sticky;
		left: 0px;
		top: 140px;

	}

}

.pe-main .pe-side .contact-image{
	grid-area: contact-image;
}

.pe-main .pe-side .contact-details{
	grid-area: contact-details;
	margin: 25px 20px 20px 20px;
	align-self: center;
}

.pe-main .pe-side .contact-details .detail-wrapper{
	display: block;
}
/*

.pe-main .pe-side .contact-details .detail-wrapper{

	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); 
	grid-template-rows: auto; 

	grid-gap: 0 10px; 
}
*/



@media screen and (min-width: 580px) {
	.pe-main .pe-side .contact-details{
		grid-area: contact-details;
		margin: 20px 0;
		padding: 0 20px;
		box-sizing: border-box;
	}

}

@media screen and (min-width: 1200px) {
	.pe-main .pe-side .contact-details{
		margin: 25px 20px 20px 20px;
		padding: 0;
	}

/*
	.pe-main .pe-side .contact-details .detail-wrapper{
		display: block;
	}
*/

	.pe-main .pe-side .contact-details .detail{
		width: 100%;
		float: none;
	}

}

.pe-main .pe-side .contact-details h2{
	margin: 0 0 15px 0;
	font-size: 21px;
}

.pe-main .pe-side .contact-details .detail{
	margin-bottom: 10px;
	display: flex;
	flex-direction: row;
	font-size: 14px;
}

.pe-main .pe-side .contact-details .detail span{
	display: inline-block;
	text-decoration: none;
	color: inherit;
	word-break: break-word;
}

.pe-main .pe-side .contact-details .detail span i{
	width: 1.25em;
	margin-right: 0.5em;
	text-align: center;
	color: var(--green-color);
	font-size: 1.25em;
	line-height: 1.5em;
}

.pe-main .pe-side .contact-details .detail a.link,
.pe-main .pe-side .contact-details .detail a[href]{
/*	color: var(--green-color);*/
/*	color: var(--color-green-highlight);*/
	cursor: pointer;
}

.pe-main .companybox{
	max-width: 325px;
}

.pe-afterbox{
	margin-top: 35px;
}

.pe-afterbox h2{
	margin: 0 0 20px 0;
	font-size: 21px;
}

.pe-afterbox .box-wrapper{
	width: calc(100% + 15px + 15px);
	margin: -20px -15px -20px -15px;
	padding: 20px 0 20px 0;
	overflow: hidden;
	position: relative;
}

@media screen and (min-width: 868px) {
	.pe-afterbox .box-wrapper{
		width: calc(100% + 20px + 20px);
		margin: -20px -20px -20px -20px;
	}
}



.pe-afterbox .box{
	margin-left: 17px;
/*	margin-right: 20px;*/
	margin-right: 10px;
	margin-top: 10px;
}

.pe-afterbox .blogpreview{
	width: 260px;
}

.pe-afterbox .blogpreview .blog{
	border-radius: 8px;
}

.pe-afterbox .blogpreview .blog .wrapper{
	border-radius: 8px;
}

.pe-afterbox .blogpreview .box-image{
	border-radius: 3px;
}



@media screen and (max-width: 867px) {
	
	
	.pe-afterbox .blogpreview .blog .wrapper{
		grid-template-columns: 100%; 
		grid-template-rows: auto auto; 
		grid-gap: 0 0;
		height: 100%;

		padding: 7px;
		box-sizing: border-box;
	}
	
	.pe-afterbox .blogpreview .blog .wrapper .box-content{
		padding: 13px 7px 5px 7px;
	}
}

.pe-afterbox .review{
	border-radius: 8px;
	box-shadow: var(--shadow-box);
	background-color: var(--box-color);
/*	box-shadow: var(--shadow-elevation-3);*/
/*	background-color: var(--color-green-pastel);*/
}

.pe-afterbox .reviewpreview{
	width: 260px;
}

@media screen and (min-width: 868px) {
	.pe-afterbox .box{
		margin-left: 20px;
	}

	.pe-afterbox .blogpreview{
		margin-right: 10px;
/*		margin-right: 20px;*/
		width: 570px;
	}
	
/*
	.pe-afterbox .blog .wrapper{
		grid-template-columns: 200px 350px; 
		grid-template-rows: auto; 
	}
*/

	.pe-afterbox .reviewpreview{
		width: 430px;
	}
}

.pe-afterbox .review .wrapper{
	overflow: hidden;
	border-radius: 8px;
	display: block;
}

.pe-afterbox .review .box-image{
	width: 100%;
}

.pe-afterbox .review .box-content{
	padding: 20px 17px 15px 17px;
	cursor: pointer;
	display: block;
}

.pe-afterbox .review .box-content h3{
	margin: 0;
	display: block;
	font-size: 14px;
	font-weight: 600;
	
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1; /* number of lines to show */
	-webkit-box-orient: vertical;
}

.pe-afterbox .review .box-content h3 .date{
	font-weight: normal;
	margin-left: 5px;
	white-space: nowrap
}

.pe-afterbox .review .box-content .stars{
	display: block;
	margin-top: 5px;
	color: var(--main-color);
}

.pe-afterbox .review .box-content p{
	margin: 5px 0 0 0;
	display: block;
	font-size: 14px;
	line-height: var(--paragraph-line-height);
}

.pe-afterbox .review .box-content p .content{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	-webkit-box-orient: vertical;
	transition: 0.6s;
	-webkit-transition: 0.6s;
}

.pe-afterbox .review .box-content p .highlight{
/*	color: var(--color-green-highlight)!important;*/
	font-weight: 600;
}


#new_review,
#contactForm{
	max-height: 0;
	overflow: hidden;
	margin: 0 -17px;
	padding: 0 17px;
	transition: 0.3s;
}

@media screen and (min-width: 868px) {
	#new_review,
	#contactForm{
		margin: 0 -20px;
		padding: 0 20px;
	}
}

.reviewToggle .actionbutton{
	margin-top: 30px;
}




/*Company-box*/

.companybox{
	width: 100%;
	border-radius: 11px;
/*	box-shadow: var(--shadow-elevation-3);*/
	align-self: start;
	
	transition: 0.3s;
	margin-left: auto;
	margin-right: auto;
	
	position: relative;
	
	background-color: var(--box-color);
/*	background-color: var(--color-orange-pastel);*/
	
	box-shadow: var(--shadow-box);
/*	border: 1px solid var(--section-box-border);*/
}

.companybox .wrapper{
	border-radius: 11px;
	overflow: hidden;
	position: relative;
	padding: 7px;
}


@media screen and (min-width: 868px) {
	.companybox:hover{
		transform: scale(1.03);
	}
}

.companybox .wrapper a{
	color: inherit;
	text-decoration: none;
	display: block;
}

.companybox .wrapper .box-image{
	width: 100%;
	border-radius: 5px;
}

.companybox .wrapper .box-content{
/*	padding: 20px 20px 15px 20px;*/
	padding: 15px 8px 5px 8px;
}

.companybox .wrapper .box-content h3{
	margin: 0;
	display: block;

	font-weight: 600;
	font-size: 19px;
}

.companybox .wrapper .box-content p{
	margin: 8px 0 0 0;
/*	display: block;*/

	line-height: var(--paragraph-line-height);
}

.companybox .wrapper .box-content .more{
	display: inline-block;
	color: var(--green-color);
/*	color: var(--color-orange-highlight);*/
/*	font-weight: 600;*/
}

.companybox .news-info-badge{
	position: absolute;
	top: -12px;
	left: 20px;
	

	background-color: var(--main-color);
	color: white;

	box-shadow: 0px 0px 0px 0px rgba(255,255,255,0.1);
	border-radius: 14px;
	
	font-size: 13px;
	font-weight: 600;

	box-sizing: border-box;

	padding: 7px 14px!important;
	margin: 0!important;

	display: flex!important;
	align-content: center;
	justify-content: center;

	overflow: hidden;
	max-width: 100%;

	text-overflow: ellipsis;

	white-space: nowrap;
	max-width: 100%;
}

.companybox .news-info-badge span{
	overflow: hidden;
	color: white;
	line-height: 1;
}

.companybox .news-info-badge span i{
	margin-right: 3px;
}

/*===============================================*/

.blogtile-wrapper{
	display: grid;
	width: 100%;

	grid-template-columns: repeat(auto-fill, 1fr); 
	grid-template-rows: auto; 

	grid-gap: 30px 30px;
	margin-bottom: 5px;
}

@media screen and (min-width: 868px) {
	.blogtile-wrapper{
		grid-template-columns: repeat(auto-fill, minmax(450px, 1fr));
		grid-gap: 40px 35px;
	}
}

.blog{
	border-radius: 11px;
	position: relative;
	box-shadow: var(--shadow-box);
	background-color: var(--box-color);
	line-height: 1.4;
	
/*	box-shadow: var(--shadow-elevation-3);*/
/*	background-color: rgba(100, 210, 255, 0.15);*/
/*	background-color: var(--color-lila-pastel);*/
}

.blog .wrapper{
	overflow: hidden;
	border-radius: 11px;
	
/*	height: 100px;*/
	
	display: grid;
	grid-template-columns: 150px 1fr; 
	grid-template-rows: 100px; 
	grid-gap: 0 0;
	
	padding: 7px;
}

@media screen and (min-width: 868px) {
	.blog .wrapper{
		grid-template-columns: 200px 1fr;
		grid-template-rows: 140px; 
	}
}


.blog a{
	color: inherit;
	text-decoration: none;
	display: block;
}

.blog .box-image{
	width: 100%;
	border-radius: 5px;
}

.blog .box-content{
	padding: 6px 15px 7px 15px;
	cursor: pointer;
}

@media screen and (min-width: 868px) {
	.blog .box-content{
		padding: 10px 17px 13px 17px;
		cursor: pointer;
	}
}

.blog .box-content h3{
	margin: 0;
	display: block;
	font-size: 14px;
	font-weight: 600;
	
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1; /* number of lines to show */
	-webkit-box-orient: vertical;
}


.blog .box-content p{
	margin: 5px 0 0 0;
	display: block;
	font-size: 14px;
	line-height: var(--paragraph-line-height);
}

.blog .box-content p .content{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	-webkit-box-orient: vertical;
	transition: 0.6s;
	-webkit-transition: 0.6s;
}

.blog .box-content p .highlight{
	display: block;
	margin-top: 2px;
	font-weight: 600;
}

@media screen and (min-width: 868px) {
	.blog .box-content h3{
		font-size: 16px;
	}
	
	.blog .box-content p .content{

		-webkit-line-clamp: 3;

	}
}



/*===============================================*/

#mapid {
	height: 100%;
/*	height: 100vh;*/
	margin: 0px;
	display: block;
}




/*===============================================*/

/*

.appearance_manager {
	position: fixed;
	min-height: 100%;
	width: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.55);
	display: block;
	z-index: 1500;
	overflow: auto;
}

.appearance_manager .popup {
	padding: 28px 28px 5px 28px;
	position: relative;
	background-color: var(--box-color);
	margin-top: 30px;
	margin-bottom: calc(30px + var(--safe-area-inset-bottom));
	border-radius: 3px;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.2);
	
	width: calc(var(--site-width-medium) + 5px);
	margin-left: calc(var(--site-edge-medium) - 2.5px);
	margin-right: calc(var(--site-edge-medium) - 2.5px);
	
	box-sizing: border-box;
}

.appearance_manager .popup.hidden {
	display: none;
}

.appearance_manager .popup h2 {
	font-size: 20px;
	line-height: 28px;
	margin-bottom: 16px !important;
	margin-bottom: 1rem !important;
	margin-top: 0px;
}
*/


/*===============================================*/

.swal-overlay,
.popup-wrapper,
.popup-wrapper-side{
	position: fixed;
	min-height: 100%;
	width: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.55);
	display: block;
	z-index: 1500;
	overflow: auto;
	visibility: hidden;
	opacity: 0;
	transition: 0.3s;
	overflow: hidden;
}

.popup-wrapper-side{
/*	z-index: 1100;*/
/*	background: rgba(255, 255, 255, 0);*/
/*	background: rgba(0, 0, 0, 0.4);*/
}

.swal-overlay,
.popup-wrapper{
	display: grid;
	place-items: center;
}

.swal-overlay--show-modal,
.popup-wrapper.show,
.popup-wrapper-side.show{

	visibility: visible;
	opacity: 1;
}

.swal-modal,
.popup-card{
/*	display: none!important;*/
	
/*	touch-action: auto;*/
	
	position: fixed;
	top: 0px;
	bottom: 0px;
	
	width: 100%;
	height: var(--app-height);
	
	position: relative;
	background: var(--section-box-color);
	overflow-y: auto;

	position: relative;
	margin-bottom: var(--safe-area-inset-bottom);
}

.swal-modal,
.popup-card.small,
.popup-card.medium{
	max-width: 450px;
	width: calc(80% + 56px);
	height: auto;
	min-height: 20px;
	max-height: 600px;

	display: block;
	border-radius: 5px;
}

@media screen and (min-width: 868px) {
	.popup-card{
		max-height: 550px;
		height: calc(90vh - 50px);
		width: calc(80% + 56px);
		max-width: 1250px;
		
		border-radius: 5px;
		margin: 30px auto;
	}

	.popup-card.small{
		max-height: 550px;
	}
	
	.popup-card.medium{
		max-width: 650px;
	}
}

.swal-modal .close,
.popup-card .close{
	position: absolute;
	top: 12px;
	right: 12px;
	height: 40px;
	width: 40px;
	background-color: var(--box-color);
	box-shadow: var(--shadow-elevation-2);
	z-index: 470;
	display: grid;
	place-items: center;
	border-radius: 5px;
	text-align: center;
	cursor: pointer;
	font-size: 20px;
}






#location_popup .popup-card{

}

@media screen and (min-width: 868px) {
	#location_popup .popup-card{
		display: grid;
		
		grid-template-rows: 100%; 
		grid-template-columns: minmax(350px, 3fr) 7fr; 
		grid-gap: 0 0; 
		grid-template-areas:  
			"side main"
		; 
	}
}

#location_popup .side{

	
	box-sizing: border-box;
	
	position: absolute;
/*	height: calc(100%);*/
	z-index: 500;
	width: auto;
	max-height: 200px;
	bottom: calc(var(--safe-area-inset-bottom) + 20px);
}

#location_popup .main{
	height: 100%;
}

@media screen and (min-width: 868px) {
	#location_popup .side{
		padding: 18px 14px 12px 14px;
		
		position: relative;
		grid-area: side;
		max-height: inherit;
		width: 100%;
		bottom: 0;
		overflow: auto;
	}

	#location_popup .main{
		grid-area: main; 
		width: 100%;
	}
}


#location_popup .main #mapid{
	height: 100%;
}

#location_popup .side h2{
	display: none;
}


@media screen and (min-width: 868px) {
	#location_popup .side .box-wrapper{
		position: relative;
		display: block;
	}
	
	
	#location_popup .side h2{
		display: block;
		font-size: 20px;
		line-height: 28px;
		margin-bottom: 16px !important;
		margin-bottom: 1rem !important;
		margin-top: 0px;
	}
}

@media screen and (max-width: 867px) {
	#location_popup .side #locations{
		overflow: hidden;
		max-width: 100%;
	}

	#location_popup .side #locations .swiper-wrapper{
		width: calc(100vw);
		align-items: stretch;
	}

	#location_popup .side #locations .swiper-wrapper .swiper-slide{
		padding-left: 14px;
		width: calc(100vw);
		box-sizing: border-box;

		display: flex;
  		align-items: stretch;
	}

	#location_popup .side #locations .swiper-wrapper .swiper-slide:last-of-type{
		padding-right: 14px;
	}
}


#location_popup .side .box{
	box-sizing: border-box;
	width: 100%;
	min-height: 40px;
	border-radius: 5px;
	padding: 10px 12px 10px 12px;
	display: block;
	cursor: pointer;
	transition: 0.2s;
	position: relative;
	
	background-color: var(--box-color);
}

@media screen and (min-width: 868px) {
	#location_popup .side .box{
		padding: 10px 35px 10px 12px;
		margin-bottom: 14px;
		box-shadow: var(--shadow-box);
		border: 1px solid var(--section-box-border);
	}
}


#location_popup .side .box:hover{
/*	background-color: var(--box-color-hover);*/
}


#location_popup .side .box > span{
	display: block;
}

#location_popup .side .box .type{
	font-size: 12px;
}

#location_popup .side .box .type i{
	font-size: 10px;
}

#location_popup .side .box .name{
	font-size: 16px;
	font-weight: 600;
	margin-top: 5px;
}

#location_popup .side .box .label{
	font-size: 14px;
	margin-top: 5px;
}

#location_popup .side .box .label a[href]{
	color: var(--blue-color);
}

#location_popup .side .box .icon{
	display: none;
}

@media screen and (min-width: 868px) {
	#location_popup .side .box .icon{
		display: block;
		font-size: 26px;
		position: absolute;
		top: calc(50% - 16px);
		right: 10px;
		color: #b5b5b5;
	}
}







#review_popup .wrapper{
	padding: 22px 18px 20px 18px;
	position: relative;
	height: calc(100%);
	overflow: auto;
	box-sizing: border-box;
}

#review_popup .wrapper .reviewer{
	margin: 0;
	display: block;
	font-size: 17px;
	font-weight: 600;
}


#review_popup .wrapper .reviewer .date{
	font-weight: normal;
/*	margin-left: 5px;*/
	white-space: nowrap
}

#review_popup .wrapper .stars{
	display: block;
	margin-top: 8px;
	font-size: 16px;
	color: var(--main-color);
}

#review_popup .wrapper .review{
	margin: 5px 0 0 0;
	display: block;
	font-size: 14px;
	line-height: var(--paragraph-line-height);
	margin-top: 10px;
}





#appearance_manager .wrapper{
	padding: 22px 18px 20px 18px;
	position: relative;
	height: calc(100%);
	overflow: auto;
	box-sizing: border-box;
}

#appearance_manager .wrapper h2 {
	font-size: 20px;
	line-height: 28px;
	margin-bottom: 16px !important;
	margin-bottom: 1rem !important;
	margin-top: 0px;
}



/*
.popup-side{
	width: 450px;
	max-width: 100%;
	height: var(--app-height);
	background-color: var(--box-color);
	float: right;
	transform: translateX(100%);
	transition: 0.5s;
	box-shadow: var(--shadow-elevation-4);
}

.popup-wrapper-side.show .popup-side{
	transform: translateX(0%);
}


.side-cart{
}

.side-cart .overflow-wrapper{
	overflow: auto;
	max-height: var(--app-height);
}

.side-cart .cart-content{
	margin: 0 25px 200px 25px;
}

.side-cart .mini-head{
	width: 100%;
	box-sizing: border-box;
	height: var(--header-height);
	display: grid;
	place-items: center;
}


.side-cart .mini-head h2{
	text-align: center;
	font-size: 22px;
	margin: 10px 0 0 0;
	
}

.cart-content .variant-content{
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto; 

	grid-gap: 20px; 
	
	margin: 20px 0;
	
	border-bottom: 1.0px solid #c6c6c6;
	padding-bottom: 20px;
	
	border-radius: 9px;
	background-color: var(--box-color);
	padding: 5px;
	box-shadow: var(--shadow-elevation-2);
	border: 2px solid #ffffff;
}

.cart-content .variant-content .image-wrapper{
	display: block;
	height: 150px;
	width: 150px;
	object-fit: cover;
	border-radius: 4px;
	overflow: hidden;
	position: relative;
}

.cart-content .variant-content .image-wrapper img{
	height: 100%;
	width: 100%;
}

.cart-content .variant-content .box-content{
	padding: 0 0;
}

.cart-content .variant-content .box-content .vendor{
	display: block;
	color: var(--text-color-grey) !important;
	margin-top: 10px;
	font-size: 95%;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.cart-content .variant-content .box-content .title{
	display: block;
	font-weight: 600;
	margin-top: 8px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.cart-content .variant-content .box-content .price{
	display: block;
	margin-top: 8px;
	margin-bottom: 15px;
}

.side-cart .mini-checkout-content{
	padding: 25px 30px 25px 30px;
	
	position: fixed;
	bottom: 0px;
	box-shadow: var(--shadow-elevation-2);
	background-color: #ffffff;
	
	width: 100%;
	box-sizing: border-box;
}

.side-cart .mini-checkout-content .sum{
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
}

.side-cart .mini-checkout-content .sum .total{
	font-weight: 600;
	font-size: 20px;
}

.side-cart .mini-checkout-content .button{
	width: 100%;
}
*/




/*===============================================*/


.swal-modal {
	padding: 22px 18px 12px 18px;
	box-sizing: border-box;
}

.swal-modal .swal-title {
	font-weight: 600;
	font-size: 18px;
	padding-right: 35px;
}

.swal-modal .swal-text {
	margin: 5px 0 5px 0;
	display: block;
	font-size: 15px;
	line-height: var(--paragraph-line-height);
	margin-top: 10px;
	
	color: var(--text-color-grey)!important;
    font-size: 95%;
}

.swal-modal .swal-footer {
	display: flex;
	float: right;
}

.swal-modal .button{
	min-width: inherit;
}

.swal-modal .button--confirm{
	margin-left: 20px;
}

.swal-modal .button--cancel{
	margin-left: 20px;
}


/*===============================================*/


.icon_img{
    height: 13px;
}

.actionbutton{
    background-color: var(--green-color);
    padding: 4px 0px;
    color: white;
    border-radius: 5px;
    cursor: pointer;
	
	margin-top: 5px;
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	min-width: 100px;
	font-size: 95%;
}

@media screen and (min-width: 868px) {
	.actionbutton{
		width: auto;
		padding: 4px 17px;
		font-size: 100%;
	}
	
	.actionbutton.full-size{
		width: 100%;
		box-sizing: border-box;
	}
}


/*___________________________*/

.content .text .infobox {
	
	height: auto;
	width: calc(100%);
	padding-top: 10px;
	padding-left: 00px;
	padding-right: 20px;
	/*	padding-bottom: 00px;*/
	margin-top: 0px;
	margin-right: 20px;

	word-wrap: break-word;
	clear: both;
}

@media screen and (min-width: 868px) {
	.content .text .infobox {
		float: right;
		height: auto;
		width: 200px;
		
/*		padding-top: 10px;*/
		padding-top: 0;
		padding-left: 20px;
		padding-right: 20px;
/*		padding-bottom: 20px;*/
		padding-bottom: 10px;
		
		background-color: var(--box-color);
		border-radius: 5px;
		margin-top: 0px;
		margin-left: 20px;
		margin-right: 20px;
/*		margin-bottom: 20px;*/

		border: 0.5px solid #d8d8d8;

		box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
		clear: none;
	}


	.content .text .text-wrapper {
		max-width: calc(var(--site-width) - 40px - 350px);
		float: left;
	}

}

.content .text .infobox h4 {
	color: #111111;
	font-size: 20px;
}

.content .text .infobox a {
	margin-bottom: 10px;
	color: rgb(0, 0, 0);
	text-decoration: none;
}

.content .text .infobox a .highlight {
	color: var(--main-color);
}

.content .text .h4 {
	margin-top: 20px;
}


/*___________________________*/
/*itembox ist die tabelle*/

.shop-overview .itembox{
	width: 100%;
}



.eventbar {
	margin-top: 50px;
	margin-bottom: -20px;
	min-height: 20px;
	width: calc(var(--site-width) - 20px - 20px);
	margin-left: var(--site-edge);
	margin-right: var(--site-edge);

	color: var(--main-color);

	padding: 10px 20px;


	background-color: var(--box-color);
	border-radius: 5px;
	border: 0.5px solid #d8d8d8;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);

}

.eventbar.flex {
	display: flex;

	justify-content: space-between;
	align-items: center;
}

.eventbar.mob-integration {
	margin-bottom: -50px;
	border: none;
	border-radius: 5px 5px 0px 0px;
	box-shadow: none;
}

@media screen and (max-width: 750px) {
	.eventbar.mob-integration {
		margin-top: 50px;
		margin-bottom: -50px;
		width: calc(var(--site-width) - 20px - 20px);
		background-color: rgb(255, 255, 255) !important;
		padding-left: 20px;
		padding-right: 20px;
		border: none;
		border-radius: 5px 5px 0px 0px;
		box-shadow: none;
	}
}

@media screen and (min-width: 750px) {
	.eventbar {
		margin-top: 50px;
		margin-bottom: -20px;
		min-height: 20px;
		width: calc(var(--site-width) - 20px - 20px);
		margin-left: var(--site-edge);

		color: var(--main-color);

	}

}

.eventbar.self-reliant {
	margin-top: 50px;
	margin-bottom: 0px;
}

@media screen and (min-width: 750px) {
	.eventbar.self-reliant {
		margin-top: 50px;
		margin-bottom: 0px;
	}
}

.eventbar.below {
	margin-top: 30px;
	margin-bottom: 0px;
}

.eventbar.center {
	text-align: center;
}

.eventbar .left {
	top: 0px;
	float: left;
}

.eventbar .right {
	top: 0px;
	float: right;
	position: relative;
}

.eventbar h2.small-title{
	margin: 0px;
	color: black;
	font-size: 18.72px;
	margin-top: 2px;
}

.eventbar a {
	text-decoration: none;
	color: var(--main-color);
}

.eventbar a.black {
	color: rgba(0, 0, 0, 0.8);
}

.eventbar .passive {
	color: rgba(0, 0, 0, 0.4) !important;
}

.eventbar .pointer {
	cursor: pointer;
}

.eventbar div.actionbanner {
	padding: 4px;

	border-radius: 5px;
	border: 2px solid var(--main-color);
	margin: -10px;
}

.eventbar .smooth-hide {
	opacity: 0;
	animation: smooth-hide 5s;
}

@keyframes smooth-hide {
	0% {
		opacity: 1;
		display: block;
	}

	50% {
		opacity: 1;
		display: block;
	}

	100% {
		opacity: 0;
		display: none;
	}
}

.eventbar .addtoclipboard-source {
	color: rgba(255, 255, 255, 0);
	font-size: 0px;
}

.eventbar .addtoclipboard-alert {
	width: 110px;
	padding: 3px;
	border-radius: 4px;
	top: 25px;
	right: -15px;
	background-color: var(--main-color);
	position: absolute;
	color: white;
	cursor: default;

	opacity: 0;
		box-shadow: 0px 0px 8px 0 white;

}

.eventbar .addtoclipboard-alert-before {
	content: "";
	position: absolute;
	z-index: 1;
	display: block;
	width: 0;
	top: 15px;
	right: -5px;
	margin-left: 50%;
	border-style: solid;
	border-width: 0 15px 15px;
	border-color: var(--main-color) transparent;
	opacity: 0;
	cursor: default;
}

@media screen and (min-width: 868px) {
	.eventbar.boxing {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-start;

	}

	.eventbar.boxing .boxing-child:nth-child(2n + 1) {
		width: calc(50% - 20px);
		display: block;

	}

	.eventbar.boxing .boxing-child:nth-child(2n) {
		padding-left: 25px;
		border-left: 1px solid var(--main-color);
		width: calc(50% - 25px);
		display: block;

	}
}

.eventbar svg {
	text-align: center;
}

.notification-box svg,
.message-box svg,
svg.status_icon {
	width: 100px;
	display: block;
/*	margin: 10px auto 20px;*/
	margin: 0 auto;
}

.notification-box svg,
.box__error svg,
.message-box svg,
.eventbar svg.status_icon .path {
	stroke-dasharray: 1000;
	stroke-dashoffset: 0;
}

.notification-box svg .path.circle,
.box__error svg .path.circle,
.message-box svg .path.circle,
.eventbar svg.status_icon .path.circle {
	-webkit-animation: dash .9s ease-in-out;
	animation: dash .9s ease-in-out;
}

.notification-box svg .path.line,
.box__error svg .path.line,
.message-box svg .path.line,
.eventbar svg.status_icon .path.line {
	stroke-dashoffset: 1000;
	-webkit-animation: dash .9s .35s ease-in-out forwards;
	animation: dash .9s .35s ease-in-out forwards;
}

.notification-box svg .path.check,
.box__error svg .path.check,
.message-box svg .path.check,
.eventbar svg.status_icon .path.check {
	stroke-dashoffset: -100;
	-webkit-animation: dash-check .9s .35s ease-in-out forwards;
	animation: dash-check .9s .35s ease-in-out forwards;
}

@-webkit-keyframes dash {
	0% {
		stroke-dashoffset: 1000;
	}

	100% {
		stroke-dashoffset: 0;
	}
}

@keyframes dash {
	0% {
		stroke-dashoffset: 1000;
	}

	100% {
		stroke-dashoffset: 0;
	}
}

@-webkit-keyframes dash-check {
	0% {
		stroke-dashoffset: -100;
	}

	100% {
		stroke-dashoffset: 900;
	}
}

@keyframes dash-check {
	0% {
		stroke-dashoffset: -100;
	}

	100% {
		stroke-dashoffset: 900;
	}
}

/*___________________________*/

/*
.product-content {
	background-color: var(--box-color);
	min-height: 200px;
	padding-bottom: 20px;
}


.product-content .main-section{
	width: 100%;
	box-sizing: border-box;
	display: grid;
	grid-template-columns: minmax(400px, 2fr) minmax(400px, 3fr);
	grid-template-rows: auto; 

	grid-gap: 20px 80px; 
}

.product-content .main-section .img-section{
	width: 100%;
	min-height: 30px;
}

.product-content .main-section .info-section{
	width: 100%;
	min-height: 30px;
}



.product-content .main-section .img-section .swiper-container {
	width: 100%;
	height: 300px;
	margin-left: auto;
	margin-right: auto;
}

.product-content .main-section .img-section .swiper-container .swiper-button{
	background-image: none;
	display: flex;
	align-items: center;
	justify-content: center;
}

.product-content .main-section .img-section .swiper-container .swiper-button i{
	background-image: none;
	font-size: 30px;
	color: white;
	text-shadow: 0 0  5px grey;
}

.product-content .main-section .img-section .swiper-container .swiper-button-prev{
	left: 5px;
}

.product-content .main-section .img-section .swiper-container .swiper-button-next{
	right: 5px;
}


.product-content .main-section .img-section .swiper-slide {
	background-size: contain;
	background-position: center;
}

.product-content .main-section .img-section .gallery-top {
	max-height: 350px;
}

.product-content .main-section .img-section .gallery-top .swiper-slide{
	display: flex;
	align-items: center;
	justify-content: center;
}

.product-content .main-section .img-section .gallery-top .swiper-slide > div{
	position: relative!important;
}

.product-content .main-section .img-section .gallery-top .swiper-slide img{
	object-fit: contain;
	width: 100%;
	height: 100%;

}

.product-content .main-section .img-section .gallery-thumbs {
	height: auto;
	box-sizing: border-box;
	padding: 10px 0;
}

.product-content .main-section .img-section .gallery-thumbs .swiper-slide {
	height: 100%;
	opacity: 0.4;
	cursor: pointer;
}

.product-content .main-section .img-section .gallery-thumbs .swiper-slide img{
	width: 100%;
}

.product-content .main-section .img-section .gallery-thumbs .swiper-slide-thumb-active {
	opacity: 1;
}



.product-content .main-section .text-section{
	width: 100%;
	box-sizing: border-box;
}

.product-content .text-section .title{
	font-weight: 600;
	font-size: 20px;
	display: block;
	line-height: 1.4em;
}

.product-content .text-section .review{
	display: block;
	color: var(--main-color);
	font-size: 15px;
	margin-top: 5px;
}

.product-content .text-section .review i{
	margin-right: 2px;
}

.product-content .text-section .costs{
	display: block;
	margin-top: 20px;
}

.product-content .text-section .costs .price{
	color: var(--green-color);
	font-weight: 600;
	font-size: 20px;
	margin-top: 20px;
}

.product-content .text-section .costs .shipping_costs{
	color: #565959;
	font-size: 15px;
}

.product-content .text-section .description{
	margin-top: 30px;
	display: block;
	line-height: 1.4em;
}

.product-content .text-section .description ul{
	padding-left: 15px;
}

.product-content .text-section .variant_title{
	display: block;
	font-weight: 600;
	font-size: 18px;
	margin-top: 20px;
}

.product-content .text-section .variants{
	margin-top: 10px;
	display: block;
}



.product-content .buy-section{
	width: 100%;
	margin-top: 15px;
	margin-bottom: 15px;
}


.product-content .buy-section__box{
	width: 100%;
	box-sizing: border-box;
	overflow: auto;
	
	
}

.product-content .buy-section .price{
	color: var(--green-color);
	display: block;
	font-weight: 600;
	font-size: 20px;
}

.product-content .buy-section .shipping_costs{
	color: #565959;
	display: block;
	font-size: 15px;
	
}

.product-content .buy-section .shipping{
	display: block;
	margin-top: 20px;
}

@media screen and (min-width: 650px) {

	.product-content .buy-section .shipping{
		margin-top: 0px;
	}

}

@media screen and (min-width: 1200px) {

	.product-content .buy-section .shipping{
		margin-top: 20px;
	}

}

.product-content .buy-section .shipping .shipping_date{
	font-weight: 600;
}

.product-content .buy-section .stock{
	margin-top: 5px;
	display: block;
	font-weight: 600;
}

.product-content .buy-section .stock.available{
	color: var(--green-color);
}

.product-content .buy-section .button{
	width: 100%;
}

.product-content .buy-section .secure{
	display: block;
	color: var(--green-color);
	font-size: 15px;
}

.product-content .buy-section .vendor_info{
	font-size: 15px;
	margin-top: 20px;
	display: block;
}

.product-content .buy-section .vendor_info .vendor{
	color: var(--main-color);
	text-decoration: none;
}

.product-content .more-info-section{
	margin-top: 0px;
	
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: space-between;
	padding: 0 20px;
	position: relative;
}


.product-content .product-info-section{
	box-sizing: border-box;
	width: calc(100%);
}


@media screen and (min-width: 1200px) {

	.product-content .product-info-section{
		width: calc(40%);
	}

}

.product-content .product-info-section .title{
	display: block;
	font-weight: 600;
	font-size: 16px;
	margin-top: 20px;
	color: var(--text-color);
}

.product-content .product-info-section table{
	width: 100%;
	margin-top: 15px;
}

.product-content .product-info-section table, 
.product-content .product-info-section tr, 
.product-content .product-info-section th {
	border-collapse: collapse;
}


.product-content .product-info-section th{
	border-top: 1px solid #e7e7e7;
	border-left: 1px solid #e7e7e7;
	border-right: 1px solid #e7e7e7;
}

.product-content .product-info-section tr:last-of-type{
	border-bottom: 1px solid #e7e7e7;
}

.product-content .product-info-section tr th:first-of-type{
	background-color: #f3f3f3;
}

.product-content .product-info-section tr th{
	text-align: left;
	padding: 7px 14px 6px;
	width: 50% !important;
	white-space: normal;
	word-wrap: break-word;
	font-weight: normal;
	color: #565959;
	font-size: 13px;
}

.product-content .product-info-section .review{
	color: var(--main-color);
}

.product-content .raitings-section{
	width: 100%;
}


@media screen and (min-width: 1200px) {
	.product-content .more-info-section{
		flex-wrap: nowrap;
	}
	
	.product-content .raitings-section{
		width: calc(100% - 40% - 40px);
		margin: 0 0 0 40px;
	}
}

.product-content .raitings-section .title{
	display: block;
	font-weight: 600;
	font-size: 16px;
	margin-top: 20px;
	color: var(--text-color);
}

.product-content .raitings-section .swiper-wrapper {
	padding-bottom: 1px;
	margin-top: 15px;
}

.product-content .raitings-section .swiper-slide {
	background-color: var(--box-color);
	padding: 14px !important;
	width: 100%;
	box-sizing: border-box;
	border-radius: 8px;
	cursor: pointer;
	transition: border-color 0.8s;
}

.product-content .raitings-section .swiper-slide::before {
	content: "";
	position: absolute;
	position: absolute;
	border: 0.5px solid #d8d8d8;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	border-radius: 8px;
	pointer-events: none;
	
	-webkit-transition : border 200ms;
	-moz-transition : border 200ms;
	-o-transition : border 200ms;
	transition : border 200ms;
}

.product-content .raitings-section .swiper-slide:hover::before {
	border: 0.5px solid var(--main-color);
}

.product-content .raitings-section .swiper-pagination {
	text-align: center;
}

.product-content .raitings-section .swiper-pagination-bullet-active {
	background: var(--main-color) !important;
	opacity: 1 !important;
}

.product-content .raitings-section .review_name{
	display: block;
	font-weight: 600;
	font-size: 16px;
	color: var(--text-color);
}

.product-content .raitings-section .rating_stars{
	margin-top: 5px;
	display: block;
	font-size: 15px;
	color: var(--main-color);
}

.product-content .raitings-section .date{
	margin-left: 5px;
	font-size: 15px;
	color: var(--text-color);
}

.product-content .raitings-section .review_description{
	display: block;
	margin-top: 10px;
	margin-bottom: 20px;
	font-size: 15px;
	color: var(--text-color);
}
*/




/*___________________________*/

.eventbar h2 {
	color: var(--main-color);
	margin-bottom: 10px;
}

.searchbar {
	/*	background-color: aqua;*/
	/*
	display: flex;
	justify-content: flex-start;
	align-items: center;
*/
	padding-bottom: 1px;
}

.inputbutton{
	border-radius: 6px;
	border: 1.0px solid var(--input-border-color);
	background-color: var(--input-background-color);
	margin: 8px 0px;
	outline: none;
/*	padding: 10.5px 9px 9.5px 9px;*/
	min-height: 40.4px;
	color: #aaa;
	width: 40px;
/*	display: inline-block;*/
	display: grid;
	place-items: center;
}

.inputbutton i{
	min-width: 20px;
	text-align: center;
}

/*:not([type="checkbox"])*/
input,
textarea,
.file-upload,
select {
	max-width: calc(100%);
	width: 600px;
	border-radius: 6px;
	border: 1.0px solid var(--input-border-color);
/*	background-color: rgba(0, 0, 0, 0.02);*/
	background-color: var(--input-background-color);
	
	margin: 8px 0px;
	outline: none;
	
	box-sizing: border-box;
	transition: 0.3s;
	-webkit-appearance: none;
	color: var(--text-color);

	font-family: inherit;
	font-size: inherit;
	
	position: relative;
	text-align: left;
	text-align: -webkit-left;
	
	padding: 10.5px 9px 9.5px 9px;
	min-height: 40.4px;
}

@media screen and (min-width: 868px) {
	input,
	textarea,
	.file-upload,
	select {
		padding: 9.5px 9px 8.5px 9px;
		min-height: 38.4px;
	}
	
	.inputbutton{
		padding: 9.5px 9px 8.5px 9px;
		min-height: 38.4px;
	}
}

.modern_layout input,
.modern_layout select{
	height: 45px;
	padding: 10px;
	border: 0 !important;
	margin: 0;
}

input.mini,
textarea.mini,
.file-upload.mini,
select.mini{
	margin: 0;
	padding: 5px;
	
	height: 29px;
	min-height: 0px;
	
/*
	background-color: rgba(0, 0, 0, 0.02);
	border: 1.0px solid #d8d8d8;
*/
	
	border: 1.0px solid var(--input-border-color);
	background-color: var(--input-background-color);
}

input[type="datetime-local"] {
	-webkit-appearance: none;
	/*	-moz-appearance: none;*/
	height: 2.3rem !important;
}


.file-upload {
	cursor: pointer;
	
	-webkit-user-select: none;
	-moz-user-select: -moz-none;
	-ms-user-select: none;
	user-select: none;
}

textarea {
	width: 100%;
	height: 250px;
	max-width: 900px;

}

textarea.medium {
	height: 100px;
	max-width: calc(100%);
	width: 600px;

}

.file-upload:hover,
.file-upload:focus {
	background-color: rgba(0, 0, 0, 0.045);
}

/*input[type="submit"]:active,*/
.file-upload:active {
	background-color: #e2e2e2;
}

input:invalid,
textarea:invalid,
select :invalid{
	box-shadow: none !important;
}

input[type="file"] {
	display: none;
}

input:focus {
	border-color: var(--green-color);
}

.checkboxcontainer input.required:invalid ~ .checkmark,
select.required:invalid,
textarea.required:invalid,
input.required:invalid {
	border-color: var(--red-color)!important;
	background-color: rgba(255, 0, 0, 0.03);
}


.checkboxcontainer input.invalid ~ .checkmark,
select.invalid,
textarea.invalid,
input.invalid {
	border-color: var(--red-color)!important;
	background-color: rgba(255, 0, 0, 0.03);
}


/*not(:placeholder-shown)*/


/*
select.required:not(:focus):invalid,
textarea.required:not(:focus):invalid,
input.required:not(:focus):invalid {
	border-color: var(--red-color)!important;
}
*/
/*not(:placeholder-shown)*/

input:invalid,
textarea:invalid,
select:invalid{
	box-shadow: none !important;
}

input.file-upload.required:invalid + label.file-upload{
	border-color: var(--red-color);
}

input:disabled,
textarea:disabled,
select:disabled{
/*	box-shadow: 0 0 8px 0 var(--main-color);*/
	box-shadow: none;
	background-color: var(--input-disabled-background-color)!important;
}

.file-upload:disabled,
.file-upload:disabled:hover,
.file-upload:disabled:focus {
	box-shadow: none !important;
	border-color: none !important;
}

/*INPUT WITH ICON*/

.input_with_icon input[type="text"],
.input_with_icon input[type="email"],
.input_with_icon input[type="password"] {
	padding-left: 36px;
}

.input_with_icon {
	position: relative;
	padding: 0px !important;
	max-width: calc(100%);
	width: 600px;
	border: 0!important;
	overflow: visible!important;
}

.input_with_icon .start_icon {
/*.input_with_icon i:first-of-type {*/
	position: absolute;
	left: 1px;
	top: 8px;
	bottom: 8px; /* Als Ausgleich zum Margin vom Input*/
	color: #aaa;
	transition: 0.3s;
	
	height: calc(100% - 16px);
	width: 36px;
	display: grid;
	place-items: center center;
	vertical-align: middle; 
}

/* Für Safari, da es mit grid alleine nicht funktioniert */

/*
.input_with_icon i::before{
	
vertical-align: middle; 
	font-weight: 900;
	display: block;
	position: absolute;
}
*/

.input_with_icon input[type="text"]:focus + .start_icon,
.input_with_icon input[type="email"]:focus + .start_icon,
.input_with_icon input[type="password"]:focus + .start_icon,
.input_with_icon input[type="text"]:focus + i:first-of-type,
.input_with_icon input[type="email"]:focus + i:first-of-type,
.input_with_icon input[type="password"]:focus + i:first-of-type {
	color: var(--green-color);
}

/*END ICON*/

.input_with_end_icon input[type="text"],
.input_with_end_icon input[type="text"],
.input_with_end_icon input[type="email"],
.input_with_end_icon input[type="password"] {
	padding-right: 40px;
}

.input_with_end_icon input:not(:placeholder-shown)[type="password"] {
/*	SCHRIFTART INTER HAT ZUGROSSE BULLET POINTS*/
	font-family: -apple-system, BlinkMacSystemFont, Arial, sans-serif;
}

.input_with_end_icon .end_icon,
.input_with_end_icon i.end_icon{
	position: absolute;
	right: 1px;
	top: 8px;
	bottom: 8px; /* Als Ausgleich zum Margin vom Input*/
	color: #aaa;
	transition: 0.3s;
	
	height: calc(100% - 16px);
	width: 40px;
	display: grid;
	place-items: center center;
	text-align: center;
}

.input_with_end_icon .end_icon .toggle-password,
.input_with_end_icon i.end_icon.toggle-password{
	cursor: pointer;
}

/*CLEARABLE*/


.input_with_icon.clearable input[type="text"],
.input_with_icon.clearable input[type="email"],
.input_with_icon.clearable input[type="password"] {
	display: inline-block;
	padding-right: 36px;
}

.input_with_icon.clearable .clearable__clear {
	position: absolute;
	right: 1px;
	top: 8px;
	bottom: 8px; /* Als Ausgleich zum Margin vom Input*/
	color: #aaa;
	transition: 0.3s;
	
	height: calc(100% - 16px);
	width: 36px;
	place-items: center center;
	text-align: center;
	
	cursor: pointer;
	display: none;
}

.input_with_icon.clearable .clearable__clear.show-clearable {
	display: grid;
}



.input_with_icon.clearable .clearable input::-ms-clear {
	/* Remove IE default X */
	display: none;
}

/* QUANITY SELECTOR */

.quantity-selector{
	position: relative;
	padding: 0px !important;
	max-width: calc(100%);
	width: 110px;
	height: 38px;
	margin: 8px 0px;
	
	border-radius: 5px;
	border: 1.0px solid #d6d6d6;
	background-color: rgba(0, 0, 0, 0.02);

	box-sizing: border-box;
	transition: 0.3s;
	color: var(--text-color);

	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	
	overflow: hidden;
	
}

.quantity-selector.mini{
	margin: 5px 0;
	height: 30px;
	width: 80px;
}

.quantity-selector .decrease,
.quantity-selector .increase{
	padding: 8px;
/*
	width: 20px;
	height: calc(100% - 16px);
*/
	text-align: center;
	display: grid;
	place-items: center;
	color: #aaa;
	cursor: pointer;
	border-radius: 3px;
	transition: 0.2s;
}

.quantity-selector.mini .decrease,
.quantity-selector.mini .increase{
	padding: 5px 5px;
}

.quantity-selector .decrease:hover,
.quantity-selector .increase:hover{
/*	background-color: #e6e6e6;*/
	background-color: rgba(113, 113, 113, 0.10);
}

.quantity-selector .increase{
/*	padding-right: 12px;*/
	margin-right: 2.5px;
}

.quantity-selector .decrease{
/*	padding-left: 12px;*/
	margin-left: 2.5px;
}

.quantity-selector input {
	width: 30px;
	padding: 0;
	margin: 0;
	border: 0;
	background-color: rgba(255, 255, 255, 0);
	
	-webkit-appearance: textfield !important;
	-moz-appearance: textfield !important;
	appearance: textfield !important;
	text-align: center;
	width: calc(100%/3);
	
	color: var(--text-color-grey);
}

.quantity-selector input::-webkit-inner-spin-button,
.quantity-selector input::-webkit-outer-spin-button {
	-webkit-appearance: none;
}

input[type="date"]{
    min-height: 38px;
}




input[type="radio"] {
	width: auto;
	border-radius: 100%;
	min-height: inherit;
	padding: 9px;
}

input[type="radio"]:checked {
	background-color: var(--green-color);
	box-shadow: none !important;
	border-color: var(--green-color);
}

/*
input[type="radio"]:checked::after {
    content: '';
    display: block;
    background-color: var(--red-color);
    border-radius: 100%;
    position: absolute;
	top: 4px;
	bottom: 4px;
	left: 4px;
	right: 4px;
}
*/

input[type="radio"]:focus {
	border-color: var(--green-color);
	box-shadow: 0 0 8px 0 var(--green-color);
}

select {
	background-image: url(../img/select-arrow.svg);
	background-position: right;
	background-repeat: no-repeat;
	padding-right: 42px;
}

input[type="checkbox"] {

	width: initial;
	border-radius: initial;
	border: 1px;
	box-shadow: initial;
	outline: initial;
	transition: initial;
	box-sizing: initial;
	-webkit-appearance: initial;
	color: initial;
	cursor: initial;
	background-color: initial;
	margin: 0px;
	padding: 0px;
	position: absolute;
	left: 12px;
	top: 12px;

}

.checkboxcontainer {

	position: relative;
	display: flex;
	
	cursor: pointer;
	color: var(--text-color);

    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);

	margin: 15px 0px 12px 0px;
	
}

.checkboxcontainer.small{
	margin: 0;
}

/* Create a custom checkbox */
.checkmark {

	position: relative;
	height: 25px;
	width: 25px;
/*	background-color: rgba(0, 0, 0, 0.02);*/
/*	border: 0.5px solid #d8d8d8;*/
/*	border: 1.0px solid #d8d8d8;*/
	
	border: 1.0px solid var(--input-border-color);
	background-color: var(--input-background-color);
	
	border-radius: 5px;
	transition: 0.3s;
	-webkit-appearance: none;
	cursor: pointer;
	
	display: grid;
	align-items: center;
	text-align: center;

}

/* When the checkbox is checked, add a green background */
.checkboxcontainer input:checked ~ .checkmark {
	background-color: var(--green-color);
	border-color: var(--green-color);
}

/* When the checkbox is checked and disabled, add a dark grey background */
.checkboxcontainer input:disabled ~ .checkmark {
	box-shadow: none;
	background-color: var(--input-disabled-background-color)!important;
}

/* When the checkbox is checked and disabled, add a dark grey background */
.checkboxcontainer input:checked:disabled ~ .checkmark {
	background-color: #8b8b8b!important;
	border-color: #8b8b8b;
}

/* Show the checkmark when checked */
.checkboxcontainer input:checked ~ .checkmark:after {
	
	-webkit-font-smoothing: antialiased;
	font: var(--fa-font-solid);
/*	font-family: "Font Awesome 6 Free";*/
	content: "\f00c";
	vertical-align: middle;
	font-weight: 900;
	
	display: block;
	color: white;
	font-size: 15px;
}

.checkboxcontainer > div {

	max-width: calc(600px - 40px);
	width: calc(100% - 40px);
	
	margin: 0 0 0 15px;
	border: none;
	border-top: none !important;
	padding: 0px !important;
	
	-webkit-user-select: none;
	-moz-user-select: -moz-none;
	-ms-user-select: none;
	user-select: none;

}

.checkboxcontainer div a {
	display: inline !important;
}

.checkboxcontainer .display_if_checked {
	margin-top: -11px;
	min-height: 52px;
}

.checkboxcontainer .display_if_checked .wrapper{
	display: none;
}

.checkboxcontainer input:checked ~ .display_if_checked .wrapper{
	display: inline-block;
}

.radio_button{
    border: none!important;
	
	max-width: 100%;
	
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: space-between;
	
	padding: 6px 0px;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
}

.radio_button.space-around{
	justify-content: space-around;
}

.radio_button.list{
	flex-direction: column;
	align-items: start;
}

.radio_button label{
	margin: 6px 10px 6px 0;
	float: left;
	
	position: relative;
	
	display: grid;
	grid-auto-flow: row;
	position: relative;
}

.radio_button label .border,
.radio_button label img,
.radio_button label svg,
.radio_button label span:first-of-type{
    transition: 0.1s;
    cursor: pointer;
    border: 2px solid #d8d8d8;
    border-radius: 5px;
	
	-webkit-user-select: none;
	-moz-user-select: -moz-none;
	-ms-user-select: none;
	user-select: none;
	
}

/*.radio_button label .border,*/
.radio_button label svg,
.radio_button label img{
    padding: 5px;
    height: 60px;
	width: auto;
	box-sizing: border-box;
	object-fit: cover;
}

/*.radio_button label .border,*/
.radio_button label svg.preview-img,
.radio_button label img.preview-img{
    padding: 5px;
    height: 110px;
    width: 110px;
	box-sizing: content-box;
}

.radio_button label .border.size-m,
.radio_button label svg.size-m,
.radio_button label img.size-m{
/*
    padding: 8px;
    width: 100%;
	height: auto;
*/
	
	padding: 8px;
	height: 80px;
}

@media screen and (min-width: 468px) {
	.radio_button label .border.size-m,
	.radio_button label svg.size-m,
	.radio_button label img.size-m{
		height: 80px;
		width: auto;
	}
}

.radio_button label .border.size-l,
.radio_button label svg.size-l,
.radio_button label img.size-l{
    padding: 8px;
    width: 100%;
	height: auto;
}

@media screen and (min-width: 468px) {
	.radio_button label .border.size-l,
	.radio_button label svg.size-l,
	.radio_button label img.size-l{
		height: 100px;
		width: auto;
	}
}

.radio_button label span:first-of-type{
    padding: 3px 8px;
	white-space: nowrap;
	min-width: 35px;
	text-align: center;
}

.radio_button input[type="radio"]{
    display: none;
}

.radio_button input[type="checkbox"]{
    display: none;
	position: relative;
}

.radio_button .check-icon{
	opacity: 0;
	position: absolute;
	top: 1px;
	right: 1px;
	height: 17px;
	width: 17px;
	background-color: var(--green-color);
	border-radius: 50%;
	transition: 0.1s;
	display: grid;
	place-items: center;
	text-align: center;
	
	transform: translate(50%, -50%);
	
}

.radio_button .check-icon i{
	line-height: 1;
	font-size: 10px;
	color: white;
	width: 1.25em;
	display: block;
}

.radio_button input:checked ~ .border,
.radio_button input:checked + label .border,
.radio_button input:checked ~ svg,
.radio_button input:checked + label svg,
.radio_button input:checked ~ img,
.radio_button input:checked + label img{
    border: 2px solid var(--green-color);
	background-color: rgba(47, 204, 102, 0.08);
}

.radio_button input:checked ~ .check-icon,
.radio_button input:checked + label .check-icon{
	opacity: 1;
}

.radio_button input ~ .img-label,
.radio_button input + label .img-label{
	padding: 7px;
	color: var(--text-color-grey);
	
}

.radio_button input:checked + label span:first-of-type{

	border-color: var(--green-color);
	background-color: var(--green-color);
	color: white;
}

.form-half-input,
.form-30-70-input,
.form-80-20-input,
.form-70-30-input,
.form-33-33-33-input{
	max-width: 100%;
	width: 600px;
	margin: 0 !important;
	padding: 0 !important;
	display: flex;
	justify-content: start;
	flex-wrap: nowrap;
	align-items: flex-end;
	
	border: none!important;
	overflow: visible!important;
}

.form-half-input > div,
.form-30-70-input > div,
.form-80-20-input > div,
.form-70-30-input > div,
.form-33-33-33-input > div{
	position: relative;
	
	margin: 0 20px 0 0!important;
	padding: 0 !important;
	
	max-width: fit-content;
	max-width: -moz-fit-content;
	
	overflow: visible!important;
	
	border: none!important;
}

.form-half-input > div{
	width: calc((100% - 20px) / 2);
}

.form-80-20-input > div:first-of-type{
	width: calc((100% - 20px) * 0.8);
}

.form-80-20-input > div{
	width: calc((100% - 20px) * 0.2);
}

.form-70-30-input > div:first-of-type{
	width: calc((100% - 20px) * 0.7);
}

.form-70-30-input > div{
	width: calc((100% - 20px) * 0.3);
}

.form-30-70-input > div:first-of-type{
	width: calc((100% - 20px) * 0.3);
}

.form-30-70-input > div{
	width: calc((100% - 20px) * 0.7);
}

.form-33-33-33-input > div{
	width: calc((100% - 30px) * 0.33);
}




.upload-box{
/*	padding: 10px 5px 10px 5px;*/
	padding: 8px 0 8px 0;
}

.upload-box .box__wrapper{
	position: relative;

	width: 100%;
	box-sizing: border-box;
	transition: 0.2s;
	overflow: visible;
}

.upload-box	.box__wrapper > div{
	border-radius: 10px;
	padding: 25px 15px;
}

.upload-box .box__input{
	border: 2px dashed #b7b7b7;
/*	border: 1.0px solid #d6d6d6;*/
	overflow: hidden;
	transition: 0.3s;
/*	margin: -25px -10px;*/
	border-radius: 10px;
	padding: 0px!important;
	transition: 0.3s;
}

.upload-box .box__input:hover{
	background-color: rgba(0, 0, 0, 0.02);
}


.upload-box	fieldset{
	border: none;
	padding: 0;
	margin: 0;
}

.upload-box	fieldset:disabled .box__input{
	background-color: #e3e3e3;
}

.upload-box .box__input label{
	border-radius: 10px;
	box-sizing: border-box;

	padding: 25px 15px;
	
	width: 100%;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;

	cursor: pointer;
}

.upload-box	fieldset:disabled .box__input label{
	cursor: default;
}

.upload-box.required:not(.has-file) .box__input{
	border-color: var(--red-color);
	background-color: rgba(255, 0, 0, 0.06);
}

.upload-box.is-dragover	.box__input{
	background-color: #e5f1ff;
	border-color: #3e94ff;
}


.upload-box .box__dragndrop,
.upload-box .box__icon{
	display: none;
}

.upload-box.has-advanced-upload .box__icon{
	display: block;
	margin-bottom: 15px;
	color: var(--text-color);
	font-size: 35px;
	min-height: 47.25px;
}

.upload-box .box__label{
	text-align: center;
}

.upload-box .box__label{
	text-align: center;
}

.upload-box .box__label .box__filename{
	display: none;
}

.upload-box .box__label.is-showing-filename .box__filename{
	display: block;
}

.upload-box .box__label.is-showing-filename .box__selectfile,
.upload-box .box__label.is-showing-filename .box__dragndrop{
	display: none;
}

.upload-box .box__supportet_filetypes{
	margin-top: 10px;
	text-align: center;
}

.upload-box input[type=submit]{
	min-width: inherit;
	width: 100%;
}

@media screen and (min-width: 338px) {
	.upload-box input[type=submit]{
		min-width: 200px;
		width: auto;
	}
}

.upload-box .box__info{
	margin-top: 10px;
}

.upload-box .box__selectfile{
	font-weight: 600;
}

.upload-box.has-advanced-upload .box__dragndrop{
	display: inline;
}

.upload-box .box__uploading,
.upload-box .box__success,
.upload-box .box__error{
	display: none;
	background-color: #f7f7f7;
	border: 2px solid #e2e2e2!important;
	margin-bottom: 20px;
	
	border-radius: 10px;
	padding: 25px 10px;
}

.upload-box.is-uploading .box__uploading{
	display: block;
	position: relative;
}

.upload-box.is-success .box__success,
.upload-box.is-error .box__error{
	display: block;
}

.upload-box.is-uploading .box__uploading div,
.upload-box.is-success .box__success div,
.upload-box.is-error .box__error div{
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 42px;

	-webkit-animation: appear-from-inside .25s ease-in-out;
	animation: appear-from-inside .25s ease-in-out;
}

.upload-box .box__error svg,
.upload-box .box__success svg{
	height: 40px;
	width: 40px;
	margin-right: 15px;
	padding: 1px;
}

@-webkit-keyframes appear-from-inside{
	from	{ -webkit-transform: scale( 0 ); }
	75%		{ -webkit-transform: scale( 1.03 ); }
	to		{ -webkit-transform: scale( 1 ); }
}

@keyframes appear-from-inside{
	from	{ transform: scale( 0 ); }
	75%		{ transform: scale( 1.03 ); }
	to		{ transform: scale( 1 ); }
}


.upload-box .box__restart{
	font-weight: 700;
}

.upload-box .box__restart:focus,
.upload-box .box__restart:hover{
	color: #39bfd3;
}

.upload-box .js .box__file{
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.upload-box .js .box__file + label{
	max-width: 80%;
	text-overflow: ellipsis;
	white-space: nowrap;
	cursor: pointer;
	display: inline-block;
	overflow: hidden;
}

.upload-box .js .box__file + label:hover strong,
.upload-box .box__file:focus + label strong,
.upload-box .box__file.has-focus + label strong{
	color: #39bfd3;
}

.upload-box .js .box__file:focus + label,
.upload-box .js .box__file.has-focus + label{
	outline: 1px dotted #000;
	outline: -webkit-focus-ring-color auto 5px;
}

.upload-box .js .box__file + label *{
	/* pointer-events: none; */ /* in case of FastClick lib use */
}

.upload-box .no-js .box__file + label{
	display: none;
}

.download-area-wrapper{
	display: block;
	margin: 8px 0px 10px 0;
}

.download-area{
	
	display: inline-block;
	max-width: calc(100%);
/*	width: 600px;*/
	border-radius: 5px;
	
	border: 1px solid var(--green-color);



	outline: none;
	padding: 4px 8px;
	box-sizing: border-box;
	transition: 0.3s;
	-webkit-appearance: none;
	color: var(--text-color);
	font-family: inherit;
	font-size: inherit;
	position: relative;
	cursor: pointer;
	
	background-color: var(--green-color-opacity-2);
}

.download-area:hover{
	background-color: var(--green-color-opacity-1);
}

.download-area .icon{
	color: var(--green-color);
	margin: 0 8px 0 4px;
}

.download-area .name{
	
	color: var(--green-color);
/*	font-weight: 600;*/
	line-height: var(--paragraph-line-height);
	user-select: none;
}


.copy-code{
	
	cursor: text;
	resize: none;
	background-color: inherit;
	border-width: 1.5px;
	color: var(--text-color);
	
	width: 100%;
	max-width: 900px;
	
	border-radius: 5px;
/*	border: 1.5px solid #d8d8d8!important;*/
	border: 1.5px solid var(--input-disabled-background-color)!important;
	
	margin: 8px 0px!important;
	padding: 8px;
	
	box-sizing: border-box;
	background-color: var(--input-disabled-background-color);
}

/*
.searchbar input[type="submit"] {
	max-width: calc(var(--site-width) - 40px);
	width: 300px;
	border-radius: 5px;
	border: 0.5px solid #d8d8d8;
	box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
	margin: 8px 0;
	outline: none;
	padding: 8px;
	box-sizing: border-box;
	transition: 0.3s;
	-webkit-appearance: none;

	color: #000000;

	cursor: pointer;

	background-color: #f0f0f0;
}

.searchbar input[type="submit"]:focus,
.searchbar input[type="submit"]:hover {
	box-shadow: 0 0 8px 0 var(--main-color);
	border-color: var(--main-color);
}

.searchbar input[type="submit"]:active {
	background-color: #e2e2e2;
}
*/


.searchbar img {
	max-width: 100%;
	width: 300px;
}

/*================================================*/

.overview{
	margin-top: 50px;
	margin-left: var(--site-edge);
	padding-top: 20px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 1px;
	width: calc(var(--site-width) - 40px);
	background-color: rgba(70, 65, 65, 0.69);
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
}


/*================================================*/


.shop-overview {
	background-color: whitesmoke;
}


.blog-overview {
	background-color: whitesmoke;
}



.blog-preview {
	padding-top: 5px;
	padding-left: 20px;
	padding-right: 20px;
	color: #000000;
	margin-bottom: 20px;
	background-color: var(--box-color);

	border-radius: 0px;
	border: 0.5px solid #d8d8d8;

	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);

}

.blog-preview h6 {
	margin-top: 15px;
	margin-bottom: 0px;
	float: left;
	color: var(--main-color);
}

.blog-preview h6 a {
	margin: 0px;
}

.blog-preview h2 {
	clear: both;
	margin-top: 20px;
	margin-bottom: 10px;
}

.blog-preview .highlight {
	color: var(--main-color);

}

.blog-preview a {
	display: block;
	margin-right: 10px;
	padding-bottom: 10px;
	text-decoration: none;
	color: inherit;
	max-width: 900px;
}

/*================================================*/

#back2Top {
	transition: 0.3s;
	width: 60px;
	line-height: 60px;
	overflow: hidden;
	z-index: 999;
	display: none;
	cursor: pointer;
	position: fixed;
	bottom: 20px;
	right: 20px;
	background-color: rgba(255, 255, 255, 0.6);
	color: rgba(0, 0, 0, 0.4);
	text-align: center;
	font-size: 30px;
	text-decoration: none;

	border-radius: 5px;

	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
}

.noback2top #back2Top {
	visibility: hidden;
}

@media screen and (min-width: 750px) {
	#back2Top {
		visibility: hidden;
	}
}

/*================================================*/

.footer-section {
	width: 100%;
	background-color: var(--footer-color);
}

.footer-section .wrapper{
	margin-left: calc(var(--site-edge) + 20px);
	width: calc(var(--site-width) - 40px);
}

.footer-section .footer {
	position: relative;
	
	max-width: 700px;
	margin: 0 auto;
	padding: 30px 40px 0 40px;
	
	display: flex;
	justify-content: center;
	flex-direction: column;
}

.footer-section .footer .container {
	float: left;
	color: var(--footer-text-color);
	margin-bottom: 15px;
}

.footer-section .footer .container .title {
	font-size: 18px;
}

.footer-section .footer .container ul {
	padding: 0px;
	margin: 15px 0 15px 0;
}

.footer-section .footer .container li {
	list-style-type: none;
	line-height: 1;
	margin-bottom: 9px;
}

.footer-section .footer .container ul li a {
/*	font-size: 14.5px;*/
	font-size: 14.5px;
	text-decoration: none;
	color: var(--footer-text-color);
}

.footer-section .footer .container ul li i {
	font-size: 180%;
	margin-right: 10px;
	vertical-align: middle;
}

.footer-section .footer .container li .pointer {
	cursor: pointer;
}

@media screen and (min-width: 750px) {
	.footer-section .footer {
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-start;
	}

	.footer-section .footer .container {
		margin-bottom: 15px;
	}
}

.footer-section .bottom-footer-line {
/*
	height: 0.75px;
	background: linear-gradient(90deg, rgba(255,255,255,0) 5%, rgba(255, 255, 255, 0.6) 50%, rgba(255,255,255,0) 95%);
*/
	border-top: 1px solid #fff;
	
}
	

.footer-section .bottom-footer {
	display: flex;
	justify-content: center;
	align-content: center;

	color: var(--footer-text-color);
	text-align: center;

	padding: 15px;
}

.footer-section .bottom-footer a {
	font-size: 14.5px;
	text-decoration: none;
	color: white;
}

/*==============================================*/


.category_boxing{
	display: grid;
	width: 100%;
	grid-template-columns: 1fr 1fr;

	grid-template-rows: auto;
	grid-gap: 30px 20px;
	margin-bottom: 11px;
}

@media screen and (min-width: 600px) {
	.category_boxing{
		grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
		grid-gap: 30px 25px;
	}
}

.category_boxing .category_box{
	display: block;
	border-radius: 11px;
/*	box-shadow: var(--shadow-elevation-3);*/
	box-shadow: var(--shadow-box);
	background-color: var(--box-color);
	align-self: start;
	transition: 0.3s;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	padding: 7px;
	
	width: 100%;
	box-sizing: border-box;
/*	border: 1px solid var(--section-box-border);*/
	
/*	align-self: stretch;*/
}

.category_boxing .category_box img{
	border-radius: 5px;
	width: 100%;
	display: block;
}

.category_boxing .category_box .box_content{
	padding: 5px 15px 5px 15px;
	text-align: center;
}

@media screen and (min-width: 600px) {
	.category_boxing .category_box .box_content{
		padding: 12px 8px 5px 8px;
	}
}

.category_boxing .category_box .box_title{
	font-weight: 600;
	font-size: 15.5px;
	line-height: 1;
}


/*==============================================*/

.section {
/*	width: calc(100% - 40px);*/
	width: 100%;
	box-sizing: border-box;
/*	border-bottom: 1px solid var(--main-color-opacity);*/
	border-bottom: 1px solid #d8d8d8;
	padding: 8px;
	display: block;
	overflow: hidden;
}

.section a {
	width: 80%;
	float: left;
	text-decoration: none;
	cursor: pointer;
}

.section.no-pointer a {
	cursor: inherit;
}

.section.no-pointer .pointer {
	cursor: pointer;
}

.section .right {
	float: right;
	width: auto;
	height: 0px;
}

.section .right a {
/*	color: var(--main-color);*/
	color: rgba(0, 0, 0, 0.2);
/*	cursor: pointer;*/
	white-space: nowrap;
}

.section label {
	float: right;
	width: calc(100% - 35px);
	cursor: pointer;
}

.section input[type="radio"] {
	float: left;
	margin: 0px;
	cursor: pointer;
}

/*==============================================BILDFORMATE*/

.accordion{
	width: 100%;
	margin-top: 20px;
	display: block;
	overflow: hidden;
	border-radius: 5px;
	background-color: var(--faq-answer-color);
	
	
/*	box-shadow: var(--shadow-elevation-1);*/
/*	border: 1.0px solid #d6d6d6;*/
/*	background-color: #fafafa;*/
/*	border: 1.0px solid #efefef;*/
}

.accordion .box-question{
	padding: 8px 10px;
	width: 100%;
	position: relative;
	height: auto;
	display: grid;
	
	grid-template-rows: auto ; 
	grid-template-columns: 1fr 25px; 
	grid-gap: 0 20px; 
	cursor: pointer;
	transition: 0.1s;
	
	background-color: var(--faq-headline-color);
	
/*	Disable user selection*/
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

/*
.accordion .box-question:hover,
.accordion.show .box-question{
	background-color: #f4f4f4;
}
*/

.accordion .box-question i{
	font-size: 120%;
	align-self: center;
	text-align: center;
	transition: 0.1s;
	margin: 0px;
	padding: 0px;
	width: 20px;
	height: 20px;
	color: var(--text-color-grey);
	line-height: 1;
}

.accordion.show .box-question i{
	transform: rotate(180deg);
}

.accordion .box-question p,
.accordion .box-answer p{
	margin: 0px;
}

.accordion .box-answer{
	
	font-size: 90%;
	color: var(--text-color-grey);
	margin: 8px 0px;
	
	border-radius: 5px;
	padding: 5px 12px;
	
	display: none;
	opacity: 0;
	
	transition: opacity .3s;
	
	
    /* fade out, then shrink */
	
/*
	font-size: 0;
    margin: 0;
    opacity: 0;
    padding: 0;
    transition: opacity .25s,
                font-size .5s .25s,
                margin .5s .25s,
                padding .5s .25s,
				height .5s .1s;
*/
}

.accordion.show .box-answer{
	
	opacity: 1;
	
	/* unshrink, then fade in */
	
/*


	
	
    transition: font-size .25s,
                margin .25s,
                padding .25s,
                opacity .5s .25s,
				height .5s .25s;
*/
}

.accordion .box-answer a[href]{
	color: var(--green-color);
}

/*==============================================BILDFORMATE*/

/* alt für background-img

/*
.ratio-4-3 {
	width: 100%;
	position: relative;
	background: url() 50% 50% no-repeat;
	background-size: cover;
	background-clip: content-box;
}

.ratio-4-3:before {
	display: block;
	content: "";
	padding-top: 75%;
}

.ratio-3-2 {
	width: 100%;
	position: relative;
	background: url() 50% 50% no-repeat;
	background-size: cover;
	background-clip: content-box;
}

.ratio-3-2:before {
	display: block;
	content: "";
	padding-top: 66%;
}

*/

/*NEU: FÜR IMG Tag*/
.ratio-4-3,
.ratio-1-1,
.ratio-3-2{
	width: 100%;
	position: relative;
	overflow: hidden;
/*
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
*/
	
/*
	animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
*/
	background-color: var(--image-loading-background-color);
}

.ratio-4-3{
	padding-top: 75%!important;
}

.ratio-3-2 {
	padding-top: 66%!important;
}

.ratio-1-1 {
	padding-top: 100%!important;
}

.ratio-4-3 img,
.ratio-1-1 img,
.ratio-3-2 img {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
/*
	min-width: 100%;
	min-height: 100%;
*/
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ratio-4-3 img[src=''],
.ratio-1-1 img[src=''],
.ratio-3-2 img[src=''] {
	display: none;
}

.animated-background {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
}

@keyframes placeHolderShimmer{
    0%{
        background-position: -468px 0
    }
    100%{
        background-position: 468px 0
    }
}

.grey-background {
	background: #ededed;
}

/*==============================================*/

button{
	font-size: 100%;
	font-family: inherit;
	border: 0;
	padding: 0;
}


input[type="submit"],
.button {
	max-width: calc(100%);
	min-width: 200px;
	width: auto;
	box-sizing: border-box;
	
	display: inline-block;
	text-align: center;
	transition: box-shadow 0.2s;
	cursor: pointer;
	
	margin: 15px 0 8px 0;
	

	background-color: var(--green-color);
	color: white !important;
	
	box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.2);
	font-weight: normal;

	
	border: none;
	outline: none;
	
 	-ms-user-select: None;
	-moz-user-select: None;
 	-webkit-user-select: None;
 	user-select: None; 
	transition: 0.1s;
		
	line-height: normal;
	transition: all .15s ease-out;
	
	border-radius: 6px;
	padding: 9px 17px;
	
	border-radius: 6px;
	padding: 10.5px 17px;
	font-size: 16px;
}

@media screen and (min-width: 868px) {
	input[type="submit"],
	.button {
		padding: 9.5px 17px;
		font-size: inherit;
	}
}

input[type="submit"].standalone,
.button.standalone{
	margin: 2px 0 2px 0;
}

input[type="submit"].small,
.button.small{
	min-width: inherit;
}

input[type="submit"].wide,
.button.wide{
	min-width: 250px;
}

input[type="submit"]:hover,
.button:hover {
	transition: 0.1s, box-shadow 0.2s;
/*	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2);*/
	border-color: rgba(255, 255, 255, 0);
}

input[type="submit"]:active,
.button:active {
	transition: 0.1s, box-shadow 0.2s;
/*	box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.2);*/
	border-color: rgba(255, 255, 255, 0);
}

input[type="submit"]:disabled,
input[type="submit"]:disabled:hover,
input[type="submit"]:disabled:focus{
	background-color: rgba(0, 0, 0, 0.3);
	box-shadow: none;
	cursor: default;
}
/*

.button.size {
	max-width: 200px;
}
*/


.button.w200 {
	max-width: 200px;
}


input[type="submit"].fittowidth,
.button.fittowidth {
	width: 100%;
}

@media screen and (min-width: 550px) {
	input[type="submit"].fittowidth,
	.button.fittowidth {
		width: auto!important;
		min-width: calc(200px);
	}

}


input[type="submit"].green,
.button.green {
	background-color: var(--green-color);
	color: white !important;
}

input[type="submit"]:hover,
.button:hover,
input[type="submit"].green:hover,
.button.green:hover {
	background-color: #2ec964;
}

input[type="submit"]:active,
.button:active,
input[type="submit"].green:active,
.button.green:active {
	background-color: #1eba55;
}

input[type="submit"]:focus,
.button:focus,
input[type="submit"].green:focus,
.button.green:focus {
	background-color: #1eba55;
}

input[type="submit"].red,
.button.red {
	background-color: var(--red-color);
	color: white !important;
}

input[type="submit"].orange,
.button.orange {
	background-color: var(--main-color);
	color: white !important;
}

input[type="submit"].blue,
.button.blue {
	background-color: var(--light-blue-color);
	color: white !important;
}

input[type="submit"].blue:hover,
.button.blue:hover {
	background-color: #206eea;
}

input[type="submit"].blue:active,
.button.blue:active {
	background-color: #1460d9;
}

input[type="submit"].grey,
.button.grey {
	background-color: #b1b1b1;
	color: white !important;
}

input[type="submit"].admin,
.button.admin {
	background-color: var(--admin-color);
	color: white !important;
}


.swal-modal .button--cancel,
input[type="submit"].grey.outline,
.button.grey.outline {
	position: relative;
	background-color: var(--button-grey-outline-background-color);
	color: var(--text-color-grey) !important;
}

input[type="submit"].green.outline,
.button.green.outline {
	background-color: rgba(255, 255, 255, 0);
	color: var(--green-color)!important;
	border: 1px solid var(--green-color)!important;
}

input[type="submit"].green.outline:hover,
.button.green.outline:hover {
	background-color: var(--green-color-opacity-1);
}

input[type="submit"].empty,
.button.empty {
	background-color: rgba(255, 255, 255, 0);
	color: var(--text-color-grey) !important;
}

input[type="submit"].white,
.button.white {
	background-color: #ffffff;
	color: var(--text-color) !important;
}

.swal-modal .button--cancel:hover,
input[type="submit"].grey.outline:hover,
input[type="submit"].empty:hover,
.button.empty:hover,
.button.grey.outline:hover {
/*	background-color: #e2e2e2;*/
	background-color: var(--button-grey-outline-background-color-hover);
}

.swal-modal .button--cancel:active,
input[type="submit"].grey.outline:active,
input[type="submit"].empty:active,
.button.empty:active,
.button.grey.outline:active {
/*	background-color: #d9d9d9;*/
	background-color: var(--button-grey-outline-background-color-hover);
	border-color: #c2ccd6;
}


/*
input[type="submit"].outline::after,
.button.outline::after {
	content: "";
	
	position: absolute;
	top: 0px;
	left: 0px;
	
	height: calc(100% - 1.6px);
	width: calc(100% - 1.6px);
	
	border: 1.5px solid #9b9b9b;
	border-radius: 7px;
}
*/


.button-next-to-each-other{
	display: flex;
	justify-content: space-around;
	flex-direction: column-reverse;
}

@media screen and (min-width: 650px) {
	.button-next-to-each-other{
		flex-direction: row;
	}
}

.mini_info {
/*	Für richtigen Zeilenbabstand*/
	display: inline-block; 
/*	display: block;
/*    line-height: 20px;*/
/*    max-width: 800px;*/
    color: var(--text-color-grey)!important;
    font-size: 80%;
/*	line-height: var(--paragraph-line-height);*/
}

.big_info {
    color: var(--text-color-grey)!important;
    font-size: 160%;
	margin-top: 6px;
}

.info {
    color: var(--text-color-grey)!important;
    font-size: 95%;
	margin-top: 6px;
	margin-bottom: 0;
}

.info-title {
    color: var(--text-color-grey)!important;
/*    font-size: 95%;*/
	margin-top: 3px;
	font-weight: 600;
	margin-bottom: 7px;
	display: block;
}

ol.info{
	margin-top: 20px;
	padding-left: 30px;
}

ol.info li{
	margin-bottom: 10px;
}

ol.info li::marker{
	display: inline-block;
	margin: 20px;
}

.mini_input_info {
/*	display: block;*/
/*    line-height: 20px;*/
/*    max-width: 800px;*/
    color: var(--text-color-grey)!important;
    font-size: 90%;
	display: block;
	margin-top: 3px;
	margin-bottom: -3px;
}

.block{
	display: block;
}

.center {
	text-align: center;
/*
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
*/
}

.align-left {
	text-align: left;
	width: auto;
}


.top-badge-wrapper {
	position: relative;
	padding: 10px;
}
.top-badge {
	position: absolute;
	top: 0px;
	right: 0px;
	font-size: 70%;
	padding: 0.3em 0.5em;
	border-radius: 100px;
	display: inline-block;
	line-height: 1;
	background-color: #ffffff4d;
}

.badge{
	font-size: 70%;
	margin-right: 1em;
/*	margin-bottom: 0.5em;*/
	padding: 0.1em 0.7em;
	background-color: #aaaaaa;
	border-radius: 100px;
	font-weight: 500;
	color: #ffffff!important;
	display: inline-block;
	line-height: 1.7;
/*	vertical-align: 2;*/
	vertical-align: 0.2em;
}

.badge.green{
	color: #ffffff!important;
	background-color: var(--green-color)!important;
}

.badge.red{
	color: #ffffff!important;
	background-color: var(--red-color)!important;
}

.badge.orange{
	color: #ffffff!important;
	background-color: var(--main-color-light)!important;
}

.badge.blue{
	color: #ffffff!important;
	background-color: var(--blue-color)!important;
}

.badge.lightgrey{
	color: var(--text-color-grey)!important;
	background-color: #ebebeb!important;
}

.badge.lightgreen{
	color: #ffffff!important;
	background-color: var(--green-color-opacity-3)!important;
}

.badge.white.outline{
	color: #ffffff!important;
	background-color: rgba(255, 255, 255, 0);
	border: 1px solid #ffffff;
}

.badge.lightwhite{
	color: #ffffff;
	background-color: #ffffff4d;
}

.badge.lightorange{
	color: #ffffff;
	background-color: #ffab4d;
}

.badge.badgelist{
	margin-right: 0.75em;
	margin-bottom: 0.75em;
}

.badge.large{
	font-size: 93%;
}

.badge.medium{
	font-size: 85%;
}
.badge.extra-large{
	font-size: 100%;
}

.unselectable {
  -webkit-user-select: none;
     -moz-user-select: -moz-none;
      -ms-user-select: none;
          user-select: none;
}

.beta::after{
/*	content: "BETTA";*/
/*
	content: url(../img/beta-icon.svg);
	transform: scale(.5);

	display: inline-block;
	height: 13px!important;
*/
	
	background-image: url(../img/beta-icon.svg);
	background-size: contain; 
	background-repeat: no-repeat;
	
    display: inline-block;
    width: 45px; 
    height: 20px;
    content:"";
	margin-bottom: -6px;
	margin-left: 9px;

}

/*
div:has(.edit_icon) {
    position: relative;
}
*/

.edit_icon{
	cursor: pointer;
	
	position: absolute;
	top: 8px;
	right: 8px;
	width: 18px;
	height: 18px;
/*
	background-color: var(--box-color);
	border: 2px solid var(--admin-color);
	color: var(--admin-color);
*/
	background-color: var(--admin-color);
	color: white!important;
	border-radius: 50%;
	
/*
	
	border: 1px solid var(--red-color);
	padding: 5px!important;
*/
/*	padding: 6px!important;*/
	padding: 0px!important;
	margin: 0!important;
	display: flex!important;
	align-content: center;
	text-decoration: none!important;
	justify-content: center;
}

.edit_icon i{
	font-size: 10px;
	padding-top: 4px;
}

.consent-ask-permission-for-service{
	width: 100%;
	height: 100%;
	background-color: #d8d8d8;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.consent-ask-permission-for-service .bg-img{
	position: absolute;
	width: 100%;
	height: 100%;
	-webkit-filter:  blur(5px) grayscale(0.75);
    filter: blur(5px) grayscale(0.75);
	background-size: cover;
}

.consent-ask-permission-for-service .popup{
	position: relative;
	width: 100%;
	height: 100%;
	background-color: var(--box-color);
	box-sizing: border-box;
	
	max-width: calc(500px + 28px + 28px);
	height: auto;
	padding: 28px;
	border-radius: 3px;
/*	box-shadow: 0 2px 5px 0 rgba(0,0,0,.2);*/
	font-size: 87%;
}

@media screen and (min-width: 500px) {
	.consent-ask-permission-for-service .popup{
		font-size: 100%;
	}
}



/*
.consent-ask-permission-for-service {
	max-width: 850px;
	width: 80%;
	padding: 28px 28px 0 28px;
	position: relative;
	background-color: var(--box-color);
	margin: 30px auto;
	overflow-y: auto;
	
}
*/

.consent-ask-permission-for-service .popup p {
	padding: 0;
	margin-top: 1rem;
	margin-bottom: 1rem;
	color: var(--text-color-grey);
    font-size: 90%;
	line-height: 1.8em;
}

.consent-ask-permission-for-service .popup p.title {
	font-size: 20px;
	line-height: 28px;
	margin-bottom: 16px !important;
	margin-bottom: 1rem !important;
	margin-top: 0px;
	color: var(--text-color);
	font-weight: 600;
}

.consent-ask-permission-for-service .popup p a {
	color: inherit;
	text-decoration: underline!important;
	display: inline;
}

.consent-ask-permission-for-service .popup .secure {
	color: var(--green-color);
	font-weight: 600;
}

.ios-only{
	display: none;
}

@supports (-webkit-touch-callout: none) {
  /* CSS specific to iOS devices */ 
	
	.ios-only{
		display: inline-block;
	}
}


/*=======================SHOP-DESIGN=======================*/


.background-image-top{
	position: relative;
	overflow: hidden;
	
	height: 370px;
	max-height: 55vh;
	
/*	height: 100vh;*/
	
	min-height: 300px;
/*	max-width: calc(1800px * 0.8 + 50px);*/
	max-width: calc(3000px * 0.8 + 50px);
	margin-left: auto;
	margin-right: auto;
}

.background-image-top.banner{
	height: 230px;
	max-height: inherit;
	min-height: 230px;
}


@media screen and (min-width: 500px) {
	.background-image-top{
		height: 500px;
		max-height: inherit;
		background-size: 100%;
	}
	
	.background-image-top.banner{
		height: 230px;
		max-height: inherit;
	}
}

@media screen and (min-width: 1200px) {
	.background-image-top{
		height: 550px;
		max-height: inherit;
	}
	
	.background-image-top.banner{
		height: 230px;
		max-height: inherit;
	}
}

@media screen and (min-width: 1600px) {
	.background-image-top{
		height: 650px;
		max-height: inherit;
	}
	
	.background-image-top.banner{
		height: 230px;
		max-height: inherit;
	}
}

@media screen and (min-width: 2000px) {
	.background-image-top{
		height: 900px;
		max-height: inherit;
	}
	
	.background-image-top.banner{
		height: 230px;
		max-height: inherit;
	}
}

.background-image-top::after{
	position: absolute;
	content: "";
/*	background-image: linear-gradient(to bottom, rgba(234, 237, 237, 0) 0%, rgb(234, 237, 237) 100%);*/
	background-image: linear-gradient(to bottom, rgba(234, 237, 237, 0) 0%, rgb(234, 237, 237) 100%);
	width: 100%;
	height: 50%;
	top: 50%;
	z-index: 1;
}

.background-image-top.banner::after{
	content: "";
	background-image: none;
	top: 100%;
}

.background-image-top .swiper-slide{
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.background-image-top .swiper-slide img{
	height: 100%;
	width: 100%;
	
	object-fit: cover;
/*	object-position: top center;*/
	object-position: 50% 25%;
	
/*
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
	transform: scale(1.2);
*/
	
	
}

/*
.background-image-top .swiper-slide img.lightfire{
	object-position: -170px 35px;
	object-position: 37% 35%;
}
*/

/*
@media screen and (min-width: 500px) {
	.background-image-top .swiper-slide img{
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}
	
	.background-image-top .swiper-slide img.lightfire{
		object-position: 37% 35%;
	}
}
*/

.background-image-top.bg-image-center .swiper-slide img{
	object-position: 50% 50%;
}


.background-image-top .swiper-button-prev {
  	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") !important;
	top: 25%;
	left: 20px;
	background-size: 15px 33px;
}

.background-image-top .swiper-button-next {
  	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") !important;
	top: 25%;
	right: 20px;
	background-size: 15px 33px;
}

@media screen and (min-width: 500px) {
	.background-image-top .swiper-button-prev,
	.background-image-top .swiper-button-next {
		background-size: 20px 44px;
	}
}

.background-image-top{
	overflow: hidden;
	
	position: relative;
	
/*
	width: calc(var(--site-width) + 100px);
	margin: 0px calc(var(--site-edge) - 50px);
*/
	
	height: 450px;
	max-height: 55vh;
	z-index: 1;
}

.background-image-top::after{
	position: absolute;
	content: "";
	background-image: linear-gradient(to bottom, rgba(248, 245, 24, 0) 0%, rgb(248, 245, 242) 100%);
	width: 100%;
	height: 50%;
	top: 50%;
	z-index: 1;
}

.background-image-top img{
	height: 100%;
	width: 100%;
	
	object-fit: cover;
	object-position: 50% 25%;
}


/*
@keyframes message-box-open {
	from {max-height: 0px;}
	to {max-height: 500px;}
}
*/

.message-box{
	z-index: 500;
	padding: 0 calc(var(--site-edge) + 20px);
	overflow: hidden;
	margin: 0;
	background-color: var(--box-color);
	
/*
	max-height: 0px;
	
	animation-name:  message-box-open;
	animation-timing-function: ease-out;
  	animation-duration: 2s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	animation-timing-function: ease;
*/
}

.message-box .wrapper{
	margin: 20px auto;
	max-width: 800px;
	
	display: flex;
	justify-content: center;

	align-items: center;
	align-content: center;
	flex-wrap: wrap;
	
	overflow: hidden;
}


.message-box .wrapper svg{
	
	margin: 10px 0;
	display: block;
	
	width: 100px!important;
	margin-right: 20px;
	flex-shrink: 0;
	padding: 1px;

}


.message-box .wrapper a{
	display: block;
	margin: 10px 0;
	text-align: center;
}

@media screen and (min-width: 480px) {
	.message-box .wrapper{
		flex-wrap: nowrap;
		justify-content: space-between;
	}
	
	.message-box .wrapper svg{
		margin: 0 16px;
	}
	
	.message-box .wrapper a{
		text-align: left;
		margin: 0 16px;
	}
}



.contentpage{
	position: relative;

	min-height: 500px;
	z-index: 1;
	color: #2a2831;
}

.contentpage .col{
/*	width: var(--site-width);*/
	padding-left: var(--site-edge);
	padding-right: var(--site-edge);

/*	overflow: hidden;*/
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 30px 0 10px 0;
}

.contentpage .col .box{
	background-color: var(--box-color);
	box-sizing: border-box;
	margin: 20px 0 0 0;
	padding: 20px;
/*	width: calc((100% - 3*20px) / 4 );*/
	width: 100%;
/*	box-shadow: 0 0 10px 0 rgba(0,0,0,.2);*/
}

.contentpage .col .box.displaylimit:nth-child(n+3){
    display: none;
}

.contentpage .col .box.col-box-2{
	width: 100%;
}

@media screen and (min-width: 480px) {
	.contentpage .col .box{
		width: calc((100% - 1*30px) / 2 );
	}
	
}

@media screen and (min-width: 800px) {
	.contentpage .col .box{
		width: calc((100% - 2*30px) / 3 );
	}
	
	.contentpage .col .box.displaylimit:nth-child(n+3){
		display: block;
	}
	
	.contentpage .col .box.displaylimit:nth-child(n+4){
		display: none;
	}

	.contentpage .col .box.col-box-2{
		width: calc((100% - 1*30px) / 2 );
	}	
}

@media screen and (min-width: 1100px) {
	.contentpage .col .box{
		width: calc((100% - 3*30px) / 4 );
	}
	
	.contentpage .col .box.displaylimit:nth-child(n+4){
		display: block;
	}
}

.contentpage .col .box.header-box{
/*	padding: 0 0 20px 0;*/
	padding: 0 0 0 0;
}

.contentpage .col .box .header-after{
	padding: 20px;
}

.contentpage .col .box.col-box{
	width: 100%;
	margin: 0;
}	

.contentpage .col .box .box-title{
	margin: 0 0 10px 0;
}

.contentpage .col .box .img-section{
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 320px;
	margin: 0 0 20px 0;
}

.contentpage .col .box .img-section img{
	object-fit: cover;
	height: 100%;
	width: 100%;
}


.contentpage .col .box a{
	text-decoration: none;
}

.contentpage .col .box .more{
	font-size: 15px;
	color: #024d9a;
	text-decoration: none;
}

.contentpage .col .box .col-box-title{
	margin: 0 0 15px 0;
	font-weight: normal;
}

.contentpage .col .box .col-box-swiper{
	overflow: hidden;
	width: 100%;
	position: relative;
}

.contentpage .col .box .col-box-swiper .swiper-slide{
	width: auto;
/*	height: 60px;*/
	height: auto;
}

.contentpage .col .box .col-box-swiper .swiper-slide img{
	width: auto;
	height: 60px;
}

.contentpage .col .box .col-box-swiper .swiper-slide img.icon{
	height: 40px;
}

@media screen and (min-width: 480px) {
	.contentpage .col .box .col-box-swiper .swiper-slide img.icon{
		height: 60px;
		padding-right: 20px;
	}
	
}

.contentpage .col .box .header-img-section{
	position: relative;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	max-height: 200px;
}

.contentpage .col .box .header-img-section.inline{
	height: 180px;
}

.contentpage .col .box .header-img-section img{
	object-fit: cover;
	height: 100%;
	width: 100%;
}

.contentpage .col .box .text-description{
	font-size: 15px;
	color: #1d1c1c;
	text-decoration: none;
}

.contentpage .col .box .square-tiles{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.contentpage .col .box .square-tiles .tile{
	width: calc((100% - 20px)/2);
	margin: 0 0 20px 0;
}

.contentpage .col .box .square-tiles .tile .img-wrapper{
	width: 100%;
	padding-top: 100%; /* 1:1 Aspect Ratio */
	position: relative;
}

.contentpage .col .box .square-tiles .tile .img-wrapper img{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.contentpage .col .box .square-tiles .tile .tile-description{
	display: block;
	margin-top: 5px;
	font-size: 15px;
	color: var(--blue-color);
	color: #1d1c1c;
	text-decoration: none;
}

#magnifying-glass-preview{
	overflow: hidden;
	position: relative;
}

.checkout{
	max-width: 650px;
	width: var(--site-width);
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
	margin-top: 60px;
}

.checkout .checkout-progress{
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 25px 20px 23px 20px;
	background-color: var(--box-color);
}

.checkout .checkout-progress::after { 
   content: " ";
   display: block; 
   height: 0; 
   clear: both;
}

.checkout .checkout-progress ul { 
	display: flex;
	justify-content: center;
	margin: 0;
	padding: 0;
}

.checkout .checkout-progress li {
	list-style-type: none;
	width: 100%;
	float: left;
	position: relative;
	text-align: center;
}

.checkout .checkout-progress li div {
	width: 60px;
	height: 60px;
	
	border-radius: 50%;
	border: 2px solid #979797;
	background-color: var(--box-color);
	position: relative;
	
	font-size: 20px;
	
	display: flex;
	justify-content: center;
	align-items: center;
	
	margin: 0 auto 10px auto;
	
	color: #979797;
}

.checkout .checkout-progress li span {
	font-size: 15px;
	text-align: center;
	color: #979797;
}

.checkout .checkout-progress li:after {
	   width: calc(100% - 60px - 0px);
    height: 2px;
    content: '';
    position: absolute;
    background-color: #979797;
    top: 30px;
    left: -50%;
    margin: 0 30px;

}

.checkout .checkout-progress li:first-child:after {
	content: none;
}

.checkout .checkout-progress li.active {
	color: green;
}

.checkout .checkout-progress li.active div,
.checkout .checkout-progress li.active span{
	border-color: var(--green-color);
	color: var(--green-color);
}

.checkout .checkout-progress li.active:after{
	background-color: var(--green-color);
}


/*
.checkout .checkout-progress li.active + li:after {
	background-color: var(--green-color);
}
*/


.checkout .checkout-content {
	margin-top: 25px;
	max-width: 100%;
	padding: 25px 26px !important;
	box-sizing: border-box;
	margin-bottom: 20px;
	background-color: var(--box-color);
}


.checkout .checkout-content h1{
	margin: 0 0 20px 0;
	font-weight: 400;
	font-size: 28px;
	line-height: 1.2;
}

.checkout .checkout-section{
	width: 100%;
	border-top: 1.0px solid #d8d8d8;
	padding: 15px 0;
	
	display: flex;
	align-items: center;
	cursor: pointer;
	justify-content: space-between;
}

.checkout .checkout-section:last-of-type{
	border-bottom: 1.0px solid #d8d8d8;
}

.checkout .checkout-section input[type="radio"]{
	width: 20px;
	height: 20px;
	transition: 0.2s;
}

.checkout .checkout-section span{
	display: flex;
	align-items: center;
}

.checkout .checkout-section! input[type="radio"]:checked {
	background-color: grey;
}

.checkout .checkout-section .checkout-method{
	margin-left: 20px;
	color: var(--text-color-grey)!important;
}

.checkout .checkout-section .method-icons{
	display: flex;
	align-items: center;
}

.checkout .method-icon-box{
	height: 37px;
	width: 55px;
	border: 1.5px solid #c9c9c9;
	border-radius: 4px;
	margin-left: 10px;
	padding: 5px;
	box-sizing: border-box;
	display: flex;
}

.checkout .method-icon-box img{
	object-fit: contain;
	max-height: 100%;
	max-width: 100%;
	object-position: center center;
	margin-left: auto;
	margin-right: auto;
}

.paypal-powered-by{
	display: none !important;
}


.list-icon {
	font-size: 95%;
	min-width: 1.25em;;
	display: inline-block;
	text-align: center;
	margin-left: -2.5px;
	padding-right: 0.5em;
	color: var(--icon-color);
	box-sizing: content-box;
}

.status-icon {
	font-size: 95%;
	min-width: 1.25em;;
	display: inline-block;
	text-align: center;
	margin-left: -2.5px;
/*	padding-right: 8px;*/
	padding-right: 0.25em;
/*	color: var(--icon-color);*/
}


.bold{
	font-weight: 600;
}

.underlined{
	text-decoration: underline;
}

/*
.status-icon.green,
.green .status-icon,
*/
.green {
	color: var(--green-color) !important;
}

/*
.status-icon.orange,
.orange .status-icon,
*/
.orange {
	color:var(--orange-color) !important;
}

/*
.status-icon.red,
.red .status-icon,
*/
.red {
	color: var(--red-color) !important;
}

/*
.status-icon.blue,
.blue .status-icon,
*/
.blue {
	color: var(--blue-color) !important;
}

/*
.status-icon.grey,
.grey .status-icon,
*/
.grey {
	color: var(--grey-color) !important;
}

/*
.status-icon.white,
.white .status-icon,
*/
.white {
	color: #ffffff !important;
}

.pointer {
	cursor: pointer!important;
}

.cursor-move {
	cursor: move!important;
}

.highlight {
	color: var(--main-color)!important;
	
}

.big-icon{
	width: 50px;
	height: 50px;
	border-radius: 8px;
	font-size: 22px;
	display: grid!important;
	place-items: center;
	text-align: center;
}

.hidden{
	display: none;
}

/*=============================================*/

.ncf-container {
	font-size: 14px;
	box-sizing: border-box;
	position: fixed;
	z-index: 999999
}

.ncf-container.nfc-top-left {
	top: 12px;
	left: 12px
}

.ncf-container.nfc-top-right {
	top: 12px;
	right: 12px
}

.ncf-container.nfc-bottom-right {
	bottom: 12px;
	right: 12px
}

.ncf-container.nfc-bottom-left {
	bottom: 12px;
	left: 12px
}

@media (max-width:767px) {
	.ncf-container {
		left: 0;
		right: 0
	}
}

.ncf-container .ncf {
	background-color: var(--box-color);
	transition: .3s ease;
	position: relative;
	pointer-events: auto;
	overflow: hidden;

	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
		
	border-radius: 5px;
	box-shadow: var(--shadow-elevation-4);
	position: relative;
	
	padding: 15px 19px 15px 74px;
	min-height: 40px;
	
	flex-direction: column;
	align-content: center;
	
	width: calc(100%);
	box-sizing: border-box;
	margin: 0;
	
	display: none;
}

/*Show only one notification per time*/
.ncf-container .ncf:last-of-type {
	display: flex;
}

@media screen and (min-width: 868px) {
	.ncf-container .ncf {
		width: 350px;
		margin: 0 0 10px 0;
		display: flex;
	}
}

.ncf-container .ncf:hover {
	cursor: pointer
}

.ncf-container .ncf .ncf-title {
	font-weight: 700;
	font-size: 16px;
	text-align: left;
	margin-top: 0;
	margin-bottom: 2px;
	word-wrap: break-word
}

.ncf-container .ncf .nfc-message {
	margin: 0;
	text-align: left;
	word-wrap: break-word
}

.ncf-container .success::after,
.ncf-container .error::after,
.ncf-container .info::after,
.ncf-container .warning::after 
{
	position: absolute;
	left: 17px;
	top: 0px;

	width: 40px;
	
	display: grid;
	place-items: center start;
	
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	min-height: 100%;
}

.ncf-container .success::after {
	content: "";
	background-image: url(../img/graphic/success-icon.svg);
}

.ncf-container .error::after,
.ncf-container .warning::after {
	content: "";
	background-image: url(../img/graphic/error-icon.svg);
}

.ncf-container button {
	position: relative;
	right: -.3em;
	top: -.3em;
	float: right;
	font-weight: 700;
	color: #fff;
	text-shadow: 0 1px 0 #fff;
	opacity: .8;
	line-height: 1;
	font-size: 16px;
	padding: 0;
	cursor: pointer;
	background: transparent;
	border: 0
}

.ncf-container button:hover {
	opacity: 1
}

.line-clamp-1{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	word-break: break-all;
}

.line-clamp-2{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.line-clamp-3{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.line-clamp-4{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
}


/*==============================================*/
/*			PRODUCT PREVIEW LAYOUT				*/
/*==============================================*/

.product-tile-wrapper{
	display: grid;
	width: 100%;
	grid-template-columns: 1fr 1fr; 
	grid-gap: 25px 20px;
	grid-template-rows: auto; 

	margin-bottom: 5px;
	align-items: start;
}
/*

.product-tile-wrapper.corporate{
	padding-top: 20px;
}
*/

@media screen and (min-width: 480px) {
	.product-tile-wrapper{
		grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); 
		grid-gap: 30px 30px;
	}
}

@media screen and (min-width: 868px) {
	.product-tile-wrapper{
/*		grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); */
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); 
		grid-gap: 30px 30px;
	}
}

/*
@media screen and (min-width: 868px) {
	.product-tile-wrapper.corporate{
		grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); 
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); 
		grid-gap: 25px 35px;
	}
}
*/

.product-preview{
/*	box-shadow: var(--shadow-elevation-3);*/
	box-shadow: var(--shadow-box);
	width: 100%;
	box-sizing: border-box;

	border-radius: 11px;
	background-color: var(--box-color);
	padding: 7px;

	position: relative;
	overflow: hidden;
/*	background-color: var(--color-yellow-pastel);*/
}

.product-preview .image-wrapper{
	border-radius: 5px;
	overflow: hidden;
}

.product-preview .image-wrapper img{
	width: 100%;
	transition: 0.3s;
}

.product-preview:hover .image-wrapper img{
/*				transform: scale(1.05);*/
}

.product-preview .like{
	position: absolute;
	top: 15px;
	right: 15px;
}

.product-preview .like i{
	width: 35px;
	height: 35px;
	padding: 8px;

	background-color: #ffffff;

	display: grid !important;
	place-items: center;
	text-align: center;
	box-shadow: var(--shadow-elevation-1);
	background-color: var(--table-link-hover-background-color);
	transition: 0.3s;
	border-radius: 7px;

	transform: scale(0.9);
	opacity: 0;
}

.product-preview:hover .like i{
	transform: scale(1);
	opacity: 1;
}
/*

.product-preview .like i{
	background-color: #ffffff;

	display: grid !important;
	place-items: center;
	text-align: center;
	box-shadow: var(--shadow-elevation-1);
	background-color: var(--table-link-hover-background-color);
	transition: 0.3s;
	border-radius: 7px;

	transform: scale(0.9);
}
*/




.product-preview .content-box{
	padding: 10px 4px 2px 4px;
	line-height: 1.5;
	position: relative;
}


.product-preview .content-box .title{

	font-size: 98%;
	font-weight: 600;
}

.product-preview .content-box .vendor,
.product-preview .content-box .price{

	font-size: 90%;
/*	color: var(--text-color-grey);*/
	color: var(--green-color);

}

/*
.product-preview .content-box .add-to-cart{
	min-width: inherit;
	position: absolute;
	top: 0px;
	right: 0;
	padding: 8px 16px;
}

.product-preview .content-box .view{
	min-width: inherit;
	position: absolute;
	top: 14px;
	right: 0;
	padding: 8px 16px;
	color: var(--text-color-grey);
}
*/

.product-preview .content-box .vendor{
	font-size: 80%;
	margin-bottom: 1px;
	color: var(--text-color-grey) !important;
}



/*==============================================*/
/*					CART LAYOUT					*/
/*==============================================*/


.grid-areas{
	display: grid;
	grid-template-columns: 1fr;
}

@media screen and (min-width: 1000px) {
	.grid-areas{
		grid-template-columns: 1fr 350px;
		grid-gap: 50px;
	}
}

.cart-content{

}

.cart-content .cart-company-area{
	margin-top: 10px;
	box-shadow: var(--shadow-box);
	border-radius: 10px;
}

.cart-content .cart-company-area:not(:first-of-type){

}

.cart-content .cart-company-area .cart-company-profile{
	position: relative;
	display: flex;

/*	background-color: rgba(206, 206, 206, 0.15);*/
	padding: 12px;
/*	border-radius: 10px;*/

	margin-bottom: 15px;
	border-bottom: 1.0px solid rgba(34, 34, 34, 0.10);
	
	border-radius: 10px 10px 0 0;
/*	box-shadow: var(--shadow-box);*/
}

.cart-content .cart-company-area .cart-company-profile img{
	width: 80px;
	height: 80px;
	border-radius: 100%;
	display: block;

	margin-right: 20px;
	object-fit: cover;
}

.cart-content .cart-company-area .cart-company-profile .company-name{
	display: block;
	font-weight: 600;
	font-size: 20px;
}

.cart-content .cart-company-area .cart-company-profile .rating-stars{
	display: block;
	color: var(--main-color);
	font-size: 95%;
	line-height: 1;
	margin-top: 5px;
}

.cart-content .cart-company-area .cart-company-profile .legal{
	display: block;
	padding-top: 8px;
/*	text-decoration: underline;*/
}

.cart-content .cart-company-area .cart-company-products{

}

.cart-content .cart-company-area .cart-company-products .cart-variant{
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: auto;
	grid-gap: 20px;
/*	background-color: var(--box-color);*/


	padding-bottom: 10px;
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 15px;
	
	margin-bottom: 10px;

	max-height: 300px;
	overflow: hidden;
	box-sizing: border-box;
	
	border-radius: 10px;
	
/*	background-color: rgba(206, 206, 206, 0.10);*/
/*	border: 1.0px solid rgba(34, 34, 34, 0.05);*/

}

.cart-content .cart-company-area .cart-company-products .cart-variant:not(:last-of-type){
/*	border-bottom: 1.0px solid rgba(34, 34, 34, 0.15);*/
}

.cart-content .cart-company-area .cart-company-products .cart-variant .image-wrapper{
	display: block;
	height: 110px;
	width: 110px;
	object-fit: cover;

	border-radius: 7px;
	overflow: hidden;
	position: relative;

	border: 1px solid #ebebeb;
}

@media screen and (min-width: 450px) {
	.cart-content .cart-company-area .cart-company-products .cart-variant .image-wrapper{
		height: 140px;
		width: 140px;
	}
}

.cart-content .cart-company-area .cart-company-products .cart-variant .image-wrapper img{
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content{
	display: grid;
	grid-template-columns: 1fr;
	grid-gap: 10px;
}

@media screen and (min-width: 600px) {
	.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content{
		grid-template-columns: 1fr 120px;
		grid-gap: 20px;
	}
}

@media screen and (min-width: 1200px) {
	.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content{
		grid-template-columns: 1fr 1fr;
	}
}

.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .infos{
	max-width: 350px;
	width: 100%;
	min-width: 0;
}

.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .infos .vendor{
	color: var(--text-color-grey) !important;
	margin-top: 2px;
	font-size: 95%;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

@media screen and (min-width: 600px) {
	.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .infos .vendor{
		margin-top: 15px;
	}
}

.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .infos .title{
	font-weight: 600;
	margin-top: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/*
@media screen and (min-width: 600px) {
	.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .infos .title{
		-webkit-line-clamp: 2;
	}
}
*/

.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .infos .description{
	color: var(--text-color-grey) !important;
	margin-top: 5px;
	font-size: 95%;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .pricing{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
}

.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .quantity-selection{
	max-width: 90px;
	margin-bottom: 5px;
	text-align: left;
}

@media screen and (min-width: 600px) {
	.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .pricing{
		align-items: flex-end;
		flex-direction: column;
	}

	.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .quantity-selection{
		text-align: right;
	}
}


@media screen and (min-width: 1200px) {
	.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .pricing{
		flex-direction: row;
		align-items: flex-start;
		justify-content: flex-end;
		margin-right: 10px;
	}

	.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .quantity-selection{
		margin-right: calc(min(100vw, var(--site-width))*0.2 - 200px);
		text-align: left;
	}
}

.cart-content .cart-company-area .cart-company-products .cart-variant .cart-variant-content .price-sum{
	font-weight: 600;
	margin-top: 8px;
	width: 90px;
	text-align: right;

}

.cart-content .cart-company-area .cart-company-shipping{
	margin-bottom: 20px;
	padding-bottom: 10px;
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
}

.cart-content .cart-company-area .cart-company-shipping .shipping-variant{

	
	overflow: hidden;
	box-sizing: border-box;
	
	display: flex;
	flex-direction: row;
	justify-content: space-between;

}

.cart-content .cart-company-area .cart-company-shipping .shipping-variant.selection{
	
	max-width: 500px;
	border-radius: 6px;
	border: 1.0px solid #d6d6d6;
	background-color: rgba(0, 0, 0, 0.02);
	outline: none;
	color: var(--text-color);

	padding: 9.5px 42px 8.5px 9px;
	
	background-image: url(../img/select-arrow.svg);
	background-position: right;
	background-repeat: no-repeat;
	
	cursor: pointer;
	
	justify-content: flex-start;
}


.cart-content .cart-company-area .cart-company-shipping .shipping-variant .title{
	font-weight: 600;
}

.cart-content .cart-company-area .cart-company-shipping .shipping-variant .shipping_info{
	display: block;
	font-size: 95%;
	color: var(--text-color-grey);
}

.cart-content .cart-company-area .cart-company-shipping .shipping-variant .free_shipping_from{
	display: block;
}

@media screen and (min-width: 600px) {
	.cart-content .cart-company-area .cart-company-shipping .shipping-variant.selection .free_shipping_from{
		display: inline;
	}
}

.cart-content .cart-company-area .cart-company-shipping .shipping-variant .price{
	transition: color 0.2s;
	text-align: right;
	font-weight: 600;
}

.cart-content .cart-company-area .cart-company-shipping .shipping-variant.selection .price{
	font-weight: normal;
}

.cart-content .cart-company-area .cart-company-shipping .shipping-variant .price:not(.free){
	white-space: nowrap;
}

.cart-content .cart-company-area .cart-company-shipping .shipping-variant .price.free{
	color: var(--green-color);
	font-weight: 600;
}

.shippingpopup .wrapper{
	padding: 22px 18px 20px 18px;
	position: relative;
	height: calc(100%);
	overflow: auto;
	box-sizing: border-box;
}

.shippingpopup .wrapper .popup-title{
	margin: 0 0 15px 0;
	display: block;
	font-size: 17px;
	font-weight: 600;
}

.shippingpopup .wrapper .shipping-variant{
	margin: 20px 0 5px 0;
	
	display: grid;
	grid-template-columns: 20px 1fr 80px; 
	grid-template-rows: auto; 

	grid-gap: 0px 15px; 
	
	place-items: top start;
	cursor: pointer;
}

.shippingpopup .wrapper .shipping-variant .radio{
	display: grid;
	place-items: center;
}

.shippingpopup .wrapper .shipping-variant .details{
/*	padding: 8px 0 8px 0;*/
	width: 100%;
}

.shippingpopup .wrapper .shipping-variant .details .title{
	font-weight: 600;
}

.shippingpopup .wrapper .shipping-variant .details .shipping_info{
	display: block;
	font-size: 95%;
	color: var(--text-color-grey);
}

.shippingpopup .wrapper .shipping-variant .price{
	text-align: right;
	float: right;
}

.shippingpopup .wrapper .shipping-variant .price.free{
	font-weight: 600;
	color: var(--green-color);
}


.cart-checkout-preview{
	border-radius: 8px;
	width: 100%;
	height: auto;
	overflow: hidden;
/*	background-color: rgba(206, 206, 206, 0.15);*/
	border: 1.0px solid rgba(34, 34, 34, 0.15);
	margin-top: 8px;
	border-radius: 10px;
	
	background-color: rgba(255, 255, 255, 0.15);
	box-shadow: var(--shadow-box);
}

.cart-checkout-preview .cartcontent-wrapper{
	padding: 10px 20px 15px 20px;
}

.cart-checkout-preview .cartcontent-wrapper .line{
	display: flex;
	justify-content: space-between;
	padding: 3px 0;
}

.cart-checkout-preview .cartcontent-wrapper .line.final{
	border-top: 1px solid rgba(34, 34, 34, 0.15);
	display: flex;
	justify-content: space-between;
	margin-top: 5px;
	padding-top: 10px;
}

.cart-checkout-preview .cartcontent-wrapper .button{
	width: 100%;
}

.infobox{
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 10px;
	background-color: var(--color-green-pastel);
	border-radius: 6px;
	border: 1px solid var(--color-green-highlight);
	margin-bottom: 20px;
	color: var(--color-green-highlight);
}

.infobox.infobox-no-margin{
	margin-bottom: 0px;
}

.infobox.orange{
	background-color: var(--color-orange-pastel);
	color: var(--color-orange-highlight);
	border: 1px solid var(--color-orange-highlight);
}

.infobox.blue{
	background-color: var(--color-blue-pastel);
	color: var(--color-blue-highlight)!important;
	border: 1px solid var(--color-blue-highlight);
}

.infobox.red{
	background-color: var(--color-red-pastel);
	color: var(--color-red-highlight);
	border: 1px solid var(--color-red-highlight);
}

.errorbox{
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 10px;
	background-color: var(--color-red-pastel);
	border-radius: 6px;
	border: 1px solid var(--color-red-highlight);
	margin-bottom: 20px;
	color: var(--color-red-highlight);
}


.hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.hide-scrollbar{
	scrollbar-width: none;
	-ms-overflow-style: none;
}