/* undohtml.css */
/* (CC) 2004 Tantek Celik. Some Rights Reserved.             */
/*   http://creativecommons.org/licenses/by/2.0                   */
/* This style sheet is licensed under a Creative Commons License. */
/* Purpose: undo some of the defaulfault styling of common (X)HTML browsers */
/* link underlines tend to make hypertext less readable, 
   because underlines obscure the shapes of the lower halves of words */
:link,:visited { text-decoration:none }
/* no list-markers by default, since lists are used more often for semantics */
ul,ol { list-style:none }
/* avoid browser default inconsistent heading font-sizes */
/* and pre/code too */
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
/* remove the inconsistent (among browsers) default ul,ol padding or margin  */
/* the default spacing on headings does not match nor align with 
   normal interline spacing at all, so let's get rid of it. */
/* zero out the spacing around pre, form, body, html, p, blockquote as well */
/* form elements are oddly inconsistent, and not quite CSS emulatable. */
/*  nonetheless strip their margin and padding as well */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin:0; padding:0 }
/* whoever thought blue linked image borders were a good idea? */
a img,:link img,:visited img { border:none }
/* de-italicize .vcard */
.vcard { font-style:normal }
/* more varnish stripping as necessary... */
/* END UNDO */

/*
COLOURS

1a1a1a black
8F8F8E grey
8cc63f orange
7FAEDA light blue

*/

/* ----------------------------------------------- */
/* =CORE ELEMENTS */



/* -------- */
/* =IMAGES */

img {
  margin: 0px 8px 8px 0;
  border: 0;
}
p img {
  float: right;
  margin: 4px 0px 8px 8px;
}

/* -------- */
/* =LINKS */
a,
a:link 
a:active,
a:visited {
  color: #1a1a1a;
  text-decoration: none;
  border: 0;
}
a:hover {
  color: #8cc63f; 
  border: 0;
  text-decoration: none;  
}
a.image,
a:hover.image { 
  border: 0; 
}

/* ---------- */
/* =HEADINGS */

h1, h2, h3, h4, h5, h6 {
  font-weight: bold;
  padding: 0;
  margin: 0;
  margin: 1.4em 0 .7em 0;
  color: #1a1a1a;
}
h1 {
  font-size: 24px;
  font-weight: normal;
  color: #fff;
}
h2 {
  font-size: 1.4em;
  border-bottom: 1px #ddd solid;
  padding-bottom: 1em;
  margin: 0;
  color: #B9B9B9;
}
h3 {
  font-size: 2.8em;
  margin: .4em 0 0 0;
  padding: 0 0 .35em 0;
}
h4 {
  font-weight: normal;
  text-transform: uppercase;
  font-size: 1.4em;
  color: #B9B9B9;
}
h5 {
  font-size: 1.2em;
  margin: 0;
  color: #B9B9B9;
}
h6 {
  font-size: 1em;
  margin: 0;
}


/* -------- */
/* =LISTS */

ul, ol, dl {
  font-size: 1.2em;
  margin: 0 0 1.4em 0;
  padding: 0;
}
dl {
  font-size: 1.2em;
  margin: 0 0 1.4em 0;
  padding: 0;
}
li {
  margin: 0;
  padding: 0 0 0 0;
}
dl dt {
  font-weight: bold;
  margin: 0;
  padding: 0;
}
dl dd {
  margin: 0;
  padding: 0;
}

/* -------- */
/* =MISC */

blockquote {
  margin: 0 0 1.4em 0;
  padding: 0 0 0 10px;
  border-left: 4px #ccc solid;
  color: #777;
}
cite {
  display: block;
  font-style: normal;
  margin: 0 0 2.8em 0;
  padding: 0;
  color: #999;
}
acronym,
abbr {
  cursor: help;
  border: 0;
} 

embed {
  margin-bottom: 1.4em;
}

/* ----------------------------------------------- */
/* =TOOLS */

/* apply to any element that appears at top of page 
to neutralise top padding/margin */
.first{
  clear: both;
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
}	
/* http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}
.clearfix {display: inline-table;}



/* ----------------------------------------------- */
/* =CONTAINERS */

body {
  margin: 0;
  padding: 0;
  font-family: Arial, Helvetica, Verdana, sans-serif;
  font-size : 62.5%; 
  line-height: 1.4;
  background: #1a1a1a url("/inc/img/backgrounds/body.gif") 0 134px no-repeat;
  color: #fff;
}
#skiplinks {
  position:absolute;
  left:0px;
  top:-500px;
  width:1px;
  height:1px;
  overflow:hidden;
}
#wrapper {
  position: relative;
  width: 899px; 
  margin: 0;
  padding: 0px 0 0 35px; /* see IE.css */
  background: url("/inc/img/backgrounds/wrapper.gif") right top repeat-y ;
}


