Skip to content

Instantly share code, notes, and snippets.

@knice
Last active January 20, 2016 22:14
Show Gist options
  • Select an option

  • Save knice/05bdbf983dc021a3910f to your computer and use it in GitHub Desktop.

Select an option

Save knice/05bdbf983dc021a3910f to your computer and use it in GitHub Desktop.
Code for the header
.block-header {
margin-top: 0;
position: relative;
h1 {
position: absolute;
width: 100%;
left: 6vw;
top: 14vw;
font-weight: 600;
font-size: calc(100vw / 12);
line-height: 1;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
.pre-title {
color: lighten($dark-blue, 50%);
display: block;
font-size: calc(100vw / 24);
font-weight: 600;
margin: 0;
text-transform: uppercase;
@include media($tablet) {
font-size: calc(100vw / 48);
}
}
video {
width:100%;
height: auto;
background-image: url(https://s3.amazonaws.com/cdn.news.ucsc.edu/poster-frame.jpg);
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment