@charset "utf-8";
/* Begin Typography & Colors
green  = #65a400;
green darker = #5d8f13;
gray   = #d2d2c4;
 */

a:link, a:active{
  /* color:#360; */
  color: #3D619C;
  text-decoration:underline;
  }

a:visited{
 /* color:#85a366; */
  color: #3D619C;
  }

a:hover, a:focus{
 /* color:#85a366; */
    color: #3D619C;
  }

/* =structure */
body {
  margin:0;  
/*  background: #FFF url(../images/background.jpg) repeat-x; */
}

.body2012 {
  margin:0;
  background-image: linear-gradient(bottom, #4F90CD 20%, #727C8C 80%);
  background-image: -o-linear-gradient(bottom, #4F90CD 20%, #727C8C 80%);
  background-image: -moz-linear-gradient(bottom, #4F90CD 20%, #727C8C 80%);
  background-image: -webkit-linear-gradient(bottom, #4F90CD 20%, #727C8C 80%);
  background-image: -ms-linear-gradient(bottom, #4F90CD 20%, #727C8C 80%);
  
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.2, rgb(79,144,205)),
    color-stop(0.8, rgb(114,124,140))
  );
    
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#727C8C', endColorstr='#4F90CD');
 
}
.container2 {
  width:950px;
  /* height: 800px;  edit 6/13/2012 */
  margin:0 auto; 
  padding:0;
  }

#mast {
  background: #65a400 url(../images/background-header.jpg) no-repeat;
  height:106px;
}

#mast2012 {
 background: #333333;
  
  /*  edit 7/5/2012 */
  /* BEGIN NEW CODE */
  width:950px;
  height: 105px;
  margin:0 auto; 
  padding:0;
  
  /* END NEW CODE */
  
}

#mast2016 {
 background: #333333;
  
  /*  edit 3/30/2016 */
  /* BEGIN NEW CODE */
  width:950px;
  height: 75px;
  margin:0 auto; 
  padding:0;
  
  /* END NEW CODE */
  
}

#logo {  
  background: url(../images/Sapphire_logo_small.png) no-repeat; 
  width:285px;
  height:75px; 
  float:left;
  cursor:pointer;
  background-position: 20px 7px;
}

#tagline {
  text-align: right;
  margin: 0px auto;
  width: 384px;
  height: 36px;
  background: url() no-repeat top right;
  background-size: contain;
  background-position: 0 25px;
  padding-top: 25px;
  float: right;
}

#logo h1, #logo h2 {text-indent:-5000px;}

hr {height:2em;background:none;}





/* =page */
#one-column {}
.column {margin:15px 0 25px;}
#page-content {background: url(../images/background-content-corner.gif) no-repeat 170px 15px;}
#two-column .pad {margin:20px 15px 15px 0;}
#three-column .pad {margin:10px;}
#three-column {background: url(../images/background-3-col.gif) repeat-y top left;}



/* =sidebar */
.sidebar-mod {
  border-top:1px solid #dbdbcf;
  padding:15px 5px 15px 15px;
  margin-right:15px;
}

.sidebar-mod h3, .press-container h3 {
  font-size:1.0em;
  /*color:#336600;*/
  color: #1F304D;
  margin-bottom:.75em;
}
.sidebar-mod.green-crude-production{
}

.sidebar-mod.green-crude-production h3 {
  letter-spacing:-0.036em;
}

.sidebar-mod.contact p {
  line-height:1.2;
  margin-bottom:.75em;
}

.sidebar-mod.jobs h5 {
  margin-bottom:.25em;
}

.sidebar-mod.jobs h5+ul {
  margin-bottom:1.5em;
}

.sidebar-mod.events h6 {
  font-size:.8em;
}

.sidebar-mod.events li, .sidebar-mod.news li  {
  margin-bottom:.75em;
}

.sidebar-mod.news h6 {
  font-weight:normal;
}

/* =press */

