/* CSS Document */
/* ############### tales.be css framework v0.5 (by kvd) ###############  */
/* ############### c.006.panels.cs ###############  */


/* ############### contains:
	1. panel topcats
	2. panel headers
	3. generic rules for making panels
	4. individual header panel-settings
	5. individual panel-settings (homepage, productlanding)

 ############### */


/* ######### PANEL TOPCATS #########*/
.topcat{
	display: block;
	width: 75px;
	height: 44px;
	background-image: url(/websites/25/uploads/image/templates/basics/panel.topcats.png);
	margin-left: 15px;
}
	#IE6 .topcat{	background-image: url(/websites/25/uploads/image/templates/basics/green/panel.topcats.gif);	}
		
		.blue   #IE6 .topcat{	background-image: url(/websites/25/uploads/image/templates/basics/blue/panel.topcats.gif);	}
		.green  #IE6 .topcat{	background-image: url(/websites/25/uploads/image/templates/basics/green/panel.topcats.gif);	}
		.orange #IE6 .topcat{	background-image: url(/websites/25/uploads/image/templates/basics/orange/panel.topcats.gif);	}
		.purple #IE6 .topcat{	background-image: url(/websites/25/uploads/image/templates/basics/purple/panel.topcats.gif);	}
		
		.topcat1{			background-position: 0 0;}
		.topcat2{			background-position: -75px 0;}
		.topcat3{			background-position: -150px 0;}
		.topcat4{			background-position: -225px 0;}
		.topcat5{			background-position: -300px 0;}
		
