/* Clean up some background spacing for the container's padding - added 12/8/2010 by @mdo; need to clean this up */
body,
body.help,
html body.help,
html body.goodies,
html body#goodies {
  background-image: none;
  padding-top: 60px !important;
  padding-bottom: 30px;
}
body.phoenix-skybar,
body.contributor-skybar {
  padding-top: 60px !important;
}
body.phoenix-skybar div.phoenix-banner-outer {
  display: none !important;
}
.fixed-banners {
  display: none !important;
}
div#container {
  margin-top: 0;
}

body #container {
  width: 980px;
  margin: 0 auto;
}

body .wrapper {
  padding: 15px 20px;
  font: 13px/20px Helvetica Neue, Helvetica, Arial, sans-serif;
}

a {
  color: #0084b4;
}

/* Heading */

.about-heading {
  border-bottom: 1px solid #E0EEF5 !important;
  clear: both;
  display: block;
  width: 940px;
  margin: 0 -20px 20px;
  -moz-border-radius-topleft:5px;
  -moz-border-radius-topright:5px;
  -webkit-border-top-left-radius:5px;
  -webkit-border-top-right-radius:5px;
  padding: 0 20px 14px;
}

.ie7 .about-heading {
  margin-top: -65px !important;
  position: absolute;
  zoom: 1;
}

.ie7 .wrapper {
  padding-top: 70px !important;
  margin-bottom: 30px !important;
}

.about-heading h1 {
  color: #999;
  display: block;
  padding-top: 0 !important;
  text-shadow: 0 1px #fff;
  font-size: 20px;
  font-weight: 300;
  letter-spacing: 0;
}

.about-heading span {
  color: #bbb;
}


/* Navigation (left sidebar) */
ul#nav {
  float: left;
  width: 172px;
  margin-bottom: 30px;
  margin-left: -12px;
}

ul#nav li {
  padding: 0;
  margin-bottom: 2px;
}

ul#nav li a {
  display: block;
  font: 15px Helvetica Neue, Helvetica, sans-serif;
  font-weight:200;
  padding: 4px 12px;
  line-height: 18px;
  outline: 0;
  color: #0084b4;
  border-radius: 16px;
  -moz-border-radius: 16px;
  -webkit-border-radius: 16px;
}

body#about a#about_link,
body#press a#press_link,
body#logo_brand a#logos_link,
body#buttons a#buttons_link,
body#logos a#goodies_link,
body#contact a#contact_link,
body#employees a#employees_link,
body#opensource a#opensource_link,
body#security a#security_link,
body#translation a#translation_link {
  color: #333;
  background: #E0EEF5;
  font-weight: 400;
  text-shadow: #fff 0 1px 0;
  -moz-box-shadow: inset #abdcf5 0 1px 0;
  -webkit-box-shadow: inset #abdcf5 0 1px 0;
  box-shadow: inset #abdcf5 0 1px 0px;
}

ul#nav li a#help_link {
  font-size: 12px;
  margin-top: 10px;
}

ul#nav li a:hover {
  background: #f8f8f8;
  text-decoration: none;
  -moz-box-shadow: inset #eee 0 1px 0;
  -webkit-box-shadow: inset #eee 0 1px 0;
  box-shadow: inset #eee 0 1px 0;
}

ul#nav li a:active {
  background: #eee;
  text-decoration: none;
}

/* Sections (aka tabs) */

.sections {
  margin: 0 0 60px 0 !important;
  padding: 0 !important;
}
.about-twitter p {
  width: 75%;
}
#content .about-twitter h4 {
  font-size:14px !important;
}
.about-twitter h3 span {
  font-weight:normal;
}
.sections p, .sections address, .sections ul {
  padding-bottom: 10px;
  font-size: 14px;
  line-height: 22px !important;
  color: #333 !important;
}

.sections p.intro {
  font-size: 18px;
  line-height: 27px !important;
  color: #666 !important;
  width: 85%;
}

.sections p.question {
  padding-bottom: 0 !important;
  margin: 0 !important;
}

.sections p.answer {
  color: #666 !important;
  margin: 0 !important;
  padding: 0 0 18px 0 !important;
}

.sections h2 {
  clear: both;
  display: block;
  font-weight: 300;
  padding: 0;
  float: none;
  font-size: 30px;
  padding-bottom: 12px !important;
  margin-top: -8px !important;
  padding-top: 8px !important;
  line-height: 118% !important;
  width: 90%;
}

body.tr .sections h2#tagline {
  font-family: Arial, sans-serif;
}