.press-materials h4.press-title {
  font-size:1.1em;
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  letter-spacing:0;
  padding-right:50px;
  min-height:0em;
  margin-bottom:.5em;
}

.press-images .caption  {text-align:left;}

.press-images img  {
}

.press-images li {
  min-height:90px;
  margin-bottom:10px;
}


.press-images h6 {
  font-weight:normal;
  margin-bottom:.5em;
}

.press-images p {
  clear:left;
  margin-top:.5em;
  overflow:hidden;
}



/* =bio */
.bio-image-container {
  float:left;
  margin:3px 15px 10px 0;
  width:175px;
}

.press-materials ul {
  list-style:disc;
  margin-left:15px;
}

.bios h4 {
    background: url(../images/page-break.jpg) no-repeat left top;
    margin-top:15px;
    padding-top:25px;
}

/* =multimedia */
.video-list  li {
  float:left;
  /* width:44%; */
  margin-right:6%;
  
}

.multimedia-container h4 {margin-bottom:.5em}
.multimedia-container h3 {font-size:.8em;padding-left:10px;}
.multimedia-container {
    clear:left;
    overflow:hidden;
    background: url(../images/page-break.jpg) no-repeat left top;
    margin-top:15px;
    padding-top:25px;}
.multimedia-container ul li {display:inline;}
.multimedia-container ul a {float:left;padding:5px;}
.multimedia-container ul a:hover {background:#f0f0f0;}


/* =green crude */

.green-crude-nav {
  background: #edf6f9 url(../images/background-greencrude-nav.jpg) repeat-x;
  height:130px;
  padding:0 10px;
  margin-bottom:1.5em;
}

.green-crude-nav h6 a {
  float:left;
  height:109px;
  width:109px;
  text-decoration:none;
  background-image: url(../images/background-crude-nav-sprite.gif);
  background-position: left bottom;
  background-repeat: no-repeat;
  margin:5px;
  /* color:#666666; */
  color: #3D619C;
  font-family:"Lucida Sans Unicode", "Lucida Grande", Garuda, arial, sans-serif;
  letter-spacing:-0.036em;
}

.green-crude-nav h6.why-algae a {background-position:left bottom;}
.green-crude-nav h6.how-it-works a {background-position:-109px bottom;}
.green-crude-nav h6.does-it-matter a {background-position:-218px bottom;}

.green-crude-nav p {
  color:#666;
  margin:2.25em 1em 1em;
  font-size:.9em;
  line-height:1.2;
  float:left;
  width:135px;
}



/* =how it works */

.process {
  background: #d6eaf1 url(../images/how-to-make-alae-based-fuel.gif) no-repeat;
  height:305px;
  width:730px;
}

.process a {
  float:left;
  width:20%;
  height:305px;
  text-indent:-5000px;
}


/* =why it matters */

.why-it-matters-row {padding-left:90px;}
.why-it-matters-row h5 {margin-bottom:5px;}

.why-it-matters-row span.icon {
  float:left;
  width:77px;
  height:62px;
  overflow:hidden;
  background-image: url(../images/why-sprite.gif);
  background-repeat: no-repeat;
  background-position:left top;
  margin-left:-90px;
  margin-top:2px;
}


#is-sustainable span.icon{ background-position:0 0 }
#is-efficient span.icon{ background-position:0 -62px }
#is-low-impact span.icon{ background-position:0 -123px }
#is-replacement span.icon{ background-position:0 -185px }
#is-scalable span.icon{ background-position:0 -248px}

/* =learn */

.learn h4, .faq h4 {margin-bottom:.5em;}

ol ul li {
  margin-bottom:1em;
  list-style:disc;
}

ol ul li li {
  margin-bottom:.25em;
  list-style:circle;
}

ol ul{
  margin-bottom:2.5em;
}

.resources dl dd {
  margin-bottom:1em;
  margin-left:0;
}

/* =news */

.news-media h4 {
  font-family:"Lucida Sans Unicode", "Lucida Grande", Garuda, Arial, sans-serif;
  text-transform:capitalize;
  font-size:1.4em;  
  letter-spacing:-0.036em;
  min-height:50px;
}

/* =events */

.events small {
  font-style:italic;
  color:#666;
}

.events h5+p {
  margin-top:-1.25em;
}

.featured-container {
  background:#C8CEE4;
  padding:.5em 1em;
  margin:1em 0;
}

.featured-container h4 {
  margin-bottom:.25em;
}

.featured-container small {
  font-style:italic;
}


/* =headers */

h1 {
  font-family:"Lucida Sans Unicode", "Lucida Grande", Garuda, Arial, sans-serif;
  letter-spacing:-.05em;
  font-size:1.6em;
  /* color:#333333;*/
  color: #1F304D
  font-weight:bold;
  margin-bottom:1em;
}
h2 {
   color: #1F304D; 
}
h3 {
  font-size:1.2em;
  text-transform:uppercase;
  /*color:#030; */
  color: #1F304D;
  line-height:1.2;
}
h4 {
  font-size:1.4em;
  /* color:#333333; */
    color: #4F90CD;
  line-height:1.2;
}

h4 small {
  font-size:.8em;
  color:#666666;
  display:block;
  font-style:italic;
}

.news-media h5 {
  background: url(../images/page-break.jpg) no-repeat left bottom;
  font-size:1.2em;
  font-style:italic;
  font-weight:normal;
  padding-bottom:.5em;
}


.news-media h5 small {
  font-size:.8em;
}



.press-container h2 {
  clear:left;
  margin-top:1em;
  padding-top:1em;
  margin-bottom:.5em;
  min-height:1em;
  background: url(../images/page-break.jpg) no-repeat left top;
  font-size:1.4em;
}


.press-container.first h2 {
  margin-top:0;
}


/* edit 6/15/2012... Commented out old nav CSS

      BEGIN OLD NAV CSS

#navigation {
  clear:both;
  background:url(../images/background-navigation.png);
  border-top:1px solid #a1c458;  
  border-bottom:1px solid #9ab959;  
  overflow:hidden;
  margin:0;
  }
    
#navigation ul li a {
  float:left;
  padding:2px 27.75px;
  color:#fff;
  font-size:1.4em;
  text-decoration:none;
  background: url(../images/nav-sep.png) no-repeat ;
}

#navigation ul li.active a {
  background:#5e8f13;
  font-weight:bold;
}
#navigation ul li {
  display:inline;
  overflow:hidden;
}

#navigation ul li a:hover {  background:url(../images/background-nav-hover.png) no-repeat ;}

#navigation ul li:first-child a { background:none;}
#navigation ul li:first-child a:hover {background:url(../images/background-nav-hover.png) no-repeat -5px 0; }

      END OLD NAV CSS

*/

/* edit 6/15/2012... Updated nav CSS */

/*       BEGIN NEW NAV CSS */
#navigation {
  clear:both;
  background:transparent url(images/nav_bg_2012.png) repeat-x top left;
  border-top:1px solid #000000;  
  border-bottom:1px solid #000000;  
  overflow:hidden;
  margin:0;
  padding:0;
  font-weight:bold;
  }
    
