html,body,div,span,applet,object,iframe,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,strong,tt,var,dl,dt,dd,blockquote,fieldset,form,i,b,caption,tbody,tfoot,thead,tr,th,td{vertical-align:baseline;margin:0;padding:0}
body{background:#fff;color:#000;line-height:1.5em;font:75%/1.5em Arial, Helvetica, "Liberation sans", "Bitstream Vera Sans", sans-serif;position:relative}
textarea{font:100%/1.5em Arial, Helvetica, "Liberation sans", "Bitstream Vera Sans", sans-serif}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
:focus{outline:1px dotted}
a{color:inherit;}
abbr,acronym{border-bottom:1px dotted;cursor:help;font-variant:small-caps}
address,cite,em,i{font-style:italic}
blockquote p{background:#eee;margin:0 1.5em 1.5em;padding:0.75em}
code,kbd,tt{font:1em/1.5em "Courier New", Courier, monospace}
del{text-decoration:line-through}
dfn{border-bottom:1px dashed;font-style:italic}
dl{margin:0 0 1.5em}
h1{font-size:2.4em;font-weight:700;margin:0 0 0}
h2{font-size:1.5em;margin:0 0 0}
h3{font-size:1.1666em;margin:0 0 1.285em}
h4{font-size:1em;margin:0 0 1.5em}
h5{font-size:0.8333em;margin:0 0 1.8em}
h6{font-size:0.666em;margin:0 0 2.25em}
img{display:inline-block;vertical-align:bottom}
ins{text-decoration:overline}
ol li{list-style:outside decimal;margin-left:15px;}
p{font-weight:300;margin:0 0 0.5em}
pre{font:1em/1.5em "Courier New", Courier, monospace;margin:0 0 1.5em;padding:0 0 0 1.5em}
sub{font-size:0.85em;line-height:1em;vertical-align:baseline;bottom:-0.4em;position:relative}
sup{font-size:0.85em;line-height:1em;vertical-align:baseline;top:-0.4em;position:relative}
ul,ol{margin:0 0 1.5em;padding:0}
li ul,li ol{margin:0}
li {margin-bottom:0.75em;}
ul li{list-style: disc}
table{border-collapse:collapse;border-spacing:0;margin:0 0 1.5em;padding:0}
caption{text-align:left;font-style:italic}
tr.alt td{background:#eee}
td{border:1px solid #000;vertical-align:middle;padding:0.333em}
th{font-weight:700;vertical-align:middle;padding:0.333em}
form button{cursor:pointer;font-size:1em;height:2em;line-height:1.5em;display:block;margin:1em 0 0;padding:0 0.5em}
form fieldset{border:0;position:relative;margin:0 0 1.5em}
form fieldset fieldset{clear:both;margin:1.5em 0 0;padding:0 0 0 1.5em}
form input{width:100%;border:0;font-size:1em;height:1.5em;line-height:1.5em;background:#eee;padding:0.375em 0}
form input[type=file]{height:2.25em;padding:0}
form textarea{width:100%;border:0;background:#eee;margin:0;padding:0.375em 0}
form select{font-size:1em;height:2.25em;line-height:2.25em;margin:0;padding:0}
form option{font-size:1em;height:1.5em;line-height:2.25em;padding:0}
form label{cursor:pointer;display:block;width:100%;margin:1.5em 0 0;padding:0}
form label input{vertical-align:top;width:auto;background:0;margin:0 0.5em 0 0;padding:0}
form legend{font-size:1.1666em;font-weight:700;left:0;margin:0;padding:0}
.amp{font-family:Baskerville, "Goudy Old Style", Palatino, "Book Antiqua", "URW Chancery L", Gentium, serif;font-style:italic}
.aside-left{clear:left;float:left;margin:0 1.5em 0 0}
.aside-right{clear:right;float:right;margin:0 0 0 1.5em}
.error{background:#fee;border:1px solid red;text-align:center;margin:1.5em;padding:0.666em}
.notice{background:#eef;border:1px solid #00f;text-align:center;margin:1.5em;padding:0.666em}
.success{background:#efe;border:1px solid #0f0;text-align:center;margin:1.5em;padding:0.666em}
.warning{background:#ffe;border:1px solid #ff0;text-align:center;margin:1.5em;padding:0.666em}
.quo{font-family:Georgia, Gentium, "Times New Roman", Times, serif}
.lquo{font-family:Georgia, Gentium, "Times New Roman", Times, serif;margin:0 0 0 -0.55em}
.section{position:relative}
.firstParagraphArticle:first-letter{font-size:3.2em;line-height:1em;float:left;font-weight:700;margin-bottom:-0.2em;padding:0.125em 0.1em 0 0}
.horizontalForm button{clear:left;float:left}
.horizontalForm input,.horizontalForm textarea{float:left;width:49%;margin:1.5em 0 0}
.horizontalForm select{float:left;margin:1.5em 0 0}
.horizontalForm label{clear:left;float:left;width:49%;padding:0.375em 0}
.horizontalForm label input{height:1em;line-height:1;width:auto;margin:0.25em 0.5em 0 0}
.horizontalForm label.singleLine{width:100%;clear:both;float:none;margin-top:0;padding:1.5em 0 0}
dt,strong,b{font-weight:700}
dd,li li{padding-left:1.5em}



html, 
body, 
#container {
  height:100%;
}

body {
  background:#121212 url('http://mikebot.net/bg.gif') top left repeat;
  color:#606060;
  font-family:helvetica, arial, sans-serif;
}

.transparent66 {
	filter:alpha(opacity=66);
	-moz-opacity:0.66;
	-khtml-opacity: 0.66;
	opacity: 0.66;
}


/* VERTICAL CENTERING */

.v_wrapper {
  display:table;
  height:100%;
  overflow;hidden;
  width:100%;
}

.v_position {
  display:table-cell;
  vertical-align:middle;
}

.v_content {

}


/* NAV */

#nav {
  position:fixed;
  top:0px;
  left:0px;
  width:240px;
  height:100%;
  z-index:2;
}

#nav_bg {
  position:absolute;
  top:0px;
  left:0px;
  height:100%;
  width:240px;
  background:#0e0e0e;
}

#nav a {
  text-decoration:none;
}

#nav .item p a {
  text-decoration:underline;
}

#logo {
  position:relative;
  display:block;
  width:240px;
  height:73px;
  background:transparent url('logo.png') center center no-repeat;
}

#logo:hover {
  background-image: url('logo_hover.png');
}

#logo .preload {
  background-image: url('logo_hover.png');
  display:none;
}

.message {
  font-size:18px;
  letter-spacing:-1px;
  font-weight:bold;
  font-style:italic;
}

.message a {
  color:#00bdec;
}

.message h1 {
  font-size:54px;
  line-height:50px;
  letter-spacing:-4px;
  text-transform:uppercase;
  font-style:normal;
  color:#fff;
  font-weight:bold;
  margin-bottom:6px;
}

.message h1 .one {
  color:#fff;
  font-size:1.4em;
}


/* NAV ITEMS */

.item {
  margin-top:3px;
  position:relative;
  height:52px;
  width:240px;
  overflow:hidden;
}

.hoverstate {
  display:none;
  width:240px;
  height:20px;
  padding:16px 0px;
  text-align:center;
}

.thumb { 
  display:block;
}

.caption {
  text-align:right;
  padding:11px 1px 11px 15px;
  height:30px;
  width:224px;
  background:none !important;
  display:none;
}

.item.selected {
  background:none!important;
}

.item.selected .hoverstate {
  display:none!important;
}

.item.selected .caption {
  display:block;
}

.item h2, 
item .hoverstate span {
  font-size:12px;
  letter-spacing:2px;
  text-transform:uppercase;
  font-weight:bold;
  line-height:15px;
  color:#999;
}

.item p {
  font-size:11px;
  line-height:13px;
  font-style:italic;
}

.item .hoverstate span {
  text-transform:uppercase;
  background:#000;
  border:solid 2px #000;
  border-width:2px 3px;
  display:inline;
  line-height:20px;
  margin-top:20px;
  font-size:9px;
  letter-spacing:1px;
  opacity:50%;
}

.item .caption h2 {
  line-height:16px;
}

.item .caption p {
  font-size:11px;
  font-style:italic;
  line-height:13px;
}


/* NAV ITEM IMAGES */

.item#t1 {
  background: transparent url('thumbs/t01.jpg') top left no-repeat;
}

.item#t2 {
  background: transparent url('thumbs/t02.jpg') top left no-repeat;
}

