
/** Font styles
---------------------------------
Mainly inspired from Mark Boulton
http://www.markboulton.co.uk/journal/comments/five-simple-steps-to-better-typography
*/

body {
  behavior: url(/js/csshover.htc);
  color: #000;
  font: 12px/1.5em arial, helvetica, verdana, sans-serif;
}

/* Titles */

h1, h2, h3, h4, h5, h6 {
  font-family: helvetica, arial, verdana, sans-serif;
  font-weight: normal;
}
h1 {/* 30px */
  font-size: 250%;
  margin: 0 0 0.8em;
}
h2 {/* 24px */
  font-size: 260%;
  margin: 0 0 0.2em;
  color:#dc8651;
  font-weight: bold;
}
h3 {/* 18px */
  color:#dc8651;
  font-size: 25px;
  font-weight: bold;
  margin: 0.5em 0 0;
}
h4 {/* 16px */
  font-size: 133%;
  font-weight: bold;
  margin: 0.5em 0;
}
h5 {/* 14px */
  font-size: 116%;
  margin: 0.5em 0;
}
h6 {/* 13px */
  font-size: 108%;
}


/* Paragraph Styles */

p {
  margin: 0 0 1.5em;
}
strong {
  font-weight: bold;
}
em, dfn {
  font-style: italic;
}
dfn {
  font-weight: bold;
}
sup, sub {
  line-height: 0;
}
address {
  margin: 0 0 1.5em;
  font-style: italic;
}
abbr {
  border-bottom: 1px dotted #666;
  cursor: help;
  white-space: nowrap;
}
img {
  border: none;
  vertical-align: baseline;
}

/* Table Styles */

table {
  width: 99%;
}
tr.even td, tr.odd td {
  padding: 10px 5px;
}
tr.odd {
  background-color: #fff;
}

/* Code */

pre {
  margin: 1.5em 0;
  white-space: pre;
}
pre,code,tt {
  font: 1em 'andale mono', 'lucida console', monospace;
  line-height: 1.5;
}

/* List Styles */

ul, ol {
  margin: 0 0 1.5em;
  padding-left: 1em;
}
ul {
  list-style-type: none;
}
ul ul {
  list-style-type: circle;
}
ul ul ul {
  list-style-type: square;
}
ul ul ul ul {
  list-style-type: circle;
}
ol {
  list-style-type: decimal;
}
ol ol {
  list-style-type: lower-alpha;
}
ol ol ol {
  list-style-type: decimal;
}

/** Accessibility
---------------------------------
* This link useful for both visually impaired people and those with mobility impairments
* who cannot use a mouse. http://www.webaim.org/techniques/css/invisiblecontent/
*/

#skip a, #skip a:hover, #skip a:visited {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
#skip a:active, #skip a:focus {
  position: static;
  width: auto;
  height: auto;
}


/** Clear Floats Without Structural Markup:
---------------------------------
* http://www.positioniseverything.net/easyclearing.html
*/

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}
/* End hide from IE-mac */


/* Common classes
---------------------------------*/

/* clear classes */
.clearleft, .clearl, .cleft {
  clear: left;
}
.clearright, .clearr, .cright {
  clear: right;
}
.clear, .clearboth, .clearall {
  clear: both;
}

/* Float classes */
.floatleft, .fleft, .floatl {
  float: left;
  margin: 0 10px 5px 0;
}
.floatright, .fright, .floatr {
  float: right;
  margin: 0 0 5px 10px;
}

/* img replacement class */
.img-replace {
  display: block;
  text-indent: -3000px;
  overflow: hidden;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: top left;
}

/* bullet-free lists */
.no-bullet {
  list-style-type: none;
  list-style-image: none;
  padding: 0;
}

/* Display list inline */
.inline li {
  display:inline;
}

/* only display for print */
.printOnly {
  display: none;
}


/** General Design styles
---------------------------------*/

body {
  margin: 0;
  background: #000;
  /* scroll bar jump fix */
  overflow-y:scroll;
}
#page {
  margin: 0 auto;
}
.section {
  width:100%;
  color:#808080;
  clear:both;
}
.section .section-inner {
  position:relative;
  z-index:0;
  width:900px;
  margin:0 auto;
  padding:30px;
}

/** Top Section (black header)
---------------------------------*/

#top-section .section-inner {
  padding-bottom:0;
}
.section a {
  color:#fff;
  text-decoration:none;
}
.section a:hover,
#navigation .active a {
  color: #eb600c;
}
#navigation .active ul a {
  color: #898989;
}

/* Site Logo */

#site-logo {
  margin:0;
}
#site-logo {
  display:block;
  width:211px;
  height:58px;
  background:transparent url('images/logo-css.gif') no-repeat top left;
}
#site-logo:hover {
  background-position:0 -59px;
}
#site-logo img{
  display:none;
}


/* Main navigation */

