/********************************************
 ThinkProgress 2013 Reboot

 "Big Screen" CSS
 ThinkProgress for the big screen


 2013, Matt Pusateri
 Center for American Progress
 *******************************************/


/********************************************
  Table of Contents


  1. Main Site Structure
  2. Typography
  3. Navigation
  4. Header & Footer
  5. Features
  6. Story previews
  7. Forms & actions
  8. Individual posts
  9. Widgets & Extras
********************************************/


  /********************************************
  Master Color Guide

  /* TP Issue Colors *

Alyssa       #66CC33 rgb(102,204,51)
Culture      #66CC33 rgb(102,204,51)
Climate      #107738 rgb(16,119,56)
Economy      #D89F00 rgb(216,159,0)
Education    #000000 rgb(0,0,0)
Health       #0B5CA6 rgb(11,92,166)
Home         #000000 rgb(0,0,0)
Immigration  #eb6923 rgb(235,105,35)
Justice      #6D398C rgb(109,57,140)
LGBT         #30B1B5 rgb(48,177,181)
Media        #000000 rgb(0,0,0)
Morning      #E4531C rgb(228,83,28)
Politics     #000000 rgb(0,0,0)
Security     #960E1b rgb(150,14,27)
World        #960E1b rgb(150,14,27)
Sports     #ff0000 rgb(255,0,0)
Election     #173456 rgb(23,52,86)
Yglesias     #000000 rgb(0,0,0)


********************************************/


/********************************************

  Master Typography Guide

  base type:  Calibri, "Trebuchet MS", "Lucida Sans", Arial, sans-serif;

********************************************/


/********************************************
  1. Main Site Structure
********************************************/
#container {
  padding: 1em 20px; }

.side, .side-wrapper {
  display: table-cell;
  /* why a table-cell??? necessary to make the fixed sidebar play nice with the contained, fluid content area... until I can find a better solution */
  min-width: 320px;
  vertical-align:top;
  padding:0 0 0 19px;
   }

  .side-wrapper .side {
  width:100%;
  display:block;
  padding:0;
  }

.story-flow {
    /* block for a series of story previews */
    display: table-cell;
    margin: 0 0 1em;
    width: 100%;
}

.banner-ad {
  display: inline-block;
  margin: 1em auto 1em;
  text-align: center; }

.side-ad, #ad_zone2, #ad_zone3  {
  margin-top: 0;
  }

.sidebox .twitter-timeline {margin:2em 0;}

.small-screen-only {
  display: none; }

.no-mobile {
  display: block; }

.two-thirds {
    display:block;
    width:66%;
}

.two-thirds-wide-post{
  display: block;
  width: 100%;
}

.fb-comments, .fb-comments span, .fb-comments iframe { width: 100% !important; }

/********************************************
  2. Typography
********************************************/

h1 {
  font-size: 2.25em;
  }