.item#t3 {
  background: transparent url('thumbs/t03.jpg') top left no-repeat;
}

.item#t4 {
  background: transparent url('thumbs/t04.jpg') top left no-repeat;
}

.item#t5 {
  background: transparent url('thumbs/t05.jpg') top left no-repeat;
}

.item#t6 {
  background: transparent url('thumbs/t06.jpg') top left no-repeat;
}

.item#t7 {
  background: transparent url('thumbs/t07.jpg') top left no-repeat;
}

.item#t8 {
  background: transparent url('thumbs/t08.jpg') top left no-repeat;
}

.item#t9 {
  background: transparent url('thumbs/t09.jpg') top left no-repeat;
}

.item#t10 {
  background: transparent url('thumbs/t10.jpg') top left no-repeat;
}

.item#t1 .hoverstate {
  background: transparent url('thumbs/color/t01.jpg') top left no-repeat;
}

.item#t2 .hoverstate {
  background: transparent url('thumbs/color/t02.jpg') top left no-repeat;
}

.item#t3 .hoverstate {
  background: transparent url('thumbs/color/t03.jpg') top left no-repeat;
}

.item#t4 .hoverstate {
  background: transparent url('thumbs/color/t04.jpg') top left no-repeat;
}

.item#t5 .hoverstate {
  background: transparent url('thumbs/color/t05.jpg') top left no-repeat;
}

