/* =ORDER
 1. display
 2. float and position
 3. width and height
 4. Specific element properties
 5. margin
 6. border
 7. padding
 8. background
 9. color
10. font related properties
----------------------------------------------- */

/** =MAIN
----------------------------------------------- */
body, td, input, select, textarea, a {
  font: 95%/1.3em "Helvetica Neue", arial, helvetica, verdana, sans-serif;
}
body {
  margin: 0;
  padding: 0;
  background: #3D79AA url("/images/common/bg_fade.gif") left top repeat-x;
  color: #333;
}
img, table {
  border-width: 0;
}
table {
  padding: 0;
}
td {
  vertical-align: top;
  margin: 0;
  padding: 0;
}
form {
  display: inline;
}
a {
  text-decoration: underline;
  font-size: 100%;
}
a:link {
  color: #307AB4;
}
a:visited {
  color: #69A8DA;
}
a:hover {
  color: #333;
}
p {
  font-size: 1em;
  line-height: 1.3em;
  margin: 0 0 1.25em 0;
}
h1 {
  font-size: 2em;
  line-height: 0.75em;
  margin: 9px 20px 0.25em 20px;
  color: #307AB4;
}
.snippet {
  margin: 0 20px 20px 20px;
  border-bottom: 1px solid #EAEAEA;
  padding-bottom: 1em;
  font: italic 1.125em/1.333em georgia, times, serif;
  color: #555;
}
h2 {
  font-size: 1.5em;
  line-height: 1em;
  margin: 1.5em 0 0.5em 0;
}
h3 {
  font-size: 1.125em;
  line-height: 1.333em;
  margin-bottom: .5em;
}
h4 {
  font-size: 1em;
  line-height: 1.5em;
  margin: 1.5em 0 .75px 0;
}
.top {
  margin-top: 0;
}
h2.top,
h3.top {
  line-height: 1em;
}

/** =COMMON
----------------------------------------------- */
/* clear float */
.clr:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}
.clr {display: inline-block;}
/* Hides from IE-mac \*/
* html .clr {height: 1%;}
.clr {display: block;}
/* End hide from IE-mac */

.none {
  display: none;
}
.vtop {
  vertical-align: top;
}
.vmid {
  vertical-align: middle;
}
.vbot {
  vertical-align: bottom;
}
.left {
  float: left;
  display: inline;
}
.right {
  float: right;
  display: inline;
  text-align: right;
}
.center {
  text-align: center;
}
.img_left {
  float: left;
  display: inline;
  margin: 5px 10px 0 0;
  border: 2px solid #666;
}
.img_right {
  float: right;
  display: inline;
  margin: 5px 0 0 10px;
  border: 2px solid #666;
}
code, .path {
  background-color: #efefef;
  border: 1px solid #e1e1e1;
  border-width: 1px 0;
  font-family: "Courier New", Courier, monospace;
  font-size: 90%;
}
.amp {
  font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
  font-weight: normal;
  font-style: italic;
}

/** =ERROR PAGES 404/500
----------------------------------------------- */
#error {
  width: 318px;
  margin: 70px auto;
  padding: 5px 30px 15px 30px;
  background-color: #f9f9f9;
  border: 1px solid #14507F;
}
#error #logo {
  margin-bottom: 5px;
}
#error p {
  margin: 10px 5px 0 5px;
}

/** =LAYOUT
----------------------------------------------- */
#wrapper {
  width: 782px;
  margin: 0 auto;
}
#edge_wrapper_right {
  width: 782px;
  margin-top: 4px;
  background: url("/images/common/side_fade_right.gif") right top repeat-y;
}
#edge_wrapper_left {
  background: url("/images/common/side_fade_left.gif") left top repeat-y;
}
#header, #footer, #nav, #sub_nav, #content {
  margin-left: 11px;
  width: 760px;
}
#main {
  float: left;
  display: inline;
  width: 473px;
  margin: 0 20px 0 20px;
  font-size: 93%;
}
#main p {
  text-align: justify;
}
#main.full {
  width: 708px;
}
#main h3.box {
  margin: 0;
  background-color: #E4E4E4;
  padding: 5px 20px 3px 20px;
}
#main h3.box span {
  font-weight: normal;
  color: #666;
}
#main .box_content {
  margin: 0 0 10px 0;
  padding: 15px 10px;
  background-color: #efefef;
  list-style: none;
}
#sidebar {
  float: right;
  display: inline;
  width: 221px;
  margin-right: 20px;
}