#navigation ul li a {
  float:left;
  padding:2px 27.75px;
  color:#999999;
  font-size:1.4em;
  text-decoration:none;

}

#navigation ul li.active a {
  background:transparent url(images/nav_bg_2012.png) 0px -30px no-repeat;
  font-weight:bold;
  color:#FFFFFF;
}

#navigation ul li {
  display:inline;
  overflow:hidden;
}

#navigation ul li a:hover {  
  color:#FFFFFF;
}

/*       END NEW NAV CSS */


.side-nav ul {margin:15px 0 10px 10px;}
.side-nav ul li {margin:0;padding:0;}
.side-nav ul li a {
  display:block;
  font-size:1.2em;
  /* color:#333333;*/
  color: #3D619C;
  text-decoration:none;
  padding:5px 10px;
}
.side-nav ul li.active a  {
  background: url(../images/background-sidenav-active.png) no-repeat;
}

.side-nav ul li a:hover{background: url(../images/background-sidenav-hover.png) no-repeat;}

#footer {
  background:#d2d2c4;  
  color:#333333;
}

#footer .right {text-align:right;}
#footer .left {}
#footer .right .nav-list, #footer .left p  {padding:10px;}

/* =form */
fieldset {border:0;}
#email2 {
 display:none;
}

/* =search */
#search {
  height: 35px;
  z-index:999;
  background-color:#727C8C;
  padding:5px;
  border:1px solid black;
  display: none;
  /*float: right;*/
  position: absolute;
  left:797px;
  top: 105px;
    
}

