A Pen by Matt.

index.html

<img src="http://i.imgur.com/oGDUbcm.jpg" id="bg" alt="woods">

<link href='http://fonts.googleapis.com/css?family=Raleway:600,900' rel='stylesheet' type='text/css'>
<h1 data-text-shadow="PRETTY LITTLE THINGS"><a href="http://ohiosveryown.org">PRETTY LITTLE THINGS</a></h1>
<div id="overlay">
<div id="container">
    ...
    
    </div>
</div>

Pretty-Little-Things.markdown

Pretty Little Things

Fork

A Pen by Matt on CodePen.

License.

style.css

a:link {
  color:#ECF0F1;
  text-decoration: none;}
a:visited {
  color:#ECF0F1;}
a:hover: {
  color:#E74C3C;} 

}

#container {
    border:none;
    position: absolute;
    top: none;
    left: none;
    min-height: 100%;
    min-width: 100%;
    text-align:center;
    padding: none;
}

#overlay
{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background-color:#000;
    opacity:0.85;
    -webkit-opacity:0.5;
    -moz-opacity:0.5;
    -ms-opacity:0.5;
    -o-opacity:0.5;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter:alpha(opacity=50);
}


#bg {
  position: fixed; 
  top: 0; 
  left: 0; 
	
  /* Preserve aspet ratio */
  min-width: 100%;
  min-height: 100%;
}

body{
		background-color: #2C3E50 ;//same as the color of the h1 shadow
	}	
/* headline styles */
	h1{
		font-size:5em;
		font-weight: 900;
		text-shadow: .04em .04em 0 #2C3E50 ;
		z-index:1;
	}
	h1,h1:after {
		font-family: 'Raleway', sans-serif;
		color: rgba(0,0,0,.5);
		text-align: center;
		text-transform: uppercase;
		position: absolute;
		top: 45%;
		width: 100%;
		color: #ECF0F1 ;//same as the color surrounding the headline
		white-space: nowrap;
		letter-spacing: .1em;
		padding: .2em 0 .25em 0;
	}
	h1:after{
		content: attr(data-text-shadow);
		color: transparent;
		text-shadow: none;
		position: absolute;
		left: .0875em;
		top: .0875em;
		z-index: -1;
		background: linear-gradient(45deg, transparent 25%, white 25%, white 50%, transparent 50%, transparent 75%, white 75%, white);
background-size:4px 4px;
    -webkit-background-clip: text;  
    background-clip: text;  
	}