/** =FORMS
----------------------------------------------- */
.forms {
  margin: 20px 0;
}
.forms.top {
  margin-top: 0;
}
.forms label {
  display: block;
}
.forms label.inline {
  display: inline;
}
.forms fieldset {
  width: 440px;
  border-width: 0px;
  padding: 8px 0 8px 0;
}
.forms legend {
  font-weight: bold;
  padding: 5px 0;
}
em.req {
  color: #3D79AA;
  font-style: normal;
}
.required {
  margin: 5px 0 10px 0;
}
.forms .text {
  margin-bottom: 15px;
  width: 100%;
}
.forms .half {
  margin-bottom: 15px;
  width: 50%;
}
.fieldWithErrors {
  display: inline;
}
.forms .other {
  display: none;
}

/** =FLASH MESSAGES 
----------------------------------------------- */
#message_box {
  width: 90%;
  margin: 4px 0 15px 15px;
  border: 1px solid #bbb;
  padding: 5px 8px;
  background-color: #efefef;
}
#message_box img {
  margin-right: 3px;
}
#message_box strong {
  color: #333;
}
#message_box ol {
  margin: 5px 4px;
}
#err_fix {
  margin: 8px 0 3px 24px;
  font-style: italic;
  font-size: 90%;
}

/** =FIGURES 
----------------------------------------------- */
.figure {
  padding: 5px;
  background-color: #E4E4E4;
}
.inline_figure img,
.figure img {
  border: 1px solid #999;
}
.figure {
  font-size: 80%;
}
.figure p,
#sidebar .figure p {
  margin: 7px 4px 0 4px;
}
.figure .title {
  font-size: 90%;
  font-weight: bold;
}
.figure .caption {
  margin-top: 3px;
}


/** =HEADER
----------------------------------------------- */
#header {
  height: 56px;
}
#header .left {
  padding-top: 4px;
}
#header .right {
  padding: 30px 15px 0 0;
  font-size: 90%;
}
#header, 
#header a {
  color: #fff;
}
#logo span, #logo a {
  display: block;
  width: 179px;
  height: 51px;
  background: url("/images/common/logo.gif") no-repeat;
}
#logo img {
  display: block;
  width: 0;
}

/** =NAV
----------------------------------------------- */
#nav {
  background: #fff url("/images/common/tab_bg.gif") left top repeat-x;
}
#nav ul {
  list-style: none;
  margin: 0;
}
#nav li {
  float: left;
  display: inline;
  font-size: 90%;
}
#nav li a {
  float: left;  
  display: inline;
  margin-left: 4px;
  padding: 8px 9px 19px 9px;
  font-weight: bold;
  color: #fff;
}
#nav.with_subnav li a {
  padding: 8px 9px 11px 9px;
}
#nav a {
  text-decoration: underline;
}
#nav a:hover,
#nav .sel a, 
#nav .sel a:visited {
  background: #439B32 url("/images/common/tab_arrow.gif") center 0px no-repeat;
  text-decoration: none;
}
#nav.with_subnav .sel a, 
#nav.with_subnav .sel a:visited {
  background: #439B32;
} 

#nav .left { 
  padding-left: 7px;
}
#nav .right { 
  padding-right: 7px;
}

#sub_nav ul {
  padding: 0 10px;
  margin: 0 auto;
  background: #fff url("/images/common/tab_sub_bg.gif") left top repeat-x;
  list-style: none;
}
#sub_nav ul li {
  float: left;
  display: inline;
  margin: 0 3px;
  font-size: 90%;
}

