
/*
	NAME: Par-Kan Company
	DATE: Nov. 23, 2009
	DESCRIPTION: Par-Kan Company Website
	URL: http://www.par-kan.com
	VERSION: 1.0
	DESIGNER: Ryan Bradley
	CODER / PROGRAMMER: Andrew Champ
	COMPANY: NorthStar Media Inc
*/



*{
	outline:0;
	border:0;
	margin:0;
	padding:0;
	line-height:1.5;
}


::selection{background:#0D6C34; color:#FFF;}
::-moz-selection{background:#0D6C34; color:#FFF;}


a{color:#016232; text-transform:none;}
a:hover{color:#A8A8A8;}

html{
	min-height:100%;
	height:auto;
	overflow-y:scroll;
}

body{
	color:#000;
	font-size:14px;
	font-family:arial, verdana, sans-serif;
}


#header{
	height:170px;
	width:100%;
}

#logo{
	width:260px;
	height:156px;
	margin:10px 0 0 10px;
	float:left;
}


ul#tabnav{
	text-align:left;
	margin-top:136px;
	font-weight:bold;
	list-style-type:none;
	padding:0 134px 20px 10px;
	float:right;
}

ul#tabnav li{display:inline; line-height:1;}

ul#tabnav li a{
	padding:7px 7px 17px 7px; /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
	color:#A8A8A8;
	margin-right:0; /* set additional spacing between tabs as desired */
	text-decoration:none;
	text-transform:uppercase;
	border-bottom:none;
	line-height:1;
}

ul#tabnav a:hover{color:#016232;}

ul#tabnav a:active{outline:0; position:relative; top:1px;}

ul#tabnav .selected{
	color:#016232;
	background:url(../images/nav-arrow_active.jpg) no-repeat bottom center;
}


	ul#subnav{
		float:left;
		width:280px;
		list-style-type:none;
		font-size:15px;
		text-transform:uppercase;
		padding:0;
	}
	ul#subnav a{
		color:#016334;
		text-decoration:none;
		font-weight:bold;
		text-transform:uppercase;
		display:block;
		height:100%;
		width:100%;
	}

		ul#subnav li{
			height:34px;
			padding:12px 0 0 0;
			margin-left:76px;
			background:url(../images/subnav-divider.jpg) no-repeat center bottom;
		}
		ul#subnav li a:hover{
			background:url(../images/subnav-divider_hover.jpg) no-repeat center bottom; 
			color:#73C620; 
			height:34px;
		}
		ul#subnav li .active{
			background:url(../images/subnav-divider_hover.jpg) no-repeat center bottom;
			color:#73C620;
			height:34px;
		}
		

		
#spacer{
	clear:both;
	display:block;
	padding-top:80px;
}



/* - - - ALL FOOTER PROPERTIES - - - */

#footer{
	background:url(../images/footer-bg.jpg) repeat-x bottom center;
	height:258px;
}

	#footer-inside{
		width:960px;
		margin:0 auto;
	}
		#footer-inside a{
			color:#FFF;
			text-decoration:none;
			font-weight:bold;
		}
		#footer-inside a:hover{color:#A8A8A8;}

		
	ul#address{
		float:left;
		width:32%;
		height:180px;
		background:url(../images/footer-arrow.jpg) no-repeat top center;
		color:#FFF;
		font-weight:bold;
	}
	ul#address li{
		display:block; 
		line-height:1.7;
		padding:0 0 0 20px;
		margin-left:60px;
		list-style-type:none;
	}
		ul#address .title{
			font-size:16px;
			font-weight:bold;
			background:none;
			color:#73C620;
			text-transform:uppercase;
			padding-top:16px;
		}
		ul#address span{color:#018946;}
		

	ul#products{
		float:left;
		width:32%;
		height:180px;
		background:url(../images/footer-arrow.jpg) no-repeat top center;
	}
	ul#products li{
		display:block; 
		line-height:1.7;
		padding:0 0 0 20px;
		margin-left:60px;
		list-style-type:none;
		background:url(../images/footer-bullets.png) no-repeat center left;
	}
		ul#products .title{
			font-size:16px;
			font-weight:bold;
			background:none;
			color:#73C620;
			text-transform:uppercase;
			padding-top:16px;
		}
		ul#products .bullet{
			margin-left:80px;
		}
		
	ul#find{
		float:left;
		width:32%;
		height:180px;
		background:url(../images/footer-arrow.jpg) no-repeat top center;
	}
	ul#find li{
		display:block; 
		line-height:1.7;
		padding:0 0 0 20px;
		margin-left:60px;
		list-style-type:none;
	}
		ul#find .title{
			font-size:16px;
			font-weight:bold;
			background:none;
			color:#73C620;
			text-transform:uppercase;
			padding-top:16px;
		}
		
	
	#sub-footer{
		clear:both;
		display:block;
		padding:10px 0 0 80px;
		color:#FFF;
		font-size:12px;
		line-height:2;
	}
		#sub-footer a{color:#018946;}
		#sub-footer a:hover{color:#73C620;}
	
	#sub-footer span{word-spacing:20px;}
	
		#sub-right{
			float:right; 
			width:38%; 
			text-align:right;
			padding-right:30px;
			line-height:2;
		}

