/*
Thirtytwo.com Stylesheet

URL: 		thirtytwo.com
Created by: 	Foxxyz/Ivo KH Janssen, Mike Rusczyk & Aren Anderson
For:		Sole Technology Inc
Site Design by:	Teh Webnerds
		
http://thirtytwo.com

*/

@font-face {
	font-family: "ko-htf48";
	src: url(/app/css/fonts/ko-htf48featherweight.ttf) format("truetype");
	}

* {
	margin: 0;
	padding: 0;
	}

	a:link, a:visited {
		text-decoration: none;
		color: #F47B20;
		background-color: inherit;
		}
	
	a:hover {
		color: #565656;
		background-color: inherit;
		}

body {
	background: #B8B6B8 url(/app/css/images/site.jpg) repeat fixed 0 0;
	color: #fff;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: .81em;
	}

fieldset {
	border: none;
	}

	fieldset div {
		margin-bottom: 15px;
		}

	fieldset legend {
		display: none;
		}

h1 {
	float: left;
	width: 136px;
	height: 37px;
	margin: 0 4px 18px 0;
	background: transparent url(/app/css/images/thirtytwo-main-logo.png) no-repeat 0 -37px;
	}

	h1 a {
		display: block;
		width: 121px;
		height: 37px;
		text-indent: -9000px;
		background: transparent url(/app/css/images/thirtytwo-main-logo.png) no-repeat 0 0;
		transition: opacity 170ms ease;
   		-o-transition: opacity 170ms ease;
   		-moz-transition: opacity 170ms ease;
   		-webkit-transition: opacity 170ms ease;
		}
		
		h1 a:hover {
			opacity: 0.0;
			}
	
h2 {
	font-family: ko-htf48, Helvetica,Arial,sans-serif;
	text-transform: uppercase;
	font-weight: normal;
	font-size: 48px;
	line-height: .8em;
	}

h3 {
	font-family: ko-htf48, Helvetica,Arial,sans-serif;
	text-transform: uppercase;
	font-size: 36px;
	line-height: .8em;
	margin-top: 1em;
	margin-bottom: .2em;
	font-weight: normal;
	}

hr {
	display: none;
	}
	
img {
	display: block;
	}	

input[type=submit] {
	color: #F47B20;
	border-style: none;
	background-color: #fff;
	text-transform: uppercase;
	padding: 4px 6px;
	cursor: pointer;
	}

	input[type=submit]:hover {
		background-color: #F47B20;
		color: #000;
		border-color: #F47B20;
		}

input[type=text], input[type=password] {
	width: 134px;
	padding: 2px 3px;
	border: none;
	font-size: 1.4em;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #5E5E5E;
	}

	input + label {
		display: inline;
		}

label {
	display: block;
	font-size: 11px;
    font-style: italic;
    font-weight: bold;
    margin-bottom: 3px;
	}

p {
	margin-bottom: 1em;
	}

select {
	width: 140px;
	border: none;
	font-size: 13px;
	padding: 4px 2px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #5E5E5E;
	}

textarea {
	width: 294px;
	font-family: inherit;
	font-size: 1.2em;
	border: none;
	padding: 2px 3px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #5E5E5E;
	}
	
/* ----- 404 ----- */

	body.error.main {
		overflow: hidden;
		}
	
	.error.main #background {
		height: auto;
	    left: 0;
	    overflow: hidden;
	    position: absolute;
	    top: 0;
	    width: 100%;
	    z-index: -1;
		}
	
	.error.main	#footer {
	    background: url("/app/css/images/site.jpg") repeat fixed 0 0 #B8B6B8;
	    bottom: 0;
	    left: 0;
	    position: fixed;
	    width: 100%;
	    z-index: 1;
		}
		
	.error.main #content {
		background-color: #FFFFFF;
	    color: #323232;
	    padding: 20px;
	    position: fixed;
	    right: 60px;
	    top: 118px;
	    width: 500px;
		}
	
		.error.main #content li {
			margin: 0 20px 15px 20px;
			font-size: 14px;
			}
			
		.error.main #content ol {
			padding-top: 8px;
			}	
	
		.error.main h2 {
			background-color: inherit;
		    border-bottom: 5px solid #292427;
		    border-top: 5px solid #292427;
		    color: #292427;
		    font-size: 113px;
		    font-weight: normal;
		    margin-bottom: 20px;
		    padding: 10px 0;
		    text-shadow: 1px 1px #D5D5D5;
			}
			
		.error.main #header {
			background-image: none;
			}

		.error.main p {
			line-height: .8em;
			margin: 4px 0 10px;
			background-image: none;
			background-color: transparent;
			color: #323232;
			padding: 0;
			font-size: 40px;
			font-family: "ko-htf48", Helvetica,Arial,sans-serif;
			font-style: normal;
			text-transform: uppercase;
			font-weight: normal;
			}
		
		.error.main p#quote {
			text-align: center;
			width: 100%;
			color: inherit;
			background-color: inherit;
			font-size: 13px;
			line-height: 18px;
			font-family: Georgia, "Times New Roman", Times, serif;
			text-transform: none;
			font-weight: bold;
			font-style: italic;
			}
			
		.error.main #wrapper {
		    height: 100%;
		    margin: 0 20px 50px;
		    overflow: visible;
		    padding: 0 20px;
		    position: relative;
		    width: auto;
			}