.sections h2#tagline {
  font-size:40px;
  margin:0 0;
  margin-top:-18px !important;
  padding:0;
  width:75%;
}
body.fr h2#tagline {
  font-size:39px;
}
body.ja h2#tagline {
  font-size:26px;
}
body.western h2#tagline {
  font-size:43px;
}
.sections h2#tagline+h3 {
  margin-top:0;
}
.sections h3 {
  margin-top: 14px !important;
  padding-top: 24px !important;
  font-size: 16px;
  border-top: 1px solid #E0EEF5;
}

.sections h3.first {
  border-top: 0;
  padding-top: 0 !important;
}

.sections h3.questions-title {
  padding-bottom: 16px;
}

.sections h4 {
  color: #666;
  padding-top: 5px;
  font-size: 16px !important;
}

.sections p.note {
  background: #f4f4f4;
  color: #666;
  padding: 8px 10px;
  font-size: 12px;
  line-height: 19px !important;
  margin: 0px -10px 10px -10px !important;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
}

.borderless {
  border: 0 !important;
}

/* Images */

img.press-globe {
  margin-left: 570px;
  position: absolute;
  margin-top: -20px;
}

img.about-birds {
  margin-left: 600px;
  position: absolute;
  margin-top: -80px;
}
img.about-birds-2 {
  margin-left: 595px;
  position: absolute;
  margin-top: -120px;
}
img.about-img {
  margin-left: 570px;
  position: absolute;
  margin-top: -20px;
}

img.bird {
  margin-left: 10px;
  margin-right: -30px;
}

div.feature {
  margin-bottom: 48px;
}

#content div.feature h2{
  margin-bottom: 12px;
}

div.feature b {
  color: #ccc;
}

/*
.twitter-logos .group {
  width: 100%;
  float: left;
}

.full-logo {
  margin-top:24px;
}

*/
.sections .group h3 {
  border:0;
  margin-top:0 !important;
  padding-top:0 !important;
}

/*
div.white {
  background: #fff;
}
*/

div.twitter-buttons a {
  margin-top: 15px;
}

div.twitter-buttons a img {
  margin:0 auto;
}

div.twitter-buttons p span {
  display: block;
  margin-bottom: 5px;
}

div.twitter-buttons a:hover span {
  text-decoration: underline;
}

p.logos {
  font-size: 12px;
  line-height: 18px !important;
}

/* Logos on solid and checkered backgrounds */
.solid-bg,
.checkerboard,
.checkerboard-dark {
  padding: 15px 20px;
}
div.solid-bg {
  background: #fff;
  padding: 14px 19px; /* minus one for border */
  border: 1px solid #ccc;
}
.checkerboard {
  background: url(/oilspill/20121017122332oe_/https://si0.twimg.com/a/1350417493/images/checkerboard.png);
}
.checkerboard-dark {
  background: #333 url(/oilspill/20121017122332oe_/https://si0.twimg.com/a/1350417493/images/checkerboard.png);
}

/* Wordmarks with Larry in them */
ul.marks {

}
ul.marks li {
  margin: 0 0 20px;
  font-size: 12px;
  line-height: 18px;
}
ul.marks li div {
  margin-bottom: 5px;
  float: left;
  min-width: 200px;
}
ul.marks li strong {
  display: block;
  font-size: 13px;
  color: #555;
  clear: left;
}
ul.marks li span {
  color: #999;
  padding: 0 2px;
}

/* Bird icons */
ul.birds {
  margin-left: -20px;
  width: 780px;
}
ul.birds li {
  float: left;
  margin-left: 20px;
}
ul.birds li,
ul.birds li img {
  width: 160px;
}
ul.birds li img {
  display: block;
  width: 160px;
  line-height: 1;
}
ul.birds li div.solid-bg,
ul.birds li div.checkerboard,
ul.birds li div.checkerboard-dark {
  padding: 0;
}
ul.birds li div.checkerboard,
ul.birds li div.checkerboard-dark {
  width: 160px;
  min-width: 160px;
}
ul.birds li div.solid-bg,
ul.birds li div.solid-bg img {
  width: 158px;
  min-width: 158px;
}



div.twitter-buttons p {
  border: 0 !important;
}

div.twitter-buttons p a.btn:hover {
  text-decoration: none;
}

p.normal {
  border-left: 0;
}

p.description {
  font-size: 12px;
}

p.guidelines {
  color: #666 !important;
  margin-bottom:0 !important;
  margin-top: -8px !important;
}

p.smaller {
  width: 95%;
  border-right: 0;
}

p.logos span {
  display: block;
  clear: both;
  color: #666;
  padding: 4px 0 5px 0;
}

#download_logo h3 {
  margin-bottom: 0;
  padding-bottom: 0;
}

/*.goodies-buttons img {
  margin: -10px 0 0 0px !important;
}*/

.normal a.goodies-buttons {
  display: block;
  height:100px;
  vertical-align:bottom;
}