#search fieldset {padding:0;}
fieldset ul.inline li {float:left;}
#search .search-box{
  margin-top: 2px;
  border:1px solid #3d5801;
  /* background: url(../images/background-nav-hover.png) no-repeat -2px 0; */
  background: #4F90CD;
  box-shadow:1px 1px 1px #649201;
  -webkit-box-shadow:1px 1px 1px #649201;
  -moz-box-shadow: 1px 1px 1px #649201;  
  color:#fff;
  }
#search .search-submit{
  margin-top: 2px;
  padding: 2px;
  border:1px solid #3d5801;  
  background: #4F90CD;
  color:#fff;
  margin-top:2px;
  box-shadow:1px 1px 1px #649201;
  -webkit-box-shadow:1px 1px 1px #649201;
  -moz-box-shadow: 1px 1px 1px #649201;  
  }


/* =lists */

.nav-list {margin-left:0;padding-left:0;}

.nav-list li {
  display:inline;
  overflow:hidden;
}
.nav-list li a {
  float:left;
  color: #3D619C;
  /*color:#333;*/
  padding:2px 10px;
  text-decoration:none;
  background: url(../images/list-nav-sep.gif) no-repeat right;
  }
.nav-list li.last a {
  background: none;
  }

ul {
  padding:0;
  margin:0;
  list-style:none;
}


.link-list li  { margin-bottom:5px;  }

ul.fact-list > li {
  margin-bottom:2.0em;
  background: url(../images/page-break.jpg) no-repeat -25px bottom;
  padding-bottom:1.5em;
  overflow:hidden
}
ul.fact-list  li.last { 
  background:none;
}


.blog_article, #comment_form h3 {
  background: url(../images/page-break.jpg) no-repeat -25px top;
  padding-top:1.5em;
  margin-top:1em;
}



ul.fact-list h6 { 
  float:left;
  width:30%;
}
ul.fact-list div { 
  float:left;
  width:70%;
}

ul.fact-list dl dt { 
  clear:left;
  float:left;
  width:35%;
  font-weight:normal;
}
ul.fact-list dl dd { 
  float:left;
  width:60%;
  margin-bottom:.25em;
}

ul.fact-list ul li {
  list-style:disc;
  margin-bottom:.25em;
}


/* =index */

.main-sell {
  background: url(../images/background-index-sell.jpg) no-repeat;
  color:#fff;
  height:209px;
  margin-left:-5px;
  width:475px
}
.main-sell-2011 {
  /*background: url(../images/background-index-sell.jpg) no-repeat; */
  color:#fff;
  height:156px;
  margin-left:-5px;
  width:680px
}

.main-sell h2 {
  color:#fff;
  font-family:"Lucida Sans Unicode", "Lucida Grande", Garuda, Arial, sans-serif;
  letter-spacing:-.036em;
  font-size:2.2em;
  font-weight:bold;
  line-height:1.0;
  margin:15px 20px 8px;  
}

.main-sell h4 {
  color:#fff;
  margin:0 20px;
  font-size:1.2em;
  font-weight:bold;
}