h1{
	font-size:16px;
	color:#016334;
	font-weight:bold;
	text-transform:uppercase;
	padding:0 0 16px 0;
}				



/* - - - - - - - - - - - - - - - - - - - - - - - - 
	DIFFERENT BODY ID'S
- - - - - - - - - - - - - - - - - - - - - - - - - - */


/* Big banner pages */
#big{
	background:#FFF url(../images/header-bg_big.jpg) repeat-x top center;
}

#big #container{
	width:960px;
	overflow:hidden;
	margin:0 auto;
	background:url(../images/container-bg_big.png) no-repeat top center;
}

	#big #banner{
		clear:both;
		height:270px;
		display:block;
		overflow:hidden;
		padding:10px 0 0 0;
		color:#FFF;
	}

	#big #info{
		float:left;
		width:450px;
		padding:20px 0 0 70px;
	}
		#big #info p#slogan{
			font-style:italic;
			font-weight:bold;
			padding:10px 0 14px 0;
		}

	#big #content{
		clear:both;
		display:block;
		overflow:hidden;
		padding:50px 30px 0 70px;
	}
		#big #content a{color:#016232; text-decoration:underline;}
		#big #content a:hover{color:#A8A8A8;}

		#big #content .left{
			float:left;
			width:45%;
			padding:0 10px 0 0;
		}
		
		#big #content .right{
			float:right;
			width:45%;
			padding:0 0 0 40px;
			background:url(../images/home-divider_vertical.jpg) no-repeat center left;
		}
			
			#big #content .quote{
				background:url(../images/home-quote.jpg) no-repeat top center;
				padding-top:20px;
				margin-top:20px;
				font-style:italic;
			}

	#big .more{ /* Home page - banner, more button */
		float:right;
		padding:10px 0 0 0;
	}


	
/* Small banner pages */
#small{
	background:#FFF url(../images/header-bg_small.jpg) repeat-x top center;
}

#small #container{
	width:960px;
	overflow:hidden;
	margin:0 auto;
	background:url(../images/container-bg_small.png) no-repeat top center;
}

#small #info{
	background:url(../images/home-banner_title.png) no-repeat;
	width:444px;
	height:60px;
	margin:26px 138px 0 0;
	float:right;
}

#small #sidebar{
	float:left;
	width:240px;
	padding:40px 0 0 80px;
	font-size:13px;
}
	#small #sidebar a{color:#979797; text-decoration:none;}
	#small #sidebar a:hover{color:#666;}
#small #sidebar h1{
	font-size:15px;
	color:#73C620;
	font-weight:bold;
	text-transform:uppercase;
	padding:0 0 16px 0;
}
	
#sidebar .divider{
	background:url(../images/sidebar-divider.jpg) no-repeat center left;
	width:235px;
	height:1px;
	float:left;
	display:block;
	margin-bottom:10px;
	padding:0 0 40px 0;
}


/* PRODUCT MANUAL PAGE - SIDEBAR */
#small #sidebar .manual{margin:0 auto; text-align:center; width:200px; float:left;}
#sidebar .manual .divider{
	background:url(../images/sidebar-divider.jpg) no-repeat center left;
	width:235px;
	height:1px;
	float:left;
	display:block;
	margin-bottom:10px;
	padding:0 0 40px 0;
}

#small #content h5{
	font-size:16px;
	font-weight:bold;
	padding:24px 0 5px 0;
	color:#016232;
}	


