/* basic styles ------------------------------------------------------------ */
.inactive		{ color: #CCCCCC; }       /* inactive text link */
.active			{ color: #666666; }
input:disabled, input:disabled+a { 
	color: #CCCCCC;
}

/* start page -------------------------------------------------------------- */
.mfSclsSlct {box-shadow: none;}
.mfSclsSlct span  { font-family: Arial, MS Sans Serif; color: #FFFFFF;
	background-image: url(DefaultKreisWeis.png); background-repeat:no-repeat; background-position: left center;
}
.mfSclsSlctArrow { width: 18px; height:35px; }
.mfSclsSlctArrow1 { background-image: none; }
.mfSclsSlctArrow2 { background-image: none; }
.mfSclsSlctArrow3 { background-image: none; }
.mfSclsSlctArrow4 { background-image: none; }

.mfSclsSlct1 { background-color: #C2C2C2; }
.mfSclsSlct2 { background-color: #C2C2C2; }
.mfSclsSlct3 { background-color: #C2C2C2; }
.mfSclsSlct4 { background-color: #C2C2C2; }

.mfSclsSlct	 { padding: 33px 0 0 15px; }

#mfGroupSlct { left:-15px; }

/* mainFrame --------------------------------------------------------------- */
.mfGroupSlctLine:hover { background-image: none; background-repeat:no-repeat; background-position: top right; }
#mfSlogan	{ display:none; }

#DisplayView a{ color:#666666; font-size:15px; }
#DisplayView:hover{ cursor:pointer; }

.SectionHeader, .SectionSubHeader {font-weight:bold;}
#mfDisplay  { border:0.2em solid #CCCCCC; }

/* Toolbar -------------------------------------------------------------------- */
.ContentArea {z-index:1!important;}

/* Elemente aus TabDialog -------------------------------------------------- */
.slideActive a { color:#205F50; }
.slideInActive { background-color:#CCCCCC; background-image: url(punkt.png); background-position: left center; background-repeat: no-repeat; color:#FFFFFF; }
.slideInActive a{ color:#FFFFFF; }

.ui-corner-bottom, .ui-corner-all{ border-radius:0px; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, .ui-state-default{ border:none; }
.ui-accordion .ui-accordion-header a{ font-size:18px; height: 30px; padding: 0 0 0 30px; line-height: 1.7; }
.ui-widget-content{ background-image:none; background-color:transparent; }
.ui-state-default .ui-icon{ background-image: url(punkt.png); background-position: center center; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, .ui-state-default a:hover{ background-color:#CCCCCC; color:#FFFFFF; }

.ui-state-active .ui-icon { background-image: url(punkt_act.png); background-position: center center; }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited, .ui-state-active a:hover{ background-color:transparent; color:#006050; }

/* Dynlayer ---------------------------------------------------------------- */
/*.DynLayer   { box-shadow: none; border: 1px solid #DCDCDC !important; border-top: 20px solid #014283; background-color: #FFFFFF; }
.DynLayerHeader div.caption{ background-color:#8EAA3D; }

#DynLayer98div { height:auto!important; width:auto!important; }
#DynLayer98divContent { float: left; height: 100%; position: relative; width: 100%; margin:0; }

.closeDiv { border-bottom: 0.2em solid #95B049; border-left: 0.2em solid #95B049; position: absolute; right: 0px; top: 0px; }
.closeDiv a { margin: 0 5px;}
.handleImgDiv { height: 7px; }
.handleImgDiv img { float: left; margin-left: 10px; margin-top: 10px; margin-bottom:10px; max-height: 260px; position: relative; text-align: center; }
#handleNameSpan { float: left; padding-left: 25px; position: relative; text-align: left; margin:0;}
.handleContDiv { float: left; height: auto; margin:0; margin-top: 30px; padding-left: 25px; position: relative; text-align: left; width: auto; }
.handleContDiv input { margin: 10px 0 0; }
.htitle{ font-weight:bold; }*/

/* Tabs ------------------------------------------------------------- */
#GlaskunsText { float: left; font-weight: bold; width: 100%; }
.measuretbl.Design { position: absolute; top: 0; width: 100%; }

/* auswahl -------------------------------------------------------*/
div.symbutton.color,
div.symbutton.program,
div.symbutton.intern,
div.symbutton.glas,
div.symbutton.shape,
div.symbutton.handle,
div.symbutton.dekor{ width:102px!important; height:140px!important; background-color:#FFFFFF; box-shadow: 0 0 10px #747272; border-radius: 5px; }

div.symbutton.color,
div.symbutton.glas{ width:85px!important; height:70px!important; }

div.symbutton.glas div,
div.symbutton.handle div,
div.symbutton.intern div,
div.symbutton.dekor div,
div.symbutton.color div{ display:none; }

div.color img,
div.handle img,
div.intern img,
div.glas img,
div.dekor img{ height:100%; border-radius:5px; }

div.intern img,
div.handle img,
div.program img{ height:125px; margin-top: 8px; }

div.intern img,
div.handle img,
div.glas img,
div.color img { width:100%;  }

div.intern,
div.handle,
div.glas,
div.color { margin: 15px 20px 0 0; }

/* Überschriften ----------------------------------------------------- */
.handleSpan{font-weight:bold;}

/* Protect & Comfort in Standardausführung ----------------------------------------------------------- */
.Standardausführung{width:485px;}
.StandardausführungDiv{ padding-left:4px; }
.StandardausführungImg{ height:228px; width:320px; background-image:url(standardausstattung.png); background-repeat:no-repeat; background-size:100%; margin-top:10px; }
.Standardausführung p { font-size:15px; font-weight:bold; margin-bottom:0; }
#downloadlink		  { text-decoration:underline; }

/* NewTab ------------------------------------------------------------- */
.tabText{ display:block; }
#mfSubmenu  { background: none repeat scroll 0 0 #FFFFFF;
box-shadow: 0 2px 9px #666666; display: none; float: left; height: auto; left: 0; position: relative; top: -381px; width: 965px; z-index: 1001; min-height: 155px; }

#mfSubmenu span, #mfSubmenu a{ color:#9E9E9E; }

.mfSubmenu li		{ list-style: none; margin-bottom: 10px; }

.mfSubmenu ul		{ border-right: 1px solid #D5D5D5; height: auto; margin: 0; padding-left: 10px; padding-top: 10px; min-height: 155px; padding-right: 10px; }

.NewtabClassInActv  { border:none; color:#FFD62C; background-repeat:no-repeat; background-position:right top; margin-right: -26px; }

.NewtabClass,
.NewtabClassActive	{ background-color: transparent; cursor: pointer; padding-right: 20px; padding-left: 6px; width: auto; position:relative;
					  background-repeat:no-repeat; background-position:right top; margin-right: -21px;}


.NewtabClass:hover, .NewtabClassActive:hover	{ background-image:url(Menu/pfeil.jpg); background-repeat:no-repeat; background-position:right top; margin-right: -21px; }
.NewtabClassActive:hover{margin-right:-21px;}

li.NewtabClass a:hover, li.NewtabClassActive a:hover  { color:#FFD62C!important}

.NewTabContent		{ height: 100%; margin-left: 12px; overflow: auto; position: relative; width: 100%; }
 
#InfoImg			{ background-repeat: no-repeat; float: left; height: 145px; margin-left: 21px; position: relative; top: 10px; width: 225px; }
#InfoText			{ float: left; margin-left: 15px; margin-top: 10px; max-width: 540px; white-space: normal; }
#InfoText b			{ color: #000000; font-size: 16px; }

/* Menue ------------------------------------------------------------------- */
#navi {  }
.navigation li.menuitem    span a		{ color:#373332; font-size:2.1em; transition: all 0.3s ease-in-out 0s; background-color:transparent; }
.navigation li.menuitem    span a:hover	{ color:#FFFFFF; background-color: #423E3D; }

.navigation li.menuitemact span a		{ background-color: #423E3D; }
.navigation li.menuitemact span a,
.navigation li.menuitemact span a:hover	{ color:#FFFFFF; }

.navigation li.menuright				{ /*border-right:0.1em dashed #8EAA3D; height:4em;*/ display:none; }
.navigation li.menuright:last-child		{ border:none; }

.navigation li{  }
.navigation li.menuitem    span a, 
.navigation li.menuitemact span a,
.navigation li.menuitemvis span a { 
 padding: 0.7em 1em;
}

.navigation li.menuitemlst { display:none; }

.navigation li.menuitem5th .MenuImg:hover,
.navigation li.menuitem6th .MenuImg:hover,
.navigation li.menuitem7th .MenuImg:hover,
.navigation li.menuitem8th .MenuImg:hover {cursor:pointer;}

.navigation span.text { float:left; }
 

.navigation img.icon{ margin-left: -31px; margin-top: -3px; position: absolute; }

/* Popup Fenster ----------------------------------------------------------- */
/*#DynLayer100divContent { width:auto; height: auto; margin-top: 5px; } */

/* Buttons Preview & Next ----------------------------------------------------------- */

/* Tabsinhalt ----------------------------------------------------------- */
.SubContentDiv			   { margin: 1.5em 0 0 3em; height: calc(100% - 1.5em); }
.SubContentDiv span a:hover{ cursor:pointer; }
#PartList				   { overflow:auto; height: calc(100% - 1em); width: calc(100% - 1em); -webkit-overflow-scrolling: touch; }
#SubContentStuckliste      { display:none; }
.SubContentArea			   { height:calc(100% - 3em); font-size:1.5em; }

.SubContentDiv .tabText	span a			{ color:#AAAAAA; transition: all 0.3s ease-in-out 0s; }
.SubContentDiv .tabText span a.act		{ color:#3E3E3E; transition: all 0.3s ease-in-out 0s; }
.SubContentDiv .tabText	span a:hover	{ color:#3E3E3E; }

/* ------- Colorselection ------- */
.ColorselectionDiv		{ float:right; width:4.5em;  left: 28em; position: absolute;}
div.Colorselection		{ height:3em; width:3em; position:relative; margin: 0.5em 0 0.2em; border:0.2em solid #AAAAAA; }
div.Colorselection:hover,
div.Colorselection.act	{ border:0.2em solid #8EAA3D; }
div.Colorselection img	{ width:100%; height:100%; }
div.Colorselection span { display:none; }

/* ------- Colorselection Table ------- */
.TColorselectionDiv     { float:right; width:4.5em;  left: 28em; position: absolute; top: 25em;}
div.TColorselection 	{ height:3em; width:3em; position:relative; margin: 0.5em 0 0.2em; border:0.2em solid #AAAAAA; }
div.TColorselection:hover,
div.TColorselection.act	{ border:0.2em solid #8EAA3D; }
div.TColorselection img	{ width:100%; height:100%; }
div.TColorselection span { display:none; }

/* ------- Colorselection horizonal ------- */
.HColorselectionDiv		{ float:left; }
div.HColorselection		{ height:7em; width:7em; position:relative; margin: 1em; border:0.2em solid #AAAAAA; }
div.HColorselection:hover,
div.HColorselection.act	{ border:0.2em solid #8EAA3D; }
div.HColorselection img	{ width:100%; height:100%; }
div.HColorselection span { display:none; }

/* ---------- Wangen ------------ */
#WangenSelect		{ float:left; width: calc(100% - 4.5em); }
div.wange			{ height: 30em; padding-bottom: 1.5em; position: relative; width: 3.8em; margin: 0.5em 0 0.2em;}
div.wange img		{ width:100%; height:100%; }

div.wangeExt		{ height: 19.4em; padding-bottom: 1.5em; position: relative; width: 2.5em; margin: 0.5em 0 0.2em;}
div.wangeExt img	{ width:100%; height:100%; }

/* ---------- Schrank ----------- */
#SchrankColorSelect	{ float:right; width:5.5em; }
div.schrank			{ height:34em; width:8em; position:relative; margin: 0.5em 0.5em 0.2em; padding-bottom: 2em; }
div.schrank img		{ width:100%; height:100%; }
div.schrank span	{ display:block; }

/* ---------- Böden ------------- */
#BoedenSelect		{ float:left; width:calc(100% - 4.5em); }
#BoedenColorSelect	{ float:right; width:5.5em; }
div.boeden			{ height: 2em; margin: 0.5em 0.5em 0.2em; position: relative; width: 24em; }
div.boeden img		{ float: left; height:1.5em; padding-left:4em; padding-top: 0.2em; }
div.boeden span,
div.boeden br		{ clear: both; display: block; float: left; margin-top: -1.5em; }

div.boedenExt		{ height: 2em; padding-bottom: 1.5em; position: relative; width: 8em; margin: 3.5em 0 0.2em;}
div.boedenExt img	{ width:100%; height:100%; }

/* -------- TV-Module ----------- */
#TVmodulSelect		{ float:left; width:calc(100% - 4.8em); height: 100%; overflow:auto; -webkit-overflow-scrolling: touch;}

div.TVmodul img		{ width:100%; height:100%; }

/* ---------- Tisch ------------- */
#TischSelect		{ float:left; width:calc(100% - 4.5em); }
#TischColorSelect	{ float:right; width:5.5em; }
div.tisch			{ height: 2em; margin: 0.5em 0.5em 0.2em; position: relative; width: 24em; }
div.tisch img		{ float: left; height:1.5em; padding-left:4em; padding-top: 0.2em; }
div.tisch span,
div.tisch br		{ clear: both; display: block; float: left; margin-top: -1.5em; }

div.boedenExt		{ height: 2em; padding-bottom: 1.5em; position: relative; width: 8em; margin: 3.5em 0 0.2em;}
div.boedenExt img	{ width:100%; height:100%; }

/* ---------- mehr ------------- */
#MoreSelect		{ float:left; width:calc(100% - 4.5em); }

/* ---------- Schubkästen ------- */
#SchubladeSelect	{ float:left; width:calc(100% - 6.5em); }
div.Schublade		{ height:7em; margin: 0.5em 0.5em 0.2em; position: relative; width: 100%; }
div.Schublade img	{ float: left; height:6.5em; padding-left:4em; padding-top: 0.2em; }
div.Schublade span,
div.Schublade br	{ clear: both; display: block; float: left; margin-top: -3.5em; }

/* ---------- Drehtüren --------- */
#DrehtuerSelect		{ float:left; width:calc(100% - 5.5em); overflow: auto; height: 100%; }
div.Drehtuer		{ height:auto; margin: 0.5em 0.5em 0.2em; position: relative; width: 10em; border:1px solid transparent;}
div.Drehtuer:hover	{ border:1px solid #8EAA3D;}
div.Drehtuer img	{ float: left; width:100%; }
div.Drehtuer span,
div.Drehtuer br		{ clear: both; display: block; }

/* ---------- Einsätze ---------- */
#EinsaetzeSelect	{ float:left; width:calc(100% - 5.5em); overflow: auto; height: 100%; }
div.Einsaetze		{ height: auto; margin: 0.5em 1.5em 0.2em; padding: 1em 1em 1.5em; position: relative; width: auto; }
div.Einsaetze img	{ float: left; height:100%; }
div.Einsaetze span,
div.Einsaetze br	{ clear: both; display: block; }


/* ---------- Schiebetüren ------ */
#GlastuerSelect		{ float:left; width:calc(100% - 5.5em); height:100%; overflow:auto; }
div.Glastuer		{ height:auto; margin: 0.5em 0.5em 0.2em; position: relative; width: 10em; }
div.Glastuer img	{ float: left; width:100%; }
div.Glastuer span,
div.Glastuer br		{ clear: both; display: block; }

#HolztuerSelect		{ float:left; width:calc(100% - 5.5em); height:100%; overflow:auto; }
div.Holztuer		{ height:auto; margin: 0.5em 0.5em 0.2em; position: relative; width: 10em; }
div.Holztuer img	{ float: left; width:100%; }
div.Holztuer span,
div.Holztuer br		{ clear: both; display: block; }

/* ---------- Zubehör ----------- */
#KomodeSelect,
#LichtSelect		  { float:left; width:100%; }
#LichtSelect		  { margin-top:6em; }
#LichtSelect .tabText { float:left; margin-left:0.4em; }
#KomodeSelect		  {width:80%;}
div.Komode			  { height:auto; margin: 0.5em 0.5em 0.2em; position: relative; width: 10em; }
div.Komode img		  { float: left; width:100%; }
div.Komode span,
div.Komode br		  { clear: both; display: block; }

.dresser			  { position:absolute; right:1em; }

/* ----------- Ambiente ------------- */
#FussbodenDiv span{ margin-left: 0.15em; }
#WandfarbeDiv,
#FussbodenDiv	  { float: left; height: 28em; overflow: auto; width: calc(100% - 2em); margin-left:2em; }
#FussbodenDiv	  { height:30em; }
	
div.Wandfarbe,
div.Fussboden		{ width:8em; height:8em; }
div.Wandfarbe img,
div.Fussboden img	{ width:8em; height:8em; }

div.Wandfarbe span,
div.Wandfarbes br,
div.Fussboden span,
div.Fussboden br	{ display: none; }

/* ---------- slideLight ------------ */
.slideLightOnOff {
	width: 8em;
	height: 2.7em;
	background: #FFFFFF;
	margin-left:1em;
	top:1em;
	float:left;

	-webkit-border-radius: 5em;
	-moz-border-radius: 5em;
	border-radius: 5em;
	position: relative;

	-webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.5), 0 1px 0 rgba(255,255,255,0.2);
	-moz-box-shadow:	inset 0 0 1px rgba(0,0,0,0.5), 0 1px 0 rgba(255,255,255,0.2);
	box-shadow:			inset 0 0 1px rgba(0,0,0,0.5), 0 1px 0 rgba(255,255,255,0.2);
}

.slideLightOnOff:after {
	content: 'OFF';
	font: 1.2em/26px Arial, sans-serif;
	color: #3E3E3E;
	position: absolute;
	right: 1em;
	z-index: 0;
	font-weight: bold;
	text-shadow: 0px 1px 0px rgba(255,255,255,.15);
}

.slideLightOnOff:before {
	content: 'ON';
	font: 1.2em/26px Arial, sans-serif;
	color: #8EAA3D;
	position: absolute;
	left: 1em;
	z-index: 0;
	font-weight: bold;
}

.slideLightOnOff label {
	display: block;
	width: 3.4em;
	height: 2.1em;

	-webkit-border-radius: 5em;
	-moz-border-radius: 5em;
	border-radius: 5em;

	-webkit-transition: all .4s ease;
	-moz-transition:	all .4s ease;
	-o-transition:		all .4s ease;
	-ms-transition:		all .4s ease;
	transition:			all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 0.35em;
	left: 0.3em;
	z-index: 1;

	-webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.3);
	-moz-box-shadow:	0px 0px 1px 0px rgba(0,0,0,0.3);
	box-shadow:			0px 0px 1px 0px rgba(0,0,0,0.3);
	background:			#FFFFFF;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}

.slideLightOnOff input[type=checkbox]:checked + label {
	left: 4.3em;
}

#LichtSelect input[type="checkbox"] {
    visibility: hidden;
}

/* ---------- Abschluss --------- */
#StucklisteTitle span, #BereichTitle span{ color:#3e3e3e; }
.Stuecklistdiv{     height: 40em;    overflow: auto;    width: 73em; }
#ImageDiv  { width:calc(100% / 7 * 3); }
#Stuckliste{ width:calc(100% / 7 * 3); }
#BereichDiv{ width:calc(100% / 7 * 1); }

#BeispielBild	 { margin:3em; max-height: 90%; max-width: 90%; }
.TitleAbschluss  { padding-top:4em; padding-bottom: 2em; }

#StucklisteTabele{ font-size:1.6em; }
#StucklisteTabele{ border-top:0.15em dashed #8EAA3D; border-bottom:0.15em dashed #8EAA3D; width:98%; }
.tableColom		 { padding-bottom:0.5em; padding-top:0.5em; }
#ButtonArea		 {  width:90%; font-size:2em; padding-top: 2em;}

.finbtnAdd,
.finbtnPrint,
.finbtnSave		 { float:right; }
.finbtnAdd		 { float:left; }
.finbtnSave		 { margin-right: 1.5em; }
#btnNextWand	 { max-width: 12em; white-space: normal; margin-top:3em; font-size:2em; }

#BereichTabele{ border-top:0.15em dashed #8EAA3D; width:90%; font-size:1.6em;}

#ImageDiv, #Stuckliste, #BereichDiv{ float:left; height: calc(100% - 5em);}

.tblIndividuelesZubehoer {
	width:100%;
	font-size:1.5em;
}

#tblTdArtikelBez input,	
#tblTdArtikelAnz input,	
#tblTdArtikelPreis input	{ width:100%; }

.quickload{font-size: 1.5em;position: absolute; right: 2em; top: 6em;}
.quickloaderr{color: red;position: absolute; top: -3em;}
.quickloadBotton{padding: 0.1em 1.4em;}

.disableMenu{ pointer-events: none;cursor: default;opacity: 0.4;}

#DynLayer80div .DynLayerInnerContent { margin: 2em 2em; }