/* The ribbons */
/*
<div class="corner-ribbon top-left sticky">Hello</div>
*/
.corner-ribbon{
	width: 200px;
	background: #e43;
	position: absolute;
	top: 25px;
	left: -50px;
	text-align: center;
	line-height: 50px;
	letter-spacing: 1px;
	color: #f0f0f0;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

/* Custom styles */

.corner-ribbon.sticky{
	position: fixed;
}

.corner-ribbon.shadow{
	box-shadow: 7px 5px 3px 2px rgba(0,0,0,.3);
}

/* Different positions */

.corner-ribbon.top-left{
	top: 25px;
	left: -50px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

.corner-ribbon.top-right{
	top: 25px;
	right: -50px;
	left: auto;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}

.corner-ribbon.bottom-left{
	top: auto;
	bottom: 25px;
	left: -50px;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}

.corner-ribbon.bottom-right{
	top: auto;
	right: -50px;
	bottom: 25px;
	left: auto;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}