/* @group Basic styles *//* Neutralize styling:    Elements we want to clean out entirely: */
html, body, form, fieldset {
        margin: 0;
        padding: 0;
        font: 100%/120% Helvetica, Arial,  sans-serif;
}

/* Neutralize styling: 
   Elements with a vertical margin: */
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address {
        margin: 1em 0;
        padding: 0;
}

/* Apply left margin:
   Only to the few elements that need it: */
li, dd, blockquote {
        margin-left: 1em;
}

/* Miscellaneous conveniences: */
form label {
        cursor: pointer;
}
fieldset {
        border: none;
}
input, select, textarea {
        font-size: 100%;
}
img{border: none;}
/* Basic Typography */

body{
  font-size: 78%;
  background: #fff;
  color: #333;
  text-align: center;
}
a{
  color:  #c60;
}
h2, h3, h5 {
  text-transform:  uppercase;
  clear:  both;
}

h5 {
  display: block; 
  clear: left;
}

html>body h5 {
  display: inline;
}

h6 {
  font: 80% Helvetica, Arial,  sans-serif;
}

table{
  border: 1px solid #ccc;
}
table caption{
  font-size:  90%;
  font-style: italic;
}
th{
  background:  #ccc;
  color:  #fff;
  font-weight: bold;
}
th, td{
  padding:  10px;
}
tbody th{
  background:  #f5f5f5;
  color:  #666;
}
td{
  background:  #fcfcfc;
}

/* @end */

/* @group General Layout */

/* Layout */

#doc{
  text-align: left;
  width: 780px;
  margin: 0 auto;
  position: relative;
}


/* Header and nav */
#hd{
  background: #000;
  color: #fff;
  clear: both;
  float: left;
  width: 100%;
}
#hd h1{
  text-indent: -9999px;
  overflow: hidden;
  background: url(../images/logo.png) 20px no-repeat;
  width: 220px;
  height: 90px;
  margin: 0;
  padding: 0;
  line-height: 90px;
  float: left;
  clear: left;
}
#hd a{
  color: #fff;
  text-decoration: none;
}
#hd-controls{
  width: 240px;
  float: right;
  clear: right;
  margin:  20px 10px 0 0;
  display:  inline;
/*  position: absolute;
  right: 10px;
  top: 20px;*/
}
#hd-controls span.searchfield{
  background: url(../images/search-bg.png) top left no-repeat;
  display:  inline;
  float:  left;
  height:  22px;
  margin-right: 5px;
}
#hd-controls input.txt{
  width:  180px;
  height: 20px;
  line-height:  20px;
  background-color:  #fff;
  border:  none;
  margin:  0 5px;
}

#hd-ctas, #hd-ctas li{
  margin: 0;
  padding: 0;
  list-style-type: none;
}
#hd-ctas li{
  display: inline;
}
#hd #nav{
  width: 100%;
  clear: both;
  background: #f18e00;
  margin: 0;
  line-height:  32px;
}
#hd #nav li, #hd-ctas li{
  font-size: 90%;
  display: inline;
  text-transform: uppercase;
  line-height: 30px;
  height: 30px;
  padding: 0 10px;
  margin: 0;
  list-style-type: none;
  border-right: 1px solid #F5A541;
}
#hd #nav li.last, #hd-ctas li.last{
  border: none;
}
#hd-ctas li{
  padding: 0 5px;
}

/* Body */
#bd{
  width: 100%;
  clear: both;
  float: left;
  display: inline;
  background-color: #FFFFFF;
}

/* Two column layout */
#doc.twocol #bd1{
  width:  175px;
  float:  left;
  display: inline;
  clear:  left;
  margin-left: 10px;
}
#doc.twocol #bd2{
  width: 575px;
  margin:  0 10px;
  float:  left;
  display: inline;
  clear: right;
}
/* Three column layout */
#doc.threecol #bd1{
  width: 175px;
  float: left;
  clear: left;
  display: inline;
  margin-left:  10px;
}
#doc.threecol #bd2{
  width: 390px;
  float: left;
  display: inline;
  margin-left: 10px;
}
#doc.threecol #bd3{
  width:  175px;
  float:  left;
  display: inline;
  clear:  right;
  margin: 0 10px;
}