.alyssa h5 a {
  border-bottom: 4px solid #66cc33; }

.culture h5 a {
  border-bottom: 4px solid #66cc33; }

.climate h5 a {
  border-bottom: 4px solid #107738; }

.economy h5 a {
  border-bottom: 4px solid #d89f00; }

.health h5 a {
  border-bottom: 4px solid #0b5ca6; }

.immigration h5 a {
  border-bottom: 4px solid #eb6923; }

.justice h5 a {
  border-bottom: 4px solid #6d398c; }

.lgbt h5 a {
  border-bottom: 4px solid #30b1b5; }

.morning h5 a {
  border-bottom: 4px solid #e4531c; }

.security h5 a, .world h5 a {
  border-bottom: 4px solid #960e1b; }

.sports h5 a {
  border-bottom: 4px solid red; }

.election h5 a {
  border-bottom: 4px solid #173456; }

.politics h5 a {
  border-bottom: 4px solid black; }

.yglesias h5 a {
  border-bottom: 4px solid black; }

.media h5 a {
  border-bottom: 4px solid black; }

.education h5 a {
  border-bottom: 4px solid black; }

.story-preview.home h5 a {
  border-bottom: 4px solid black; }

.logo-subheader {
  display: none; }

 blockquote {
  margin: 1em 3em;
   }

/********************************************
  3. Navigation
********************************************/
.logo {
  width: 41.152263374486%;
  height: auto;
  margin: .5em 0 1em;
  display: block; }

  body.term-climate .logo { /* making Climate logo same height as others */
    width: 51.646090534979%;
    height: auto;
    }

nav.main {
  background: #000;
  width: 100%;
  overflow: hidden;
  display: block; }

nav ul {
  text-style: none;
  margin: 0;
  width: 100%; }

nav ul.issues {
  display: block; }

nav ul li {
  display: inline-block; }

nav ul li a {
  display: inline-block;
  padding: .75em .9em .7em .9em;
  margin-right: .5em;
  font-weight: bold;
  font-size: .9em;
  letter-spacing: 1px;
  color: #eee;
  text-transform: uppercase;
  margin: 0; }

nav ul.loaded li a {
  font-size: .9em; }

nav ul li a:hover {
  text-decoration: none;
  color: #000; }

/* style each vertical with its color */
nav ul li a {
  border-bottom: 6px solid #444; }

nav ul li.economy a {
  border-bottom: 6px solid #d89f00; }

nav ul li.health a {
  border-bottom: 6px solid #0b5ca6; }

nav ul li.security a, nav ul li.world a {
  border-bottom: 6px solid #960e1b; }

nav ul li.climate a {
  border-bottom: 6px solid #107738; }

nav ul li.immigration a {
  border-bottom: 6px solid #eb6923; }

nav ul li.lgbt a {
  border-bottom: 6px solid #30b1b5; }

nav ul li.justice a {
  border-bottom: 6px solid #6d398c; }

nav ul li.alyssa a {
  border-bottom: 6px solid #66cc33; }

nav ul li.culture a {
  border-bottom: 6px solid #66cc33; }

nav ul li.sports a {
  border-bottom: 6px solid red; }

nav ul li.election a {
  border-bottom: 6px solid #173456; }

nav ul li.about a {
  border-bottom: 6px solid #666;
  margin-right: 0;
  background: #666; }

nav ul li a:hover {
  color: #fff;
  background: #444; }

body.term-alyssa nav ul li.alyssa a, body.issue_alyssa nav ul li.alyssa a, nav ul li.alyssa a:hover, nav ul li.alyssa a.active {
  border-bottom: 6px solid #66cc33;
  background: #66cc33; }

body.term-culture nav ul li.culture a, body.issue_culture nav ul li.culture a, nav ul li.culture a:hover, nav ul li.culture a.active {
  border-bottom: 6px solid #66cc33;
  background: #66cc33; }

body.term-climate nav ul li.climate a, body.issue_climate nav ul li.climate a, nav ul li.climate a:hover, nav ul li.climate a.active {
  border-bottom: 6px solid #107738;
  background: #107738; }

body.term-economy nav ul li.economy a, body.issue_economy nav ul li.economy a, nav ul li.economy a:hover, nav ul li.economy a.active {
  border-bottom: 6px solid #d89f00;
  background: #d89f00; }

body.term-health nav ul li.health a, body.issue_health nav ul li.health a, nav ul li.health a:hover, nav ul li.health a.active {
  border-bottom: 6px solid #0b5ca6;
  background: #0b5ca6; }

body.term-immigration nav ul li.immigration a, body.issue_immigration nav ul li.immigration a, nav ul li.immigration a:hover, nav ul li.immigration a.active {
  border-bottom: 6px solid #eb6923;
  background: #eb6923; }

body.term-justice nav ul li.justice a, body.issue_justice nav ul li.justice a, nav ul li.justice a:hover, nav ul li.justice a.active {
  border-bottom: 6px solid #6d398c;
  background: #6d398c; }

body.term-lgbt nav ul li.lgbt a, body.issue_lgbt nav ul li.lgbt a, nav ul li.lgbt a:hover, nav ul li.lgbt a.active {
  border-bottom: 6px solid #30b1b5;
  background: #30b1b5; }

body.term-security nav ul li.security a, body.issue_security nav ul li.security a, nav ul li.security a:hover, nav ul li.security a.active,
body.term-world nav ul li.world a, body.issue_world nav ul li.world a, nav ul li.world a:hover, nav ul li.world a.active {
  border-bottom: 6px solid #960e1b;
  background: #960e1b; }

body.term-sports nav ul li.sports a, body.issue_sports nav ul li.sports a, nav ul li.sports a:hover, nav ul li.sports a.active {
  border-bottom: 6px solid red;
  background: red; }

body.term-election nav ul li.election a, body.issue_election nav ul li.election a, nav ul li.election a:hover, nav ul li.election a.active {
  border-bottom: 6px solid #173456;
  background: #173456; }

nav ul li.home a {
  background: #555555 url(./../images/TP-white.png) no-repeat top left;
  border-bottom: 6px solid #555;
  padding-left: 40px;
  background-position: 10px 7px; }

nav ul li.home a:hover {
  background: black url(./../images/TP-white.png) no-repeat top left;
  border-bottom: 6px solid #000;
  padding-left: 40px;
  background-position: 10px 7px; }

.mobile-nav {
  display: none; }

.trending {
  display: block;
  color: #000;
  background: #fff;
  margin: 1em 0; }

.trending ul {
  display: block;
  overflow: hidden;
  font-size: 1em;
  width: 100%;
  list-style: none;
  padding: 0;
  float: left;
  height: 1.5em;
  line-height: 1.25em;
  overflow: hidden;
  text-align: center; }

.trending ul li {
  display: inline-block;
  font-size: .9em;
  font-weight: bold; }

.trending li.trendingnow {
  font-weight: bold;
  margin-left: 0;
  margin-right: 1em; }

.trending li a {
  margin-left: 0;
  margin-right: 1em;
  text-decoration: none;
  color: #666; }

.trending li a:hover {
  text-decoration: none;
  color: #000;
  border-bottom: 2px dotted #cccccc; }

/********************************************
  4. Header & Footer
********************************************/
/* Header Social Links */
.header-social {
  display: inline-block;
  margin: 0;
  overflow: hidden;
  float: right;
  min-width: 365px;
  }

.header-social .fb-like {
    margin: 0 5px;
}
.header-social .rss {
  display: inline-block; }

.header-social .tumblr {
  margin: 0 1em 0 0;
  display: inline-block; }

.header-social .social_toolbox {
  display: inline-block;
  padding: 0;
  height: 20px; }

/* Trending & Search */
.secondary .alyssa {
  background: #66cc33; }

.secondary .culture {
  background: #66cc33; }

.secondary .climate {
  background: #107738; }

.secondary .economy {
  background: #d89f00; }

.secondary .health {
  background: #0b5ca6; }

.secondary .immigration {
  background: #eb6923; }

.secondary .justice {
  background: #6d398c; }

.secondary .lgbt {
  background: #30b1b5; }

.secondary .security, .secondary .world {
  background: #960e1b; }

.secondary .sports {
  background: red; }

.secondary .election {
  background: #173456; }

.secondary .politics {
  background: black; }

.secondary .yglesias {
  background: black; }

.secondary .media {
  background: black; }

.secondary .education {
  background: black; }

.secondary .home {
  background: black; }

.secondary .homelink {
  float: left;
  margin-right: 1em; }

.secondary .search {
  display: block;
  width: 27%;
  /* Why 27%?  Because trending is to its left, and it is 70% wide */
  float: right;
  text-align: right; }

.search .inputbox {
  width: 85%;
  margin: 0;
  padding: 3px .5em;
  font-size: .8em;
  border: 1px solid #ccc;
  color: #666; }

.search .searchicon {
  height: 1.1em;
  width: auto;
  margin-left: .5em; }

.trending ul {
  width: 70%;
  padding: 0;
  text-align: left; }

/********************************************
  5. Features
********************************************/
/* basic layout for three main features */


.primary-feature {
  width: 66.666666666666%;
  display: block;
  float: left;
  }

.primary-feature img {
  width: 100%;
  height: auto;
  display:block;
  border-right:2px solid #fff;
  }

.secondary-feature {
  width: 33.3333333333333%;
  float: right;
  overflow: hidden;
  display: block;
  margin: 0; }

.secondary-feature img,
.secondary-feature a {
  display: block;
  padding: 0; }

/* layout for five features */
.five-features {background:#fff;}

.five-features .primary-feature {
  width: 50%;
  display: block;
  position: relative;
  float: left;
  padding-right: 1px;
  border: 0;
}

.five-features .secondary {
  width: 50%;
  float: right;
  overflow: hidden;
  position: relative;
  border-left: 1px solid #fff; }

.five-features .secondary .quarter-feature {
  width: 50%;
  float: left;
  position: relative;
  display: block;
  margin: 0;
  border: 0; }

.five-features .secondary .first {
  padding: 0;
  display: block;
  border-bottom: 2px solid #fff;
  border-right: 1px solid #fff;
  margin: 0; }

.five-features .secondary .second {
  padding: 0 0 0 0;
  display: block;
  border-bottom: 2px solid #fff;
  border-left: 1px solid #fff; }

.five-features .secondary .third {
  border-right: 1px solid #fff;
  margin-bottom: -1px;
  display: block; }

.five-features .secondary .fourth {
  padding: 0 0 0 0;
  border-left: 1px solid #fff;
  margin-bottom: -1px;
  display: block; }

/* Layout for one big SOLO feature */
.solo-feature .primary-feature {
  width: 100%;
  border: 0; }

.features .top {
  border-bottom: 1px solid #fff; }

.features .bottom {
  margin-bottom: -3px; }

.features h1,
.features h2,
.features h3,
.features h4 {
  padding: 1em 1em 0.5em;
  display: inline-block;
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  line-height: 1.25em;
  }


.five-features .secondary .quarter-feature h4 {
  font-size: 1.1em;
  width: 90%;
  padding: 1.5em 0.75em 0.5em;
  bottom: 1em;
  top: 0 auto;
  margin: 0 auto; }

.features h1 {
  font-size: 2.2em; }

.features h2 {
  font-size: 2em; }

.five-features .primary-feature h2 {
  font-size: 1.4em; }

/* triple feature for sticky posts */
.triple-feature {
  margin: 2em 0;
  display:block;
  overflow:hidden;
  }

.triple-feature .third {
  width: 33%;
  margin: 0;
  display: block;
  position: relative;
  float: left;
  margin-right:.5%;
}

  .triple-feature .third:nth-of-type(3) {
      margin-right:0;
      float:right;
}

.triple-feature h4 {
  /*  min-height:33%; */ }

.triple-feature h4 a {
  font-size: 1.25em; }

/********************************************
  6. Story Previews
********************************************/
.story-preview {
  margin: 0 0 2em 0;
  width:100%;
  }

.story-preview .preview-pic {
  width: 39.2337%;
  height: auto;
  float: left; }

.story-preview .preview-text {
  width: 57%;
  float: right;
  margin: 0;
  }

.thumbless .preview-text {
  width: 100%;
  float: none; }

.story-preview h5 {
  display: block;
  font-weight: bold;
  text-transform: uppercase;
  padding: 0;
  font-size: .9em;
  border-bottom: 1px solid #ccc;
  margin-bottom: .5em; }

.story-preview h5 a {
  display: inline-block;
  font-weight: bold;
  text-transform: uppercase;
  padding: 0 4px 4px;
  margin: 0; }

.story-preview h4 {
  font-weight: normal;
  font-size: 1.3em;
  }

.story-preview p.tease {
  display: block;
  line-height: 1.33em; }

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

.story-preview p.timestamp a {
  font-weight: bold; }

.story-preview p.timestamp span.byline {
  display: inline; }

.counts {
  display: inline-block;
  margin-top: .25em; }

.counts a {
  text-decoration: none; }

.counts img {
  margin: 0 .5em 0 0;
  position: relative;
  top: 1px; }

.counts .facebook-count {
  display: inline-block;
  color: #3b5998; }

.counts .twitter-count {
  display: inline-block;
  margin-right: .5em;
  color: #4099ff; }

/********************************************
   7. Forms & Actions
********************************************/
.sign-up-strip {
  /*     @extend .clearfix; */
  background: #eeeeee url(./../images/mail-32.png) no-repeat 3% center;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 1em 2em;
  margin: 1em auto 2em;
  width: 100%;
  text-align: center;
  position: relative;
  display: block;
  overflow: hidden; }

.sign-up-strip h3 {
  display: inline;
  font-weight: normal;
  text-transform: uppercase;
  font-style: italic;
  margin-left: 1em; }

.sign-up-strip form {
  display: inline-block;
  margin-left: 1em; }

.sign-up-strip form input {
  padding: .5em 1em;
  margin-right: .5em;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #999;
  font-size: .75em; }

.sign-up-strip form input.submit {
  padding: .6em 1em;
  background: #c00;
  color: #fff;
  border: 0;
  font-size: .75em;
  font-weight: bold;
  -webkit-border-radius: 4px;
  border-radius: 4px; }

.sign-up-strip form input.submit:hover {
  background: #000; }

.sign-up-tease {
  font-style: italic;
  text-align: center;
  padding-bottom: 2em; }

.sign-up-tease img {
  display: inline-block;
  margin: .5em 0 0 .5em; }

/********************************************
   8. Individual Posts
********************************************/


article {
  display:table-cell;
  padding:0 1em 0 0;
  margin-right:2em;
  border:0;
  }

.post {
  line-height: 1.5em;
  font-size: 1.1em;
  display:block;
  float:none;
  padding:0;
  }

/* Post Tools */
.mobile-tool { float: right; }

.post-tools {
  display: none;
  }

.post-tools li {
  padding: 10px 0 0 0;
  line-height: 1.25em;
  font-size: .8em; }

.post-tools li.comment-tool a {
  color: #999;
  font-weight: normal;
  font-size: 1em; }

.comment-tool {
  margin-top: 5px; }

.comment-tool img {
  position: relative;
  top: 15px;
  padding-left: 3px; }

.twitter-tool {
  position: relative;
}

.facebook-tool {
  position: relative;
  text-align: left; }

.post-tools li.email-tool {
  position: relative;
  top: 0px; }

.post-tools li.print-tool, .post-tools li.social-tool {
  position: relative;
  top: -2px; }

.post-tools li.comment-tool {
  position: relative;
  top: -24px; }

.comment-count {
  display: block;
  margin-top: 12px; }

article .triple-feature h4 {
  font-size: .9em;
  line-height: 1.4em; }

.story-topper {
  width: 68%;
  float: left;
  display: block; }

/* Post styling color effects */
/* In the reboot, we're applying this to the H1, not the article itself */

article h1 {
    padding-top:.5em;
    border-top: 4px solid #333;
    font-size:2em;
    text-align:left;
    }

article.alyssa h1 {
  border-top-color: #66cc33;
  /* background: url(./../images/postfades/default-fade.jpg) repeat-x;  */}

article.culture h1 {
  border-top-color: #66cc33;
  /* background: url(./../images/postfades/default-fade.jpg) repeat-x;  */}

article.climate h1 {
  border-top-color: #107738;
  /* background: url(./../images/postfades/green-fade.png) repeat-x;  */}

article.economy h1 {
  border-top-color: #d89f00;
  /* background: url(./../images/postfades/economy-fade.png) repeat-x;  */}

article.health h1 {
  border-top-color: #0b5ca6;
  /* background: url(./../images/postfades/health-fade.png) repeat-x;  */}

article.immigration h1 {
  border-top-color: #eb6923;
  /* background: url(./../images/postfades/immigration-fade.png) repeat-x;  */}

article.justice h1 {
  border-top-color: #6d398c;
  /* background: url(./../images/postfades/justice-fade.png) repeat-x;  */}

article.lgbt h1 {
  border-top-color: #30b1b5;
  /* background: url(./../images/postfades/lgbt-fade.png) repeat-x;  */}

article.morning-briefing h1 {
  border-top-color: #e4531c;
  /* background: url(./../images/postfades/morning-fade.png) repeat-x;  */}

article.security h1, article.world h1 {
  border-top-color: #960e1b;
  /* background: url(./../images/postfades/security-fade.png) repeat-x;  */}

article.sports h1 {
  border-top-color: red;
  /* background: url(./../images/postfades/sports-fade.png) repeat-x;  */}

article.election h1 {
  border-top-color: #173456;
  /* background: url(./../images/postfades/election-fade.png) repeat-x; */ }

article.politics h1 {
  border-top-color: black;
  /* background: url(./../images/postfades/default-fade.png) repeat-x;  */}

article.yglesias h1 {
  border-top-color: black;
  /* background: url(./../images/postfades/default-fade.png) repeat-x;  */}

article.media h1 {
  border-top-color: black;
  /* background: url(./../images/postfades/default-fade.png) repeat-x;  */}

article.education h1 {
  border-top-color: black;
  /* background: url(./../images/postfades/default-fade.png) repeat-x;  */}

article.home h1 {
  border-top-color: black;
  /* background: url(./../images/postfades/default-fade.png) repeat-x;  */}

article.search-results {
  border:0;
  background:none; }


/* Styling for Wide, Full-Width Articles */


article.wide-story {
  display:block;
  width:100%;
  padding:0;
  border:0;
  }

article.wide-story .post {
  line-height: 1.5em;
  font-size: 1.1em;
  display:block;
  float:none;
  background:#fff;
  position:relative;
  top:-4em;
  width:90%;
  margin:0 auto;
  padding:1em 2em;
  -webkit-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, .25);
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, .25);
  border-top:5px solid #000;
  }

article.wide-story .post h1 {
    border:0;
    }

article.wide-story .post {
    padding-top:.5em;
    border-top: 6px solid #333;
    }

article.wide-story.alyssa .post {
  border-top-color: #66cc33;
  }

article.wide-story.culture .post {
  border-top-color: #66cc33;
  }

article.wide-story.climate .post {
  border-top-color: #107738;
  }

article.wide-story.economy .post {
  border-top-color: #d89f00;
  }

article.wide-story.health .post {
  border-top-color: #0b5ca6;
  }

article.wide-story.immigration .post {
  border-top-color: #eb6923;
  }

article.wide-story.justice .post {
  border-top-color: #6d398c;
  }

article.wide-story.lgbt .post {
  border-top-color: #30b1b5;
  }

article.wide-story.morning-briefing .post {
  border-top-color: #e4531c;
  }

article.wide-story.security .post, article.wide-story.world .post {
  border-top-color: #960e1b;
  }

article.wide-story.sports .post {
  border-top-color: red;
  }

article.wide-story.election .post {
  border-top-color: #173456;
  }

article.wide-story.politics .post {
  border-top-color: black;
  }

article.wide-story.yglesias .post {
  border-top-color: black;
  }

article.wide-story.media .post {
  border-top-color: black;
  }

article.wide-story.education .post {
  border-top-color: black;
}

article.wide-story.home .post {
  border-top-color: black;
  }





/* Let's try to fix legacy, oversized images */
.post img.size-full,
.post img.aligncenter,
.post .aligncenter,
.post img {
    overflow:hidden;
    display:block;
    }

img.size-full {max-width:100% !important}


/* Comments */
#comments {
    margin-top: 20px;
}

#comments h3 {
    border-top: 1px solid #ccc;
    padding-top: 10px;
}

.comment-disclaimer {
    font-size: .9em;
    font-style: italic;
    padding: 0 60px 10px 0;
    margin: 0;
}

article .post .photo-box.alignleft,
.wide-story .post .photo-box.alignleft  {
    float: left;
}


article .post .photo-box,
.wide-story .post .photo-box  {
    display: block;
    float: right;
    margin: .75em 0 .5em 1em;
    clear:none;
    max-width:none !important;
}


.post .alignright,
.post .picright,
.wide-story .picright {
    float: right;
    padding: 6px 0 10px 10px;
    margin:0;
}

.post .alignleft,
.post .picleft,
.wide-story .picleft {
    float: left;
    padding: 6px 10px 10px 0;
    margin:0;
}

article .post .aligncenter {
  margin:.5em auto;
  float:none;
  clear:both;
  display:block;
  padding: 0;
  }

.post-navigation p.next,
.post-navigation p.previous {
  width:45%;
  margin-top:0;
  margin-bottom:1em;
  }

    .postnav a.button {font-size:1.2em; font-style:normal}
    .postnav a.preview-head {display:inline-block}
    .postnav a.preview-image {display:inline-block;}


.social_toolbox, .share-box {display:block}

.share-box img{
    margin:0 auto 1em;
    }

.share-box {
    width:100%;
    display:block;
    margin:1em 0;
    text-align:center;
    }

.share-box .social_toolbox,
.share-box .social_default_style {
    display:inline-block;
    margin:0 auto 0 36px;
    text-align:center;
}

.share-box .fb-like {display:inline-block;margin-right:30px}

/* Clean, home-rolled social sharing tools */
.clean-share-box {
  display:inline-block;
  margin:1em auto;
  text-align:center;
  width:100%;
  white-space:nowrap;
  }

/* New Additions for AB Test */
.clean-share-box a {
    padding-right: 5px;
    width: auto!important;
}
.clean-share-box a span {
    line-height: 17px;
    display: inline-block;
    text-align: center;
}
.clean-share-box a small {
    display: inline-block;
    margin-left: 5px;
    min-width: 100px;
}
.clean-share-box a.social_button_twitter img,
.clean-share-box a.social_button_facebook img {
    border-right: 1px solid;
    margin-right: 5px;
}
.clean-share-box a.social_button_twitter {
    border: 1px solid #5AB7D7;
}
.clean-share-box a.social_button_twitter img {
    border-color: #5AB7D7;
}
.clean-share-box a.social_button_facebook {
    border: 1px solid #3E6093;
}
.clean-share-box a.social_button_facebook img {
    border-color: #3E6093;
}
/* End AB Test */

.wide-story .clean-share-box {text-align:center}

.clean-share-box a {
  display:inline-block;
  width:100px;
  margin: 0 1em 0 0;
  text-decoration:none;
  color:#fff;
  font-weight:bold;
  font-size:.8em;
  text-align:left;
  background:#ccc;
  }

.clean-share-box a img,
.clean-share-box a span {
    display:inline-block;
    vertical-align:middle;
    }

.clean-share-box a.social_button_facebook {background:#507cbd;}
.clean-share-box a.social_button_twitter {background:#64cbee;}

.small-share {display:none;}

.social_toolbox .social_button_facebook,
.social_toolbox .social_button_twitter {
    margin-right:.5em;
    display:inline-block;
    overflow:hidden;
    height:32px;
    width:32px;
    line-height:32px;
    padding:0px;
    }


.wide-story {position:relative;}

.wide-story h1,
.wide-story p.timestamp {
    text-align:center;
}

.wide-story p.timestamp {margin-bottom:1em}

.wide-story h1 {
    font-size:2.2em;
    padding-left:1em;
    padding-right:1em;
    }

article .post .wide-photo-box img {
    max-width:638px;
    width:auto;
    height:auto;
    display:inline-block;
    margin-left:auto;
  margin-right:auto;
  display:block;
  clear:both;
    }

article.wide-story .wide-photo-box p.photo-credit {
    position:absolute;
    top:1em;
    right:1em;
    color:#fff;
    color:rgba(255,255,255,.5);
    font-size:.8em;
    text-shadow: 1px 1px 1px #999;
    filter: dropshadow(color=#999, offx=1, offy=1);
    padding:0;
    }



 aside {
    font-size:1.6em;
    width:50%;
    float:right;
    margin:.5em 0 1em 1em;
    padding:.5em .5em .5em 65px;
    background:url('../images/pullquote-icon.png') no-repeat;
    background-position-y:.7em;
    }

    aside.left {
    float:left;
    margin:.33em 1em 1em 0;
    }



/********************************************
   9. Widgets & Extras
********************************************/
.facebook-like-bottom {
  position: fixed;
  display: block;
  bottom: 10%;
  right: -100%;
  padding: 1em 2em;
  margin: 3em 0 0 0;
  width: 40%;
  z-index: 100;
  background-color: #E6E6FA;
  -moz-transition-property: background-color;
  /* FF4+ */
  -moz-transition-duration: 1s;
  -webkit-transition-property: background-color;
  /* Saf3.2+, Chrome */
  -webkit-transition-duration: 1s;
  -o-transition-property: background-color;
  /* Opera 10.5+ */
  -o-transition-duration: 1s;
  -ms-transition-property: background-color;
  /* IE10? */
  -ms-transition-duration: 1s;
  transition-property: background-color;
  /* Standard */
  transition-duration: 1s;
  border: 3px solid #999999;
  border-right: 0;
  -webkit-border-radius: 12px 0px 0px 12px;
  border-radius: 12px 0px 0px 12px; }

.facebook-like-bottom a.smallbtn {
  text-decoration: none;
  font-weight: bold;
  padding: .25em  .75em;
  background: #ddd;
  color: #333;
  border: #777 1px solid;
  margin-top: .7em;
  pointer: cursor; }

.facebook-like-bottom a.smallbtn:hover {
  color: #900; }

.facebook-like-bottom a.fbpromo {
  display: block;
  text-align: left;
  padding-top: 1em;
  font-style: italic;
  font-size: .8em;
  font-weight: bold;
  text-decoration: none; }

.facebook-like-bottom a.fbpromo:hover {
  color: #900; }



/* Slidebox */
#slidebox{
    width:33%;
    min-height:7em;
    padding:1em 2em;
    position:fixed;
    bottom:0px;
    right:-26em;
    z-index:100;
    -webkit-border-radius: 6px 0px 0px 0px;
    border-radius: 6px 0px 0px 0px;
    background:#ffc220;
    background:rgba(255,194,32,.9);
    display:block;
    }

#slidebox h3,
#slidebox h4  {
color:#000;
margin-bottom:.5em;
    }

a.close{
    background:transparent url(../images/close.gif) no-repeat top left;
    width:13px;
    height:13px;
    position:absolute;
    cursor:pointer;
    top:10px;
    right:10px;
    }

/* Social Slidedown */
/* SlideDOWN */
#slidedown{
    display:block;
    width:100%;
    height:auto;
    position:fixed;
    top:-100%;
    left:0;
    z-index:100;
    background:#000;
    color:#fff;
    padding:.5em 2em 1em;
    border-bottom:#ffc220 solid 3px;
    vertical-align:middle;
    }

#slidedown {text-align:center;}

    #slidedown .social_toolbox {padding:0;}

    #slidedown .social_toolbox a {
        display:inline-block;
        margin-left:1em;
        vertical-align:middle;
        }

        #slidedown .social_toolbox a:nth-child(1) {margin-left:0}

#slidedown p {
        display:inline-block;
        padding:.5em 0;
        font-size:1.1em;
        text-align:center;
        font-weight:700;
        }

#slidedown em {
        display:inline;
        margin-bottom:.75em;
        }

#slidedown .clean-share-box,
#slidedown .social_default_style,
#slidedown .social_toolbox  {
    display:inline-block;
    width:auto;
    margin:-5px 0 0 1.5em;
/*     font-size:1.1em; */
    text-align:left;
    font-weight:700;
    vertical-align:middle;
    }

#slidedown .clean-share-box a,
#slidedown .social_default_style a {
    width:32px;
    margin:0 0 0 1em;
    vertical-align:middle;
    display:inline-block;
    float:none;
    }


/* SEARCH RESULTS */
/* Search Results Styling */

.content article p.sort-search {
    display:inline-block;
    margin:.75em 0 1em 0;
    text-align:left;
    }

.content article p.sort-search a {font-weight:bold;}

.content article p.results-count {
  margin: .5em 0 1em;
  font-size:1em;
  font-style:italic;
  }

.content article.search-results h1 {margin-bottom:.5em}
.content article.search-results h1 span {color:#777}

/* "searchside" is for the facets to refine a search */

#searchside {
    display:block;
    width:25%;
    float:left;
    margin:1em 0 0 5%;
    padding-right:1em;
    }

#searchside h3 {padding:0;}

article #searchside ul {
    margin-left:1em;
        }

article #searchside ul li {
    list-style:none;
    padding:.25em 0 0;
    margin:0 0 0 0;
    font-size:.9em;
    }
article #searchside ul li a {color:#666;}
article #searchside ul li a:hover {color:#900;}

#searchside img.arrow {margin-right:.5em; vertical-align:middle;}


#searchside form {margin-bottom:1.5em;}

#searchside input[type=text] {
  display:block;
  padding:.5em;width:100%;
  font-size:.9em;
  margin-bottom:.25em;
  }

#searchside input[type=submit] {
  display:block;
  padding:.25em;width:100%;
  font-size:.9em;
  }

#searchside .filters {margin-bottom:1em;}

#searchside .opened::before {content: "\25BC";display: inline;padding-right:.5em;font-size:.8em;}
#searchside .closed::before {content: "\25BA";display: inline;padding-right:.5em;font-size:.8em;}

#searchside ul.facet {margin:0 0 1em 0}
#searchside ul.facet li {padding:0}
#searchside ul.facet.date li {padding-left:2em;}
#searchside ul.facet li {padding-left:1em;}

#searchside ul.facet.tag li {padding-left: 2em;}

#searchside ul.facet li {padding:.25em 0 .25em 1em;}

#searchside ul.facet.tag li {padding-left: 2em;}

#searchside li.filter a {font-weight:bold}
#searchside ul.facet.tag li a {font-weight:normal}

#searchside h3 {
    margin:0;
    font-size:1.2em;
    }

#searchside h4 {margin-bottom:.5em;}


#searchside ul.active-filters {margin:0 0 1em; display:block}

 .active-filter {
    float: left;
    padding: 2px 8px;
    margin-right: 3px;
    margin-bottom: 3px;
    border: solid 1px #999;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    }

.filter-item a {
    background: #ddd url('/wp-content/themes/tp4/images/remove.png') left center no-repeat;
    padding: .25em 1em .25em 1.5em;
    color: #666;
    text-decoration: none;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    }

.filter-item.remove-all, .filter-item:hover {
    border-color: #a80000;
    }

.filter-item.remove-all a, .active-filter a:hover {
    color: #a80000;
    }


/* position & style the search results for the bigger screen */
.search-result {
    margin:0 0 1.5em 30%;
    }

.search-result h3 {
  font-size:1.1em;
  line-height:1.25em;
  padding:0;
  }

.search-result p.timestamp {padding:0;text-transform:none;font-style:italic}

/* Show full range on sorting search result pages on big screens */

.resultpager ul {text-align:center;margin:1em auto}

.resultpager ul li {
  display:inline-block;
  padding:0 1em 0 0;
  }



.feedlist {
    width:20%;
    float:left;
    }

#twitter-widget {display:inline-block; width: 100%; }