/* ----- ERROR and STATUS ----- */

p.error, body.error p, ul.error  {
	padding: 14px 14px 12px 60px;
	color: #fff;
	font-size: 28px;
	margin: 75px 10px 10px;
	background: #F47B20 url(/app/css/images/error-large.png) no-repeat 16px 16px;
	font-weight: bold;
	font-style: italic;
	}

	p.error a {
		color: #fff;
		background-color: inherit;
		text-decoration: underline;
		}
		
		p.error a:hover {
			color: #222;
			background-color: inherit;
			}

	.error p {
		font-size: 14px;
		text-align: left;
		line-height: 1.2;
		color: #fff;
		min-height: 11px;
		padding: 5px 6px 4px 25px;
		background: #F47B20 url(/app/css/images/error-small.png) no-repeat 8px 8px;
		margin: 0 0 5px;
		}

		#content p.error {
			margin: 0 0 20px;
			}

	p.status, body.status p, ul.status  {
		padding: 14px 14px 12px 60px;
		color: #F47B20;
		font-size: 28px;
		margin: 0 0  10px 0;
		background: #fff url(/app/css/images/status-large.png) no-repeat 16px 12px;
		font-weight: bold;
		font-style: italic;
		}

		.status p {
			font-size: 11px;
			color: #fff;
			min-height: 11px;
			padding: 9px 8px 8px 35px;
			background: #51B148 url(/app/css/images/status.png) no-repeat 8px 8px;
			margin: 0 0 5px;
			}

ul.error {
	list-style: none;
}

/******************\
|	ID SPECIFICS   |
\******************/

#background {
	width: 100%;
	height: auto;
    overflow: hidden;
    position: absolute;
    top: 0;
	left: 0;
    z-index: -1;
	}

	#background img {
		min-width: 940px;
		width: 100%;
		height: auto;
		}

#content {
	}

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

#footer {
	position: relative;
	clear: both;
	font-size: 11px;
	padding: 16px 0 20px;
	margin: 60px 20px 0;
	overflow: hidden;
	color: #9C9C9C !important;
	background-color: transparent;
	font-family: Helvetica, Arial, sans-serif;
	min-width: 940px;
	color: inherit;
	background: transparent url(/app/css/images/h-rule.png) repeat-x top left;
	}
	
	#footer a {
		color: #9C9C9C;
		background-color: inherit;
		}
		
		#footer a:focus {
			outline-style: none;
			}

		#footer a:hover {
			color: #EA6621;
			background-color: inherit;
			}

	#footer h5 {
		float: left;
		margin: 2px 0 0 0;
		}

		#footer h5 a {
			display: block;
			width: 60px;
			height: 18px;
			background: url(/app/css/images/thirtytwo-footer-logo.png) no-repeat 0 0;
			text-indent: -9000px;
			}

			#footer h5 a:hover {
				background-position: 0 -18px;
				}

	#footer ul {
		list-style: none;
		float: left;
		margin: 5px 0 0 0;
		}	
	
	#footer li {
		display: inline;
		padding-right: 2px;
		}

		#footer li:before {
			content: '/';
			padding-right: 5px;
			}

			#footer li:first-child:before {
				content: '';
				}
			
	#footer #framework-status {
		display: none;
		}
	
/* ---------- */

