.story-page {
padding-top: 34px;
}
.story-page h1{
font: bold italic 40px/1 NewParisSkyline;
color: #162c5d;
margin-left: 21px;
}
.story-page .stories{
margin: 25px 21px;
}
.story-page .stories div{
background-color: #f1f2f2;
width: 400px;
height: 446px;
padding: 1px;
margin-bottom: 25px;
}
.story-page .blog-category{
color: #7d909d;
font: normal 16px/29px NewParis;
position: relative;
background: white;
padding-left: 10px;
}
.story-page .blog-category:after{
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
width: 38px;
height: 28px;
border-left: 1px solid #f1f2f2;
}
.story-page .blog-category.under35:after{
background: url(//www.nationalbook.org/wp-content/themes/nationalbook/images/storypage/icon-window.png) center no-repeat;
}
.story-page .blog-category.bookup-program:after{
background: url(//www.nationalbook.org/wp-content/themes/nationalbook/images/storypage/icon-play.png) center no-repeat;
}
.story-page .blog-category.national-book:after{
background: url(//www.nationalbook.org/wp-content/themes/nationalbook/images/storypage/icon-pen.png) center no-repeat;
}
.story-page .blog-category.innovation:after{
background: url(//www.nationalbook.org/wp-content/themes/nationalbook/images/storypage/icon-text.png) center no-repeat;
}
.story-page .blog-category.updates:after{
background: url(//www.nationalbook.org/wp-content/themes/nationalbook/images/storypage/icon-lines.png) center no-repeat;
}
.story-page .blog-category.reading:after{
background: url(//www.nationalbook.org/wp-content/themes/nationalbook/images/storypage/icon-glass.png) center no-repeat;
}
.story-page .blog-category.reading:after{
background: url(//www.nationalbook.org/wp-content/themes/nationalbook/images/storypage/icon-glass.png) center no-repeat;
}
.story-page .picture{
text-align: center;
margin: 12px 0 21px;
}
.story-page h4{
margin: 0 10px 8px;
font: normal 17px/19px NewParisSkyline;
color: #162c5d;
}
.story-page h4 a{
color: inherit;
}
.story-page .text-story{
font: normal 13px/20px NewParis;
color: #000f08;
margin: 0 10px;
}
.story-page .read-more{
margin-left: 10px;
}
@media (max-width: 850px){
.story-page .stories div {
width: 47%;
}
.story-page .stories div img{
width: 100%;
}
}
@media (max-width: 767px){
.story-page h1{
font-size: 48px;
}
}
@media (max-width: 599px){
.story-page .stories div {
width: 95%;
height: auto;
}
.story-page .read-more {
margin-bottom: 20px;
}
}
@media (max-width: 550px){
.story-page h1 {
font-size: 44px;
}
}