#navigation {
  position:absolute;
  top:47px;
  right:30px;
  width:650px;
  text-align:right;
}
#navigation li {
  margin-left:10px;
  position:relative;
  font-weight:bold;
  list-style-type:none
}
#navigation li ul {
  position:absolute;
  width:160px;
  top:15px;
  left:-10px;
  z-index:999;
  padding:10px;
  background-color:#000;
  font-size:11px;
  display:none;
  text-align:left;
}
#navigation li:hover ul {
  display:block;
}
#navigation li ul li,
#navigation li ul li a{
  display:block;
  margin-left:0;
  color:#898989;
}
#navigation li ul li {
  line-height:1.3em;
  margin-bottom:5px;
}
#navigation li ul li a{
  padding-left:10px;
  background:transparent url('images/arrow-grey.gif') no-repeat 0 3px;
}
#navigation li ul li a:hover {
  color:#fff;
  background-position:0 -42px;
}

/* Page Intro 

.introduction {
  height:330px;
  padding:56px 510px 0 0;
  margin-right:-30px;
  background-color:transparent;
  background-position:bottom right;
  background-repeat:no-repeat;
}*/

.introduction {
  height:299px;
  padding:0;
  margin-right:-57px;
  /*background-color:transparent;
  background-position:bottom left;
  background-repeat:no-repeat;*/
}

#page-title {
  font-size:93px;
  color:#eb600c;
  margin:20px 0 0;
  letter-spacing:-0.04em;
  line-height:0.9em;
}
.cufon-active #page-title {
  line-height:0;
}

#page-title strong {
  color:#fff;
}

/* fix line height */

#page-title cufon {
  margin-top:-20px;
}
#description {
  font-weight:bold;
  font-size:15px;
}

/* Names */

.name {
  position:absolute;
  left:505px;
  top:420px;
  padding-left:10px;
  font-size:11px;
  line-height:16px;
  font-weight:bold;
  display:inline-block;
  height:30px;
  background:transparent url('images/arrow-orange.gif') no-repeat 0 5px;  
}
.name strong {
  display:block;
  color: #eb600c;
  margin-bottom:-3px;
}
.name-right {
  left:765px;
}

.name.lori { left: 480px; }

/* introduction specifics BG */
/*
.about-you .introduction, 
.privacy-policy .introduction, 
.sitemap .introduction{
  background-image: url('images/top-section/about-you-2.jpg');
}
.what-we-do .introduction{
  background-image: url('images/top-section/what-we-do.jpg');
}
.contact-us .introduction{
  background-image: url('images/top-section/about-you.jpg');
}
.job-opportunities .introduction{
  background-image: url('images/top-section/job.jpg');
}
.about-us {
  background:transparent url('images/top-section/team.jpg') no-repeat center 96px;
}
.about-us #top-section .section-inner{
  background:transparent url('images/top-section/team.jpg') no-repeat center bottom;
}
*/

.about-you #top-section, 
.privacy-policy #top-section, 
.sitemap #top-section{
  background:url(images/top-section/about-you.gif) no-repeat center bottom;
}
.what-we-do #top-section{
   background:url(images/top-section/whatwedo.gif) no-repeat center bottom;  
}
.contact-us #top-section{
  background:url(images/top-section/contact.gif) no-repeat center bottom;
}
.job-opportunities #top-section{
  background:url(images/top-section/jobs.gif) no-repeat center bottom;
}
.about-us #top-section{
  background: url(images/top-section/team.gif) no-repeat center bottom;
}


/* introduction specifics name positions */

