/*
Theme Name: Tripleoptic
Theme URI: http://tripleoptic.net
Description: Custom WordPress theme for Tripleoptic
Version: 1.0
Author: Matt Rosenzweig
Author URI: http://tripleoptic.net
*/

/* globals */
* {margin:0;padding:0;}
img {border:0;}
html {height:100%;}
body {
	height:100%;
	background:url(img/body_background.jpg) #dae3e7;
	text-align:center;
	color:#f1f6ff;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 62.5%;
}

a {color:#ffc82e;}
a:hover {text-decoration:none;}

a:active, a:focus {outline: 0;} /* hide outline in firefox when links are clicked */

/* content wrapper */
div#content {
	width:813px;
	min-height:100%;
	background:url(img/content_background.jpg) repeat-y #1b1c1d;
	margin:auto;
	text-align:left;
}

* html body div#content {
	height: 100%;
}

/* header and header items */
div#header {
	width:753px;
	height:70px;
	margin:0px 30px 0px 30px;
	padding: 30px 0 0 0;
	cursor:default;
}

div#logo {
	width:169px;
	height:51px;
	float:left;
}

div#tagline {
	width:169px;
	height:51px;
	float:right;
}

a#header_tagline {
	width:169px;
	height:51px;
	display:block;
	background:url(img/header_tagline_off.jpg) no-repeat;
}

a#header_tagline:hover, a#header_tagline:active {
	width:169px;
	height:51px;
	display:block;
	background:url(img/header_tagline_on.jpg) no-repeat;
}

/* navigation */
div#navigation {
	width:800px;
	height:35px;
	background:url(img/nav_background.jpg) repeat-x #282a2b;
	margin-left:7px;
	cursor:default;
}

div#navigation ul {
	width:250px;
	height:25px;
	list-style-type:none;
	margin:auto;
	padding-top:10px;
	display:table;
}

div#navigation ul li {
	height:14px;
	padding:0 20px 0 20px;
	display:table-cell;
	float:left;
}

a#nav_work {width:35px;height:14px;display:block;background:url(img/navitem_work_off.jpg) no-repeat;}
a#nav_work.nav_on {width:35px;height:14px;display:block;background:url(img/navitem_work_on.jpg) no-repeat;}
a#nav_work:hover, a#nav_work:active {background:url(img/navitem_work_on.jpg) no-repeat;}

a#nav_about {width:40px;height:14px;display:block;background:url(img/navitem_about_off.jpg) no-repeat;}
a#nav_about.nav_on {width:40px;height:14px;display:block;background:url(img/navitem_about_on.jpg) no-repeat;}
a#nav_about:hover, a#nav_about:active {background:url(img/navitem_about_on.jpg) no-repeat;}

a#nav_contact {width:51px;height:14px;display:block;background:url(img/navitem_contact_off.jpg) no-repeat;}
a#nav_contact.nav_on {width:51px;height:14px;display:block;background:url(img/navitem_contact_on.jpg) no-repeat;}
a#nav_contact:hover, a#nav_contact:active {background:url(img/navitem_contact_on.jpg) no-repeat;}

/* page content */
div#page {
	width:788px;
	height:100%;
	padding:30px 0px 30px 0px;
	font-size: 1.2em;
	line-height: 1.6em;
	margin:auto;
	text-align:center;
	cursor:default;
}

/* work thumbnail */
div.work {
	width:234px;
	height:174px;
	background:url(img/work_background.jpg) no-repeat;
	display:inline-block;
	zoom:1;
	*display:inline;
	margin:0px 10px 20px 10px;
	padding:3px 0px 0px 0px;
}

div.work img {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	-khtml-opacity: 0.6;
}

div.work img:hover {
	opacity: 1.0;
	filter: alpha(opacity=100);
	-moz-opacity: 1.0;
	-khtml-opacity: 1.0;
}

div.work_caption {
	font-size:11px;
	font-family:Arial, Helvetica, sans-serif;
	text-align:left;
	padding-left:5px;
	line-height:1.3em;
}

div.work_caption  span {
	color:#ffc82e;
	font-weight:bold;
}

/* work / project page */
div#work_image {
	width:744px;
	height:328px;
	background:url(img/work_image_background.jpg) no-repeat #1b1c1d;
	display:inline-block;
	zoom:1;
	*display:inline;
	padding-top:3px;
	padding-left:3px;
}

div.work_body {
	width:750px;
	display:inline-block;
	zoom:1;
	*display:inline;
	text-align:left;
	margin-top:10px;
	margin-bottom:50px;
}

div.work_body p {font-size:11px;margin-left:5px;margin-top:10px;}

/* image slider */
/*preload classes*/ 
.svw {width: 50px; height: 20px; background: #fff;} 
.svw ul {position: relative; left: -999em;} 
 
/*core classes*/ 
.stripViewer {  
position: relative; 
overflow: hidden;     
margin: 0 0 5px 0px; 
} 
.stripViewer ul { /* this is your UL of images */ 
margin: 0; 
padding: 0; 
position: relative; 
left: 0; 
top: 0; 
width: 1%; 
list-style-type: none; 
} 
.stripViewer ul li {  
float:left; 
} 
.stripTransmitter { 
overflow: auto; 
width: 1%; 
} 
.stripTransmitter ul { 
margin: 0; 
padding: 0; 
position: relative; 
list-style-type: none; 
} 
.stripTransmitter ul li{ 
width: 20px; 
float:left; 
margin: 0 1px 1px 0; 
} 
.stripTransmitter a{ 
font: bold 10px Verdana, Arial; 
text-align: center; 
line-height: 22px; 
background: #ffc82e; 
color: #1b1c1d; 
text-decoration: none; 
display: block; 
} 
.stripTransmitter a:hover, a.current{ 
background: #f1f6ff; 
color: #1b1c1d; 
} 

/* contact form */
div.contact_page {
	text-align:left;
	margin-left:20px;
}

p.contact_copy {width:720px;margin:10px 0px 30px 10px;}

form#contact_form label { width: 150px; float: left; }
form#contact_form label.error { float: none; color:#ffc82e; padding-left: .5em; vertical-align: top; }
form#contact_form p { clear: both;margin:10px 0px 10px 10px; }
form#contact_form .submit {margin-left:150px;}
form#contact_form em { font-weight: bold; width:15px; padding-right: 1em; vertical-align: top; }

form#contact_form input, form#contact_form textarea {border:0px;padding:7px;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:12px;}
form#contact_form textarea {width:350px;height:300px;}
form#contact_form .submit {padding:5px;background:#ffc82e;color:#1b1c1d;}

/* about */
div.about_page {
	text-align:left;
	margin-left:20px;
	margin-right:20px;
}

div.about_page p {margin-bottom:20px;}

img.about_photo {
	float:left;
	padding:0px 20px 0px 0px;
}