#ribbon-wrapper{
	position: relative;
	z-index:1;
}
#ribbon{
	color:white;
	background-color: blue;
	padding:7px 0px 7px 0px;
	font:17px cambria;
	margin-top:0px;
	margin-left: -20px;
	text-align: center;
	width:0px;
	opacity:1;
	position: absolute;
	border-top: 2px solid blue;
	border-bottom: 2px solid blue;
	display:block;
}
#triangle-left{
	position:absolute;
	display:block;	
	opacity: 0;	
	width : 20px;
	z-index: -1;
}
.skew-left{
	transform : skewY(45deg);
	-ms-transform : skewY(45deg);
	-webkit-transform : skewY(45deg);
}
.skew-right{
	transform : skewY(-45deg);
	-ms-transform : skewY(-45deg);
	-webkit-transform : skewY(-45deg);
}
#triangle-right{
	position: absolute;
	display:block;
	opacity: 0;
	z-index: -1;	
}

#square-left{
	position: absolute;
	display:block;
	border: 24px solid #00009b;
	border-left: 24px solid transparent;
	z-index: -2;
	opacity: 0;
}
#square-right{
	position: absolute;
	display:block;
	border: 24px solid #00009b;
	border-right: 24px solid transparent;
	z-index: -2;
	opacity: 0;
}
#outer-wrapper{
	position: relative;
	
}
#corner-ribbon-wrapper {
  width: 90px;
  height:90px;
  overflow:hidden;
  position: absolute;
}

#corner-ribbon-left,#corner-ribbon-right{
  font:14px cambria;
    text-align: center;
  position: relative;
  padding: 4px 0;
 width:126px;
 opacity:0;
  background-color:blue;
  color:white;
  border-top: 2px solid blue;
border-bottom: 2px solid blue;

}
#corner-ribbon-left{
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform:    rotate(-45deg);
  -ms-transform:     rotate(-45deg);
  -o-transform:      rotate(-45deg);
}
#corner-ribbon-right{
	 transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
}
.badge-wrapper{
	width:40px;
	height:10px;
	position: relative;
	overflow: hidden;
}


.badge-ribbon{
	width:40px;
	height:70px;
    text-align:center;
	position: relative;
}
.content{
	margin-top:20px;
	margin-left: -10px;
	width: 60px;
	position: absolute;
}
.badge-ribbon-left{
	width:40px;
	height: 40px;
	top:50px;
	margin-left: -20px;
	position: absolute;
	 transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
}
.badge-ribbon-right{
	width:40px;
	height: 40px;
	top:50px;
	margin-left: 20px;
	position: absolute;
	 transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
}