/* -------- */
/* =HEADER */ 

#header {
  position: relative;
  background: #1a1a1a;
  height: 134px;
}
#branding {
  position:absolute;
  left: 0px;
  top: 56px;
}
#menu {
  position:absolute;
  left: 548px;
  top: 74px;
  width: 400px;
  width: inherit;
  list-style: none;
  font-size: 1.3em;
  text-transform: uppercase;
  font-weight: bold;
}
#menu li  {
  float: left;
  padding: 0 12px 0 0;
  margin: 0 6px 0 0;
  background: url("/inc/img/backgrounds/menu-divider.gif") right center no-repeat ;
}
#menu li.last {
  float: left;
  padding: 0;
  margin: 0;
  background: none;
}
#menu a {
  color: #fff;
}
#menu a:hover,
#menu .selected a {
  color: #8cc63f; 
}



/* -------- */
/* =CONTENT */ 

#content {
  float: right;
  width: 564px;
  min-height: 191px;
  padding: 25px;
  margin: 0 0 35px 0;
  color: #8F8F8E;
  border-top: 1px #E3E3E3 solid;
}


#content .summary {
  position:absolute;
  left: 35px;
  top: 134px;
  width: 284px;
  height: 242px;
  background: url("/inc/img/backgrounds/summary.png") left center no-repeat;
  color: #fff;
}
#content .summary h1,
#content .summary p,
.clients .article #content .summary p {
  color: #222;
  margin: 15px 20px;
  width: auto;
  float: none;
}
#content .summary h1 {
}
#content .summary p {
}
#content .summary a {
  color: #fff;
}
.article p,
.article ul,
.article ol,
.article dl,
.article h3,
.article h4,
.article h5,
.article h6,
.article blockquote, /* see IE.css */
.article cite  {
  width: 324px;
}
.article #content img,
.article #content #myGallery  {
  margin: 0 0 2em 0;
}
#content p {
  font-size: 1.2em;
  margin: 0 0 1.4em 0;
  padding: 0;
}
#content blockquote p {
  margin: 0;
}
#content ul, 
#content ol {
  margin: 0 0 1em 20px;
  padding: 0 0 0 20px;
}
#content ul{
  list-style: disc;
}
#content ol {
  list-style: decimal;
}
#content acronym,
#content abbr {
  border-bottom: 1px #777 dotted;
} 
#content p.meta {
  color: #C0C0C0;
  margin-bottom: 0;
}
#content abbr.meta {
  border-bottom: 0;
}
#content p.footnote {
  clear: both;
  font-size: 1.1em;
  color: #aaa;
}

.intro {
  font-weight: bold;
  margin-top: 1.4em;
}


/* =nav */ 
#content .nav {
  list-style: none;
  margin: 0;
  padding: 2px 0 0 0;
  font-size: 1em;
  font-weight: bold;
  line-height: 1.4;
  text-transform: uppercase;
}

#content .nav li {
  margin-bottom: .5em;
}
.nav .selected {
  color: #8cc63f;
}


/* =boxout */ 
.boxout {
  float: right;
  padding: 0px;
  width: 200px; 
}
#content .boxout h5 { 
  float: left;
  clear: both;
  width: 80px;
}
#content .boxout ul { 
  float: right;
  width: 120px;
  margin-bottom: 1.4em;
}

/* =teasers */ 

#content .teasers {
  list-style: none;
  margin: 1.4em 0;
  padding-left: 0;
}
#content .teasers li {
  float: left;
}
#content .teasers li li {
  float: none;
  width: inherit;
}
#content .teasers li dl {
  display: none;
}
#content .teasers li a img {
  padding: 46px;
  border: 0;
  background-image: url("/inc/img/backgrounds/clients_logos.jpg");
  background-position: center top;
  background-repeat: no-repeat;
}
#content .teasers li a:hover img {
  background-position: center bottom;
}

/* -------- */
/* =HOME */


body.default #wrapper  {
  background: transparent;
}
body.default #content  {
  padding: 0;
  width: 900px;
  color: #fff;
  border: 0;
}
body.default #footer  {
  border: 0;
}
body.default .summary  {
  position: relative;
}

#content .continued {
  color: #B35811;
  font-size: 1.2em;
  font-weight: bold;
  position: absolute;
  top: 204px;
  left: 158px;
  width: 113px;
}
#content a.continued:hover {
  color: #fff;
}

body.default #content #myGallery  {
  float: right;
  width: 614px;
  height: 242px;
}