.hiddencat{
	background-image: none !important;
}
/* ######### PANEL HEADERS #########*/
.panelheader{
	position: relative;
	z-index: 10;
	/*bottom: 0px;*/
	/*top: 10px*/
	/*margin-bottom: -10px;*/
}
							
							.panelheader .paneltopleft{
								display: block;
								float: left;
								width: 100px;
								height: 10px;
								background-image: url(/websites/25/uploads/image/templates/basics/panel.header.top.left.png);
							}
								#IE6 .panelheader .paneltopleft{
									display: inline-block;
									background-image: url(/websites/25/uploads/image/templates/basics/panel.header.top.left.gif);	
									margin: 0 -3px 0 0 !important;
									padding: 0 !important;
								}
							
								.blue   .panelheader .paneltopleft{background-position: 0 -100px;}
								.green  .panelheader .paneltopleft{background-position: 0 0px;}
								.orange .panelheader .paneltopleft{background-position: 0 -200px;}
								.purple .panelheader .paneltopleft{background-position: 0 -300px;}
							
								
							.panelheader .paneltopright{
								display: block;
								float: left;
								width: 15px;
								height: 10px;
								background: url(/websites/25/uploads/image/templates/basics/panel.header.top.right.png);
							}	
								#IE6 .panelheader .paneltopright{
									display: inline-block;
									float: none;
									background: url(/websites/25/uploads/image/templates/basics/panel.header.top.right.gif);
									margin: 0 0 -8px 0 !important;
									padding: 0 !important;
									overflow: hidden;
								}
								
								.blue   .panelheader .paneltopright{background-position: 0 -100px !important;}
								.green  .panelheader .paneltopright{background-position: 0 0px !important;}
								.orange .panelheader .paneltopright{background-position: 0 -200px !important;}
								.purple .panelheader .paneltopright{background-position: 0 -300px !important;}
							
							
							.panelheader .panelbottomleft{
								display: block;
								float: left;
								width: 100px;
								height: 12px;
								background-image: url(/websites/25/uploads/image/templates/basics/panel.header.bottom.left.png);
							}
								#IE6 .panelheader .panelbottomleft{
									display: inline-block;
									background-image: url(/websites/25/uploads/image/templates/basics/panel.header.bottom.left.gif);
									margin: 0 -3px 0 0 !important;
									padding: 0 !important;
									overflow: hidden;
									}
							
								.blue   .panelheader .panelbottomleft{background-position: 0 -100px !important;}
								.green  .panelheader .panelbottomleft{background-position: 0 0 !important;}
								.orange .panelheader .panelbottomleft{background-position: 0 -200px !important;}
								.purple .panelheader .panelbottomleft{background-position: 0 -300px !important;}
							
								
							.panelheader .panelbottomright{
								display: block;
								float: left;
								width: 15px;
								height: 12px;
								background: url(/websites/25/uploads/image/templates/basics/panel.header.bottom.right.png);
							}	
								#IE6 .panelheader .panelbottomright{
									display: inline-block;
									float: none;
									background: url(/websites/25/uploads/image/templates/basics/panel.header.bottom.right.gif);
									margin: 0 0 0 0 !important;
									padding: 0 !important;
									overflow: hidden;
								}
									
								.blue   .panelheader .panelbottomright{background-position: 0 -100px !important;}
								.green  .panelheader .panelbottomright{background-position: 0 0 !important;}
								.orange .panelheader .panelbottomright{background-position: 0 -200px !important;}
								.purple .panelheader .panelbottomright{background-position: 0 -300px !important;}
								
								
							.panelheader .panelmiddle{
								display: block;
								width: 79px;
								padding: 0 15px 0 15px;
								background-color: #165a0c;
								color: #fff;
								border-left: 3px solid #165a0c;
								border-right: 3px solid #165a0c;
							}	
								
								
								.blue   .panelheader .panelmiddle{ background-color: #16457a; border-color: #16457a;}
								.green  .panelheader .panelmiddle{ background-color: #165a0c; border-color: #165a0c;}
								.orange .panelheader .panelmiddle{ background-color: #7a1f16; border-color: #7a1f16;}
								.purple .panelheader .panelmiddle{ background-color: #3a236f; border-color: #3a236f;}
							
								
				

/* ######### PANELS GENERIC SETUP #########*/


.panel{	float: left;
	position: relative;
	z-index: 5;}
		
	
							
							.panel .paneltopleft{
								display: block;
								float: left;
								width: 100px;
								height: 15px;
								background-image: url(/websites/25/uploads/image/templates/basics/panel.top.left.png);
							}
								#IE6 .panel .paneltopleft{
									display: inline-block;
									background-image: url(/websites/25/uploads/image/templates/basics/panel.top.left.gif);	
									margin: 0 -3px 0 0 !important;
									padding: 0 !important;
								}
							
								.blue   .panel .paneltopleft{background-position: 0 -100px;}
								.green  .panel .paneltopleft{background-position: 0 0px;}
								.orange .panel .paneltopleft{background-position: 0 -200px;}
								.purple .panel .paneltopleft{background-position: 0 -300px;}
							
								
							.panel .paneltopright{
								display: block;
								float: left;
								width: 15px;
								height: 15px;
								background: url(/websites/25/uploads/image/templates/basics/panel.top.right.png);
							}	
								#IE6 .panel .paneltopright{
									display: inline-block;
									float: none;
									background: url(/websites/25/uploads/image/templates/basics/panel.top.right.gif);
									margin: 0 0 0 0 !important;
									padding: 0 !important;
									
								}
								
								.blue   .panel .paneltopright{background-position: 0 -100px !important;}
								.green  .panel .paneltopright{background-position: 0 0px !important;}
								.orange .panel .paneltopright{background-position: 0 -200px !important;}
								.purple .panel .paneltopright{background-position: 0 -300px !important;}
							
							
							.panel .panelbottomleft{
								display: block;
								float: left;
								width: 100px;
								height: 15px;
								background-image: url(/websites/25/uploads/image/templates/basics/panel.bottom.left.png);
							}
								#IE6 .panel .panelbottomleft{
									display: inline-block;
									background-image: url(/websites/25/uploads/image/templates/basics/panel.bottom.left.gif);
									margin: 0 -3px 0 0 !important;
									padding: 0 !important;
									overflow: hidden;
									}
							
								.blue   .panel .panelbottomleft{background-position: 0 -100px !important;}
								.green  .panel .panelbottomleft{background-position: 0 0 !important;}
								.orange .panel .panelbottomleft{background-position: 0 -200px !important;}
								.purple .panel .panelbottomleft{background-position: 0 -300px !important;}
							
								
							.panel .panelbottomright{
								display: block;
								float: left;
								width: 15px;
								height: 15px;
								background: url(/websites/25/uploads/image/templates/basics/panel.bottom.right.png);
							}	
								#IE6 .panel .panelbottomright{
									display: inline-block;
									float: none;
									background: url(/websites/25/uploads/image/templates/basics/panel.bottom.right.gif);
									margin: 0 0 0 0 !important;
									padding: 0 !important;
									overflow: hidden;
								}
									
								.blue   .panel .panelbottomright{background-position: 0 -100px !important;}
								.green  .panel .panelbottomright{background-position: 0 0 !important;}
								.orange .panel .panelbottomright{background-position: 0 -200px !important;}
								.purple .panel .panelbottomright{background-position: 0 -300px !important;}
								
								
							.panel .panelmiddle{
								display: block;
								width: 79px;
								padding: 0 15px 0 15px;
								background-color: #fff;
								border-left: 3px solid #165a0c;
								border-right: 3px solid #165a0c;
								color: #165a0c;
							}	
								
								
								.blue   .panel .panelmiddle{ color: #16457a; border-color: #16457a;}
								.green  .panel .panelmiddle{ color: #165a0c; border-color: #165a0c;}
								.orange .panel .panelmiddle{ color: #7a1f16; border-color: #7a1f16;}
								.purple .panel .panelmiddle{ color: #3a236f; border-color: #3a236f;}
							
								
								
	
	
	

/* #################### INDIVIDUAL HEADERPANEL SETTINGS #################### */		
	
	.panelheader1 .paneltopleft, .panelheader1 .panelbottomleft{ width: 272px;  } /*287 - 15*/ 
	.panelheader1 .panelmiddle { width: 251px; } /* 287 - 36*/

/* #################### INDIVIDUAL PANEL SETTINGS #################### */	
	
	
	/* HOMEPAGE LEFT COLUMN*/
	.panelhome1{	top: -10px; }
	.panelhome1 .paneltopleft, .panelhome1 .panelbottomleft{ width: 272px;  } /*287 - 15*/ 
	.panelhome1 .panelmiddle { width: 251px; } /* 287 - 36*/
	
	/* HOMEPAGE ROW 1*/
	/* total width row panels (top): max: 618;  */
	.panelhome2{	margin-right: 18px;	}
		#IE6 .panelhome2, #IE8 .panelhome2{	width: 393px;	}
	.panelhome2 .paneltopleft, .panelhome2 .panelbottomleft{ width: 378px;  } /*393 - 15*/ 
	.panelhome2 .panelmiddle { width: 357px; } /* 393 - 36*/
	
	
		#IE6 .panelhome3, #IE8 .panelhome3{	width: 237px;	}
	.panelhome3 .paneltopleft, .panelhome3 .panelbottomleft{ width: 222px;  } /*237 - 15*/ 
	.panelhome3 .panelmiddle { width: 201px; } /* 237 - 36*/
	
	
	/* HOMEPAGE ROW 2*/
	.panelhome4{	margin-right: 18px;	}
		#IE6 .panelhome4, #IE8 .panelhome4{	width: 203px;	}
	.panelhome4 .paneltopleft, .panelhome4 .panelbottomleft{ width: 188px;  } /*203 - 15*/ 
	.panelhome4 .panelmiddle { width: 167px; } /* 203 - 36*/
	
	
		#IE6 .panelhome5, #IE8 .panelhome5{	width: 427px;	}
	.panelhome5 .paneltopleft, .panelhome5 .panelbottomleft{ width: 412px;  } /*427 - 15*/ 
	.panelhome5 .panelmiddle { width: 391px; } /* 427 - 36*/
	
	
	
	/* ECARD VIEWPAGE*/
	.panelecardtext{ margin-left: 0px;	}
		#IE6 .panelecardtext, #IE8 .panelecardtext{	width: 285px;	}
		#IE6 .panelecardtext{ margin-left: 28px;	}
	.panelecardtext .paneltopleft, .panelecardtext .panelbottomleft{ width: 270px;  } /*285px - 15*/ 
	.panelecardtext .panelmiddle { width: 249px; } /* 285px - 36*/
	
	
	
	
	/* ECARD VIEWPAGE*/
	.panelwallpaper{ margin-right: 10px; margin-top: 0px; margin-bottom: 10px; }
	
		#IE6 .panelwallpaper, #IE8 .panelwallpaper{	width: 207px; ;	}
	.panelwallpaper .paneltopleft, .panelwallpaper .panelbottomleft{ width: 192px;  } /*207 - 15*/ 
	.panelwallpaper .panelmiddle { width: 171px; } /* 207 - 36*/