/* 
-----------------------------------------------------------------
Generell Setup
----------------------------------------------------------------- 
*/

* 
	{
    padding: 0; 
    margin: 0;}

body 
	{
	font: 11px Tahoma;
	background-color: #ffffff;
	}
	
	.TableDetails 
	{
	border: solid 1px #525252;
	border-collapse:collapse;
	}
.LabelCaption 
	{
	font-weight: bold;
	padding:3px;
	border-width: 0;
	color: #666666;
	background: #e1e1e1;
	border: solid 1px #c1c1c1;
	}
.TableHeader
	{
	background-position: 50% top;
	padding: 6px 3px;
	color: #ffffff;
	/*  background: #424242 url('../images/grd_head.png') repeat-x 50% top; */
	background: #424242 repeat-x 50% top;
	border-left: solid 1px #525252;
	font-weight: bold;
	}
.LabelText  
	{
	padding:3px;
    color: #717171;
	border-width: 0;
	background: #ffffff;
	border: solid 1px #c1c1c1;
	}
.LabelImage  
	{
	padding:3px;
	color: #717171;
    border-width: 0;
    background: #ffffff;
    border: solid 1px #c1c1c1;
	}
	
	
.LinkButton
	{
	padding:8px; 
	background: #006fb3;
	color: #ffffff;
	}
/* 
-----------------------------------------------------------------
Grid Views 
----------------------------------------------------------------- 
*/

.mGrid
	{
	margin: 0px 0 0px 0;
	border: solid 1px #525252;
	border-collapse: collapse;
	}
    .mGrid td 
		{ 
		padding: 1px 5px; 
		border: solid 1px #c1c1c1; 
		color: #616161; 
		line-height:24px; 
		}
    .mGrid a 
		{   
		padding: 3px;
		color: #ffffff; 
		} 
    .mGrid tr:hover 
		{
    	padding: 6px;
    	background: #99CCFF;
		}
    .mGrid th 
		{
		font-weight: bold;
		padding: 6px 3px;
		color: #ffffff; 
		/* background: #424242 url('../images/grd_head.png') repeat-x 50% top; */
		background: #424242 repeat-x 50% top; 
		border-left: solid 1px #525252; 
		border: solid 1px #c1c1c1; 
		 }
    .mGrid th:hover 
		{ 
		padding: 6px color: #00ccff;
		background: #99CCFF; 
		border: solid 1px #60CCFF; 
		}
	.mGrid .alt 
		{
		background: #E8E8E8
		}
		
	/* 
	-----------------------------------------------------------------
	Grid View Pager
	----------------------------------------------------------------- 
	*/
	.mGrid .pgr 
		{
		/* background: #424242 url('../images/grd_pgr.png') repeat-x 50% top; */
		background: #424242 repeat-x 50% top;
		}
		.mGrid .pgr table 
			{
			margin: 0px 0;
			}
		.mGrid .pgr td 
			{
			background: #424242;
			border-width: 0;
			padding: 0 3px;
			border-left: solid 1px #666666;
			font-weight: bold; color: #fff;
			line-height: 15px; 
			}   
		.mGrid .pgr td:hover 
			{
			background: #424242;
			border-width: 0; 
			padding: 0 3px;
			border-left: solid 1px #666666;
			font-weight: bold;
			color: #fff;
			line-height: 15px;
			}   
		.mGrid .pgr a 
			{
			font-weight: normal;
			color: #cccccc;
			text-decoration: none; }
		.mGrid .pgr a:hover 
			{
			font-weight: normal;
			color: #000000;
			text-decoration: none;
			 }

/* 
-----------------------------------------------------------------
User Login
----------------------------------------------------------------- 
*/

.LoginTextBox 
	{ 
	font-family: Arial, Tahoma, Verdana, Calibri;
	font-size: 11px;
	color: Black;
	height: auto;
	width: 120px
	}
.LoginLabel 
	{ 
	font-family: Arial, Tahoma, Verdana, Calibri;
	font-size: 11px;
	color: Black;
	height: auto;
	width: 120px
	}

