﻿/*
Sole Technology, April 20, 2007
URL: http://soletechnology.com
Created by: bill@ghettocooler.net, http://thecolab.com, http://ghettocooler.net 
Site Design by:	The CoLab
Notes: green: 75c618, overall width: 802px, content width = 776px
*/

* {margin: 0;padding: 0;}
html {
	background:#2e2e2e;
	font-size:62.5%;
	}
	body {
		padding: 0;
		font:normal 1.2em/1.2 Helvetica, Arial, Verdana, Sans-Serif;
		color:#2e2e2e;
		border: 0px solid #000;
		}	
		
abbr {
	border-bottom-style: none;
	}
		
		#thankslightbox {
			width:802px;
			margin:20px auto 40px;
			/*background:#2e2e2e url(/app/css/images/header.gif) no-repeat 0 0;*/
			}
			p {
				margin:0 0 1em 0;
				line-height:1.7;
				font-size: 13px;
				font-family:Verdana,Sans-Serif;
				}
			hr {display:none;}
				a, a:link, a:visited {
					text-decoration: none;
					color:#75c618;
					}
					
				a:hover, a:active {color:#2e2e2e;}
				
				a img, a:link img, a:visited img  {border-color:#75c618;}
				a:hover img, a:active img {border-color:#2e2e2e;}
			#header {
				height:107px;
				background-color: #fff;
				border-radius: 25px 25px 0 0;
				-moz-border-radius: 25px 25px 0 0;
				}
	/* hide outlines on image replaced links only */
	#header a {outline:none;}
	/* [Sole logo] ----------  */
	h1 {
		display:block;
		float:left;
		width:92px;height:68px;
		text-indent:-9009px;
		position:relative;
		top:23px;left:29px;
		}
		h1 span {display:none;}
		h1 a, h1 a:link, h1 a:visited  {
			display:block;
			width:100%;
			height:100%;
			background:transparent url(/app/css/images/logo-nav.gif) no-repeat 0 0;
			}

	/* [logo navigation across the top]--------  */
	ul#brand-nav { 
		position:relative;
		left:325px;top:57px; /* was 255px; */
		float:left;
		}
		ul#brand-nav li {
			display:block;
			float:left;
			}
			ul#brand-nav li a {
				display:block;
				width:25px;height:37px;
				background:transparent url(/app/css/images/brand-nav.gif) no-repeat 0 0;
				text-indent:-9009px;
				margin:0 32px 0 0;
				}
				ul#brand-nav li a:hover {
					background-position:0 -37px;
					}
			ul#brand-nav li#girl-nav a {
				width:54px;
				background-position:-50px 0;
				}
				ul#brand-nav li#girl-nav a:hover {
					background-position:-50px -37px;
					}
			ul#brand-nav li#plus-nav a {
				width:35px;
				background-position:-378px 0;
				}
				ul#brand-nav li#plus-nav a:hover {
					background-position:-378px -37px;
					}
			ul#brand-nav li#es-nav a {
				background-position:-135px 0;
				}
				ul#brand-nav li#es-nav a:hover {
					background-position:-135px -37px;
					}
			ul#brand-nav li#emerica-nav a {
				width:41px;
				background-position:-187px 0;
				}
				ul#brand-nav li#emerica-nav a:hover {
					background-position:-187px -37px;
					}
			ul#brand-nav li#thirtytwo-nav a {
				width:46px;
				background-position:-301px 0;
				}
				ul#brand-nav li#thirtytwo-nav a:hover {
					background-position:-301px -37px;
					}
			ul#brand-nav li#altamont-nav a {
				width:24px;
				background-position:-248px 0;
				}
				ul#brand-nav li#altamont-nav a:hover {
					background-position:-248px -37px;
					}
			ul#brand-nav li#sti-nav a {
				width:33px;
				background-position:-443px 0;
				margin:0;
				}
				ul#brand-nav li#sti-nav a:hover {
					background-position:-443px -37px;
					}
