/* CSS Document */
/* ############### tales.be css framework v0.3 (by kvd) ###############  */
/* ############### SIDENAVIGATION ############### */
/*
	1. sidenav products
	2. generic sidenav


*/

/* ############### SIDENAVIGATION  PRODUCTS ############### */
#sidenavproducts ul{
	margin: 0;
	overflow: hidden;
}
#IE6 #sidenavproducts ul, #IE7 #sidenavproducts ul{}
#sidenavproducts li{
	display: list-item;
	list-style: none;
	color: #fff;
	margin: 0 0 10px 0;
	padding: 0 ;
	height: 65px;
}
	#IE7 #sidenavproducts li{

		}
#sidenavproducts ul li a{
	display: block;
	background-color: aqua;

 } 



	#sidenavproducts ul li a span.frontbumper{
		display: block;
		float: left;
		background: url(../image/templates/basics/sidenav.button.off.png) no-repeat 0 10px;
		height: 65px;
		width: 24px;
	}
			#IE6 #sidenavproducts ul li a span.frontbumper{background-image: url(../image/templates/basics/sidenav.button.off.gif);}
			
			
			.blue   #sidenavproducts ul li a span.frontbumper{	background-position:  0 -90px;}
			.green  #sidenavproducts ul li a span.frontbumper{	background-position:  0 10px;}
			.orange #sidenavproducts ul li a span.frontbumper{	background-position:  0 -190px;}
			.purple #sidenavproducts ul li a span.frontbumper{	background-position:  0 -290px;}
			
			
	#sidenavproducts ul li a span.stretcher{
		display: block;
		float: left;
		background: url(../image/templates/basics/sidenav.button.off.png) no-repeat -25px 10px;
		height: 65px;
		font-size: 1.3em;
		font-weight: bold;
	}
			#IE6 #sidenavproducts ul li a span.stretcher{background-image: url(../image/templates/basics/sidenav.button.off.gif);}
			
			
			.blue   #sidenavproducts ul li a span.stretcher{	background-position:  -25px -90px;}
			.green  #sidenavproducts ul li a span.stretcher{	background-position:  -25px 10px;}
			.orange #sidenavproducts ul li a span.stretcher{	background-position:  -25px -190px;}
			.purple #sidenavproducts ul li a span.stretcher{	background-position:  -25px -290px;}
			
			

	#sidenavproducts ul li a span.icon{
		display: block;
		float: left;
		height: 65px;
		width: 82px;
		overflow: hidden;
	}
			
				
				

	#sidenavproducts ul li a span.textwrapper{
		display: block;
		float: left;
		height: 37px;
		padding: 28px 0 0 0;
		
	}
		#IE7 #sidenavproducts ul li a span.textwrapper{	height: 32px; padding: 28px 0 5px 0;}
			
			
			
	#sidenavproducts ul li a span.backbumper{
		display: block;
		float: left;
		background: url(../image/templates/basics/sidenav.button.off.png) no-repeat -373px 10px;
		height: 65px;
		width: 28px;
		margin-right: 0px;
	}
			#IE6 #sidenavproducts ul li a span.backbumper{background-image: url(../image/templates/basics/sidenav.button.off.gif);	}
			
			
			.blue   #sidenavproducts ul li a span.backbumper{	background-position:  -373px -90px;}
			.green  #sidenavproducts ul li a span.backbumper{	background-position:  -373px 10px;}
			.orange #sidenavproducts ul li a span.backbumper{	background-position:  -373px -190px;}
			.purple #sidenavproducts ul li a span.backbumper{	background-position:  -373px -290px;}
			
			
#sidenavproducts ul li a:link, #sidenavproducts ul li a:visited{
	text-decoration: none;
	color: #055d2e;	
}
	.blue   #sidenavproducts ul li a:link, .blue   #sidenavproducts ul li a:visited{	color: #10457B;}
	.green  #sidenavproducts ul li a:link, .green  #sidenavproducts ul li a:visited{	color: #055d2e;}
	.orange #sidenavproducts ul li a:link, .orange #sidenavproducts ul li a:visited{	color: #7B1C10;}
	.purple #sidenavproducts ul li a:link, .purple #sidenavproducts ul li a:visited{	color: #39206B;}
	
	
	