/* Secondary Navigation */

#secnav{
  background: #fef7e6;
  padding:  10px;
}

#secnav h2{
  font-size:  110%;
  text-transform:  uppercase;
  color:  #666;
  border-bottom:  1px solid #c60;
}
#secnav ul{
  color:  #f4ba2f;
  padding: 0;
}
#secnav li{
  margin:  0;
  padding:  0;
  font-size: 95%;
  border-bottom:  1px solid #f4dbb9;
  list-style: none;
}
#secnav li li{
  text-transform:  none;
  border: none;
  padding-left:  10px;
  list-style: disc;
  list-style-position: inside;
}
#secnav li a{
  color:  #333;
  text-decoration: none;
}
#secnav li.active a{
  background: #fbe8b9;
  display: block;
}
#secnav li.active li a{
  display: inline;
  background: none;
}

p#breadcrumbs{
  width: 750px;
  margin:  10px;
  clear:  both;
}

#bd3 div.adoptbox, #bd3 div.feature{
  padding-bottom: 20px;
}
#bd3 div.adoptbox, #bd3 div.feature, #bd2 div.feature {
  background:  #e6e6e6;
  margin-bottom:  10px;
  clear:  both;
}
div.adoptbox p,
div.feature p, 
div.adoptbox h3,
div.feature h3, 
#bd3 div.adoptbox img, 
#bd3 div.feature img, 
div.adoptbox a.buttonlink, 
div.adoptbox a.more{
  margin: 10px 10px 5px 10px;  
}

#bd2 img {
  margin: 4px;
}

/*Footer*/
#ft{
  margin: 20px 10px 40px 10px;
  padding: 20px 0;
  text-align:  center;
  display:  inline;
  float:  left;
  clear:  both;
  width:  760px;
  background:  #f6f6f6;
}

/* @end */

/* @group Homepage */

/*Homepage Specific styles*/
#banner{
  height: 215px;
}

#banner .campaign-intro.bigcats{
  background: url(../images/banner-lion.jpg) top no-repeat;
  height: 165px;
  display: block;
}
#banner .campaign-intro.bigcats p{
  margin: 0 10px 10px 595px;
  padding-top: 30px;
  color: #000;
  line-height: 200%;
  font-size: 105%
}

#banner .bff-intro{
  background: #000;
  color: #fff;
  float: left;
}
#banner .bff-intro p{
  width: 560px;
  font-size: 90%;
  margin-top: 0;
  line-height: 120%;
  margin: 10px;
  float: left;
  display:  inline;
  height: 20px;
}
#banner .bff-intro span.banner-cta{
  width: 200px;
  height: 50px;
  line-height: 50px;
  float: right;
  background: #585858;
  display: inline;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  font-size: 110%;
}
#banner h2{display: none;}

/* Homepage Feature boxes */
#home-page div.feature{
  width:  240px;
  margin:  10px;
  float:  left;
  display:  inline;
  background:  #e6e6e6;
}
#home-page div.feature h3, #home-page div.feature p{
  margin:  10px;
}
#home-page div.feature h3, div#news h3{
  font-size:  110%;
  text-transform: uppercase;
  margin:  10px;
  color:  #666;
}

/*Homepage news items*/
#home-page div#news{
  margin: 10px 10px 0 10px;
  width:  760px;
  background-color:  #fef5e9;
  clear:  both;
  float: left;
  display:  inline;
}
#home-page div#news h3{
  color:  #333;
  margin-bottom:  0;
}
#home-page div.newsitem{
  width:  227px;
  float:  left;
  display:  inline;
  margin-left: 10px;
  margin-bottom: 10px;
  padding-right: 10px;
}
#home-page div.newsitem.first{
  border-right: 1px solid #c60;
}
#home-page div.newsitem.last{
  border-left: 1px solid #c60;
  width:  225px;
  padding-left:  10px;
}

