/** Begin Main Layout **/
body {
   width:100%;
   height:100%;
   color:#000;
   background: #f5f5f5;
   min-width:960px;
   position: absolute;
   z-index: 1;
}

#myCanvas {
	position: absolute;
	z-index: 0;
}

div#container {
/*   position:relative;
   min-height:100%;
   text-align:left;
   top:0px;
   left:0px;
   width:100%;
   min-width:960px;*/
}

* html div#container {
  height:100%; 
}

div#content {
   position:relative;
   float:left;
   width:960px;
   min-width:960px;
   padding-bottom: 50px;
   left:50%;
   margin-left:-480px;
   display:inline;
   clear:both;
}

div#main {
   position:relative;
   width:960px;
   left:50%;
   margin-left:-480px;
}

div#header {
   position:relative;
   width:100%;
   height:42px;
   padding-top:12px;
   margin-bottom:20px;
}

div#footer {
   position:relative;
   float:left;
   clear: both;
   width:100%;
   height:340px;
   background: transparent;
}

div#footer_content {
   border-top: 1px solid #373737;
   position:relative;
   padding-top: 75px;
   width:960px;
   height:170px;
   left:50%;
   margin-left:-480px;
   top:160px;
}

/* Global Styles */
input[type="text"],textarea {
   border:0;
   position:relative;
   padding:5px;
   border: 1px solid #ccc;
   background:url(/images/input-bg.png) 0 0 no-repeat;
}

input[type="file"] {
   color:#dadada;
}

input#searchsubmit, input#submit {
   cursor: pointer;
   background: #000;
   color: #fff;
   padding:5px;
   border: 1px solid #ccc;
}

/* Column setup */
div.left_wide {
   float:left;
   position:relative;
   width:576px;
   margin-right:30px;
   clear:left;
}
div.left_wide div.column_content {
   float:left;
   position:relative;
   width:576px;
   padding-bottom:50px;
}

div.right_thin {
   float:left;
   position:relative;
   width:354px;
   clear:right;
}

div.right_thin div.column_content {
   float:left;
   position:relative;
   width:354px;
}

div.col-5 {
   float:left;
   position:relative;
   width:162px;
   margin-right:30px;
}

div.col-5.last, div.col-5-2.last {
   margin-right:0px;
}

div.col-5-2 {
   float:left;
   position:relative;
   width:354px;
   margin-right:30px;
}

div.col-5-3 {
   float:left;
   position:relative;
   width:546px;
   margin-right:30px;
}

div.col-2 {
   float:left;
   position:relative;
   width:450px;
   margin-right:30px;
}

div.left_wide_subcol_2 {
   float:left;
   position:relative;
   width:288px;
}

div.right_thin div.column_content {
   float:left;
   position:relative;
   width:354px;
   padding-bottom:50px;
}


/** End Main Layout **/

/** Begin Headng Styles **/
h1, h2, h3, h4, h5, h6 {
   font-family:"Helvetica";
   color:#000;
   font-weight: bold;
}

h1 {
   font-size:65px;
}

h2 {
   font-size:50px;
}

h3 {
   font-size:38px;
}

h4 {
   font-size:25px;
}

h5 {
   font-size:20px;
}

h6 {
   font-size:18px;
}

a {
   color:#0099ff;
	-webkit-transition: color .3s ease-in-out !important;
	-moz-transition: color .3s ease-in-out !important;
	-o-transition: color .3s ease-in-out !important;
	-ms-transition: color .3s ease-in-out !important;	
	transition: color .3s ease-in-out !important;
}
a:hover, a:focus {
   color:#616265;
}

/** End Headng Styles **/

/** Begin Header Layout **/
div#header div#header_logo {
   clear:left;
   float:left;
   position:relative;
   width:49px;
}

div#header div#header_logo a img {
	width: 60px;
	margin: 0px 0px 20px 0px;
}
div#header div#header_nav {
   clear:right;
   position:relative;
   float:right;
   margin-right:30px;
}

div#header div#header_nav ul li {
   display:inline;
   margin-left:28px;
}

div#header div#header_nav ul li a {
   font-size:108%;
   color:#000000;
   font-weight: bold;
   text-decoration:none;
}

div#header div#header_nav ul li a:hover {
   color:#616265;
}

div#header div#header_nav ul li.active {
   margin-left:26px;
}

div#header div#header_nav ul li.active a {

  color:#616265;
}
/** End Header Layout **/

/** Begin Footer Layout **/
div#footer_logo {
   float:left;
   position:relative;
}

div#footer_logo a img {
	width: 60px;
}
div#footer div.footer_col {
   float:left;
   position:relative;
   margin-left:40px;
   width:120px;
   height:150px;
}
div#footer div.footer_col h5 {
  margin-bottom:10px;
}