div.logo .checkerboard-dark {
  display:block;
  height:90px;
  width:240px;
  margin:20px 0 0;
  padding:0;
}

div.logo .checkerboard-dark a {
  display:block;
  text-align:center;
}
div.logo .checkerboard-dark a img {
  margin-top:25px;
}
div.logo .normal {
  padding-bottom: 7px;
}
h3.second {
  clear:both;
  display: block;
  margin-top: 40px !important;
}

/* Resources */

.resources-feature {
  width: 220px;
  float: left;
  margin-right: 20px;
  font-size: 14px;
  line-height: 22px;
}

.resources-feature a {
  color: #999;
}

.resources-feature a:hover {
  text-decoration: none;
}

.resources-feature strong,
.resources-feature .dest {
  color: #0084b4;
}

.resources-feature a:hover .dest,
.resources-feature a:active .dest {
  text-decoration: underline;
}

.resources-feature strong,
.resources-feature span {
  display: block;
}

.resources-feature strong {
  font-weight: normal;
  font-size: 18px;
}

.resources-feature .illustration-buttons {
  width: 199px;
  height: 132px;
  margin: 12px 0;
  background: url('/oilspill/20121017122332oe_/https://si0.twimg.com/a/1350417493/images/widgets/resources_illustration.png');
}

.resources-feature .illustration-widgets {
  width: 166px;
  height: 118px;
  margin: 19px 0 19px 21px;
  background: url('/oilspill/20121017122332oe_/https://si0.twimg.com/a/1350417493/images/widgets/resources_illustration.png') no-repeat -218px 0;
}

.resources-feature .illustration-logos {
  width: 202px;
  height: 132px;
  margin: 12px 0;
  background: url('/oilspill/20121017122332oe_/https://si0.twimg.com/a/1350417493/images/widgets/resources_illustration.png') no-repeat -403px 0;
}

/* Contact us */

#contact ul.emails {
  float: left;
  width: 30%;
}

#contact address {
  float: left;
  width: 30%;
}

p#office_image {
  padding-top: 1em;
}

/* Contact us */

#press ul.links {
  float: left;
  width: 40%;
}

/* Employees */

.employees {
  margin-top: 20px;
  margin-bottom: 20px;
}

.employees img {
  padding-right: 2px;
  padding-bottom: 3px;
}

/* Misc */

div.item {
  width: 45%;
  float: left;
  padding-right: 5%;
}

p.desc {
  font-size: 13px;
  line-height: 19px !important;
  padding-top: 0;
  margin-top: -2px !important;
  padding-bottom: 5px;
  height: 2.5em;
  min-height: 2.5em;
  overflow: hidden;
}

h3.cat {
  margin-bottom: 12px !important;
  clear: both;
  color: #666;
  font-weight: normal;
  display: block;
}

a.btnlink {
  display: inline-block;
  padding: 3px 10px 3px 10px !important;
  margin: 5px 0 0 -10px !important;
  font-family: Arial, sans-serif;
  margin-bottom: 0px !important;
  line-height: 18px;
  outline: 0;
  font-weight: bold;
  font-size: 11px;
  -moz-border-radius: 16px;
  -webkit-border-radius: 16px;
  cursor: pointer;
}

a.btnlink:hover {
  text-decoration: none;
  color: #000;
}

a.smaller-link {
  color: #999;
  font-weight: normal !important;
  outline: none;
}

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

.last {
  padding-bottom: 0;
  margin-bottom: 0;
}

.security p {
  width: 90%;
}

.security p.sep {
  border-bottom: 1px solid #eee;
  width: 100%;
  padding: 0;
  color: #999 !important;
  height: 12px;
}

.security-intro {
 }

.security-intro img.shield {
  position: absolute;
  margin-left: 610px;
  margin-top: -192px;
}

.security-intro p.intro {
  width: 78%;
  font-weight: 300;
}

.security p.sep strong {
  background: #fff;
  margin-bottom: -10px;
  display: inline-block;
  padding-right: 6px;
}

.white-hats {
  padding-top: 10px;
  margin-left: -10px;
  margin-bottom: 40px;
}

.white-hats a {
  display: block;
  width: 230px;
  height: 48px;
  padding: 10px;
  float: left;
}

.white-hats a:hover {
  background: #f4f4f4;
  text-decoration: none;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
}

.white-hats a img {
  float: left;
  margin: 0 10px 0 0;
}

.white-hats a b {
  font-weight: normal;
}

.white-hats a strong {
  font-weight: bold;
}

.white-hats a span {
  display: block;
  color: #333;
}

.translation p {
  width: 90%;
}

.translation-intro {
 }