#sub_nav a,
#sub_nav a:visited {
  display: block;
  float: left;
  display: inline;
  background: transparent;
  text-decoration: underline;
  padding: 8px 9px 17px 9px;
  color: #333;
}
#sub_nav a:hover,
#sub_nav .sel a,
#sub_nav .sel a:visited  {
  color: #000;
  background: #D3D3D3 url("/images/common/tab_sub_arrow.gif") center 35px no-repeat;
  text-decoration: none;
}

/** =FOOTER
----------------------------------------------- */
#footer {
  padding: 8px 15px 5px 15px;
  width: 730px;
  font-size: 90%;
  background-color: #E4E4E4;
}

/** =CONTENT
----------------------------------------------- */
#content {
  padding: 12px 0;
  background: #fff;
  /* background: #fff url("/images/common/24_line_height.gif") 0 0; */
}
#main dl {
  margin-left: 14px;
}
#main dd {
  margin-left: 0;
  padding-left: 10px;
}


/** =SIDEBAR
----------------------------------------------- */
#sidebar ul, 
#sidebar dl {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
#sidebar dt {
  margin: 3px 0 0 0;
}
#sidebar dd {
  margin: 0;
  padding: 1px 0 3px 0;
  font-style: italic;
  line-height: 1em;
  color: #666;
  font-size: 95%;
}
#sidebar .side_item {
  margin-bottom: 25px;
  font-size: 90%;
}
#sidebar p.contact {
  margin-bottom: 10px;
}
#sidebar .url {
  font-size: 85%;
}

#sidebar h4 {
  margin: 0;
  font-size: 1.125em;
  line-height: 1.5em;
  color: #439B32;
}
#sidebar p {
  font-size: 95%;
  margin: 0;
}
#sidebar .side_nav {
  font-weight: bold;
}
#sidebar .side_nav p, 
#sidebar .side_nav a {
  font-weight: normal;
}


/** =HOME
----------------------------------------------- */
#flipper {
  width: 443px;
  height: 276px;
  border-top: 1px solid #dfdfdf;
  border-left: 1px solid #dfdfdf;
  border-right: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
  background-color: #f4f4f4;
  padding: 12px 13px 8px 13px;
  margin-bottom: 1.5em;
}
#flipper #flipper_images {
  width: 441px;
  height: 198px;
  border: 1px solid #a5a5a5;
  background-color: #fff;
}
#flipper_images li, 
#flipper_images a {
  float: left;
}
#flipper_images img {
  margin: 0;
}
#flipper ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#flipper .controls {
  height: 26px;
  background: url("/images/common/flipper_line.gif") left bottom no-repeat;
  margin: 6px 0;
  padding: 2px 0;
  font-size: 90%;
  line-height: 1em;
}
#flipper .controls a, 
#flipper .controls a:visited {
  display: block;
  text-indent: -9999px;
  outline: none;
  line-height: 1em;
}
#flipper .controls .title {
  width: 140px;
  float: left;
  display: inline;
  color: #999;
  margin-top: 4px;
}
#flipper #flipper_nav {
  width: 66px;
  float: left;
  display: inline;
  margin: 6px 47px 0 47px;
  text-align: center;
}
#flipper #flipper_nav a {
  float: left;
  display: inline;
  width: 10px;
  height: 10px;
  margin: 0 3px;
  background: url("/images/icons/circles.gif") -20px 0 no-repeat;
}
#flipper #flipper_nav a.sel {
  text-decoration: none;
  background: url("/images/icons/circles.gif") 0 0 no-repeat;
}
#flipper #flipper_nav a:hover {
  background: url("/images/icons/circles.gif") -10px 0 no-repeat;
}