/* 
-----------------------------------------------------------------
Article Search
----------------------------------------------------------------- 
*/
.psearchheader
	{
	background-position: 50% top;
	padding: 6px 3px;
	color: #ffffff;
	/* background: #424242 url('../images/grd_head.png') repeat-x 50% top; */
	background: #424242 repeat-x 50% top;
	border-left: solid 1px #525252;
	font-weight: bold;}
	
.psearcharea
	{
	border: solid 1px #c1c1c1;
	}

.psearchimage
	{
	width: 15px;
	height: 15px;}
	
/* 
-----------------------------------------------------------------
Order Process Panel above Product Configurator
----------------------------------------------------------------- 
*/
	
.PanelOrderProcess
	{
 	border: solid 1px LightSteelBlue;
 	display:block;
 	width: 580px;
 	left: 0%;
 	padding: 5px 5px 5px 5px
	}
	
/* 
-----------------------------------------------------------------
Product Configurator
----------------------------------------------------------------- 
*/
.ArticleConfiguratorHeader1 
	{
	font: 18px Verdana,Tahoma,Arial,Calibri;
	font-weight:bold;
	display:block;  
	color: #003A64;
	border: solid 0px #CCCCCC;
	top: 30px;  
	}

.ArticleConfiguratorHeader2 
	{
	top: 30px;  
	font: 12px Verdana,Tahoma,Arial,Calibri;
	font-weight:bold;
	color: #003A64;
	border: solid 0px #CCCCCC;
	}

.ConfiguratorTooltipImage  
	{
	padding: 0px 2px 4px 10px;
	}

.ConfiguratorLabelCaption  
	{
	font-weight:bold;
	font-size:11px;
	padding:3px;
	border-width: 0;
	color: #666666;
	background: #e1e1e1;
	border: solid 1px #c1c1c1;
	height:27px;
	vertical-align:middle
	}

.ConfiguratorLabelTextbox
	{
	font-size:14px;
	padding:2px;
	color:#000000;
	border-width: 0;
	background: #ffffff;
	border: solid 1px #c1c1c1;
	height:21px
	}
.ConfiguratorValidatorLabel
	{
	font: 12px Verdana,Tahoma,Arial;
	line-height:18px; 
	font-weight:normal ;
	padding:3px;
	border-width: 0;
	color: #FF3030 !important; /* "!important" necessary to overwrite validator fore color */
	background: #ffffff;
	border: solid 0px #ffffff;
	vertical-align:middle
	}

.ConfiguratorLabelText
	{
	font-size:14px;
	 padding:2px;
	 color: #000000;
	 border-width:0;
	 background: #ffffff;
	 border: solid 1px #c1c1c1;
	 height:26px;
	 vertical-align:middle;
	 }
 
 .ConfiguratorOptionsDetails
	{
	font-size:12px;
	padding:5px;
	color: #666666;
	border-width:0;
	background: #ffffff;
	vertical-align:middle
	}

.ConfiguratorOptionsDetailsCheckBox
	{
	font-size:12px;
	padding:5px;
	margin-top:4px;
	position: relative; 
	top:4px;
	color:#666666;
    background:#ffffff;
    }
    

    
/* 
-----------------------------------------------------------------
Product Configurator Price Details
----------------------------------------------------------------- 
*/
 
 .PriceOrderPanel
	{
 	padding:0px; 
	border-width:1;
	background: #ffffff;
	left: 480px;
	top: 100px;
	margin-left:0px; 
	position:absolute; 
	display:block; 
	color: #006fb3;
	border: solid 0px #000000;
	font-weight: bold;
	font-size: 20px ; 
}
 .ConfiguratorPrice 
	{
	padding:0px;
	border-width:1;
	position:static; 
	width:200px;
	top: 0px;
	margin-left:0px; 
	height:30px;
	color: #006fb3;
	min-height: 100%;
 
}

.ConfiguratorPriceDetails 
	{
	padding:0px;
	border-width: 1;
  	position:static; 
	width:150px;
	top: 25px;
	margin-left:0px; 
	height:30px;
	color: #006fb3;
	min-height: 100%;
	font-size:11px;
	}

.ConfiguratorTotal 
	{
 	padding:0px;
	border-width: 1;
  	position:static; 
	left: 480px;
	width:150px;
	top: 20px;
	height:30px;
	min-height: 100%;
	margin-left:0px; 
	height:30px;
	color: #006fb3;
	}

