@charset "UTF-8";
/* CSS Document */

/*.wrapper{
	background:#ffffff;
	position:relative;
	padding:0px;
	width:950px;
	display:block;
	clear:both;
	text-align:left;
	margin-left: auto;
	margin-right:auto;
}
*/

/* preview popup test
*/

/*top nav style*/
/*ultimate link
.n1, .n1:link, .n1:visited{ font-family:Arial, Helvetica, sans-serif; font-size:20px; color:#333333; padding:5px;}
.n1:hover {color:#CCCC66;padding:5px;font-size:20px;}
*/
/*For the rotating quote */

.bullet ul, li {font-family:Arial, Helvetica, sans-serif; font-size:12px;} 
.bullet {font-family:Arial, Helvetica, sans-serif; font-size:12px;} 
#quote{
	height:100px;
	width:350px;
	position:absolute;
	top:428px;
	left:16px;
	margin:0;
	padding:0;
}
#quote_static{
	position:absolute;
	top:428px;
	left:16px;
	margin:0;
	padding:0;
}

.fade p{
	margin:0;
	padding:0;
	text-align: left;
	font-family:Arial, "Futura Md", sans-serif;
	font-size:24px;
	font-weight:bold;
	color:#000000;
}
#masternav {position: absolute;
	top:0px;
	left:0px;
	width:100%;
	height: 18px;
	clear:both;
	background:#000;
	padding-top:4px;
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#FFFFFF;
	}
	
