#pre-content {
  background: url(/themes/jwawesome/css/../images/blackstripev4.png);
}

#block-blogheaderlogo {
  padding-top: 5px;
}

#block-blogheaderlogo h1 {
  color: #fff;
  font: 300 3.3em futura-pt;
  margin: 0;
  padding: 15px 30px;
  text-transform: uppercase;
}

#right-column,
#share-column {
  display: none;
}

.blog article {
  margin-top: 0;
  padding: 0;
  width: 100%;
}

.blog #block-mainpagecontent {
  width: 100%;
}

.blog-top {
  position: relative;
}

.featured-blogpost {
  float: left;
  position: relative;
  width: 63.8%;
}

.featured-blogpost .field-name-field-image {
  max-height: 449px;
  overflow: hidden;
}

.featured-blogpost img {
  height: inherit;
  width: 100%;
}

.blog-top-right,
.blog-bottom-right {
  float: right;
  width: 36.2%;
}

.blog-top-right img,
.blog-bottom-right img {
  float: right;
  height: inherit;
  width: 100%;
}

.secondary-blogpost .node,
.tertiary-blogpost .node {
  border: 4px solid #fff;
  float: right;
  position: relative;
  text-align: center;
  width: 100%;
}

.secondary-blogpost .node {
  border-bottom: none;
}

.featured-blogpost .node {
  background: #fff;
  padding: 4px;
  width: 100%;
}

.title-and-summary {
  background: moz-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 60%,rgba(0,0,0,.9) 100%);
  background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 60%,rgba(0,0,0,.9) 100%);
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 60%,rgba(0,0,0,.9) 100%);
  bottom: 0;
  color: #fff;
  padding: 100px 0 0 1%;
  position: absolute;
  width: 99%;
}

.secondary-blogpost .title-and-summary,
.tertiary-blogpost .title-and-summary,
.section .title-and-summary {
  margin: 0;
  padding: 100px 0 0 0;
  text-align: left;
  width: 100%;
}

.section .title-and-summary {
  background: none;
  bottom: 40%;
  text-align: center;
}

.secondary-blogpost .post-title,
.tertiary-blogpost .post-title {
  font-size: 1.6em;
  line-height: .95em;
  padding: .3em .3em 0 .3em;
}

.featured-blogpost .field-name-field-summary {
  padding: .3em 4em .3em .5em;
}

.secondary-blogpost .field-name-field-summary,
.tertiary-blogpost .field-name-field-summary,
.section .summary {
  font-size: .8em;
  padding: 0 .6em .5em .6em;
}

.title-and-summary p {
  margin: 0;
}

.featured-blogpost .node:hover .title-and-summary {
  background: moz-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 60%,rgba(0,0,0,.95) 100%);
  background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 60%,rgba(0,0,0,.95) 100%);
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 60%,rgba(0,0,0,.95) 100%);
}

.featured-blogpost .post-title {
  font-size: 2.6em;
  line-height: 1.1em;
  margin: 0;
}

.featured-blogpost .credit {
  padding-left: .3em;
}

.secondary-blogpost .credit,
.tertiary-blogpost .credit {
  padding-left: .6em;
}

.blog-top .field-name-field-summary p,
.section .summary {
  display: none;
}

.featured-blogpost:hover .field-name-field-summary p,
.secondary-blogpost:hover .field-name-field-summary p,
.tertiary-blogpost:hover .field-name-field-summary p {
  display: block;
  font-size: 1.3em;
  margin: 0;
  padding-top: .5em;
}

.section:hover .summary {
  display: block;
  font-size: 1.2em;
}

.subscribe-container {
  float: left;
  margin-top: 25px;
  width: 33%;
}

#subscribe {
  background: #8d1b3d;
  color: #fff;
  font: 300 1.2em futura-pt, sans-serif;
  height: 156px;
  line-height: 1.1em;
  margin: 0 auto;
  padding-bottom: 10px;
  width: 98%;
}

#subscribe .text-wrapper {
  padding: 0 5%;
}

#subscribe .text-wrapper {
  padding-top: 30px;
}

#subscribe .text {
	font-weight: bold;
}

#subscribe a {
	color: #fff;
}

.sections {
  clear: both;
  padding-top: 20px;
}

.sections-categories {
  text-align: center;
}

.section {
  display: inline-block;
  margin: 0 .5%;
  position: relative;
  width: 31%;
}

.section img {
  height: inherit;
  width: 100%;
}

.section .post-title {
  font-size: 1.8em;
 }

.about {
  clear: both;
  float: left;
  padding: 5px 0 0 3%;
  width: 62%;
}

.about p {
  font-size: 1.2em;
  padding-right: 5%;
}

.allposts .views-element-container {
  padding: 0 3%;
}

.sections-header,
.allposts-header {
  background: #222;
  clear: both;
  color: #fff;
  display: inline-block;
  font-size: 1.2em;
  margin: 1em 0;
  padding: .25em 0;
  text-transform: uppercase;
  width: 100%;
}

.sections-header span,
.allposts-header span {
  font-size: 1.2em;
  padding-left: 3%;
}

@media only screen and (max-width: 900px) { 

  #block-blogheaderlogo h1 {
	font-size: 3em;
  }

  .featured-blogpost,
  .about,
  .views-field-field-summary,
  .view-jwablog-recent-posts,
  .section  {
    width: 100%;
  }
  
  .subscribe-container {
	float: none;
	margin: 0 auto;
    width: 417px;
  }
  
  #subscribe {
    float: left;
	margin: 0 1%;
	width: 98%;
  }
  
  .blog-top-right, 
  .blog-bottom-right {
    float: left;
	padding: .5%;
	width: 49%;
  }
  
  .featured-blogpost .node {
    padding: 0;
  }
  
  .blog-top-right .node,
  .blog-bottom-right .node {
    border: none;
  }
  
  .section {
	float: none;
	margin: 0 auto;
	max-width: 417px;
    padding: 0;
  }
}

@media only screen and (max-width: 600px) {
  html {
    margin: 0 auto;
  }
  #block-blogheaderlogo h1 {
  	font-size: 2em;
  }
  article div {
    max-width: 100%;
  }

  .blog-top-right, 
  .blog-bottom-right {
	padding: .5% 0;
    width: 100%;
  }
  
  .blog-bottom-right {
    padding: 0;
  }
  
  .featured-blogpost .post-title {
    font-size: 1.6em;
	padding: .3em .3em 0 .3em;
  }
  
  .feature-blogpost .credit {
    padding-left: .6em;
  }
}
