/* -------------------------------------------------------------- 
  
   Web design & development by Justin Taylor
   howto | at | findzen.net
   
   Portions of CSS adapted from Blueprint CSS Framework 0.7.1
   http://blueprintcss.googlecode.com 
   
-------------------------------------------------------------- */




/* Reset
-------------------------------------------------------------- */

html, body { height:100% }

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

body { line-height: 1.5; }

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

/* Remove annoying border on linked images. */
a img { border: none; }




/* Typography
-------------------------------------------------------------- */

/* Default font settings. 
   The font-size percentage is of 16px. (0.75 * 16px = 12px) */
body { font-size: 75%; color: #fff; background: #faf9f5; font-family:"Helvetica Neue", Arial, Helvetica, sans-serif; letter-spacing:.4px; }


/* Headings */

h1,h2,h3,h4,h5,h6 { font-weight:normal; color: #fff; }

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; line-height:1; margin-bottom: 0.75em; }
h3 { text-transform:uppercase; font-size: 2.5em; line-height: 1; margin-bottom: .5em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img { margin: 0; }


/* Text elements */

p           { margin: 0 0 1.5em; }
p img       { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a:focus, 
a:hover     { color: #fff; }
a           { color: #fff; text-decoration: underline; font-weight:bold; }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre 				 { margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }


/* Lists */

li ul, 
li ol       { margin:0 1.5em; }
ul, ol      { margin: 0 1.5em 1.5em 1.5em; }

ul          { list-style-type: disc; }
ol          { list-style-type: decimal; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}


/* Tables */

table       { margin-bottom: 1.4em; width:100%; }
th          { font-weight: bold; background: #C3D9FF; }
th,td       { padding: 4px 10px 4px 5px; }
tr.even td  { background: #E5ECF9; }
tfoot       { font-style: italic; }
caption     { background: #eee; }


/* Misc classes */

.small      { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
.large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
.hide       { display: none; }

.quiet      { color: #666; }
.loud       { color: #000; }
.highlight  { background:#ff0; }
.added      { background:#060; color: #fff; }
.removed    { background:#900; color: #fff; }

.first      { margin-left:0; padding-left:0; }
.last       { margin-right:0; padding-right:0; }
.top        { margin-top:0; padding-top:0; }
.bottom     { margin-bottom:0; padding-bottom:0; }




/* Forms
-------------------------------------------------------------- */

form label { display:none; font-size:2em;}

.button,
button,
input,
textarea,
select { font-family:"Helvetica Neue", Arial, Helvetica, sans-serif; letter-spacing:.4px; font-size:2em; padding:5px; margin-top:10px; }

input,
textarea,
select { border:2px solid #fff; background-color:#fcfcfc; }

textarea:focus, input:focus { border: 2px solid #000; background-color:#fff; }

input 		{ width:290px; }
textarea    { float:left; width:572px; height:140px; margin-right:10px; overflow:auto; }

.button, 
button  { width:auto; display:block; float:left; border:none; margin:20px 0; padding:7px 30px; background:url(/img/bg/diag.gif); text-transform:uppercase; font-size:1.5em; font-weight:normal; color:#eee; cursor:pointer; text-decoration:none;  }
.button:after,
button:after { content: " »" }


button:hover, 
button:focus, 
button:active, 
.button:hover,
.button:focus,
.button:active 	{ color:#fff; background-color:#750101; }

button.submit 	{ width:304px; padding:7px; margin:10px 0; font-size:2em; }


/* Success, notice and error boxes */

div.error,
div.notice, 
div.success    	{ display:none; padding:5px; margin-bottom:10px; font-size:2em; }

div.error      	{ background:#FF0000; }
div.notice     	{ background: #FFF6BF; }
div.success    	{ background:#009900; }


input.error		{ color:#ff0000; }


/* Positioning, DIVs, etc.
-------------------------------------------------------------- */

body 		{  background-color:#000; }
.container 	{ width:940px; margin:0 auto; padding:0 0 80px 0; }
#ie 		{ display:none; }

body.home .content, 		
body.work div#contact, 	
body.contact div#work 	{ display:none; }

.diag 		{ position:fixed; z-index:1; top:0; left:0; width:100%; height:100%; background:url(/img/bg/diag2.gif); overflow:auto; }
img.bg 		{ position:fixed; z-index:0; top:0; left:0; width:100%; height:100%;   }

.header 	{ width:100%; margin:80px 0 40px 0; padding:20px 0; background:url(/img/bg/80pcBlack.png); }
.header h1 	{ width:940px; height:182px; margin:0 auto; background:url(/img/header.png) no-repeat; text-indent:-9000px; }

ul.nav 				{ margin:0; }
ul.nav li 			{ display:inline; float:left; list-style-type:none; }
ul.nav a 			{ display:block; width:460px; height:135px; text-indent:-9000px; }
ul.nav a:active 	{ outline:none; }
ul.nav a:focus 		{ -moz-outline-style:none; }
ul.nav a#workNav 	{ margin-right:20px; }


body.work ul.nav a#workNav:link,
body.work ul.nav a#workNav:visited,
body.work ul.nav a#workNav:hover,
body.work ul.nav a#workNav:focus,
body.work ul.nav a#workNav:active, 
ul.nav a#workNav:link,
ul.nav a#workNav:visited,
ul.nav a#workNav:hover,
ul.nav a#workNav:focus,
ul.nav a#workNav:active 				{ background:url(/img/nav/work_80pcRed.png); }

ul.nav a#workNav.collapsed:link,
ul.nav a#workNav.collapsed:visited 		{ background:url(/img/nav/work_80pcWhite.png); }
ul.nav a#workNav.collapsed:hover,
ul.nav a#workNav.collapsed:focus,
ul.nav a#workNav.collapsed:active 		{ background:url(/img/nav/work_100pcWhite.png); }

body.contact ul.nav a#contactNav:link,
body.contact ul.nav a#contactNav:visited,
body.contact ul.nav a#contactNav:hover,
body.contact ul.nav a#contactNav:focus,
body.contact ul.nav a#contactNav:active,
ul.nav a#contactNav:link,
ul.nav a#contactNav:visited,
ul.nav a#contactNav:hover,
ul.nav a#contactNav:focus,
ul.nav a#contactNav:active 				{ background:url(/img/nav/contact_80pcRed.png); }

ul.nav a#contactNav.collapsed:link,
ul.nav a#contactNav.collapsed:visited 	{ background:url(/img/nav/contact_80pcWhite.png); }
ul.nav a#contactNav.collapsed:hover,
ul.nav a#contactNav.collapsed:focus,
ul.nav a#contactNav.collapsed:active 	{ background:url(/img/nav/contact_100pcWhite.png); }


.content { clear:both; background:url(/img/bg/80pcRed.png); padding:20px; overflow:auto; }

.creative 			{ clear:both; border-top:5px solid #fff; border-bottom:5px solid #fff; margin:20px 0 0 0; padding:10px 0; overflow:auto; }
.creative h4 		{ font-style:italic; font-size:1em; letter-spacing:1px; margin-bottom:0; }
.creative h4:after 	{ content: ":" }
.creative ul 		{ list-style-type:none; margin:0 0 20px 0; line-height:2.25em; }
.creative li 		{ display:inline; padding:4px; color:#750101; font-weight:400; letter-spacing:1px; background-color:#fff; }


a.screenshot img { float:right; margin:0 0 0 10px; }

a.jump:link,
a.jump:visited 	{ clear:both; font-weight:normal; text-transform:uppercase; letter-spacing:1px; background:url(/img/icons/arrow_top.gif) no-repeat 6px 0px #fff; color:#750101; padding:3px 9px 4px 22px; text-decoration:none; font-size:1.1em; }
a.jump:hover,
a.jump:focus,
a.jump:active 	{ background:url(/img/icons/arrow_top-over.gif) no-repeat 6px 0px #fff; color:#000; }


div.serverError { display:block; width:900px; margin:20px auto;  padding:20px;  text-align:left; background-color:#000; overflow:auto; }
div.serverError .button { margin:0; }
div.serverError a.button:link,
div.serverError a.button:visited { background-color:#444; }

div.serverError h1 { margin-bottom:5px; }
div.serverError p { font-size:1.5em; margin-bottom:15px; }






/* fancybox.css
-------------------------------------------------------------- */

div#fancy_overlay 			{ position:fixed; top:0; left:0; width:100%; height:100%; background-color:#000; display:none; z-index:30}
* html div#fancy_overlay 	{ position:absolute; height:expression(document.body.scrollHeight >document.body.offsetHeight ? document.body.scrollHeight:document.body.offsetHeight+'px')}
div#fancy_wrap 				{ text-align:left}

div#fancy_loading 			{ position:absolute; height:40px; width:40px; cursor:pointer; display:none; overflow:hidden; background:transparent; z-index:100}
div#fancy_loading div 		{ position:absolute; top:0; left:0; width:40px; height:480px; background:transparent url(/img/fancybox/fancy_progress.png) no-repeat}
div#fancy_loading_overlay 	{ position:absolute; background-color:#FFF; z-index:30}
div#fancy_loading_icon 		{ position:absolute; background:url(/img/fancybox/fancy_loading.gif) no-repeat; z-index:35; width:16px; height:16px}

div#fancy_outer 	{ position:absolute;     top:0;     left:0;     z-index:90;     padding:18px 18px 33px 18px;     margin:0;     overflow:hidden;     background:transparent;     display:none}
div#fancy_inner 	{ position:relative; width:100%; height:100%; border:1px solid #BBB; background:#FFF}
div#fancy_content 	{ margin:0; z-index:100; position:absolute}
div#fancy_div 		{ background:#000; color:#FFF; height:100%; width:100%; z-index:100}
img#fancy_img 		{ position:absolute; top:0; left:0; border:0; padding:0; margin:0; z-index:100; width:100%; height:100%}
div#fancy_close 	{ position:absolute; top:-12px; right:-15px; height:30px; width:30px; background:url(/img/fancybox/fancy_closebox.png) top left no-repeat; cursor:pointer; z-index:181; display:none}
#fancy_frame 		{ position:relative; width:100%; height:100%; display:none}
#fancy_ajax 		{ width:100%; height:100%; overflow:auto}

a#fancy_left, 
a#fancy_right 		{ position:absolute; bottom:0px; height:100%; width:35%; cursor:pointer; z-index:111; display:none; background-image:url(/data:image/gif; base64,AAAA); outline:none}
a#fancy_left 		{ left:0px}
a#fancy_right		{ right:0px}

span.fancy_ico 				{ position:absolute; top:50%; margin-top:-15px; width:30px; height:30px; z-index:112; cursor:pointer; display:block}
span#fancy_left_ico 		{ left:-9999px; background:transparent url(/img/fancybox/fancy_left.png) no-repeat}
span#fancy_right_ico 		{ right:-9999px; background:transparent url(/img/fancybox/fancy_right.png) no-repeat}
a#fancy_left:hover 			{ visibility:visible}
a#fancy_right:hover 		{ visibility:visible}
a#fancy_left:hover span 	{ left:20px}
a#fancy_right:hover span 	{ right:20px}

.fancy_bigIframe { position:absolute; top:0; left:0; width:100%; height:100%; background:transparent}

div#fancy_bg 	{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:70; border:0; padding:0; margin:0}
div.fancy_bg 	{ position:absolute; display:block; z-index:70; border:0; padding:0; margin:0}
div.fancy_bg_n 	{ top:-18px; width:100%; height:18px; background:transparent url(/img/fancybox/fancy_shadow_n.png) repeat-x}
div.fancy_bg_ne { top:-18px; right:-13px; width:13px; height:18px; background:transparent url(/img/fancybox/fancy_shadow_ne.png) no-repeat}
div.fancy_bg_e 	{ right:-13px; height:100%; width:13px; background:transparent url(/img/fancybox/fancy_shadow_e.png) repeat-y}
div.fancy_bg_se { bottom:-18px; right:-13px; width:13px; height:18px; background:transparent url(/img/fancybox/fancy_shadow_se.png) no-repeat}
div.fancy_bg_s 	{ bottom:-18px; width:100%; height:18px; background:transparent url(/img/fancybox/fancy_shadow_s.png) repeat-x}
div.fancy_bg_sw { bottom:-18px; left:-13px; width:13px; height:18px; background:transparent url(/img/fancybox/fancy_shadow_sw.png) no-repeat}
div.fancy_bg_w 	{ left:-13px; height:100%; width:13px; background:transparent url(/img/fancybox/fancy_shadow_w.png) repeat-y}
div.fancy_bg_nw { top:-18px; left:-13px; width:13px; height:18px; background:transparent url(/img/fancybox/fancy_shadow_nw.png) no-repeat}

div#fancy_title 			{ position:absolute; bottom:-33px; left:0; width:100%; z-index:100; display:none}
div#fancy_title div 		{ color:#FFF; font:bold 12px Arial; padding-bottom:3px}
div#fancy_title table 		{ margin:0 auto}
div#fancy_title table td 	{ padding:0; vertical-align:middle}
td#fancy_title_left 		{ height:32px; width:15px; background:transparent url(/img/fancybox/fancy_title_left.png) repeat-x}
td#fancy_title_main 		{ height:32px; background:transparent url(/img/fancybox/fancy_title_main.png) repeat-x}
td#fancy_title_right 		{ height:32px; width:15px; background:transparent url(/img/fancybox/fancy_title_right.png) repeat-x}