.translation-intro p.intro {
  width: 78%;
  font-weight: 300;
}

.translation-intro img.translator-bird {
  position: absolute;
  margin-left: 580px;
}

.translation-moderators {
  padding-top: 10px;
  margin-left: -10px;
  margin-bottom: 40px;
}

.translation-moderators a {
  display: block;
  width: 230px;
  height: 48px;
  padding: 10px;
  float: left;
}

.translation-moderators a:hover {
  background: #f4f4f4;
  text-decoration: none;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
}

.translation-moderators a img {
  float: left;
  margin: 0 10px 0 0;
}

.translation-moderators a b {
  font-weight: normal;
}

.translation-moderators a strong {
  font-weight: bold;
}

.translation-moderators a span {
  display: block;
  color: #333;
}




/* New brand resources page
--------------------------------------------- */

.brand-resources ul {
  padding-bottom: 0;
  margin-bottom: 11px;
  margin-left: 30px;
  width: 70%;
  list-style: disc;
}
/* main page heading */
.brand-resources .sections h2 {
  width: 75%;
  font-size: 40px;
}
/* headings with dividers */
.brand-resources .sections h3 {
  padding-top: 44px !important;
  margin-top: 45px !important;
  margin-bottom: 11px;
  font-size: 30px;
  position: relative;
}
/* subheadings */
.brand-resources .sections h4 {
  padding-top: 0;
  margin-top: 30px;
  font-size: 24px !important;
  color: #333;
}
/* main body text */
.brand-resources .sections p,
.brand-resources .sections li {
  color: #666 !important;
}
.brand-resources .sections p {
  padding-bottom: 0;
  margin-bottom: 11px;
  width: 80%;
}
.brand-resources .sections p.intro {
  width: 90%;
}

/* permalink anchors */
.brand-permalink {
  display: block;
  position: absolute;
  top: 50px;
  right: 0;
  font-size: 20px;
  font-weight: bold;
  color: #aaa;
  padding: 0 5px 5px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}
.brand-permalink:hover {
  color: #0084b4;
  text-decoration: none;
  background-color: #f5f5f5;
}

/* example bird callout */
.brand-resources-bird-callout {
  float: right;
  margin: 10px 60px 20px 30px;
}

/* example uses (wrong and inappropriate) */
.twitter-brand-uses {
  margin: 5px 0;
}

/* Twitter buttons screenshot */
.twitter-choose-buttons {
  display: block;
  width: 652px;
  margin-right: 60px;
}

/* linked, bordered images */
.bordered-image {
  margin-top: 11px;
  margin-bottom: 11px;
  line-height: 1;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  -webkit-box-shadow: 0 0 1px rgba(0,0,0,.3);
     -moz-box-shadow: 0 0 1px rgba(0,0,0,.3);
          box-shadow: 0 0 1px rgba(0,0,0,.3);
  -webkit-transition: all .2s ease-in-out;
     -moz-transition: all .2s ease-in-out;
          transition: all .2s ease-in-out;
}
a:hover .bordered-image {
  -webkit-box-shadow: 0 0 1px #56b4ef, 0 0 8px rgba(82,168,236,.6);
     -moz-box-shadow: 0 0 1px #56b4ef, 0 0 8px rgba(82,168,236,.6);
          box-shadow: 0 0 1px #56b4ef, 0 0 8px rgba(82,168,236,.6);
}

/* birds */
.twitter-bird-logos {
  overflow: hidden; /* clear the floats */
  margin-top: 10px;
}
.bird-logo-option {
  float: left;
  width: 140px;
  margin-right: 30px;
}
.bird-logo-option strong {
  display: block;
}
.bird-logo-option .separator {
  color: #aaa;
}
.twitter-bird-example {
  display: block;
  width: 140px;
  height: 140px;
  margin-bottom: 5px;
  background-color: #f5f5f5;
}
.twitter-bird-example,
.twitter-bird-example img {
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}
.twitter-bird-example img {
  width: 140px;
}
.transparent-bird {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAK0lEQVQYlWNkYGCQZEAD////f44uxoQugAsMoELG////YwoyMmJ4cCh4BgCPIgcpTqY4UQAAAABJRU5ErkJggg==);
}
.transparent-dark {
  background-color: #444;
}

/* verified badge */
.verified-badge {
  display: inline-block;
  zoom: 1; /* IE7 inline-block hack part 1*/
  *display: inline; /* IE7 inline-block hack part 2 */
  width: 15px;
  height: 15px;
  vertical-align: text-top;
  background-image: url(/oilspill/20121017122332oe_/https://si0.twimg.com/a/1350417493/t1/img/twitter_web_sprite_icons.png);
  background-position: -30px -480px;
  background-repeat: no-repeat;
}