/* @end */

/* @group Campaign Page */

#campaign-page ul.speciesnav {
  margin:  0;
  padding:  0;
}
#campaign-page ul.speciesnav li {
  display:  inline;
  margin:  0;
  padding:  0;
  margin-right: 10px;
}
#campaign-page a.buttonlink {
  width:  40%;
  text-align:  center;
  float:  left;
  display: block;
  clear:  both;
}

/* @end */

/* @group Give page */

#give-page #bd2 div.feature{
  width:  180px;
  float:  left;
  clear:  none;
  margin-right:  10px;
  margin-top:  10px;
}
#give-page div.feature a.buttonlink{
  display:  block;
  float:  right;
  clear:  both;
}

/* @end */

/* @group News */

#campaign-page div.newsitem, 
#news-page div.newsitem{
  clear:  both;
  float: left;
  width:  100%;
}

#news-page div.newsitem p, #news-page div.newsitem h4, #news-page div.newsitem h3 {
  margin-left:  0px;
}
#campaign-page div.newsitem h4, #campaign-page div.newsitem h3,
#news-page div.newsitem h4, #news-page div.newsitem h3, #about-page h4 {
  margin-bottom:  0;
  font-size:  120%;
}
#campaign-page div.newsitem img {
  float:  left;
  margin-top:  -1.5em;
}

#news-page div.newsitem img {
  float: right;
}

.csc-textpic-caption {
  font-style: italic;
}

#campaign-page .caption {
  clear: right;
  float: right;
  width: 250px;
  font-style: italic;
}
#news-page .caption {
  clear: right;
  float: right;
  text-align: center;
  width: 250px;
  font-style: italic;
}

#campaign-page div.newsitem img {
  float: right;
  margin-top: 5px;
}

#campaign-page #bd2 .buttonlink {
  clear: left;
}

div.newsitem p.categories{
  margin-top:  -1em;
}

/* @end */

/* @group Who We Work With Page */

#partners-page div.feature{
  margin-bottom:  20px;
  width: 100%;
}

/* @end */

/* @group Animals */
ul#animalslist, ul#campaignslist{
  width:  100%;
}
ul#animalslist, ul#animalslist li, #campaignslist, #campaignslist li{
  margin:  0;
  padding: 0;
  list-style-type: none;
  float:  left;
}
ul#animalslist h3{
  width:  100px;
  float: left;  
  clear:  left;
  margin-left: 10px;
}
ul#animalslist li{
  clear:  right;
  display: block;
  float:  left;
  clear: left;
  width:  100%;
}
ul#animalslist li.odd, ul#campaignslist li.odd{
  background:  #f5f5f5;  
}
ul#animalslist li li{
  width:  100px;
  float:  left;
  clear:  none;
  margin-left:  10px;
}

div.animalsBlock {
  width: 100%;
}

div.animalsBlock ul {
  list-style-type: none;
  float: left;
}

div.animalsBlock h3{
  width:  100px;
}
div.animalsBlock li{
  display: inline;
}

/* @end */

/* @group Campaigns */

#campaignslist h3{
  display:  none;
}
#campaignslist img{
  float: left;
  margin:  10px;
}
#campaignslist p{
  margin-left: 195px;
  clear:  none;
  margin-right: 10px
}

div.campaignBox {
  display: block;
  clear: left;
  padding-top: 5px;
  padding-bottom: 5px;
}

div.campaignBox h3 {
  display: none;
}

div.campaignBox img {
  float: left;
  margin:  10px;
}
div.campaignBox p {
  margin-left: 195px;
  clear:  none;
  margin-right: 10px
}


/* @end */

/* @group General Classes */

/*Classes*/

p.note{
  margin-top:  0;
  color:  #666;
  font-style: italic;
}

a.more{
  display:  block;
  text-align: right;
}