.masternav {font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; font-style:normal; text-decoration:none; color:#ffffff;}
.masternav a:link {font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; font-style:normal; text-decoration:none; color:#999;}
.masternav a:hover {font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; font-style:normal; text-decoration:none; color:#FFF;}
.masternav a:hover {font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; font-style:normal; text-decoration:none; color:#FFF;}
.masternav a:visited {font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal; font-style:normal; text-decoration:none; color:#999;}

.bimg, .bimg:link, .bimg:hover, .bimg:visited {font-family: 'Museo500', sans-serif; font-size:14px; color:#333333; background:url("http://media.collarfree.com/artistichub/images/web2010/button01bg.png"); background-repeat:no-repeat; background-position:center;}
/*@font-face property*/
@font-face {
	font-family: 'Museo300';
	src: url('museo300-regular.eot');
	src: local('Museo'), local('Museo-300'), url('museo300-regular.woff') format('woff'), url('museo300-regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Museo700';
	src: url('museo700-regular.eot');
	src: local('Museo'), local('Museo-700'), url('museo700-regular.woff') format('woff'), url('museo700-regular.ttf') format('truetype');
}

@font-face {
	font-family: 'Museo500';
	src: url('museo500-regular.eot');
	src: local('Museo'), local('Museo-500'), url('museo500-regular.woff') format('woff'), url('museo500-regular.ttf') format('truetype');
}

.header {font-family: 'Museo500', sans-serif; font-size:34px; line-height:130%; color:#333333;}
.header1 {font-family: 'Museo500', sans-serif; font-size:18px; line-height:110%; color:#333333;}
.header2 {font-family: 'Museo300', sans-serif; font-size:16px; line-height:110%; color:#ffffff;}
.header3 {font-family: 'Museo300', sans-serif; font-size:18px; line-height:110%; color:#ffffff;}
.header4 {font-family: Arial, Helvetica, sans-serif; font-size:16px; color:#990000;}


.title, .title:link, .title:hover, .title:visited{font-family: 'Museo500', sans-serif; font-size:24px; line-height:25px; color:#333333;}
.title1, .title1:link, .title1:hover, .title1:visited{font-family: 'Museo500', sans-serif; font-size:14px; line-height:18px; color:#990000;}
.title9, .title9:link, .title9:hover, .title9:visited{font-family: 'Museo500', sans-serif; font-size:24px; line-height:25px; color:#990000;}
.title2, .title2:link, .title2:hover, .title1:visited{font-family: 'Museo500', sans-serif; font-size:24px; line-height:25px; color:#ff6600;}
.title3, .title3:link, .title3:hover, .title3:visited{font-family: 'Museo500', sans-serif;font-size:24px; line-height:25px; color:#660033;}
.title4, .title4:link, .title4:hover, .title4:visited{font-family: 'Museo500', sans-serif; font-size:24px; line-height:25px; color:#006666;}
.title5, .title5:link, .title5:hover, .title5:visited{font-family: 'Museo500', sans-serif;font-size:24px; line-height:25px; color:#000066;}
  
.n1, .n1:link, .n1:visited{ font-family: 'Museo500', sans-serif;font-size:18px; color:#990000; padding:5px;}
.n1:hover {color:#cc3300;padding:5px;font-size:18px; text-decoration:none;}
.n2, .n2:link, .n2:visited{ font-family: 'Museo500', sans-serif; font-size:18px; color:#ff6600; padding:5px;}
.n2:hover {color:#ff9900; padding:5px;font-size:18px; text-decoration:none;}
.n3, .n3:link, .n3:visited{ font-family: 'Museo500', sans-serif; font-size:18px; color:#660033; padding:5px;}
.n3:hover {color:#993366; padding:5px;font-size:18px; text-decoration:none;}
.n4, .n4:link, .n4:visited{ font-family: 'Museo500', sans-serif; font-size:18px; color:#006666; padding:5px;}
.n4:hover {color:#009999; padding:5px;font-size:18px; text-decoration:none;}
.n5, .n5:link, .n5:visited{font-family: 'Museo500', sans-serif; font-size:18px; color:#000066; padding:5px;}
.n5:hover {color:#003399; padding:5px;font-size:18px; text-decoration:none;}
.div{ font-family: 'Museo500', sans-serif; font-size:20px; color:#333333; padding:5px;}

/*css buttons */
.button, .button:visited{
	background: #222 url(/http://media.collarfree.com/artistichub/images/web2010/alert-overlay.png) repeat-x; 
	display: inline-block; 
	padding: 5px 10px 6px; 
	color: #fff; 
	text-decoration: none;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border-bottom: 1px solid rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer;
}

.indent {padding-left:20px; font-weight:bold;}
.subtitle {color:#999; padding-left:16px;}
.quotetop {padding-left:40px; font-family: Arial, Helvetica, sans-serif; font-size:15px; line-height:115%; color:#333333;}
.quotetop_sm {padding-left:60px; font-family: Arial, Helvetica, sans-serif; font-size:12px; line-height:115%; color:#333333;}
/* Sizes ---------- */
.small.button {
font-size: 11px;
color: #fff;

}
.medium.button {
font-size: 13px;
color: #fff;
}
.large.button {
font-size: 14px;
padding: 8px 14px 9px;
color: #fff;

}

.button:hover							{ background-color: #111; color: #fff; }
.button:active							{ top: 1px; }
.small.button, .small.button:visited 			{ font-size: 11px; padding: ; }
.medium.button, .medium.button:visited 		{ font-size: 13px; font-weight: bold; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); }
.large.button, .large.button:visited 			{ font-size: 14px; font-weight: bold; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); padding: 8px 14px 9px; }
.green.button, .green.button:visited		{ background-color: #CCCC66;}
.green.button:hover							{ background-color: #669900;}	
.gray.button, .gray.button:visited		{ background-color: #666666;}
.gray.button:hover							{ background-color: #333333;}
	
/*css buttons END*/	
pre{
	display:block;
	font:100% Arial, Helvetica, sans-serif, #333333;
	padding:10px;
	border:1px solid #DDDDDD;
	background:#eeeeee;	
	margin:.5em 0;
	overflow:auto;
	width:800px;
}

img{border:none;}
ul,li{
	margin:0;
	padding:0;
}
li{
	list-style:none;
	float:left;
	display:inline;
	margin-right:10px;
}
#demo{
	height:139px;
	width:142px;
	position: absolute;
	top:212px;
	z-index:50;
	left:828px;
	font-size: 22px;
	background-image:url('http://media.collarfree.com/artistichub/images/web2010/demo.png');
	background-repeat:none;
		}
#video{
	height:250px;
	width:640px;
	position: absolute;
	top:340px;
	z-index:-4;
	left:425px;
	font-size: 22px;
	background-repeat:none;
		}
#preview{
	position:absolute;
	border:1px solid #999999;
	line-height: 20px;
	background:#ffffff;
	padding:5px;
	display:none;
	color:#333333;
	z-index:100;
	}
#tooltip{
	position:absolute;
	border:1px solid #333;
	background:#f7f5d1;
	padding:2px 5px;
	color:#333;
	display:none;
	z-index:100;
	}
#screenshot{
	position:absolute;
	border:1px solid #999999;
	background:#ffffff;
	line-height: 20px;
	padding:5px;
	display:none;
	color:#333333;
	z-index:100;
	}

  /* // image replacement */
  p {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; line-height:18px;}
  .p1 {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; line-height:18px;}
  h1 {font-family:Arial, Helvetica, sans-serif;font-size:18px; color:#333333;}
  h2 {font-family:Arial, Helvetica, sans-serif;font-size:15px; color:#333333;}
  h3 {font-family: 'Museo500', sans-serif; font-size:20px; line-height:22px; color:#333333;}
  h4 {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#999999; font-weight:normal;}
  .banner{font-family: 'Museo500', sans-serif; font-size:45px; line-height:48px; color:#333333;}
  .banner2{font-family: 'Museo500', sans-serif; font-size:16px; line-height:25px; color:#333333;}
  .callout {font-family: 'Museo500', sans-serif; font-size:16px; color:#333333; padding-left:8px}
  .sub {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#999999; font-weight:normal;}
  .footer1 {font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#FFFFFF;}
  .footer2 {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF;}
  .footer3 {font-family:Arial, Helvetica, sans-serif; font-size:18px; line-height:20px; color:#ffffff;}
  .footer2 a:link {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; text-decoration:none;}
  .footer2 a:hover {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#CCCC66; text-decoration:none;}
  .footer2 a:active {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#CCCC66; text-decoration:none;}
  .footer2 a:visited {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; text-decoration:none;}
  a:link {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; text-decoration:none; padding-bottom:5px;}
  a:hover {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#CCCC66; text-decoration:underline;}
  a:active {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#CCCC66; text-decoration:underline;}
  a:visited {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333333; text-decoration:underline;}

/* image replacement */
        .graphic, #prevBtn, #nextBtn, #slider1prev, #slider1next{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
            }
    /* // image replacement */
			
	#container{	
		margin:0 auto;
		position:relative;
		text-align:left;
		width:950px;
		margin-top:0;
		font-family:Arial, Helvetica, sans-serif;
		line-height: 1.4em;
		}	
	#section03{
	position:absolute;
	text-align:left;
	width:905px;
	margin-top:178px;
	margin-left:32px;
	font-family:Arial, Helvetica, sans-serif;
	line-height: 1.4em;
	z-index:100;
		}
	.test{
		position:absolute;
	}
	#banner{
	height:260px;
	position: absolute;
	top:132px;
	z-index:1;
	left: 0px;
		}	
	#bannertext {
	height:260px;
	width:800px;
	position: absolute;
	top:124px;
	right:135px;
	z-index:1;
	left: 1px;
	font-size: 22px;
		}
	#banner ul {font-size:20px; font-color: #03F; font-family:Verdana, Geneva, sans-serif; list-style-image: url(http://media.collarfree.com/artistichub/images/web2010/bullet.png); line-height:150%;}
	#banner ul li{font-size:20px; font-color: #03F; font-family:Verdana, Geneva, sans-serif; list-style-image: url(http://media.collarfree.com/artistichub/images/web2010/bullet.png); line-height:150%;}
	#funfact{
	height:300px;
	width:242px;
	position: absolute;
	top:340px;
	right:135px;
	z-index:1;
	left: 18px;
	font-size: 20px;
	font-family: 'Museo500', sans-serif;
	color:#333333;
	padding:10px;
		}
	#title{
	height:28px;
	width:907px;
	position: absolute;
	top:990px;
	right:135px;
	z-index:1;
	left: 40px;
	font-size: 20px;
	font-family:Arial, Helvetica, sans-serif;
	color:#333333;
		}
	#header{
	height:80px;
	line-height:80px;
	background:#5DC9E1;
	color:#fff;
		}				
	#content{
		position:absolute;
		top:400px;
		}
		/*
	#top{
		position:fixed;
		left:900px;
		width:50px;
		} */
	#footer{
		height:260px;
		width:100%;
		position: absolute;
		top:2700px;
		background-color:#333333;
		z-index:0;
		padding-top:15px;
		}
	#footer2{
		height:260px;
		width:100%;
		position: absolute;
		top:2500px;
		background-color:#333333;
		z-index:0;
		}
	#footer3{
		height:260px;
		width:100%;
		position: absolute;
		top:2600px;
		background-color:#333333;
		z-index:0;
		padding-top:15px;
		}

	#casestudies{
		height:200px;
		width:150px;
		position:absolute;
		top:590px;
		left:15px;
		font-family:Arial, Helvetica, sans-serif; 
		font-size:12px; 
		color:#333333;}		
	#clients{
		height:400px;
		width:600px;
		position:absolute;
		top:2100px;
		left:300px;
		font-family:Arial, Helvetica, sans-serif; 
		font-size:12px; 
		color:#333333;}	
	#clients2{
	height:400px;
	width:600px;
	position:absolute;
	top:1392px;
	left:301px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#333333;
}	
	#back{
	 height:200px;
	 width:250px;
	 position:absolute;
	 top: 170px;
	 left: 700px;
	 }	
	 #whitepaper_back{
	height:200px;
	width:198px;
	position:absolute;
	top: 170px;
	left: 700px;
	background-image:url(http://media.collarfree.com/artistichub/images/web2010/whitepaper_sidebg.png);
	background-repeat:no-repeat;
	padding:20px;
	text-align:center;
	 }	
	 	 #whitepaper_back2{
	height:288px;
	width:198px;
	position:absolute;
	top: 170px;
	left: 700px;
	background-image:url(http://media.collarfree.com/artistichub/images/web2010/whitepaper_sidebg.png);
	background-repeat:repeat-y;
	padding:20px;
	 }	
	#login{
	 height:460px;
	 width:650px;
	 position:absolute;
	 top:109px;
	 left:79px;
	 background-image:url(http://media.collarfree.com/artistichub/images/web2010/clientlogin_bg.jpg);
	 background-repeat:no-repeat;
	 }	
	 #loginform{
	 height:200px;
	 width:293px;
	 position:absolute;
	 top: 38px;
	 left: 40px;
	 }	
	 #logo{
	 height:98px;
	 width:254px;
	 position:absolute;
	 top:5;
	 left:5px;
	 }
	.top{
	position: absolute;
	left:851px;
	width:50px;
	top: 770px;
		}	
	.top2{
	position: absolute;
	left:850px;
	width:50px;
	top: 943px;
		}
	.top3{
	position: absolute;
	left:849px;
	width:50px;
	top: 1348px;
		}	
	.top4{
	position: absolute;
	left:849px;
	width:50px;
	top: 2282px;
		}	
		/* video player */
#videogallery { zoom:1; }
#videogallery span{ display:block; }
#videogallery a{
	display:-moz-inline-stack;
	display:inline-block;
	zoom:1;
	*display:inline;
	position:relative;
	vertical-align:top;
	margin:3px;
	width:160px;
	font-family:Trebuchet,Tahoma,Arial,sans-serif;
	font-size:11px;
	font-weight:normal;
	text-decoration:none;
	text-align:center;
	opacity:0.87;
}
#videogallery a img{
	display:block;
	border:none;
	margin:0;
}
#videogallery a:hover{
	opacity:1;
}

/* the overlayed element */
div#voverlay {
	
	/* growing background image */
	background-image:url(http://media.collarfree.com/artistichub/images/web2010/vidbg.png);
	
	/* dimensions after the growing animation finishes  */
	width:640px;
	height:480px;
	
	/* initially overlay is hidden */
	display:none;
	
	/* some padding to layout nested elements nicely  */
	padding:35px;
}

/* default close button positioned on upper right corner */
div#voverlay div.close {
	background-image:url(http://media.collarfree.com/artistichub/images/web2010/close.png);
	position:absolute;
	right:10px;
	top:15px;
	cursor:pointer;
	height:18px;
	width:26px;
}

div#vcontainer{
	left:0;
	top:0;
	width:100%;
	height:100%;	
	background:url(../http://media.collarfree.com/artistichub/images/web2010/loading.gif) no-repeat 50% 50%;
}

/* END video player */		

/* Easy Slider 

	#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ /*
		width:900px;
		height:350px;
		overflow:hidden; 
		}	
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		left:-30px;
		top:800px;
		z-index:101;
		}	
	#nextBtn, #slider1next{ 
		left:900px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(http://media.collarfree.com/artistichub/images/web2010/arrow_left.png) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(.http://media.collarfree.com/artistichub/images/web2010/arrow_left.png) no-repeat 0 0;	
		}	*/
		
	/* numeric controls 	

	ol#controls{
		margin:1em 0;
		padding:0;
		height:28px;	
		}
	ol#controls li{
		margin:0 10px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		height:28px;
		line-height:28px;
		}
	ol#controls li a{
		float:left;
		height:28px;
		line-height:28px;
		border:1px solid #ccc;
		background:#DAF3F8;
		color:#555;
		padding:0 10px;
		text-decoration:none;
		}
	ol#controls li.current a{
		background:#5DC9E1;
		color:#fff;
		}
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
	*/
	
/* // Easy Slider */

/*CODA easy slider */
* { margin: 0; padding: 0 }
		/* I've used a hard CSS reset above, but you should consider a more sophisticated reset, such as this one: http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */
/*
		
		p { text-align: left; margin: 15px 0 }
		
		p, ul { font-size: 13px; line-height: 1.4em } 
		
		p a, li a { color: #39c; text-decoration: none }
		
		p.intro { border-bottom: 1px solid #ccc; margin-bottom: 20px; padding: 20px 0 30px 0; text-align: center; width: 100% }
		
		
		p#cross-links { text-align: center }
		
		p#cross-links { border-bottom: 1px solid #ccc; margin-bottom: 30px; padding-bottom: 30px }
		
		noscript p, noscript ol { color: #a00; font-size: 13px; line-height: 1.4em; text-align: left }
		noscript a { color: #a00; text-decoration: underline }
		noscript ol { margin-left: 25px; }
		
		a:focus { outline:none }
		
		img { border: 0 }
		
		h3 { border-bottom: 1px solid silver; margin-bottom: 5px; padding-bottom: 3px; text-align: left }
		*/
		
		.stripViewer .panelContainer .panel ul {
			text-align: left;
			margin: 0 15px 0 30px;
		}
		
		.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			margin: 20px 0;
			position: relative;
			width: 100%;
		}

		/* These 2 lines specify style applied while slider is loading */
		.csw {width: 100%; height: 350px; background: #fff; overflow: scroll}
		.csw .loading {margin: 200px 0 300px 0; text-align: center}

		.stripViewer { /* This is the viewing window */
			position: relative;
			overflow: hidden; 
			margin: auto;
			width: 900px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			height: 350px;
			clear: both;
			background: url("http://media.collarfree.com/artistichub/images/web2010/features_bg.png");
			background-repeat: no-repeat;
		}
		
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
			position: relative;
			left: 0; top: 0;
			width: 100%;
			list-style-type: none;
			/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 100%;
			position: relative;
			width: 900px; /* Also specified in  .stripViewer  above */
		}
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding: 30px;
		}
		
		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			margin: auto;
		}
		
		.stripNav ul { /* The auto-generated set of links */
			list-style: none;
		}
		
		.stripNav ul li {
			float: left;
			margin-right: 2px; /* If you  this, be sure to adjust the initial value of navWidth in coda-slider.1.1.1.js */
		}
		
		.stripNav a { /* The nav links */
			font-size: 12px;
			font-weight: normal;
			text-align: center;
			line-height: 30px;
			background: #ffffff;
			color: #999999;
			text-decoration: none;
			display: block;
			padding: 0 15px;
		}
		
		.stripNav li.tab1 a { background-color:#660033; color:#ffffff;}
		.stripNav li.tab1 a:hover {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab1 a:active {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab1 a.current { background-color:#CCCC66; color:#333;}
		
		.stripNav li.tab2 a { background-color:#660033; color:#ffffff; }
		.stripNav li.tab2 a:hover {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab2 a:active {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab2 a.current { background-color:#CCCC66; color:#333;}
		
		.stripNav li.tab3 a { background-color:#660033; color:#ffffff; }
		.stripNav li.tab3 a:hover {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab3 a:active {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab3 a.current { background-color:#CCCC66; color:#333;}
		
		.stripNav li.tab4 a { background-color:#660033; color:#ffffff; }
		.stripNav li.tab4 a:hover {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab4 a:active {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab4 a.current { background-color:#CCCC66; color:#333;}
		
		.stripNav li.tab5 a { background-color:#660033; color:#ffffff; }
		.stripNav li.tab5 a:hover {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab5 a:active {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab5 a.current { background-color:#CCCC66; color:#333;}
		
		.stripNav li.tab6 a { background-color:#660033; color:#ffffff; }
		.stripNav li.tab6 a:hover {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab6 a:active {  background-color:#CCCC66; color:#333;}
		.stripNav li.tab6 a.current { background-color:#CCCC66; color:#333;}
/*------------------------OLD
		
		.stripNav li.tab1 a { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_01.jpg"); background-repeat:no-repeat; background-position:center; color:#999999;}
		.stripNav li.tab1 a:hover { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_01.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab1 a:active { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_01.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab1 a.current { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_01a.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab2 a { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_02.jpg"); background-repeat:no-repeat; background-position:center; color:#999999;}
		.stripNav li.tab2 a:hover { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_02.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab2 a:active { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_02.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab2 a.current { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_02a.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab3 a { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_03.jpg"); background-repeat:no-repeat; background-position:center;  color:#999999; }
		.stripNav li.tab3 a:hover { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_03.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab3 a:active { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_03.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab3 a.current { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_03a.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab4 a { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_04.jpg"); background-repeat:no-repeat; background-position:center;  color:#999999; }
		.stripNav li.tab4 a:hover { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_04.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab4 a:active { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_04.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab4 a.current { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_04a.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab5 a { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_05.jpg"); background-repeat:no-repeat; background-position:center;  color:#999999; }
		.stripNav li.tab5 a:hover { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_05.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab5 a:active { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_05.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		.stripNav li.tab5 a.current { background:url("http://media.collarfree.com/artistichub/images/web2010/plbg_05a.jpg"); background-repeat:no-repeat; background-position:center; color:#333333;}
		END OLD------*/
		
		/*
		.stripNav li a:hover {
			background: #0033cc;
		}
		
		.stripNav li a.current {
			background: #fff;
			color: #660033;
		}
		*/
		
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			top: 180px;
			text-indent: -9000em;
			z-index:2;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 45px;
			width: 45px;
		}
		
		.stripNavL {
			left: -20px;
		}
		
		.stripNavR {
			right: -118px;
		}
		
		.stripNavL {
			background: url("http://media.collarfree.com/artistichub/images/web2010/arrow_left.png") no-repeat center; outline:none;
		}
		
		.stripNavR {
			background: url("http://media.collarfree.com/artistichub/images/web2010/arrow_right.png") no-repeat center; outline:none;
		}
		
/* popup bubble */
        
        .bubbleInfo {
            position: relative;
            top: 0px;
            left: 200px;
            width: 500px;
        }
		 .bubbleInfo2 {
            position: absolute;
            top: 1663px;
            left: 0px;
            width: 383px;
        }
        .trigger {
	position: absolute;
	left: 0px;
	top: -4px;
        }
     
	      .trigger2 {
	position: absolute;
	left: 300px;
	top: 0px;
        }
     
        /* Bubble pop-up */

        .popup {
        	position: absolute;
			left: -128px;
			top: -8px;
        	display: none;
        	z-index: 50;
        	border-collapse: collapse;
        }

        .popup2 {
        	position: relative;
			left: 50px;
			top: 1000px;
        	display: none;
        	z-index: 50;
        	border-collapse: collapse;
        }

        .popup td.corner {
        	height: 15px;
        	width: 19px;
        }

	    .popup td#topleft { background-image: url(images/bubble-1.png); }
        .popup td.top { background-image: url(images/bubble-2.png); }
        .popup td#topright { background-image: url(images/bubble-3.png); }
        .popup td.left { background-image: url(images/bubble-4.png); }
        .popup td.right { background-image: url(images/bubble-5.png); }
        .popup td#bottomleft { background-image: url(images/bubble-6.png); }
        .popup td.bottom { background-image: url(images/bubble-7.png); text-align: center;}
        .popup td.bottom img { display: block; margin: 0 auto; }
        .popup td#bottomright { background-image: url(images/bubble-8.png); }

        .popup table.popup-contents {
        	font-size: 12px;
        	line-height: 1.2em;
        	background-color: #fff;
        	color: #666;
        	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
        	}

        table.popup-contents th {
        	text-align: right;
        	text-transform: lowercase;
        	}

        table.popup-contents td {
        	text-align: left;
        	}

        tr#release-notes th {
        	text-align: left;
        	text-indent: -9999px;
        	background: url(http://jqueryfordesigners.com/demo/images/coda/starburst.gif) no-repeat top right;
        	height: 17px;
        	}

        tr#release-notes td a {
        	color: #333;
        }