#sidenavproducts ul li a:hover, #sidenavproducts ul li a:active{
	color: red;
}

	
		#sidenavproducts ul li a:hover span.stretcher, #sidenavproducts ul li a:active span.stretcher{
			color: red;
		}
		
		#sidenavproducts ul li.selected a span.stretcher{
			color: #fff;
		}
	
				#IE6 #sidenavproducts ul li a:hover span.stretcher, #IE6 #sidenavproducts ul li a:active span.stretcher,
				#IE6 #sidenavproducts ul li.selected a span.stretcher{
				}

		#sidenavproducts ul li a:hover span.backbumper, #sidenavproducts ul li a:active span.backbumper,
		#sidenavproducts ul li.selected a span.backbumper{
			color: #fff;
		}
				#IE6 #sidenavproducts ul li a:hover span.backbumper, #IE6 #sidenavproducts ul li a:active span.backbumper,
				#IE6 #sidenavproducts ul li.selected a span.backbumper{
				}


#sidenavproducts ul li.selected a{}
#sidenavproducts ul li.selected a:link, #sidenavproducts ul li.selected a:visited{}
#sidenavproducts ul li.selected a:hover, #sidenavproducts ul li.selected a:active{}



#sidenavproducts ul li#tn_home a span.tn_icon{
	display: inline-block;
	float: left;
	width: 17px;
	height: 15px;
/*	background-image: url(../image/templates/basics/topnav.ico.home.png);
	background-repeat: no-repeat;*/
	margin-left: -15px;
}

#sidenavproducts ul li#tn_home a span.stretcher{
	float: left;
	text-indent: -2000px;
	width: 0;
	padding-right: 5px;
	}


	
	
	
	
	/* ##### cat icons ##### */
		
	#sidenavproducts ul li a .movedenclosingspandown{
		margin-top: -2px;
	}
			
				

	#sidenavproducts ul li a span.icon img.moveddown{
		margin-top: 30px;
	}
	#sidenavproducts ul li a span.icon span.moveddown{
		margin-top: 30px;
	}
	
	.catplaceholder{
		display: block;
		width: 82px;
		height: 63px;
	}
	
	.cat1{		background-image: url(../image/templates/basics/sidenav.katz.young.png);}	
	.cat2{		background-image: url(../image/templates/basics/sidenav.katz.flavour.png);}	
	.cat3{		background-image: url(../image/templates/basics/sidenav.katz.fitness.png);}
	.cat4{		background-image: url(../image/templates/basics/sidenav.katz.housecat.png);}	
	.cat5{		background-image: url(../image/templates/basics/sidenav.katz.oldies.png);}
	
	
	
	
	
	
	
	
	/* ##### selected state ##### */
	
	#sidenavproducts ul li.selected a span.frontbumper{background-image: url(../image/templates/basics/sidenav.button.on.png) ;}
	#sidenavproducts ul li.selected a span.stretcher{background-image: url(../image/templates/basics/sidenav.button.on.png) ;}
	#sidenavproducts ul li.selected a span.backbumper{background-image: url(../image/templates/basics/sidenav.button.on.png) ;}
	
	
			#IE6 #sidenavproducts ul li.selected a span.frontbumper{background-image: url(../image/templates/basics/sidenav.button.on.gif) ;}
			#IE6 #sidenavproducts ul li.selected a span.stretcher{background-image: url(../image/templates/basics/sidenav.button.on.gif) ;}
			#IE6 #sidenavproducts ul li.selected a span.backbumper{background-image: url(../image/templates/basics/sidenav.button.on.gif) ;}
	
	
			#sidenavproducts ul li.selected a span.frontbumper{background-position: 0 10px ;}
			#sidenavproducts ul li.selected a span.stretcher{background-position: -25px 10px ;}
			#sidenavproducts ul li.selected a span.backbumper{background-position: -373px 10px ;}
			
			
			#sidenavproducts ul li#cat1.selected a span.frontbumper{background-position: 0 10px ;}
			#sidenavproducts ul li#cat1.selected a span.stretcher{background-position: -25px 10px ;}
			#sidenavproducts ul li#cat1.selected a span.backbumper{background-position: -373px 10px ;}
			
			#sidenavproducts ul li#cat2.selected a span.frontbumper{background-position: 0 -90px ;}
			#sidenavproducts ul li#cat2.selected a span.stretcher{background-position: -25px -90px ;}
			#sidenavproducts ul li#cat2.selected a span.backbumper{background-position: -373px -90px ;}
			
			#sidenavproducts ul li#cat3.selected a span.frontbumper{background-position: 0 -190px ;}
			#sidenavproducts ul li#cat3.selected a span.stretcher{background-position: -25px -190px ;}
			#sidenavproducts ul li#cat3.selected a span.backbumper{background-position: -373px -190px ;}
			
			#sidenavproducts ul li#cat4.selected a span.frontbumper{background-position: 0 -290px ;}
			#sidenavproducts ul li#cat4.selected a span.stretcher{background-position: -25px -290px ;}
			#sidenavproducts ul li#cat4.selected a span.backbumper{background-position: -373px -290px ;}
			
			#sidenavproducts ul li#cat5.selected a span.frontbumper{background-position: 0 -390px ;}
			#sidenavproducts ul li#cat5.selected a span.stretcher{background-position: -25px -390px ;}
			#sidenavproducts ul li#cat5.selected a span.backbumper{background-position: -373px -390px ;}
				
				
				
				