#flipper #flipper_buttons {
  width: 140px;
  float: left;
  display: inline;
  text-align: right;
}
#flipper #flipper_buttons span,
#flipper #flipper_buttons a {
  width: 23px;
  height: 20px;
  float: right;
  display: inline;
  text-decoration: none;
}

#flipper #flipper_buttons span.prev_disabled {
  background: url("/images/buttons/flippers.gif") 0 0 no-repeat;
}
#flipper #flipper_buttons span.next_disabled {
  background: url("/images/buttons/flippers.gif") -23px 0 no-repeat;
}
#flipper #flipper_buttons a.prev {
  background: url("/images/buttons/flippers.gif") 0 -20px no-repeat;
}
#flipper #flipper_buttons a.next {  
  background: url("/images/buttons/flippers.gif") -23px -20px no-repeat;
}

#flipper #flipper_buttons a.prev:hover {
  background: url("/images/buttons/flippers.gif") 0 -40px no-repeat;
}
#flipper #flipper_buttons a.next:hover {
  background: url("/images/buttons/flippers.gif") -23px -40px no-repeat;
}

#flipper #flipper_text {
  font-size: 90%;
  line-height: 1.3em;
}
#flipper_text li {
  height: 40px;
  background-color: #f4f4f4;
  color: #333;
}

#home_services {
  margin-bottom: 20px;
}
#home_work {
  margin-top: 8px;
  margin-bottom: 5px;
}
#home_clients {
  margin-bottom: 40px;
}

#main h2 {
  font-size: 125%;
  margin-bottom: 5px;  
}
#home_services h2 {
  margin-top: 0;
}
#home_services p {
  margin: 5px 0 20px 0;
}
#home_clients h2 {
  font-size: 125%;
  margin-bottom: 10px;
}
#home_clients p {
  margin: 5px 0 20px 0;
}
#home_clients .figure {
  margin: 0 8px 8px 0;
}

#home_work h2 {
  font-size: 125%;
  margin-bottom: 10px;
}
#home_work .desc {
  margin-top: 10px;
}

.home_box {
  background-color: #efefef;
  padding: 6px 12px;
  font-size: 95%;  
}
.home_box h4 {
  margin: 7px 0 3px 0;
}
.home_box p {
  margin: 0;
  
}
.home_box ul {
  list-style: none;
  margin: 5px 0 18px 0;
  padding-left: 0;  
}
.home_box .all a {
  color: #333;  
}
.home_box .news .date {
  padding-left: 5px;
  font-size: 90%;
  color: #666;
}

#more_work .figure {
  margin: 2px 5px 5px 0;
}
#more_work dl {
  margin-bottom: 5px;
}
#more_work dt {
  margin-bottom: 2px;
}
#more_work dd {
  font-size: 88%;
  font-family: inherit;
  font-style: normal;
}
#newest_book .book {
  margin: 5px 0;
}
#newest_book .publisher {
  font-size: 84%;
  
}

/** =ABOUT
----------------------------------------------- */
#management h3 {
  margin: 30px 0 0 0;
}
#management h4 {
  margin: 3px 0 0 0;
  color: #666;
  font-weight: normal;
  font-style: italic;
  font-size: 90%;
}
#management .email {
  margin-bottom: 5px;
}
.about_position {
  font-style: italic;
}
#locations p {
  line-height: 1.7em;
  font-size: 84%;
  color: #333;
}
#locations h5 {
  margin: 10px 0 0 0;
  font-size: 100%;
}
#locations .city {
  margin: 0;
  color: #666;
}
#brochure p {
  font-size: 90%;
}
#about_index .news {
  font-size: 84%;
  line-height: 1.4em;
}
#about_index .news {
  margin-top: 10px;
}
#about_index .news li {
  margin: 0;
  padding-bottom: 8px;
}
#about_index .news .date {
  color: #666;
}