/* [main & footer navigations] ----------------- */
	ul.nav { 
		padding: 10px 0 8px;
		background:#75c618;
		text-transform:uppercase;
		color:#fff;
		margin:0 0 13px 0;
		}
		ul.footer {
			text-align:center;
			background:transparent;
			color:#696969;
			padding: 20px 0 0 0;
			margin:0;
			}
			ul.legal {
				text-transform:none;
				padding:2px 0;
				}
		ul.nav li { 
			display: inline;
			padding: 0;
			margin: 0;
			}
			ul.nav li:before {
				content:'|';
				}
			ul.nav li:first-child:before {
				content:'';
				}
			/*----------[/css/exploder.css for IE]--- */
			ul.nav a, ul.nav a:link, ul.nav a:visited {
				color:#fff;
				text-decoration:none;
				padding:0 14px;
				}
				/* Current items, main navigation */
				body.home ul.nav li.home a,
				body.brands ul.nav li.brands a,
				body.pas ul.nav li.pas a,
				body.company ul.nav li.company a,
				body.employment ul.nav li.employment a,
				body.contact ul.nav li.contact a,
				body.press ul.nav li.press a {color:#2e2e2e;}
					ul.nav a:hover, ul.nav a:active {color:#2e2e2e;}
				ul.footer a, ul.footer a:link, ul.footer a:visited  {
					color:#696969;
					padding:0 10px;
					}
					
				ul.nav li:last-child a {
					padding-right: 0;
					}	
					
				/* Current items, footer navigation */
				/*
				body.home ul.footer li.home a,
				body.brands ul.footer li.brands a,
				body.company ul.footer li.company a,
				body.contact ul.footer li.contact a,
				body.pas ul.footer li.pas a,
				body.employment ul.footer li.employment a,
				body.press ul.footer li.press a 
				*/
				ul.footer li a.active { color:#fff; }
				
					ul.footer a:hover, ul.footer a:active {color:#fff;}

					ul.legal a {
						padding:0 5px;
						}
	/*[sub navigation]---------------------------------------------*/
	.subnav {
		float:left;
		margin:0 13px 0 0;
		background:#75c618 url(/app/css/images/subnav-corner.gif) no-repeat bottom left;
		width:228px; /* 248 */
		height:253px;
		padding: 10px 0 0 20px;
		}
		.subnav h2 {color:#fff; margin-bottom:4px;}
		
		.employment .subnav {
			height:auto;
			}
			
			.employment .subnav a.rss {
				font-size: 11px;
				padding: 0 10px 0 27px;
				margin: 0 0 15px;
				display: block;
				color: #32540a;
				background: transparent url(/app/css/images/rss-icon.png) no-repeat 0 2px;
				text-decoration: none;
				}
				
				.employment .subnav a.rss:hover {
					color: #fff;
					background-position: 0 -77px;
					}
					
	.subnav h4 {
		font-weight: normal;
		font-size: 12px;
		display: none;
		}	

		.subnav ul {
			margin:0 10px 24px 18px;
			}
			
		.subnav ul li {
			color:#fff;
			line-height: 1.1;
			margin: 0 0 6px 0;
			}
			
		.subnav li li {
			color: #beed89;
			}
			
		.pas .subnav li li {
			list-style-type: none !important;
			}
						
			.pas .subnav li li li {
				list-style: circle !important;
				}
				
			.pas .subnav li ul {
				margin: 2px 0 0 10px;
				}	
				
				.pas .subnav li ul ul {
					margin: 5px 0 6px 10px;
					list-style-type: circle;
					}
		
			.subnav li ul {
				margin: 6px 0 0 10px;
				}
				
		.subnav ul a, .subnav ul a:link, .subnav ul a:visited {
			color:#fff;
			text-decoration:none;
			}
			.subnav ul a:hover, .subnav ul a:active {
				color:#2e2e2e;
				}

.wrapper ul.nav li a.active,
.wrapper .subnav ul li a.active
{
	color:#2e2e2e;
	}
body.environmental .subnav ul li.environmental-seed a,
body.environmental .subnav ul li.environmental-carbon a,
body.main .subnav ul li.main li.timeline a,
body.projects .subnav ul li.projects li.hour a,
body.projects .subnav ul li.projects li.seed a,
body.projects .subnav ul li.projects li.global-green a {
	color:#fff;
	}
/*[content]---------------------------------------------*/

.wrapper {
	display:block;
	background:#fff;
	color:#2e2e2e;
	padding: 0 13px 80px;
	height:1%;
	}
	
	.wrapper:after {
		content:'';
		display:block;
		clear:both;
		}
			
	.hero {
		display:block; 
		float:left;
		border-style: none;
		}	
		
#flash-internal {
	margin-bottom:23px;
	}
	
/* [left side images] ---- */

.callouts {
	margin-top:13px;
	width:248px;
	float:left;
	text-align:right;
	}
	
	.callouts a img {
		border-style:none;
		}
	
	.callouts img {
		float: right;
		margin:0 0 10px 0;
		opacity: .4;
		}
		
		.callouts a:hover img {
			opacity: 1.0;
			}
		
	.callouts img.second {
		margin-right:10px;
		}
	
	.content {
		margin:0 0 40px 11px;
		float:left;
		width: 504px;
		}
		
		.content h2 {
			color: #363636;
			padding: 23px 0 15px 0;
			border-bottom: 1px dashed #B4D094;
			margin: 0 0 15px 0;
			font-size: 24px;
			line-height:1.3;
			font-weight: bold;
			}
			
			.content h2 small {
				display: block;
				font-size: 13px;
				padding: 5px 0 0;
				}
			
		.community .content h3 {
			color: #363636;
			padding: 20px 0 5px 0;
			margin: 20px 0 0 0;
			font-size: 26px;
			line-height:1;
			font-weight: bold;
			}	

		.content h3 span.q  {
			margin-bottom: 10px;
			font-size: 16px;
			}
		
			.content h3 cite {
				display: block;
				margin: 0 0 10px 40px;
				}
		
		span.q {
			padding:15px 16px 0 75px;
			display:block;
			font-size:1.5em;
			line-height:1.1;
			}
			
			.content span.q {
				padding:0;
				}
				
		h2 sup {
			text-transform:lowercase;
			}
			
/* [employment] --------------  */

	.content-employment {
		float:left;
		margin:0;
		width:513px;
		}
		
		.content-employment h2 {
			background:#2e2e2e;
			color:#fff;
			padding:13px;
			margin:0 0 13px 0;
			text-transform:uppercase;
			}
			
			.content-employment * {
				margin-right:13px;
				margin-left:13px;
				}
				
			.content-employment * * {
				margin-left:0;
				margin-right:0;
				}
				
			.content-employment h3 {
				margin-top:13px;
				text-transform:uppercase;
				}
				
			.content-employment ul {
				margin:10px 0 0 27px;
				}
				
			.content-employment ul li {
				margin-bottom:6px;
				}
				
.more {
	margin-top:13px;
	}

		.environmental .content li li, .environmental.production .content li {
	   		margin: 0 0 16px 1.2em;
	   		list-style-type: disc;
	   		font-size: 13px;
	   		line-height: 1.6;
			overflow: visible
	   		}
	
	.environmental h4 {
		margin-bottom: 8px;
		}
	
	.environmental .video {
		margin-bottom: 30px;
		}
	
.even-more {
	margin-top:26px;
	}
	
	
/*[brands.css]---------------------------------------------*/


/*[contact, please support microformats!]---------------------------------------------*/
.vcardFormat {
	display:block;
	margin:0 0 13px 0;
	}
	
	.vcardFormat * {
	border:0px solid #ff0000;
	}
	
	.org, .geo, .type, .hidden, legend {
		display:none;
		}
		
	form, ul.error {
		margin:0 0 13px 0;
		}
		
	.error ul.error {
		margin:5px 0 10px 20px;
		}
	
	form div {
		margin:0 0 7px 0;
		}
		
	div.error p {
		color:#ff0000;
		}
		
	fieldset {
		border-style:none;
		}
		
	label {
		display:block;
		}
		
	input, textarea {
		border:1px solid #2e2e2e;
		}
		
	input:hover, textarea:hover {
		border:1px solid #75c618;
	}
	
	.login fieldset {
		width: 300px;
		}
	
	.login h2 {
		font-size: 16px;
		line-height:1;
		margin: 20px 0;
		text-transform: uppercase;
		}
	
	.login input {
		font-size: 16px;
		padding: 4px;
		color: #555;
		background-color: inherit;
		}	
		
		.login input[type="checkbox"] {
			border-style: none;
			margin: 2px 0 8px;
			padding: 2px;
			}

		.login input[type="checkbox"] + label {
			display: inline;
			font-size: 14px;
			padding-left: 3px;
			}
			
	.login input#login_submit {
		font-size: 20px;
		margin: 0 0 20px 92px;
		cursor: pointer;
		padding: 4px 12px;
		color: #fff;
		background-color: #75C618;
		border-color: #68b114;
		}		
		
		.login input#login_submit:hover {
			color: #fff;
			background-color: #426e10;
			border-color: #35580c;
			}
		
	.login label {
		margin-bottom: 2px;
		}	
		
	.login form div {
		margin-bottom: 20px;
		}
		
		.pas .content p, .environmental .content p {
			font-size: 12px;
			margin-bottom: 1.6em;
			font-family: Verdana,Sans-Serif;
			}
			
		.environmental .content h3 {
			font-size: 18px;
			padding: 30px 0 5px;
			font-family: Helvetica, Arial, Verdana, Sans-Serif;
			}
			
		.pas .content h3, .environmental.main .content h3 {
			font-size: 18px;
			}
			
		.pas .content img, .environmental .content img {
			border-style: none;
			margin-bottom: 10px;
			border: 1px solid #f2f2f2;
			}	
			
			.pas .content h3 a, .environmental .content h3 a {
				color: #363636;
				background-color: inherit;
				text-decoration: none;
				}	
				
				.pas .content h3 a:hover, .environmental .content h3 a:hover {
					color: #75C618;
					background-color: inherit;
					}
					
	.pas .content, .environmental .content {
		font-family: Verdana, Sans-Serif;
		margin-bottom: 0;
		}
			
		.pas.projects .content ul, .environmental .content ul {
			list-style-type: none;
			}	
				
		.pas .options a, .environmental .options a {
			display: block;
			padding: 4px 10px;
			margin-right: 10px;
			float: left;
			font-size: 10px;
			color: #fff;
			background-color: #75C618;
			text-decoration: none;
			border-radius: 2px;
			-moz-border-radius: 2px;
			}
			
			.pas .options a:hover, .environmental .options a:hover {
				color: #fff;
				background-color: #363636;
				}	
				
	.pas a.thickbox {
		text-decoration: none;
		}
				
		.pas.projects .content li, .environmental.main .content li {
			margin-bottom: 70px;
			overflow: hidden;
			}
		
	.pas .video {
		margin-bottom: 1em;
		}	
		
	.pas .video object {
		display: block;
		}
		
	.content a:focus {
		outline-style: none;
		}		
	
/* ------------ */	

	.main blockquote {;
		padding: 30px 50px;
		margin: 1.8em 0;
		line-height: 1.5;
		font-family: Helvetica, Arial, Verdana, Sans-Serif;
		color: #7c9765;
		background-color: #F0F7EA;
		border-radius: 2px 2px 2px 25px;
		-moz-border-radius: 2px 2px 2px 25px;
		}
		
		.main blockquote cite {
			font-size: 1.1em;
			display: block;
			font-size: 12px;
			color: #75C618;
			background-color: inherit;
			}
		
		.main blockquote q, .pas.main blockquote q {
			display: block;
			font-size: 18px;
    		font-style: italic;
			line-height: 1.5;
			margin-bottom: .6em;
			font-family: Helvetica, Arial, Verdana, Sans-Serif;
			}
			
			.main blockquote q:first-letter, .pas.main blockquote q:first-letter {
				 float: left;
    			font-size: 66px;
    			margin-left: -30px;
				color: #7c9765;
				font-family: Georgia,serif;
				}	

/* ------------ */		    		

		.projects-pas-collection .content h3 {
		    clear: both;
			padding-top: 40px;
		    }

	.projects-pas-collection .callouts {
		display: none;
		}
		
	.projects-pas-collection .content {
		float: right;
		width: 522px;
		margin-bottom: 60px;
		}		
			
		.projects-pas-collection h2, .projects-pas-collection h3, .projects-pas-collection h4, .projects-pas-collection p {
			margin-left: 7px;
			}
			
		.projects-pas-collection .content h4 {
			padding: 10px 0 4px;
			}	
			
		.projects-pas-collection .content ul {
			overflow: hidden;
			list-style-type: none;
			margin-bottom: .5em;
			}		
			
			.projects-pas-collection .content ul li {
				width: 160px;	
				float: left;
				margin: 7px;
				}
				
				.projects-pas-collection .content ul li img {
					padding: 4px 0;
					}
				
			.projects-pas-collection .content ul span {
				display: block;
				text-align: center;
				color: #c6c6c6;
				background-color: inherit;
				font-size: 10px;
				}
				
			.projects-pas-collection .content ul a:focus {
				outline-style: none;
				}	
				
				.projects-pas-collection .content ul a:hover span {
					color: #75C618;
					background-color: inherit;
					}	
				
		.projects-pas-collection .content a img {
			border: 1px solid #f6f6f6;
			}	
			
			.projects-pas-collection .content a:hover img {
				border-color: #d4e9b8;
				}
		
	.projects-pas-collection ol {
		list-style-type: none;
		overflow: hidden;
		}
		
		.projects-pas-collection .content ol p {
			clear: both;
			font-size: 11px;
			margin: 0 10px 1.5em 7px;
			}
			
	.projects-kia-special blockquote {
		padding: 34px 18px 10px 30px;
		border-left: 5px solid #e9e9e9;
		border-bottom: 2px solid #e9e9e9;
		color: #565656;
		background: transparent url(/app/css/images/pas-pullquote.png) no-repeat 10px 0px;
		margin: 0 0 1.8em;
		}	
			
		.projects-kia-special .content li {
			margin: 0 0 5px 14px;
			}	
			
		.projects-kia-special .content ul {
			margin-bottom: 2.8em;
			}
			
	.pas .toplink {
		float: right;
		opacity: .5;
		font-size: .9em;
		padding: 20px 10px;
		display: block;
		text-decoration: none;
	}			
		
/*======= P2P =======*/		

	.p2p a img {
		border-width: 1px;
		border-color: #c9cdc8;
		margin-bottom: 5px;
		}
		
		.p2p a:hover img {
			border-color: #75C618;
			} 

	.p2p a.example {
		width: 382px;
		float: left;
		text-decoration: none;
		text-align: center;
		display: block;
		margin: 20px 3px 30px;
		}	

		.p2p #content li {
			margin: 0 0 8px 20px;
			font-size: 11px;
			}	
	
		.p2p #content ul {
			padding: 2px 10px 25px;
			}	
	
			.p2p #content li ul {
				padding: 0 0 5px;
				}

	.p2p h2, .sb657 h2 {
		color: #2E2E2E;
		font-size: 2.3em;
		padding: 35px 0 0;
		text-align: center;
		}
			
		.p2p h2 span {
			font-size: .6em;
			}
	
	.p2p h3, .sb657 h3 {
		font-size:1.8em;
		line-height:1.1;
		margin: 50px 10px 15px;
		padding-bottom: 4px;
		border-bottom: 1px dashed #2E2E2E;
		}
	
	.p2p h4 {
		font-size: 14px;
		padding: 20px 10px 3px;
		}
		
	.p2p h4#user-operation {
		padding-top: 0;
		}
		
	.p2p p code, .p2p li code {
		font-size: 12px;
		color: #222;
		background-color: #eae5e5;
		padding: 0 3px;
		}
		
	.p2p p, .sb657 p {
		font-size: 1.1em;
		padding: 0 10px;
		}	
		
	.p2p pre {
		font-size: 11px;
		color: #000;
		background-color: #eae5e5;
		border: 1px solid #dedbdb;
		padding: 15px 20px 0;
		margin: 0 5px 20px;
		width:724px;
		overflow: visible;
		}	
		
	.p2p .wrapper, .sb657 .wrapper {
		padding: 0 13px 55px;
		}	
