﻿
@font-face {
	font-family: font1;
	src: url(OpenSans-Regular.ttf) format('truetype');
}

@font-face {
	font-family: font2;
	src: url(OpenSans-Bold.ttf) format('truetype');
}

@font-face {
	font-family: font3;
	src: url(OpenSans-Regular.ttf) format('truetype');
}

@font-face {
	font-family: font4;
	src: url(OpenSans-Regular.ttf) format('truetype');
}

@font-face {
	font-family: font5;
	src: url(OpenSans-Regular.ttf) format('truetype');
}


:root {
	--colorpicker1: rgba(0, 142, 95, 1) !important;
	--colorpicker2: rgba(0, 0, 0, 1) !important;
	--colorpicker3: rgba(167, 0, 0, 1) !important;
}

.tuermasse .ueberschrift span {
	color: var(--colorpicker1);
}

.changePriceArt {
	display: none;
}

body {
	font-family: font1;
}

span, a, input, b,
#tool .FeatureHelp span,
#Zusammenfassung .red .row1 span,
#Zusammenfassung .einruecken td.row1 span {
	color: var(--colorpicker2);
}

.button span {
	background-color: #FFF;
	padding: 0.5em 1em;
	transition: all 0.4s ease;
	cursor: pointer;
	color: #000;
	border: 1px solid #000;
	border-radius: .8em;
	font-weight: 600;
}

.button span:hover {
	background-color: var(--colorpicker1);
	color: #FFF;
	border-color: var(--colorpicker1);
}

#navi .menuitem span {
	text-transform: capitalize;
}

.tabText {
	font-family: font4;
}

.ModellbezeichnungUpload span, .Modellbezeichnung span {
	font-family: font4;
	color: var(--colorpicker1);
}

.file-upload,
#UploaderDiv .button,
.upl_btnMain .button {
	background: var(--colorpicker1);
}

#mfPrice .summe {
	font-weight: normal;
	font-family: font4;
	margin-left: 1.5em;
	align-self: center;
}

#mfBannerContent {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

#mfLogo {
	background-image: url(logo.png);
	background-repeat: no-repeat;
	width: 32em;
	height: 10em;
	background-size: contain;
}

#mfMenu {
	position: absolute;
	top: 13em;
	background: transparent;
	border-bottom: 1px solid var(--colorpicker1);
	height: 4em;
	width: calc(100% - 6em);
}

#navi .menuitemact, #navi .menuitem:hover {
	background: var(--colorpicker1);
}

#navi .menuitem span {
	color: #000;
}

.tabClass.tabClass {
	border-bottom: 4px solid transparent;
}

.tabClass.tabClassActive, .tabClass:hover {
}

.tabClass span {
	padding-bottom: -0em;
}

#navi .menuitemact span,
#navi .menuitem:hover span {
	color: #FFF;
}

#navi ul li div a {
}

#navi .menuitemact:after {
	display: none;
}

.tabClassActive span a {
	color: var(--colorpicker1);
}

.shapeMeasuretble input.measure {
	border-color: var(--colorpicker2);
	border-radius: .8em;
	height: calc(2.2em);
	margin: 0 0.5em;
	background: #fff;
	border: 1px solid #000;
}

#mfStepper {
	height: 4em;
}

#mfStepper ul {
	border: 1px solid var(--colorpicker1);
	border-radius: .8em;
	height: 3.8em;
}

.ContentHandle .symbutton .Description {
	margin: -3px 0px 0px 0px;
}

#mfPrice span {
	color: #FFF;
	white-space: nowrap;
}

#mfPrice .PriceDiv span {
	color: #000 !important;
	white-space: nowrap;
}

#mfPrice .TextSummeWarenkorb {
	font-family: font4;
	display: none;
}

.warenkorbTexte {
	display: flex;
	flex-direction: column;
	justify-content: center;
	order:0;
}

#mfPrice .summe {
	font-size: 3em !important;
}

#mfPrice .summe,
#mfPrice .summeText,
#mfPrice .TextVersand {
	font-size: 1.3em;
	color: #FFF;
}

#mfPrice .PriceDiv {
	height: auto;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 0 2em;
	margin-right: 2em;
	background-color: #FFF;
	border: 1px solid var(--colorpicker1);
	border-radius: .8em;
}

.file-upload {
	border: 1px solid var(--colorpicker1);
}

.file-upload:hover {
	background-color: var(--colorpicker1);
}

.divbutton .button span {
    border: none; 
    font-weight: normal; 
	color: #FFF;
}

.RALColorDiv, .symbuttonContent.Contentcolor #symbuttoninnercontent img {
	width: 100%;
	height: 12em;
	margin: 0;
}

#mfPrice {
	top: 2em;
	right: 3em;
	height: 5em !important;
	width: 61em;
	display: flex;
	justify-content: flex-end;
}

