@import base


.item+.item
  border-top: 1px solid #dedddf
  margin-top: 25px
  padding-top: 25px

.item-p+.item
  margin-top: 40px
  padding-top: 30px

.item-no-p+.item-p
  padding-top: 45px

.item-p+.item-p
  border: 0

.post
  position: relative

  h1.title
    +ofl-font(32px)
    font-weight: 400
    line-height: 1.4
    text-align: right
    a.title
      float: left
      text-align: left
    a.date
      font-size: 18px
      font-style: italic


.post-without-title-pic
  .read-more
    letter-spacing: 3px
    text-align: right
    font-style: italic

  .summary
    z-index: -1

  h1.title
    a.date
      color: $black
      text-decoration: none
    margin-bottom: 22px

.post-with-title-pic
  padding: 270px 22px 22px
  cursor: pointer
  background-image: -webkit-gradient(linear,0 0,0 100%,from(rgba(0,0,0,.01) 40%),to(rgba(0,0,0,.7) 80%))
  background-image: -webkit-linear-gradient(top,rgba(0,0,0,.01) 40%,rgba(0,0,0,.7) 80%)
  background-image: -moz-linear-gradient(top,rgba(0,0,0,.01) 40%,rgba(0,0,0,.7) 80%)
  background-image: linear-gradient(top,rgba(0,0,0,.01) 40%,rgba(0,0,0,.7) 80%)
  background-repeat: repeat-x
  +transition(.1s)
  h1.title
    color: #fff
    +transition(.5s)
    a
      color: #fff
    a:hover
      color: #fff

  .title-pic-preview
    max-width: 100%
    position: absolute
    top: 0
    left: 0
    z-index: -1
    width: 100%
    height: 100%
    background-repeat: no-repeat
    background-position: center
    background-size: cover
  a.entry-link
    position: absolute
    top: 0
    left: 0
    width: 100%
    height: 100%

.post-with-title-pic:hover
  background-image: -webkit-gradient(linear,0 0,0 100%,from(rgba(0,0,0,.01) 40%),to(rgba(0,0,0,.55) 80%))
  background-image: -webkit-linear-gradient(top,rgba(0,0,0,.01) 40%,rgba(0,0,0,.55) 80%)
  background-image: -moz-linear-gradient(top,rgba(0,0,0,.01) 40%,rgba(0,0,0,.55) 80%)
  background-image: linear-gradient(top,rgba(0,0,0,.01) 40%,rgba(0,0,0, .55) 80%)

.post-with-title-pic>.spinner
  // background-position: center
  background-repeat: no-repeat
  position: absolute
  top: 143px
  left: 275px
  z-index: -3

.post-with-title-pic .spinner
  -webkit-animation: spriteSpin .2s steps(12) infinite
  animation: spriteSpin .2s steps(12) infinite
  display: block
  margin: 0 auto
  width: 50px
  height: 50px

.paging
  +transition(.5s)
  width: 100%
  margin: 15px 0
  line-height: 1.0
  font-size: 42px
  font-weight: 100
  display: inline-block
  a
    display: block
    width: 50%
  a.prev
    float: left
    text-align: left
  a.next
    float: right
    text-align: right

.aboutme
  border-top: 2px solid #dedddf
