/********************************************
 ThinkProgress 2013 Reboot
 
 "Midsize Screen" CSS
 ThinkProgress for the midsize/tablet screens
 
 
  
 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
********************************************/
  /********************************************
  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)
Health       #0B5CA6 rgb(11,92,166)
Justice      #6D398C rgb(109,57,140)
Immigration  #eb6923 rgb(235,105,35)
LGBT         #30B1B5 rgb(48,177,181)
Morning      #E4531C rgb(228,83,28)
Security     #960E1b rgb(150,14,27)
World        #960E1b rgb(150,14,27)
Sports 		 #ff0000 rgb(255,0,0)
Election     #173456 rgb(23,52,86)
Politics     #000000 rgb(0,0,0)
Yglesias     #000000 rgb(0,0,0)
Media        #000000 rgb(0,0,0)
Education    #000000 rgb(0,0,0)
Home         #000000 rgb(0,0,0)
		
********************************************/
.logo {
    width: 60%;
    height: auto;
    margin: 2em auto 1em;
    display: block;
    float: none;
}

/*
.features h1,
.features h2,
.features h3,
.features h4 {
    font-size:1.5em;
}
*/
  
.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; 
  }

.features h1,
article h1 {
  font-size: 2.2em; }
  
  article h1 {text-align:center;}

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

.features h3 {
    font-size:1.75em;
}  

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

.triple-feature h4 a {
  font-size: 1.5em; }
  
.story-preview h4 {
  font-size: 1.5em;
   }  
  
.two-thirds {
    width:100%;   
}
  
  
/* don't let tablets oversize images or have stuff float around them */  
.post img.size-full, .post .aligncenter {
    max-width:555px;
    float:none;
    margin-left:auto;
    margin-right:auto;
}

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

.post .alignleft, .post .picleft {
    float: left;
    padding: 6px 10px 10px 0; 
    margin:0;
}
 
article .post .photo-box.alignleft {
    float: left;
}

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