
/* CSS cover-image structure from medium.com */

/* .cover-actions */


.cover-actions {
  /*padding-top:20px;*/
  margin-top: 20px;
  border-top: 1px solid rgba(255,255,255,0.3);
}

/* .cover-title */


.cover-title {
  font-size: 27px;
  font-family: sans-serif;
  font-weight: bold;
  letter-spacing: -0.092em;
  line-height: 1;
  color: #fff;
  margin-bottom: 12px;
  text-shadow: 0 1px 3px rgba(0,0,0,0.3)
}

/* .cover-description */


.cover-description {
  font-size: 16px;
  line-height: 1.2;
  color: #fff;
  margin-bottom: 14px;
  text-shadow: 0 1px 3px rgba(0,0,0,0.3)
}

.cover-description a {
  color: #fff;
  text-decoration: underline
}

/* .cover-body */


.cover-body {
  position: absolute;
  bottom: 0;
  padding: 50px 54px 54px;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

.cover-body:before {
  content: '';
  position: absolute;
  top: -80px;
  right: 0;
  bottom: 0;
  left: 0;
  background-repeat: repeat-x;
  background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,0.5) 0, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
  background-image: -moz-linear-gradient(bottom, rgba(0,0,0,0.5) 0, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
  background-image: -ms-linear-gradient(bottom, rgba(0,0,0,0.5) 0, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
  background-image: -o-linear-gradient(bottom, rgba(0,0,0,0.5) 0, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
  background-image: linear-gradient(bottom, rgba(0,0,0,0.5) 0, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
}

.browser-ie .cover-body:before {
  top: 0;
  background: rgba(0,0,0,0.5)
}

/* .cover-body-inner */	


.cover-body-inner {
  position: relative;
  z-index: 100;
  /*background-color:rgba(0,0,0,0.20);*/
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
}

/* .cover */


.cover {
  position: relative;
  width: 100%;
  height: 60%;
  background-color: black;
}

.cover-title { position: relative; }
 @media all and (max-width:580px) {

/*.cover 				{height:auto; padding-top:65%; }*/

.cover-body { padding: 10% 5% 30px }

.cover-title {
  font-size: 25px;
  line-height: 1;
  margin-bottom: 5px
}

.cover-description {
  font-size: 16px;
  margin-bottom: 6px
}
}

/* .cover-img */
    

.cover-img {
  display: table-cell;
  vertical-align: middle;
  position: relative;
  height: 100%;
  width: 100%;
  text-align: center
}

.cover-img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-box-shadow: inset-1px 0 0 rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset-1px 0 0 rgba(0, 0, 0, 0.3);
  box-shadow: inset-1px 0 0 rgba(0, 0, 0, 0.3);
}

/*@media all and (min-width:1001px) { .cover-img {border-right:1px solid rgba(0,0,0,0.35); } }*/

/*---- .WRAPPER ----*/


.wrapper {
  background-color: #fff;
  background-color: transparent;
  overflow: hidden;
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
  padding: 81px 30px 54px 30px;
}
 @media all and (max-width:480px) {

.wrapper { padding: 54px 20px 54px 20px }
}