/* ############### SIDENAVIGATION  GENERIC ############### */
#sidenav ul{
	margin: 0;
	overflow: hidden;
}
#IE6 #sidenav ul, #IE7 #sidenav ul{}
#sidenav li{
	display: list-item;
	list-style: none;
	color: #fff;
	margin: 0 0 10px 0;
	padding: 0 ;
	height: 66px;
}
	#IE7 #sidenav li{

		}
#sidenav ul li a{
	display: block;
	background-color: aqua;

 } 



	#sidenav ul li a span.frontbumper{
		display: block;
		float: left;
		background: url(../image/templates/basics/sidenav.png) no-repeat 0 0px;
		height: 66px;
		width: 24px;
	}
			#IE6 #sidenav ul li a span.frontbumper{background-image: url(../image/templates/basics/sidenav.gif);}
			
			
			.blue   #sidenav ul li a span.frontbumper{	background-position:  0 -100px;}
			.green  #sidenav ul li a span.frontbumper{	background-position:  0 0px;}
			.orange #sidenav ul li a span.frontbumper{	background-position:  0 -200px;}
			.purple #sidenav ul li a span.frontbumper{	background-position:  0 -300px;}
			
			
	#sidenav ul li a span.stretcher{
		display: block;
		float: left;
		background: url(../image/templates/basics/sidenav.png) no-repeat -25px 0px;
		height: 66px;
		font-size: 1.3em;
		font-weight: bold;
	}
			#IE6 #sidenav ul li a span.stretcher{background-image: url(../image/templates/basics/sidenav.gif);}
			
			
			.blue   #sidenav ul li a span.stretcher{	background-position:  -25px -100px;}
			.green  #sidenav ul li a span.stretcher{	background-position:  -25px 0px;}
			.orange #sidenav ul li a span.stretcher{	background-position:  -25px -200px;}
			.purple #sidenav ul li a span.stretcher{	background-position:  -25px -300px;}
			
			

	#sidenav ul li a span.icon{
		display: block;
		float: left;
		height: 66px;
		width: 82px;
		overflow: hidden;
	}
			
				
				

	#sidenav ul li a span.textwrapper{
		display: block;
		float: left;
		height: 37px;
		padding: 29px 0 0 0;
		
	}
		#IE7 #sidenav ul li a span.textwrapper{	height: 32px; padding: 29px 0 5px 0;}
			
			
			
	#sidenav ul li a span.backbumper{
		display: block;
		float: left;
		background: url(../image/templates/basics/sidenav.png) no-repeat -373px 0;
		height: 66px;
		width: 28px;
		margin-right: 0px;
	}
			
			
			#IE6 #sidenav ul li a span.backbumper{background-image: url(../image/templates/basics/sidenav.gif);}
			
			.blue   #sidenav ul li a span.backbumper{	background-position:  -373px -100px;}
			.green  #sidenav ul li a span.backbumper{	background-position:  -373px 0;}
			.orange #sidenav ul li a span.backbumper{	background-position:  -373px -200px;}
			.purple #sidenav ul li a span.backbumper{	background-position:  -373px -300px;}
			
			