body.default #content .teasers {
  width: 900px;
  margin: 3em 0;
}
body.default #content .teasers li {
  padding: 24px  24px 16px 24px;
  margin-right: 16px;
  width: 240px;
  height: 7em;
  background: #202020 url("/inc/img/backgrounds/teaser-top.gif") left top no-repeat;
}

body.default #content .teasers li.last {
  margin: 0px;
}

body.default #content .teasers li h4 {
  margin: 0px;
  width: 241px;
  text-transform: none;
}
body.default #content .teasers li h4.video  {
  background: url("/inc/img/backgrounds/video.gif") 206px 3px no-repeat;
  padding-right: 30px;
  width: 211px;
}

body.default #content .teasers li h4 a {
  color: #8cc63f;
}
body.default #content .teasers li h4 a:hover {
  color: #fff;
}

body.default #content .teasers li p {
  font-size: 1em;
  line-height: 1.6;
  margin: 0px;
  width: 241px;
}
body.default #content h5 {
  font-size: 1.3em;
  font-weight: normal;
  color: #444243;
}

#content .our_clients {
  overflow: hidden;
  background: #202020;
  padding: 20px 20px;
}
#content .our_clients ul {
  width: 100%;
  overflow: hidden;
  list-style: none;
  margin: 0;
  padding: 0;
}
#content .our_clients li {
  float: left;
  margin: 20px 0 0 24px;
}
#content .our_clients img {
  margin: 0;
}



/* ------------------- */
/* =COMPANY & SERVICES */


body.company h2,
body.services h2 {
  margin: 0 0 .7em 0;
  padding: 0 0 .35em 0;
}


/* -------- */
/* =CLIENTS */



body.clients #content .teasers {
  width: 564px;
}
body.clients #content .teasers li {
  width: 188px;
  height: 188px;
}

/* =case-study */ 

body.clients .article #content .sidebar { 
  position: absolute;
  top: 525px;
  left: 350px;
  width: 113px;
}
body.clients .article #content dl.boxout {
  float: none;
  width: 200px; 
  font-size: 1em;
}
body.clients .article #content .boxout dt { 
  clear: none;
  float: left;
  width: 80px;
  font-size: 1.2em;
}
body.clients .article #content p,
body.clients .article #content h4,
body.clients .article #content h5,
body.clients .article #content h6,
body.clients .article #content ul.links {
  clear: none;
  float: right;
  margin-right: 50px;
  width: 300px; /* see IE.css */
}
body.clients .article #content ul.links,
body.clients .article #content ul.links li {
  margin-left: 0;
  padding-left: 0;
  list-style: none;
  font-weight: bold;
}

a#play {
  position: absolute;
  top: 223px;
  left: 790px;
  width: 150px;
  font-weight: bold;
  color: #7FAEDA;
  background: url("/inc/img/backgrounds/play.gif") left center no-repeat;
  padding: 4px 0 4px 25px;
}
a:hover#play {
  color: #1a1a1a;
}
#back {
  position: absolute;
  top: 153px;
  left: 795px;
  width: 113px;
  background: url("/inc/img/backgrounds/back-to-menu.gif") left center no-repeat ;
  color: #fff;
  padding: 34px 0 0 0;
  height: 0px !important; 
  height /**/:30px; /* for IE5/Win */
  overflow: hidden;
}

/* -------- */
/* =NEWS */ 

body.news h2 {
  font-size: 2.8em;
  margin: 0 0 .7em 0;
  padding: 0 0 .35em 0;
  color: #1a1a1a;
}
body.news #content p.credit {
  font-size: 1.1em;
  float: left;
  margin-top: -20px;
  color: #bbb;
}


/* local navigation */

#local {
  float: left;
  width: 263px;
  margin-top: 268px;
}
.article #local ul {
  width: 263px;
}
#local li {
  margin: 0 0 1.4em 0;
}
#local li {
  border-top: 1px #E6E5E4 solid;
  background-color: #1E1E1E;
  padding: 16px 24px;
}
#local h4 {
  margin: 0;
  color: #8cc63f;
  font-size: 1.4em;
  line-height: 1.2;
  text-transform: none;
  width: 215px;
}
#local h4.video  {
  background: url("/inc/img/backgrounds/video.gif") 180px 3px no-repeat;
  padding-right: 30px;
  width: 185px;
}


#local a  {
  color: #8cc63f;
}
#local .selected a ,
#local a:hover  {
  color: #fff;
}

#local .meta {
  font-size: 1em;
  margin: 0;
  color: #747377;
}