/** =LIGHTBOX
----------------------------------------------- */
div#outerImageContainer {
  border: 1px solid #fff;
  border-bottom: 0;
}
div#imageDataContainer {
  background-color: #e4e4e4;
  border: 1px solid #fff;
  border-top: 0;
}
img#lightboxImage {
  border: 1px solid #999;
}
div#imageContainer {
  background-color: #e4e4e4;
}
div#imageData {
  padding-top: 5px;
  font-weight: bold;
  color: #333;
}

div#bottomNav {
  overflow: hidden;
}

/** =VIDEO
----------------------------------------------- */
#player {
  display: block;
  width: 460px;
  height: 370px;
}

/** =OUR PRODUCTS
----------------------------------------------- */
#products_index #main {
  width: 730px;
  margin: 0 15px;
}
.products .product {
  margin-bottom: 2.5em;
}
.products h2 {
  margin-top: 0;
}
.products ul {
  margin-top: 0;
  padding-left: 15px;
  margin-left: 0;
}
.products li {
  padding-left: 0;
}
.products p, 
.products li {
  font-size: 90%;
  line-height: 1.4em;
}
.products .product .figure {
  margin-left: 15px;
}


/** =OUR WORK
----------------------------------------------- */
#case_studies_index #main {
  width: 730px;
  margin: 0 15px;
}
#study_spotlight {
  margin-bottom: 12px;
  margin-left: 4px;
}
#study_spotlight h2 {
  margin-top: 0;
  font-weight: normal;
  font-size: 150%;
}
#study_spotlight .desc {
  float: left;
  display: inline;
  width: 255px;
}
#study_spotlight .screenshot {
  float: left;
  display: inline;
  width: 465px;
}
#study_spotlight p {
  font-size: 90%;
}
#study_spotlight p.more, 
#study_spotlight p.site {
  font-size: 90%;
}
#study_spotlight {
  height: 324px;
}
#study_spinner {
  height: 336px;
}
#study_spinner {
  text-align: center;
}
#study_spinner img {
  margin-top: 150px;
}

#case_studies {
  list-style: none;
  margin: 0;
  padding: 0;
}
#case_studies .case_study {
  float: left;
  display: inline;
  width: 168px;
  margin: 0 16px 18px 0;
  text-align: center;
}
#case_studies .study_3, 
#case_studies .study_7, 
#case_studies .study_11 {
  margin-right: 0;
}
#case_studies .case_study a {
  float: left;
  display: inline;
  width: 168px;
  border-top: 1px solid #ececec;
  border-left: 1px solid #ececec;
  border-right: 1px solid #d8d8d8;
  border-bottom: 1px solid #d8d8d8;
  background-color: #f8f8f8;  
  text-decoration: none;
  outline: none;
}
#case_studies .sel a,
#case_studies .case_study a:hover {
  border-top: 1px solid #fcedbc;
  border-left: 1px solid #fcedbc;
  border-right: 1px solid #ead799;
  border-bottom: 1px solid #ead799;
  background-color: #fffada;
}
#case_studies img {
  margin-top: 7px;
  border: 1px solid #a5a5a5;
}
#case_studies .title {
  display: block;
  padding: 6px;
  color: #333;
}
.screenshot {
  float: left;
  display: inline;
  padding-top: 5px;
  padding-bottom: 15px;
}

.before_after .figure {
  float: left;
  display: inline;
  margin: 0 10px;
}
#main .before_after .figure p.caption {
  font-size: 95%;
  text-align: center;
}