.fl{
  float:  left;
  clear:  left;
  margin:  1em 1em 1em 0;
}
.fr{
  float:  right;
  clear:  right;
  margin:  1em 0 1em 1em;
}
a.buttonlink{
  background: #f18e00;
  text-transform:  uppercase;
  padding:  5px 5px;
  color:  #fff;
  text-decoration: none;
  clear:  both;;
}
.bff{
  font-weight:  bold;
}


img.campaignsubhead{
position:  absolute;
top:  120px;
left:  530px;
}

/* Where We Work styling */

#regionHeaders {
  margin-bottom: 15px;
}

#regionHeaders li, .singleRegion li {
  list-style: none;
  display: inline;
}

#regionHeaders li a {
  margin-right: 5%;
  font-size: 20px;
}

.singleRegion {
  margin-bottom: 10px;
  background-color: #FEF7E6;
  padding: 5px;
}

.singleRegionHeader {
  padding-bottom: 2px;
  border-bottom: 1px solid #F18E00;
  border-bottom-width: medium;
  font-size: 18px;
  color: #666666;
  display: block;
  margin-bottom: 10px;
  font-weight: bold;
}

.singleRegion ul {
  display: inline;
}

.regionChildren li a {
  font-weight: bold;
}

.childRegion .regionChildren li a {
  padding-top: 5px;
}

.childRegionHeader {
  display: block;
  color: #666666;
  font-weight: bold;
}

.childRegion {
  margin: 10px 0 10px 10px;
}

.regionLink {
  margin-left: 10px;
}

/* @end */

/* @group Microformats */

#ft div.vcard div{
  display:  inline;
}

/* @end */

/* Forms styling */

#contactForm label {
  width: 200px;
  float: left;
  clear: left;
  margin-bottom: 10px;
}

#contactForm input, textarea {
  margin-bottom: 10px;
}

#bd2 ul {
  margin-left: 5px;
}

#noSecNav #secnav {
  background-color: #FFFFFF;
}

/* News Paging */

.tx-ttnews-browsebox {
  background-color: #FFFFFF;
  border: none;
  margin: 0;
  padding: 0;
}

.tx-ttnews-browsebox table {
  width: 100%;
}

.tx-ttnews-browsebox td {
  font-size: 100%;
}

.tx-ttnews-browsebox-SCell {
  background-color: #FEF7E6;
}

/* @group sIFR */

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

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

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

.sIFR-hasFlash #bd h3 {
  font-size: 16px;
  line-height:  10px;
  height: 20px;
  margin: 10px 0 0 10px;
}

.sIFR-hasFlash #bd h3 {
  margin: 5px 0 0 0;
}

.sIFR-hasFlash h2, .sIFR-hasFlash h3, .sIFR-hasFlash #bd1 h2, .sIFR-hasFlash h5{
  font-size: 16px;
  line-height:  20px;
  height: 20px;
  margin: 5px 0;
}

.sIFR-hasFlash #bd3 div.feature h3 {
  font-size: 16px;
  line-height:  20px;
  height: 20px;
  margin: 10px 0 0 10px;
}

.sIFR-hasFlash #bd1 h3 {
  font-size: 14px;
  line-height: 18px;
  height: 18px;
}

.sIFR-hasFlash #bd2 h2 { 
  font-size:  20px;
  line-height:  30px;
  height:  30px;
}

.sIFR-hasFlash h3, .sIFR-hasFlash h2, .sIFR-hasFlash h5 {
    visibility: hidden;
    /* other CSS properties go here */
}

/* Homepage Featurelink boxes */
#home-page div.featurelink{
  width:  240px;
  margin:  10px;
  float:  left;
  display:  inline;
  background:  #e6e6e6;
}
#home-page div.featurelink h3, #home-page div.feature p{
  margin:  10px;
}
#home-page div.featurelink h3, div#news h3{
  font-size:  110%;
  text-transform: uppercase;
  margin:  10px;
  color:  #666;
}
div.featurelink img {
  float: left;
  margin:  10px;
}
/* @end */