div#footer div.footer_col ul li{
   list-style:none;
   font-size:11px;
   font-weight: bold;
   line-height:18px;
}

/** End Footer Layout **/

/** Begin Common Element Styles **/

span.section_header img.sh_right {
   margin-left:100%;
   left:-35px;  
}

div.top_right_image {
   position:absolute;
   top:0%;
   left:100%;
   height:32px;
   width:1px;
   display:inline-block;
   clear:both;  
}

div.bottom_right_image {
   position:absolute;
   top:100%;
   left:100%;
   height:32px;
   width:1px;
   display:none;
   clear:both;
}
.clearfix {
   zoom:1;
}

.clearfix:after {
   content: ".";
   display: block;
   height: 0px;
   clear: both;
   visibility: hidden;
}


span.section_header {
   position:relative;
   float:left;
   width:100%;
   color:#fff;
   text-transform:uppercase;
   font-size:10px;
   padding-bottom:2px;
   border-bottom:1px solid #373737;
   margin-bottom:15px;
   top:-14px;
   _top:-31px;
}

span.section_header span.section_subheader {
   color:#616265;
   font-size:10px;
}

span.section_header img {
   position:absolute;
   top:14px;
   left:0px;
}

div.flashcard {
   float:left;
   position:relative;
   height:248px;
   width:162px;
   left:-10px;
   top:-10px;
   padding:10px;
   margin-right:10px;
   display: inline;
   _margin-right:0px;
   _padding-right:0px;
   _height:255px;
   	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;	
	transition: all .3s ease-in-out;
}

div.flashcard span {
   font-size:16px;
}

div.flashcard_inner_for_hover {
   float:left;
   left:-10px;
   top:-10px;
   padding:10px;
   *padding-right:0px;
   position:relative;
   width:162px;
}

div.flashcard.big_tile div.flashcard_inner_for_hover {
   width:354px;
}

div.flashcard_inner_for_hover.over {
   	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;	
	transition: all .3s ease-in-out;
	background: #0099ff;
   -moz-box-shadow: 0px 0px 15px #444;
   -webkit-box-shadow: 0px 0px 15px #444;
   box-shadow: 0px 0px 15px #444;
}

div.flashcard_inner_for_hover.over a {
   color:#ffffff;
}

div.flashcard img {
   width:160px;
   height:77px;
   border:1px solid #575757;
   float:left;
}

div.flashcard img.bio_flashcard {
   height:114px;
}

a.about_post_image {
   width:162px;
   padding-left:4px;
   padding-right:4px;
   position:relative;
}

div.flashcard p {
   float:left;
   position:relative;
   font-size:12px;
   margin-top:4px;
   line-height:17px;
}

div.flashcard p {
   margin-left: -4px\9; /* All IEs includine IE8 */
   _margin-left:0px; /* but not IE 6 */
}

div.flashcard.last {
   margin-right:0px;
   float:right;
   clear:right;
}

.workimg-big {
   float:left;
   position:relative;
   border:1px solid #575757;
}

div.work_item {
   top:-10px;
   padding-top:10px;
   left:-10px;
   padding-left:10px;
   padding-bottom:10px;
   padding-right:10px;
   	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;	
	transition: all .3s ease-in-out;
}

div.work_item h4 {
   float:left;
   position:relative;
   width:100%;
   clear:both;
}

div.work_item a {
   float:left;
   position:relative;
}

div.work_item.over {
   background: #0099ff;
   -moz-box-shadow: 0px 0px 15px #444;
   -webkit-box-shadow: 0px 0px 15px #444;
   box-shadow: 0px 0px 15px #444;
  	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;	
	transition: all .3s ease-in-out;
}

div.work_item.over a {
   color:#ffffff;
}

div.work_item div.work_byline {
   float:left;
   position:relative;
   width:265px;
   clear:left;
}

div.work_item div.view_site {
   float:right;
   width:56px;
}

div.work_item a.shadowbox_link {
   background:url(../images/shadows/homepage328x156.png) no-repeat 4px 0px;
   width:324px;
   left:-4px;
   padding-left:4px;
   padding-right:4px;
   position:relative;
   margin-top:10px;
   padding-bottom:4px;
}

/** End Common Element Styles **/

/** 404 page **/
img#not-found {
   margin-left:79px;
   border:1px solid #575757;
   margin-top:30px;
}


/* Shadowbox hack */
div#sb-caption {
   background-color:black;
   margin-top:-100px;
   opacity:0.0;
   filter:alpha(opacity=0);
   padding:10px;
   position:relative;
   z-index:2000;
}

div#sb-caption-inner {
   font-size:16px;
   color: #fff;
}