/** =SERVICES
----------------------------------------------- */
#services_index #main {
  width: 730px;
  margin: 0 15px;
}
#main.services .desc {
  width: 470px;
}
#main.services h3 {
  margin-top: 0px;
  margin-bottom: 0;
  font-size: 100%;
}
#main.services h3 a {
  font-weight: bold;
}
.service ul {
  list-style: none;
  margin: 0 0 0 30px;
  padding: 20px 0 0 0;
}
.service li {
  margin: 0;
  padding-left: 16px;
  background: url("/images/icons/tick.gif") left 5px no-repeat;
  font-size: 84%;
}
#main .service_study .figure {
  float: left;
  display: inline;
}
#main .service_study .desc {
  float: left;
  display: inline;
  width: 285px;
  margin-left: 15px;
  font-size: 90%;
  text-align: left;
}
p.more_work {
  margin-top: 5px;
  padding: 2px 8px;
  background-color: #e4e4e4;
  font-size: 90%;
}
#sidebar.services ul {
  margin-top: 5px;
}
#sidebar.services li, 
#sidebar.services p {
  font-size: 95%;
}
#sidebar.services li {
  padding-left: 16px;
  background: url("/images/icons/tick.gif") left 5px no-repeat;
}
#sidebar.services li.screenshot {
  padding-left: 0;
  background: #fff;
}

/** =NEWS
----------------------------------------------- */
#news {
  padding: 0;
  margin: 0;
}
#news li {
  margin: 0;
  padding: 0;
  list-style: none;
}
#news .news_date {
  margin: 0 0 5px 0;
  padding: 0;
  color: #666;
  line-height: 1;
  font-weight: normal;
  font-size: 110%;
}
#news h3 {
  margin: 0;
  padding: 0;
}
#news .news_content  {
  margin: 0 0 30px 0;
}
#news .news_content p {
  margin-top: 5px;
}

/** =ARTICLES
----------------------------------------------- */
#posted {
  font-weight: normal;
}
#sidebar div.wwr {
  margin-bottom: 20px;
}
#sidebar div.wwr img {
  margin-left: -5px;
}

/** =GUIDES
----------------------------------------------- */
#main h2.guide_header {
  margin-bottom: 6px;
}
.guide_points {
  list-style: none;
  margin: 0;
  padding: 0;
}
.guide_points li {
  margin: 0;
}
.guide_points li h3 {
  margin: 0;
  font-size: 100%;
}
.guide_points li h3 a {
  width: 460px;
  display: block;
  background-color: #EEF1F6;
  border-bottom: 1px solid #e4e8f0;
  border-top: 1px solid #FFFFFF;
  padding: 6px 6px;
  text-decoration: none;
  line-height: 1em;
  outline: none;
}
.guide_points li h3 a:link,
.guide_points li h3 a:visited {
  color: #307AB4;
}
.guide_points li h3 a:hover {
  background: #e4e8f0 url("/images/common/guide_arrow.gif") right center no-repeat;
}
.guide_points div {
  border: 1px solid #eee;
  border-top: 1px solid #fff;
  padding: 4px 6px 2px 6px;
  font-size: 95%;
  color: #666;
}
.guide_points div ul {
  margin-bottom: 1.25em;
}
.guide_points div ul {
  margin-left: 0;
  padding-left: 1.5em;
  list-style: disc;
}
.guide_points div ul li {
  line-height: 1.3em;
  padding-bottom: 2px;
}

.cta a:link,
.cta a:visited {
  color: #307AB4;
}
.cta a {
  display: block;
  background-color: #EEF1F6;
  border-bottom: 1px solid #e4e8f0;
  border-top: 1px solid #FFFFFF;
  padding: 6px 6px;
  margin: 22px 0;
  text-decoration: none;
}
.cta a:hover {
  background: #e4e8f0 url("/images/common/guide_arrow.gif") right center no-repeat;
}

/** =BOOKS
----------------------------------------------- */
#books h3, 
#contributions h3 {
  margin: 1.5em 0 0 0;
}
#books .author, 
#contributions .author {
  margin: 0 0 1.2em 0;
  font-size: 90%;
}
#books .figure, 
#contributions .figure {
  margin: 0 .75em .25em 0;
}

/** =LIST SPACING
----------------------------------------------- */
#articles h3, 
#software h3 {
  margin: 0;
}
.feed {
  margin-top: 5px;
}

/** =LANDING PAGES
----------------------------------------------- */
p.demos a {
  padding-left: 20px;
  background: transparent url("/images/icons/film.gif") 0 0 no-repeat;
}

