.btn {
	 display: inline-block;
	 padding: 0.75rem 1.25rem;
	 border-radius: 10rem;
	 color: #fff;
	 text-transform: uppercase;
	 font-size: 1rem;
	 letter-spacing: 0.15rem;
	 transition: all 0.3s;
	 position: relative;
	 overflow: hidden;
	 z-index: 1;
}
 .btn:after {
	 content: '';
	 position: absolute;
	 bottom: 0;
	 left: 0;
	 width: 100%;
	 height: 100%;
	 background-color: #0cf;
	 border-radius: 10rem;
	 z-index: -2;
}
 .btn:before {
	 content: '';
	 position: absolute;
	 bottom: 0;
	 left: 0;
	 width: 0%;
	 height: 100%;
	 background-color: #008fb3;
	 transition: all 0.3s;
	 border-radius: 10rem;
	 z-index: -1;
}
 .btn:hover {
	 color: #fff;
}
 .btn:hover:before {
	 width: 100%;
}
/* optional reset for presentation */
 * {
	 font-family: Arial;
	 text-decoration: none;
	 font-size: 20px;
}
 .container {
	 padding-top: 50px;
	 margin: 0 auto;
	 width: 100%;
	 text-align: center;
}
 h1 {
	 text-transform: uppercase;
	 font-size: 0.8rem;
	 margin-bottom: 2rem;
	 color: #777;
}
 span {
	 display: block;
	 margin-top: 2rem;
	 font-size: 0.7rem;
	 color: #777;
}
 span a {
	 font-size: 0.7rem;
	 color: #999;
	 text-decoration: underline;
}