.main-sell .nav-list {
  margin:15px;
}
.main-sell .nav-list a {
  /*color:#fff;*/
  color: #3D619C;
  border-color:#fff;
  background: url(../images/list-nav-sep-reverse.gif) no-repeat right center;
  text-decoration:underline;
  font-size:1.4em;
}

#small1{margin-bottom:1px;}
#small2{}
#large{margin-left:1px;}

#index-sub-sidebar {
  background: url(../images/content-sep-vert.gif) no-repeat center right;
  background-size: 10px 100%;
  height: 500px; /* edit 6/15/2012 */
}
#index-sub-sidebar h3, #index-sub-content h3, #index-sub-content p {
  margin:10px 20px;
}
#index-sub-sidebar dl {
  margin:15px 30px 45px 20px;
}
#index-sub-sidebar dl dt {
  color:#999999;
  text-transform:uppercase;
  font-size:.8em;
}
#index-sub-sidebar dl dd {
  margin-bottom:15px;
  margin-left:0;
}

#index-sub-sub-content {
  background: url(../images/content-sep-horz.gif) no-repeat top center;
  overflow:hidden;
  padding-top:15px;
}

.index-people img {
  float:left;
  margin:0 10px 10px 10px;
}

.index-contact p {
  margin-bottom:.5em;
  line-height:1.4;
}

.index-contact p.smaller {
    font-size:0.9em;
}

/* =career center */
.career h4 {
  margin-bottom:.15em;
}

.career ul {
  margin-bottom:2em;
}

.career ul li:before {
  content: "\00BB \0020";
  }

.career-contianer ul {
  list-style:circle;
  padding-left:15px;
  margin-left:15px;
}

.career-contianer ul li {
  margin-bottom:.5em;
}

.application-instructions {
  font-style:italic;
  color:#666;
}

/* table */

thead th {
  background:#74b400;
  color:#fff;
}

tbody td {
  border-bottom:1px dotted #ccc;
}

tfoot td {
  border-top:1px solid #666;
  border-bottom:1px dotted #ccc;
}


/* =text */


.post-date {
  float:left;
  width:70px;
  background:#C8CEE4;
  height:auto;
  margin:0 10px 10px 0;
  padding:10px;
}

.post-date .day {
 /* color:#5c8f13;*/
  color: #1F304D;
  float:left;
  font-size:26px;
  border-right:1px solid #5c8f13;
  vertical-align:middle;
  margin-right:5px;
  padding-right:3px;  
  line-height:1;
  font-weight:bold;
}
.post-date .month {
  text-transform:uppercase;
  font-size:14px;
  line-height:1;
  /*color:#5c8f13; */
  color: #1F304D;
}
.post-date .year {
  font-size:12px;
  line-height:1;
  /*color:#3f6f0e;*/
  color: #1F304D;
}



.content-trail {
  display:block;
  padding:8px 0;
} 

blockquote {
  font-size:1.2em;
  font-family:"Lucida Sans Unicode", "Lucida Grande", Garuda, arial, sans-serif;
  /* border-left:5px solid #8ab734; */
  border-left:5px solid #727C8C;
  padding:3px 0 3px 10px;
  line-height:1.2;
  font-style:normal;
}

blockquote.align-right {
  float:right;
  width:175px;
  margin:5px 0 5px 10px;
}

.caption {
  text-align:right;
  color:#999;
  font-size:0.8em;
  margin:5px 10px 10px;
}

p.link-more {margin-top:-1em;}

em.author {
  clear:left;
  font-style:italic;
  color:#666;
}

.pagination {
  background:#C8CEE4;
  padding:5px 10px;
}

/* edit 6/15/2012... Commented out social icon CSS


ul.social-icons {
  margin:10px 5px ;
  padding-left:0;
  display:none;
}

ul.social-icons li a {
  float:left;
  width:16px;
  height:16px;
  overflow:hidden;
  background-image: url(../images/sprite.gif);
  background-repeat: no-repeat;
  background-position:top left;
  margin-right:3px;
}
   END OLD SOCIAL MEDIA CSS */

  /* Social Icon CSS . Commented out 7/29/2012 */