.item#t6 .hoverstate {
  background: transparent url('thumbs/color/t06.jpg') top left no-repeat;
}

.item#t7 .hoverstate {
  background: transparent url('thumbs/color/t07.jpg') top left no-repeat;
}

.item#t8 .hoverstate {
  background: transparent url('thumbs/color/t08.jpg') top left no-repeat;
}

.item#t9 .hoverstate {
  background: transparent url('thumbs/color/t09.jpg') top left no-repeat;
}

.item#t10 .hoverstate {
  background: transparent url('thumbs/color/t10.jpg') top left no-repeat;
}

.item#t1:hover .hoverstate {
  display:block;
}

.item#t2:hover .hoverstate {
  display:block;
}

.item#t3:hover .hoverstate {
  display:block;
}

.item#t4:hover .hoverstate {
  display:block;
}

.item#t5:hover .hoverstate {
  display:block;
}

.item#t6:hover .hoverstate {
  display:block;
}

.item#t7:hover .hoverstate {
  display:block;
}

.item#t8:hover .hoverstate {
  display:block;
}

.item#t9:hover .hoverstate {
  display:block;
}

.item#t10:hover .hoverstate {
  display:block;
}


/* DEMO REEL */

#reel_wrapper {
  margin:10px;
}

#reel_position {
  width:768px;
  height:452px;

  position:relative;
  margin:0 auto;
}

#reel {

}

#shot_breakdown {
  margin:0 auto;
  color:#aaa;
  font-size:14px;
  text-align:left;
  display:none;
  padding:24px 28px;
}

#shot_breakdown a {
  color:#00bdec;
}

#shot_breakdown .title {
  color:#00bdec;
  font-weight:bold;
  letter-spacing:2px;
  font-size:11px;
  text-transform:uppercase;
  display:block;
}

#shot_breakdown .software {
  display:block;
  color:#666;
  font-size:12px;
  font-style:italic;
}

#toggle_shot, 
#toggle_reel {
  margin-top:8px;
  color:#fff;
  font-size:14px;
}


/* CONTENT */

#container {
  padding-left:240px;
  position:relative;
  text-align:center;
}

#container .v_content {
  display:none;
}

#container .v_content.active {
  display:block;
}

a {
  color:#999;
}

.display {
  padding:3px;
  border:dotted 1px #272727;
  background:#000;
  margin:10px;
}


/* HEADER / FOOTER */

#header {
  position:fixed;
  z-index:3;
  top:0px;
  left:0px;
  width:100%;
  background:#2a2a2a;
  overflow:visible;
  border-bottom:solid 1px #000;
  border-top:solid 3px #fff;
}

#header .block {
  float:left;
  padding:12px 10px 9px 10px;
  font-size:13px;
  font-family:helvetica, arial, sans-serif;
  line-height:14px;
  height:14px;
  color:#aaa;
  border-right:dotted 1px #3b3b3b;

}

#header .block.first {
  padding-left:15px;
  padding-right:15px;
}

#header .block.active {
    background:#fff;
    border-color:#fff;
 }

#header .block a {
  color:#fff;
}

 #header .block.active a {
    color:#000;
    font-style:italic;
    text-decoration:none;
  }

#footer {
  position:fixed;
  right:0px;
  bottom:0px;
  padding:3px 11px 4px 5px;
  font-size:11px;
  font-style:italic;
  color:#888;
  background:#000 url('http://mikebot.net/bg.gif') top left repeat;
}