#sidenav ul li a:link, #sidenav ul li a:visited{
	text-decoration: none;
	color: #055d2e;	
}
	.blue   #sidenav ul li a:link, .blue   #sidenav ul li a:visited{	color: #10457B;}
	.green  #sidenav ul li a:link, .green  #sidenav ul li a:visited{	color: #055d2e;}
	.orange #sidenav ul li a:link, .orange #sidenav ul li a:visited{	color: #7B1C10;}
	.purple #sidenav ul li a:link, .purple #sidenav ul li a:visited{	color: #39206B;}
	
	
	
#sidenav ul li a:hover, #sidenav ul li a:active{
	color: red;
}

	
		#sidenav ul li a:hover span.stretcher, #sidenav ul li a:active span.stretcher{
			color: red;
		}
		
		#sidenav ul li.selected a span.stretcher{
			color: #fff;
		}
	
				#IE6 #sidenav ul li a:hover span.stretcher, #IE6 #sidenav ul li a:active span.stretcher,
				#IE6 #sidenav ul li.selected a span.stretcher{
				}

		#sidenav ul li a:hover span.backbumper, #sidenav ul li a:active span.backbumper,
		#sidenav ul li.selected a span.backbumper{
			color: #fff;
		}
				#IE6 #sidenav ul li a:hover span.backbumper, #IE6 #sidenav ul li a:active span.backbumper,
				#IE6 #sidenav ul li.selected a span.backbumper{
				}


#sidenav ul li.selected a{}
#sidenav ul li.selected a:link, #sidenav ul li.selected a:visited{}
#sidenav ul li.selected a:hover, #sidenav ul li.selected a:active{}



#sidenav ul li#tn_home a span.tn_icon{
	display: inline-block;
	float: left;
	width: 17px;
	height: 15px;
/*	background-image: url(../image/templates/basics/topnav.ico.home.png);
	background-repeat: no-repeat;*/
	margin-left: -15px;
}

#sidenav ul li#tn_home a span.stretcher{
	float: left;
	text-indent: -2000px;
	width: 0;
	padding-right: 5px;
	}


	
	
	
	
	/* ##### cat icons ##### */
		
	#sidenav ul li a .movedenclosingspandown{
		margin-top: -2px;
	}
			
				

	#sidenav ul li a span.icon img.moveddown{
		margin-top: 30px;
	}
	#sidenav ul li a span.icon span.moveddown{
		margin-top: 30px;
	}
	
	.catplaceholder{
		display: block;
		width: 82px;
		height: 63px;
	}

	
	
	
		
	.down1{		background-image: url(../image/templates/basics/sidenav.downloads.wallpaper.png);}	
	.down2{		background-image: url(../image/templates/basics/sidenav.downloads.movie.png);}	
	.down3{		background-image: url(../image/templates/basics/sidenav.downloads.ringtone.png);}
	
	/* ##### selected state ##### */
	
	#sidenav ul li.selected a span.frontbumper{background-position: -600px 0;}
	#sidenav ul li.selected a span.stretcher{background-position: -625px 0; color: #fff;}
	#sidenav ul li.selected a span.backbumper{background-position: -973px 0;}
	
	
			
			.blue   #sidenav ul li.selected a span.frontbumper{	background-position:  -600px -100px;}
			.green  #sidenav ul li.selected a span.frontbumper{	background-position:  -600px 0;}
			.orange #sidenav ul li.selected a span.frontbumper{	background-position:  -600px -200px;}
			.purple #sidenav ul li.selected a span.frontbumper{	background-position:  -600px -300px;}
			
			.blue   #sidenav ul li.selected a span.stretcher{	background-position:  -625px -100px;}
			.green  #sidenav ul li.selected a span.stretcher{	background-position:  -625px 0;}
			.orange #sidenav ul li.selected a span.stretcher{	background-position:  -625px -200px;}
			.purple #sidenav ul li.selected a span.stretcher{	background-position:  -625px -300px;}
			
			.blue   #sidenav ul li.selected a span.backbumper{	background-position:  -973px -100px;}
			.green  #sidenav ul li.selected a span.backbumper{	background-position:  -973px 0;}
			.orange #sidenav ul li.selected a span.backbumper{	background-position:  -973px -200px;}
			.purple #sidenav ul li.selected a span.backbumper{	background-position:  -973px -300px;}	
			
			
			
			
			.gamenav .icon, .gamenav .catplaceholder{
				width: 0px !important;
			}
			
			.gamenav .textwrapper{
				width: 125px !important;
			}