@import "compass/css3";
 @import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);
 @import url(https://fonts.googleapis.com/css?family=Fjalla+One);


 * {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
html{
	width: 100%;
	height: 100%;
}

.container {
  text-align: center;
}

.badge {
	position: relative;
	width: 216px;
	display: inline-block;
	margin: 25px;
}
.year {
  font-size: .75em;
}

.year, .sub2 {
  font-style: italic;
}

.sub2 {
  line-height:2;
}

 .badge .title {
	 font-family: "Montserrat", sans-serif;
	 font-weight: bold;
	 font-size: 1.25em;
	 position: absolute;
	 top: 0px;
	 border-radius: 8px 8px 0 0;
	 text-align: center;
	 width: 100%;
	 background: #2ecc70a9;
	 padding: 15px 0;
}
 .badge .subtitle {
	 position: absolute;
	 font-family: "Fjalla One", sans-serif;
	 font-size: 1.25em;
	 width: 100%;
	 text-align: center;
	 color: white;
	 position: absolute;
	 top: 90px;
}
 .badge .subtitle:after {
	 content: "★ ★ ★";
	 display: block;
	 font-size: 0.7em;
	 position: relative;
	 margin: 15px 0 0;
	 transition: all 0.3s;
}
 .badge:hover .subtitle:after {
	 word-spacing: 30px;
   color: gold;
}
 .title {
	 background: #2ecc70a9;
}
 .subtitle:after {
	 color: #2ecc70a9;
}

.footer {
  position: relative;
}