#mfSection, #mfOptions {
	top: 20em;
	height: calc(100% - 21.5em);
	border:none;
}

.ModellbezeichnungUpload, .Modellbezeichnung {
	top: 2em;
	border: 1px solid var(--colorpicker1);
	background: #FFF;
	border-radius: .8em;
}

#tool .btnWarenkorb .iconDiv {
	background-color: var(--colorpicker1);
}

.btnWarenkorb {
	display: none;
}

.ContentHandle .symbutton {
	border: none;
}

.symbutton .Description {
	margin-top: -3px;
	border-radius: 0 0 0.8em 0.8em;
}

.warenkorbBtn {
	position: relative;
	background: var(--colorpicker1);
	display: flex;
	right: 0;
	padding: 1.3em 1em 1.3em 4em;
	bottom: 0em;
	cursor: pointer;
	border: 1px solid var(--colorpicker1);
	transition: all .2s ease 0s;
	border-radius: 0.8em;
}

.warenkorbBtn span {
	font-family: font4;
	color: #FFF;
	text-transform: uppercase;
}

.warenkorbBtn:hover {
	background: #FFF;
}

.warenkorbBtn:hover span {
	color: var(--colorpicker1) !important;
}

.warenkorbBtn path {
	fill: #FFF;
}

.warenkorbBtn:hover path {
	fill: var(--colorpicker1);
}

#warenkorb_svg {
	left: 1em;
	position: absolute;
	z-index: 12231;
	width: 2.5em;
	height: 2.5em;
}

#mfLanguage {
	display: none !important;
}

#mfToolbar.shop {
	top: 11.8em;
	max-width: max-content;
}

#mfToolbar.shop #tool .FeatureHelp {
	border-bottom: none;
}

#mfToolbar.shop #tool .liContentDiv a:hover {
	transform: none;
}

#mfToolbar.shop #tool {
	right: 0.6em;
}

#showMass {
	right: 3em;
}

.ContentHandle .symbutton:hover, .ContentHandle .symbutton.act {
	border: none;
	background-color: transparent;
	transition: all 0.5s ease;
}

#mfToolbar.shop #tool .iconDiv {
	display: none
}

#mfToolbar.shop #tool .FeatureHelp span {
	transition: all 0.4s ease;
	padding: 0.5em 1em;
}

#mfToolbar.shop #tool .FeatureHelp:hover span {
	background: var(--colorpicker1);
	color: #FFF;
}

#mfTop {
	border-top: 5px solid var(--colorpicker1);
	margin-top: 0.5em;
}

@media screen and (max-width: 1024px) and (orientation: portrait) {
	.warenkorbBtn {
		display: none;
	}

	.btnWarenkorb {
		display: block;
	}

	#mfSection, #mfOptions {
		top: calc((100% / 3) + 10em);
		width: 100%;
		height: calc(((100% / 3)* 2) - 10em);
	}

	#mfMenu {
		top: 0em;
		background: #FFF;
		margin-left: 0;
		width: 100%;
	}

	#mfLogo {
		width: 22.4em;
		height: 3.3em;
		background-size: contain;
		margin-left: 0em;
	}

	#mfTop, #mfMenu {
		height: 4em;
	}

	#mfTop {
		border-top: none;
		margin-top: 0em;
	}

	#mfBannerContent {
		position: absolute;
		left: 6em;
		margin-right: 1em;
		justify-content: flex-start;
	}

	#mfPrice .PriceDiv {
		height: 3em;
		top: 0.5em;
	}

	#mfPrice .summe {
		line-height: 0.8em;
	}

	#tool {
		right: calc(-100% + 4.6em);
	}

	#tool .liContentDiv a {
		border: none;
	}

	#mfPrice {
		background-color: transparent;
		height: 12em;
		position: absolute;
		right: 0;
		top: 0em;
		width: 20em;
		z-index: 5;
		display: table;
		text-align: right;
		left: auto;
	}

	#mfPrice .summeText,
	#mfPrice .TextVersand {
		font-size: 1em !important;
	}

	#mfPrice span, #mfPrice .PriceDiv span {
		color: var(--colorpicker1) !important;
	}

	#mfPrice .PriceDiv {
		background: transparent
	}

	#mfPrice .PriceDiv {
		flex-wrap: nowrap;
	}

	span.TextVersand {
		text-wrap-mode: nowrap;
	}

	#mfPrice .PriceDiv {
		padding: 0px;
	}

	span.TextVersand {
		line-height: 6px;
	}

	span.TextSummeWarenkorb {
		line-height: 7px;
	}

	#mfPrice .summe {
		margin-left: 0.5em;
	}

	#tool .iconDiv {
		display: flex
	}
}