.contact .lori {left:445px;}
.about-you .andrewpike {left:500px;}
.about-you .nikky {left:850px;}
.what-we-do .jevita {left:800px;}
.contact .karin {left:830px;}
.job-opportunities .bernice {left:480px; top:385px;}
.job-opportunities .tamara {left:750px; top:385px; color:#403f45; background-image:url('images/arrow-black.gif');}


/* introduction misc specifics */
.introduction h1{ width:510px; float:left; position:relative; top:56px;}
.introduction #description{ width:426px; float:right; position:relative; top:58px; left:-40px; font-size:24px; font-weight:normal; line-height:1.2em;}

.home .introduction #description{ float:left; clear:both; top:0; left:0; margin:45px 0 20px 0;}

.about-you .introduction h1{ width:490px;}

.about-us .introduction h1{ width:400px;}
.about-us #description { left:-82px;}

.job-opportunities h1 strong { font-size:55px;}
.job-opportunities h1, .privacy-policy h1, .sitemap h1{ width:470px;}
.job-opportunities #description { left:-15px;}

.what-we-do .introduction h1{ width:390px;}
.what-we-do #description { left:-62px;}

/* Social Media 
.social-media { position:absolute; }
.introduction .social-media { right:30px; top:771px; }
#footer .social-media { right:30px; top:40px; }
.socialIcon { display:block; width:29px; height:29px; float:left; text-indent:-99999px; margin-left:11px; }
.socialIcon.linkedin { background:url(images/icon_linkedin.gif) 0 0 no-repeat; }
.socialIcon.twitter { background:url(images/icon_twitter.gif) 0 0 no-repeat; }
.socialIcon.facebook { background:url(images/icon_facebook.gif) 0 0 no-repeat; } */



/** Header Social Media
---------------------------------*/
.social-media { position: absolute; top: 20px; right: 20px; }
.sm { display: block; width: 16px; height: 16px; margin: 0 9px 0 0; float: left; background: url(images/sm-icons.gif) no-repeat 0 0; text-indent: -9999em; overflow: hidden; }

.sm#linkedin { background-position: 0 0; }
.sm#linkedin:hover { background-position: -16px 0; }
.sm#twitter { background-position: 0 -16px; }
.sm#twitter:hover { background-position: -16px -16px; }
.sm#facebook { background-position: 0 -32px; }
.sm#facebook:hover { background-position: -16px -32px; }


/** White Section (content)
---------------------------------*/

.white {
  color:#000;
  background-color:#fff;
  padding-bottom:50px;
}

/* columns */

.col {
  float:left;
  width:425px;
}
.rightcol {
  float:right;
  padding-right:0;
}
.large-content .leftcol {
  width:575px;
}
.large-content .rightcol {
  width:275px;
}

.rightcol a.download { display: block; }

/* content styles */

.white a:link, .white a:visited {
  color: #dc8651;
}
.white a:hover, .white a:active {
  color: #eb600c;
}
.white ul {
  list-style-type:none;
  padding:0;
}
.white ol {
  padding:0 0 0 18px;
}
.white ul li {
  padding-left:18px;
  background:transparent url('images/list.gif') no-repeat 0 6px;
  margin:0 0 1em;
}
.border, .content-list li {
  border-bottom:1px solid #b0b0b0;
  padding-bottom:20px;
  margin-bottom:30px;
}

.internal .border { border:none !important; }

.content-list li:last-child {
  border:0;
}

/* content list */

.white .content-list li {
  padding-left:0;
  background:transparent none;
}
.job-description p, .position{
  margin-bottom:0.5em;
}

/* list with arrows */

ul.arrow-list li {
  padding-left:10px;
  background:transparent url('images/arrow-orange.gif') no-repeat 0 -41px;
  margin-bottom:5px;
  font-size:14px;
  line-height:14px;
  display:inline-block;
  height:16px;
}
ul.arrow-list li:hover {
  background-position:0 4px;
}
.rightcol ul.arrow-list li {
  font-size:11px;
  font-weight:bold;
  display:block;
}

/* list with arrows */

ul.sub-menu li {
  
  margin-bottom:5px;
  font-size:14px;
  line-height:14px;
  display:inline-block;
  height:16px;
}
ul.sub-menu li:hover {
  background-position:0 4px;
}
.rightcol ul.sub-menu li {
	background:none;
  font-size:11px;
  font-weight:bold;
  display:block;
  padding-left:0;
}
.rightcol ul.sub-menu a {padding-left:10px;
  background:transparent url('images/arrow-orange.gif') no-repeat 0 -41px;}
.rightcol ul.sub-menu a.active {
  color:#000;background:transparent url('images/arrow-black.gif') no-repeat 0 4px;
}

/* Subnav Header */
.internal .rightcol h1.pagetitle,
.internal .rightcol h2.pagetitle {width:auto; font-size: 133%;font-weight: bold; margin: 0 0 21px 0; color:#000; }
.internal .rightcol h5.pagetitle { display:none; }

/* download links */

#news-listing .download,
.leftcol .download {
  font-size:11px;
  font-weight:bold;
  padding-right:10px;
  height:10px;
  line-height:5px;
  display:inline-block;
  background:transparent url('images/arrow-orange.gif') no-repeat 100% -42px;
}
.download:hover {
  background-position:100% 3px;
}

/* title in narrow right sidebar */

.large-content .rightcol h2 {
  font-size:25px;
  margin:5px 0 10px;
}

/* Footer
---------------------------------*/

#footer {
  font-size:11px;
}
#footer h4 {
  font-size:11px;
  font-weight:normal;
  color:#fff;
}
#footer dl {
  width:235px;
  float:left;
}
#footer dl dt {
  float:left;
  clear:left;
  width:45px;
}
#footer a {
  color:#898989;
}

/* Misc
---------------------------------*/

/* contact page map */

#rightcol iframe {
  margin-top:40px;
}

/* contact page txt */

.contact #content p strong {
  font-size:1.1em;
}

/* about us 

.about-us #description {
  position:absolute;
  top:150px;
  left:520px;
  z-index:-1;
}
.about-us .introduction{ padding:56px 0 0; width: 900px; }*/
.job-opportunities #page-title strong {margin-top:-28px; display:block;}
.cufon-active .job-opportunities #page-title strong {margin-top:0; display:inline;}

/* About Us
---------------------------------*/

.section-inner #aboutUsLeft, .section-inner #whatWeDoLft{ float:left; width:425px;}
.section-inner #aboutUsRight, .section-inner #whatWeDoRgt{ float:right; width:425px;}


/* 404 and 500 error pages */

#errorPage{ height:200px;}

#news-listing li { margin: 0 0 25px !important; }