.ConfiguratorTotalDetails 
	{
 	padding:0px;
	border-width: 1;
  	position:static; 
	width:150px;
	top: 20px;
	height:30px;
	margin-left:0px; 
	display:block; 
	height:40px;
	color: #006fb3;
	min-height: 100%;
	font-size:11px;
	}


.OrderButton
	{
 	padding:0px;
	border-width: 0;
	background: #ffffff;
	top: 50px;
	margin-left:0px; 
	}

/* 
-----------------------------------------------------------------
Product Browser Tiles
----------------------------------------------------------------- 
*/

.ProductGroupPanel 
	{
	padding:15px; 
	border: solid 0px #CCCCCC;
	background: #ffffff;
	cursor:pointer;
	float:left;
	display:inline;
	margin-right:20px;
	margin-top:20px;
	margin-bottom:20px; 
	position:relative; 
	width:240px;
	height:220px;
	color: #006fb3;
	border-collapse:collapse;
	font-weight: bold; 
	font-size: 10px ; 
}

.ProductGroupCaptionPanel 
	{
 	padding:5px;
	border: solid 1px #82A2C4; 
	background: #82A2C4;
	border-collapse:collapse;
	text-align:center;
	margin-right:0px;
	margin-top:0px;
	vertical-align:middle;
	position:relative; 
	width:240px;
	height:50px;
	color: #ffffff;
	font-weight: bold; 
	font-size: 12px ; 
	}


.ProductGroupDescriptionPanel 
	{
 	padding:5px; 
	border: solid 1px #CCCCCC; 
	background: #CCCCCC;
	text-align:center;
	margin-right:0px;
	margin-top:3px;
	margin-bottom:100px; 
	position:relative; 
	width:240px;
	height:30px;
	color: #525252;
	font-weight: bold;
	font-size: 10px ; 
}

.ProductGroupImagePanel 
	{
	padding:5px; 
	border-left:solid 1px #CCCCCC;
	border-right:solid 1px #CCCCCC;
	border-top:solid 1px #CCCCCC; 
	background: #ffffff;
	text-align:center;
	margin-right:0px;
	margin-top:2px; 
	position:relative; 
	width:240px;
	height:120px;
	color: #525252;
	font-weight: bold;
	font-size: 10px ;
	}
	
.ProductGroupImage
	{
	padding:0px; 
	border: solid 0px #525252; 
	background: #ffffff;
	width: auto;
	height : auto;
	text-align:center;
	max-height:100%;
	max-width:100%;
	}

/* 
-----------------------------------------------------------------
Message Modal
----------------------------------------------------------------- 
*/

.modal {
    position:fixed;
    top: 50%;
    left:50%;
    background-color:#e1e1e1;
    width: 400px;
    margin-left: -200px;
    height: 230px;
    margin-top: -115px;
    padding:15px;
    box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    z-index:1000
}

.m-invisible {
    position:absolute;
    top:0;
    left:0;
    width:0;
    height:0;
    visibility:hidden;
}

.subject {
    width: 100%;
    margin-bottom:15px;
}

.message {
    width: 100%;
    margin-bottom:15px;
}
		
/* DEPRECATED
	
	
.mGridArt
	{
	margin: 0px 0 0px 0;
	border: solid 1px #525252;
	border-collapse: collapse;
	background-color: #C1C1C1;
	vertical-align: sub;
	text-align: center;
	}
    .mGridArt td 
		{
		border: solid 1px #c1c1c1;
		color: #616161;
		line-height:24px;
		background-color: #C1C1C1
		}
    .mGridArt a 
		{
		color: #ffffff
		} 
    .mGridArt tr:hover 
		{
    	padding: 6px;
		background: #99CCFF;
		 }
    .mGridArt th 
		{
		font-weight: bold;
		color: #ffffff;
		background: #424242 url('../images/grd_head.png') repeat-x 50% top; 
		border-left: solid 1px #525252;
		border: solid 1px #c1c1c1;
		}
    
    .mGridArt th:hover 
		{  
		background: #99CCFF;
		border: solid 1px #60CCFF;
		}
    .mGrid .alt 
		{
		background: #E8E8E8
		}

	*/