/* For Sidebar Arrow Lists */
#small #sidebar .arrow-left{
	float:left;
	width:40%;
	padding-left:18px;
	background:url(../images/sidebar-arrow.jpg) center left no-repeat;
}
#small #sidebar .arrow-right{
	float:left;
	width:40%;
	padding-left:18px;
	background:url(../images/sidebar-arrow.jpg) center left no-repeat;
}




#small #content{
	float:right;
	width:560px;
	padding:30px 50px 0 0;
}
#small #content p{padding-bottom:15px;}
	#small #content .left{
		float:left;
		width:45%;
		padding-top:20px;
	}
		#small #content .left a{display:block;}
	#small #content .right{
		float:left;
		width:45%;
		padding:20px;
	}
		#small #content .right a{display:block;}


		
		
		

/* - - - - - - - - - - - - - - - - - - - - - - - - 
	PRODUCT PAGES LAYOUT
- - - - - - - - - - - - - - - - - - - - - - - - - - */
		
#productviews{
	width:100%;
	height:263px;
	display:inline;
	clear:both;
}
	#productviews #s1{
		width:371px;
		height:263px;
		float:left;
		display:block;
	}
	#productviews #prev{
		background:url(../images/controls-prev.png) no-repeat center center;
		width:31px;
		height:59px;
		display:block;
		float:left;
		padding:170px 0 0 0;
	}
	#productviews #next{
		background:url(../images/controls-next.png) no-repeat center center;
		width:31px;
		height:59px;
		display:block;
		float:left;
		padding:170px 0 0 0;
	}

	
#thesmallprint{
	font-size:11px;
	text-transform:uppercase;
	clear:both;
}

#product p{padding:0 0 14px 38px;}

#product h1{
	font-size:16px;
	color:#016232;
	text-decoration:underline;
	clear:both;
	padding:20px 0 20px 0;
}

#product h2{
	font-size:16px;
	color:#73C620;
	text-transform:uppercase;
	clear:both;
	height:24px;
	padding:0 0 10px 38px;
	background:url(../images/heading-arrow.jpg) no-repeat;
}

#product h3{
	font-size:14px;
	color:#016232;
	padding:0 0 10px 38px;
	text-transform:uppercase;
}

	ul.details{padding-bottom:20px;}
	ul.details li{
		display:block; 
		line-height:1.7;
		padding:0 0 0 14px;
		margin-left:40px;
		list-style-type:none;
		background:url(../images/details-bullet.jpg) no-repeat;
		background-position:0 9px;
	}
	
	ul.specs{padding:0 0 30px 38px; width:300px;}
	ul.specs li{
		display:block;
		padding:2px 0 2px 14px;
		list-style-type:none;
	}
	ul.specs li span{float:right; width:50%;}
		.white{background:#FFF;}
		.grey{background:#F0F0F0;}
		
		
ul.versions{color:#73C620;}
	#small #sidebar ul.versions a{color:#016232;}
	#small #sidebar ul.versions a:hover{color:#666;}
ul.versions li{
	display:block;
	list-style-type:none;
	text-transform:uppercase;
	font-size:12px;
	padding-left:20px;
}
	ul.versions .title{
		font-size:14px; 
		font-weight:bold;
		padding:5px 0 2px 20px;
	}
		#small #sidebar ul.versions .title a{color:#73C620;}
		#small #sidebar ul.versions .title a:hover{color:#999;}
	ul.versions .active{
		background:url(../images/sidebar-arrow.jpg) center left no-repeat;
		padding-left:20px;
	}
		
		
			
		


/* ========== GREASE CONTAINER - OPTIONS PAGE ========== */
.slidingpoo,.slidingpee,.slidingpuke,.slidingspit,.slidingsnot,.slidingblood{display:none;}
.slidingpoo img,.slidingpee img,.slidingpuke img,.slidingspit img,.slidingsnot img,.slidingblood img{padding:10px 0 5px 10px;}
	

/*	========== TABLE STYLES FOR PRODUCT PAGES ==========	*/	

.table{font-size:11px; padding-bottom:30px;}		
th{text-align:left;}
table .title{font-size:12px;}

#product p.small{font-size:12px;}






































































































/*  "In hell people speak Spanish and the water there gives you diarrhea."  */