ul.social-icons {
  padding-left:0;
  display: block;
  margin:10px 0 ;
}

ul.social-icons li a {
  float:left;
  width:24px;
  height:24px;
  overflow:hidden;
  background-repeat: no-repeat;
  background-position:top left;
  margin-left:3px;

}

ul.social-icons li.facebook a {background-image: url(../images/social/FacebookIcon24.png);}
ul.social-icons li.facebook a:hover {background-image: url(../images/social/FacebookIcon24.png);}
ul.social-icons li.twitter a {background-image: url(../images/social/TwitterIcon24.png);}
ul.social-icons li.twitter a:hover {background-image: url(../images/social/TwitterIcon24.png);}
ul.social-icons li.youtube a {background-image: url(../images/social/YouTubeIcon24.png);}
ul.social-icons li.youtube a:hover {background-image: url(../images/social/YouTubeIcon24.png);}
ul.social-icons li.mail a {background-image: url(../images/social/EmailIcon24.png);}
ul.social-icons li.mail a:hover {background-image: url(../images/social/EmailIcon24.png);}
ul.social-icons li.rss a {background-image: url(../images/social/RSSIcon24.png);}
ul.social-icons li.rss a:hover {background-image: url(../images/social/RSSIcon24.png);}

div.social_container {
  width: 145px;
  float: right;
  clear: right;
  margin-bottom: 5px;
}

  /* END NEW SOCIAL MEDIA ICON CSS */

.tools {
  border:1px solid #e4e4db;
  padding:5px;
  margin:0;
  overflow:hidden;
  width:165px;
}

.tools li a {
  float:left;
  text-decoration:none;
  color:#999999;
  padding-left:18px;
  padding-right:6px;
  background-image: url(../images/sprite.gif);
  background-position: 0 -48px;
  background-repeat: no-repeat;
}

.tools li.print a { background-position: 0 -48px;}
.tools li.email a { background-position: 0 -80px;}
.tools li.twitter-small a { background-position: 0 -64px;}
.tools li.share a { background-position: 500px 500px;}


.floating-tools {
  float:right;
  width:180px;
  margin-top:-5px;
}


.pdf {
  padding-left:24px;
  background: url(../images/sprite.gif) no-repeat 0 -95px;
  color:#666 ! important;
  text-decoration : none ! important;
}

/* =images */

.side-bar-image {
  padding:10px 10px 15px; ;
}

.content-left {
  float:left;
  padding:10px 10px 10px 0;
  margin:10px 10px 0 0;
  background: url(../images/background-image-left.jpg) no-repeat top right;
}
.content-left.first {margin:0 10px 0 0;}

.content-right {
  float:right;
  margin:10px 0 10px 10px;
}
.dynamic-right {
  align:right;
  margin:10px 0 10px 10px;
}

/* =tooltips */

.tooltip
{
  background-color: #fff;
  color: #666;
  font-size:12px;
  border:solid 1px #000;
  z-index:100;
  width:225px;
  padding:15px;
  border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
  -moz-box-shadow: 3px 3px 3px #666;
  -webkit-box-shadow: 3px 3px 3px #666;
  box-shadow: 3px 3px 3px #666;  
}



/* =gallery */

.image-wrapper img {max-width:525px}

/* =slideshoe */

div.slideshow {
  height:380px;
}

.addthis_default_style .at300b, .addthis_default_style .at300m {
  padding:1px 0 0 ! important;
}

/* JSM 2/27/11 Side bar for Authors in News Stories */
.author-sidebar {
  width:40%; 
  float:right; 
  background:#EBF2D9; 
  margin:5px; 
  padding:5px; 
  border:1px solid green;
}