#RSS {
  background: #131313 url("/inc/img/backgrounds/feed-icon-10x10.png") 4px 5px no-repeat;
  padding: 4px 4px 2px 18px;
  color: #fff;
  position: absolute;
  top: 200px;
  left: 23px;
}
#RSS:hover {
  color: #8cc63f;
}

/* -------- */
/* =CONTACT */

.form-wrapper {
  padding: 11px 11px 0 11px;
  border: 1px #DDDCDC solid;
  width: 303px; /* see IE.css */
  background: #F8F8F8;
}
.form-wrapper h5 {
  color: #1a1a1a;
}
form fieldset {
  border: 0;
  border-top: 1px #DDDCDC solid;
  margin: 0; 
  padding: 0;
}
label {
  float: left;
  font-size: 1.2em;
  margin: 0;
  padding: 1em 0;
  width: 100px;
}
.zemContactForm  {
  margin-top: 1em;
}
.zemContactForm input.zemText,
.zemContactForm textarea.zemTextarea {
  float: right;
  border: 1px #E2E1E1 solid;
  margin: 1em 0;
  padding: 4px;
  font-family: Arial, Helvetica, Verdana, sans-serif;
  font-size: 1.2em;
  background: #fff;
  width: 191px;
}
.zemContactForm fieldset input.zemCheckbox {
  clear: none; 
  float: right;
  padding: 0;
  border: 0;
  margin: 1em 188px 0 0;
}
fieldset#spam-filter label {
  width: 80px;
}
.zemContactForm .zemSubmit {
  clear: both;
  float: right;
  padding: 2px 4px;
  margin: 1em 155px 0 0;
  background: #F47B1F;
  border: 1px #F37220 solid;
  color: #fff;
}
#content ul.zemError {
  list-style: none;
  margin-left: 0;
  padding: 10px 0;
  border-width: 1px 0;
  border-style: solid;
  border-color: #ccc;
}
#content .zemError li {
  background:url("/inc/img/backgrounds/error.gif") no-repeat 0 .1em;	
  padding-left: 30px;
}

.zemContactForm #phone,
.zemContactForm #mail {
  display: none;
}


/* -------- */
/* =hCARD */


.vcard {
  font-size: 1.1em;
}
.vcard div,
.vcard .email,
.vcard h6 {
  float: right;
  width: 120px;
  font-weight: bold;
  color: #1a1a1a;
}
.vcard div,
.vcard h5,
.vcard h6  {
  font-size: 1em;
}

.vcard h5 {
  clear: both;
}
.vcard .locality,
.vcard .postal-code,
.vcard .number {
  display: inline;
}
.vcard .number,
.vcard .tel {
  letter-spacing: 0.05em;
}
.vcard .adr,
.vcard .email,
.vcard .tel,
.vcard .note {
  margin: 0 0 10px 0;
}
.vcard .fn,
.vcard .url {
  position:absolute;
  left:0px;
  top:-500px;
  width:1px;
  height:1px;
  overflow:hidden;
}
#vcard-link {
  float: right;
  padding: 5px 0 5px 30px;
  width: 90px;
  background:url("/inc/img/backgrounds/vcard.gif") no-repeat left center;	
  color: #8cc63f;
  font-weight: bold;
}
.vcard .email {
  color: #8cc63f;
}
a:hover.email ,
a:hover#vcard-link {
  color: #1a1a1a;
}



/* ----------------------------------------------- */
/* =FOOTER */ 

#footer {
  clear: both;
  text-align: right;
  font-weight: bold;
  border-top: 30px #1a1a1a solid;
  padding: 30px 0;
  margin: 0;
  background: #1a1a1a url("/inc/img/backgrounds/footer.gif") repeat-x left top;	
  color: #525050; 
  font-size: 1.1em;
}
#footer a {
  color: #666363;
}
#footer a:hover {
  color: #999;
}



/* ----------------------------------------------- */
/* =SIFR */


/*=:project
    scalable Inman Flash Replacement (sIFR) version 3.

  =:file
    Copyright: 2006 Mark Wubben.
    Author: Mark Wubben, <http://novemberborn.net/>

  =:history
    * IFR: Shaun Inman
    * sIFR 1: Mike Davidson, Shaun Inman and Tomas Jogin
    * sIFR 2: Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben

  =:license
    This software is licensed and provided under the CC-GNU LGPL.
    See <http://creativecommons.org/licenses/LGPL/2.1/>    
*/

/*---- sIFR ---*/
.sIFR-flash {
	visibility: visible !important;
	margin: 0;
	padding: 0;
}

.sIFR-replaced, .sIFR-ignore {
	visibility: visible !important;
}

.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/*---- Header styling ---*/