/** =INVOICE
----------------------------------------------- */
.clients_list img {
  margin-right: 5px;
}
.invoices .add {
  font-size: 85%;
}
.invoices .add a:link,
.invoices .add a:visited {
  color: #333;
}
.invoices h2 {
  font-size: 1.1em;
}
.invoices ul {
  margin: 0 0 10px 0;
  padding: 15px 10px;
  list-style: none;
}
.snippet .icon,
.invoices .icon {
  margin-left: 10px;
}
.invoices li.add {
  background-color: #fff;
}
.invoices li {
  padding: 2px 12px;
}
.invoices li .left span {
  margin-left: 10px;
  font-size: 90%;
  color: #666;
}
.invoices li .right {
  font-size: 90%;
}

/** =LINE ITEMS
----------------------------------------------- */
#main.invoices table.box_content,
#main.invoices ul.box_content {
  width: 100%;
  margin-bottom: 25px;
  border: 1px solid #E4E4E4;
  padding: 0;
}
.invoices tbody {
  padding: 0;
}
.invoices th {
  text-align: left;
}
.invoices th,
.invoices td {
  padding: 2px 12px;
  font-size: 85%;
}
.invoices li.light,
.invoices tr.light td {
  background-color: #fff;
}
.invoices tfoot td {
  font-weight: bold;
  border-top: 1px solid #fff;
  background-color: #e4e4e4;
}
.invoices .numeric {
  text-align: right;
}
.invoices td.name {
  width: 80px;
  color: #666;
}
.invoices td.date {
  width: 80px;
}
.invoices td.hours {
  width: 40px;
}
.invoices td.edit {
  width: 50px;
}
.line_item_form input, 
.line_item_form select, 
.line_item_form label {
  font-size: 90%;
}

/** =DOWNLOADS
----------------------------------------------- */
#main.downloads th.date {
  width: 300px;
}
#main.downloads .uniques,
#main.downloads .downloads {
  width: 30px;
  text-align: center;
}
#main.downloads h2 .right {
  font-weight: normal;
  font-size: 90%;
}

/** =SYNTAX
----------------------------------------------- */
.syntax {
  border: 1px solid #e1e1e1;
  border-width: 1px 0;
  padding: 5px;
  background-color: #efefef;
  margin: 0 0 15px 0;
  width: 450px;
  overflow: auto;
}
.syntax pre {
  font-size: 90%;
  line-height: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  font-family: monospace;
}

/* ruby */
.syntax .normal {
}
.syntax .comment {
  color: #808080; 
  font-style: italic; 
}
.syntax .keyword {
  color: #008800; 
  font-weight: bold;
}
.syntax .method { 
  color: #0066BB; 
  font-weight: bold;
}
.syntax .class { 
  color: #C40066; 
}
.syntax .module { 
  color: #C40066; 
}
.syntax .punct { 
  color: #333; 
}
.syntax .symbol { 
  color: #AA6600; 
}
.syntax .string { 
  color: #E6374B;
  background-color: #FFF0F0;
}
.syntax .char { 
  color: #FFFBC7; 
}
.syntax .ident { 
  color: #333; 
}
.syntax .constant { 
  color: #003366; 
  font-weight: bold;
}
.syntax .regex { 
  color: #98AEC2; 
}
.syntax .number { 
  color: #0000DF; 
}
.syntax .attribute { 
  color: #3333BB; 
}
.syntax .global { 
  color: #FFCE90; 
}
.syntax .expr { 
  color: #333; 
}
.syntax .escape { 
  color: #333; 
}
.syntax .access {
  color: #AA6600;
}

/* yaml */
.syntax .key {
  color: #0066BB;
}
.syntax_yaml .punct {
  color: #666;
}

#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url("/images/lightbox/blank.gif") no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url("/images/lightbox/prevlabel.gif") left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url("/images/lightbox/nextlabel.gif") right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%	
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.0em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}