#header {
	margin: 0 20px;
	padding: 20px 0 0;
	height: 58px;
	color: inherit;
	background: transparent url(/app/css/images/h-rule.png) repeat-x bottom left;
	min-width: 940px;
	}
	
		#header a:focus {
			outline-style: none;
			}

	#header > ul {
		float: left;
		font-family: ko-htf48, Helvetica, sans-serif;
		font-size: 24px;
		text-transform: uppercase;
		margin-top: 5px;
		}
	
		#header > ul > li {
			float: left;
			padding: 0 2px;
			position: relative;
			}
			
			#header > ul > li > a {
				text-shadow: 1px 1px 0 #d5d5d5;
				}
			
				#header > ul > li:hover > a {
					color: #565656;
					background-color: inherit;
					}
						
				#header > ul > li > a:hover, #header > ul > li.active > a {
					padding-bottom: 27px;
					color: #565656;
					background-color: inherit;
					}

	#header  ul.snlinks {
		float: right;
		font-size: 18px;
		letter-spacing: .03em;
		margin: 8px -7px 0 0;
		}
	
	#header li {
		list-style-type: none;
		}	
		
		#header li:hover ul {
			display: block;
			}
			
		#header li a {
			color: #292427;
			background-color: transparent;
			padding: 0 5px 2px 5px;
			display: block;
			}
		
			#header li li a {
				display: block;
				padding: 4px 10px;
				border-color: #cbcaca;
				border-width: 0 1px;
				border-style: solid;
				}
				
				#header li li:first-child a {
					padding-top: 10px;
					}

				#header li li:last-child a {
					padding-bottom: 10px;
					border-bottom: 1px;
					}	
				
				#header li li a:hover, #header li li.active a {
					color: #e0dfe0;
					background-color: #656565;
					border-color: #656565;
					}		

		#header li ul {
			display: none;
			top: 52px;
			left: 2px;
			position: absolute;
			font-family: Georgia, serif;
			text-transform: uppercase;
			font-size: 11px;
			white-space: nowrap;
			color: #292427;
			background-color: #EFEFEF;
			z-index:300;
			min-width: 112px;
			
			-moz-box-shadow: 1px 2px 2px #9C9C9C;
			-webkit-box-shadow: 1px 2px 2px #9C9C9C;
			box-shadow: 1px 2px 2px #9C9C9C;
						
			background: -webkit-gradient(linear, left center, left bottom, from(#e9e9e9	), to(#bcbcbc));
			background: -moz-linear-gradient(top,  #e9e9e9, #bcbcbc);
			}
			
		#header .snlinks a {
			color: #666165;
			background-color: transparent;
			padding: 0 5px !important;
			}	
			
			#header .snlinks a:hover {
				color: #292427 !important;
				background-color: inherit;
				}		

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


	#subnavigation h3 {
		display: none;
		}

#wrapper {
	position: relative;
	padding: 0 20px;
	width: 940px;
	margin: 0 auto;
	overflow: hidden;
	}
	
#yeahbitch {
	width: 227px;
	height: 20px;
	margin: 0 3px 0 7px;
	float: left;
	text-indent: -9000px;
	border-left: 1px solid #9C9C9C;
	border-right: 1px solid #9C9C9C;
	color: inherit;
	background: transparent url(/app/css/images/thirtytwo-footer-logo.png) no-repeat -63px 1px;
	}			
	
/******************\
| CLASS SPECIFICS  |
\******************/	
		
/* ---- Login ---- */	

	.login #content {
		margin: 60px 0 200px;
		}
	
	.login h2 {
		width: 300px;
		background-color: inherit;
	    color: #292427;
	    margin-bottom: 4px;
	    text-shadow: 1px 1px #D5D5D5;
		border-bottom: 5px solid #292427;
		border-top: 5px solid #292427;
		padding: 20px 0;
		}
		
	.login input[type="text"], .login input[type="password"] {
		width: 293px;
		}
		
	.login input[type="submit"] {
		background-color: #565656;
	    border-style: none;
	    box-shadow: 0 0 6px #6A6A6A inset;
		-moz-box-shadow: 0 0 6px #6A6A6A inset;
		-webkit-box-shadow: 0 0 6px #6A6A6A inset;
	    color: #F2F2F2;
	    cursor: pointer;
	    float: left;
	    font-size: 11px;
	    padding: 2px 4px;
		}
		
		.login input[type="submit"]:hover {
			color: #F2F2F2;
			background-color: #F47B20;
			border-color: #F47B20;
			}
		
	.login form {
		padding-top: 20px;
		}	
		
		.login form div {
			margin-bottom: 1em;
			}
			
	.login label {
		background-color: inherit;
		color: #323232;
		}		
		
/* ---- Tech Section ---- */	

	.tech h2 {
		background-color: inherit;
	    color: #292427;
	    margin-bottom: 4px;
	    text-shadow: 1px 1px #D5D5D5;
		}
		
	.tech h3 {
		margin-top: 20px;
		}
		
	.tech #content {
		margin-top: 0;
		float: left;
		width: 260px;
		border-bottom: 5px solid #292427;
		border-top: 5px solid #292427;
		padding: 20px 0;
		color: #323232;
		background-color: inherit;
		}		
		
		.tech #content p {
			line-height: 1.3;
			font-family: Georgia,"Times New Roman",Times,serif;
		    font-style: italic;
		    font-weight: bold;
			margin-bottom: 0;
			}
	
	.tech #header {
		margin-bottom: 60px;
		}
		
	.tech #secondary {
		width: 620px;
		margin: 0 0 90px 10px;
		float: right;
		background-color: #FFFFFF;
		color: #323232;
		padding: 20px;
		}
		
		.tech #secondary p {
			font-size: 14px;
			line-height: 1.3;
			margin-bottom: 1em;
			}
		
		.tech #secondary li {
			list-style-type: none;
			}
		
	.tech object {
		display: block;
		}

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