.badgeContainer {
	position:absolute;
	z-index:1000;
	top:0;
	height:75%;
	width:30%;
	display:none;
	left:1%;
  overflow: visible;
}

.badgeContainer div{
	box-sizing:border-box;
	}

.ribbon{
	top:-3%;
	margin: 0 1%;
	position: relative;
	width: 8vw;
	float: left;
	transition: 0.5s ease-in;
	-webkit-filter: drop-shadow(0 .5rem .3em rgba(0,0,0,.5));
}

.ribbon-inner{
	font-size: 1vw;
	text-align: center;
	font-weight: bold;
	text-shadow: 1px 1px 5px rgba(0,0,0,.15);
	display: block;
	background: linear-gradient(to bottom, #999999 0%,#CCCCCC 100%);
	color: white;
	padding-top: 8%;
	transform: translate3d(0, 0, 0);
	height:80%;
	z-index:20;
	position:relative;
	border-width: 0 2px 0 2px;
	width:100%;
	}


.ribbon-bot{
	height:17.7%;
	width:100%;
	position:relative;
	top:-10%;
	z-index:10;
	}

.ribbon-bot div{
	width:50.5%;
	height:100%;
	float:left;
	background-color:white;
	position: absolute;
	}

.ribbon-bot div:nth-child(1){
	transform: skewY(15deg);
	left:0;
	border-width: 0px 0px 2px 2px;
	}

.ribbon-bot div:nth-child(2){
	transform: skewY(-15deg);
	right:0;
	border-width: 0px 2px 2px 0px;
	}

/*
.ribbon-inner::after{
	content: "";
	width:50%;
	height: 0;
	border-right: 4vw solid transparent;
	border-left: 4vw solid transparent;
	border-top: 1.5rem solid #CCCCCC;
	position: absolute;
	top: 100%;
	left: 0;
	transition: 0.5s ease-in;
}
*/

.ribbon:hover{
	/*top:0;
	cursor:pointer;*/
	top:-3%;
	transition: 0.15s ease-in;
	}

.ribbonHidden{
	top:-100%;
	}

.ribbon hr{
	margin:3px 0;
	border-top: 1px solid #db0131;
	}

.ribbon i{
	font-size: 150%;
	color: #db0131;
	}

.ribbon .stars{
	content: "★ ★ ★";
	display: block;
	font-size: .4em;
	position: relative;
	margin: 15px 0 0;
	transition: all .3s;
	}

.ribbon:hover .stars{
	word-spacing: 30px;
	}

.ribbon:nth-child(1){
	height:70%;
	}

.ribbon:nth-child(2){
	height:70%;
	}

.ribbon:nth-child(3){
	height:70%;
	}

.ribbon--red .ribbon-inner{
	background: linear-gradient(to bottom, #D3362D 0%,#E57368 100%);
}

.ribbon--red::after, .ribbon--red .ribbon-bot div{
	border-top: 1.5rem solid #E57368;
}

.ribbon--orange .ribbon-inner{
	background: linear-gradient(to bottom, #E7711B 0%,#F7981D 100%);
}

.ribbon--orange .ribbon-bot div{
	background-color: #F7981D;
}

.ribbon--yellow .ribbon-inner{
	background: linear-gradient(to bottom, #F1CA3A 0%,#F6EB3B 100%);
}

.ribbon--yellow .ribbon-bot div{
	background-color: #F6EB3B;
}

.ribbon--green .ribbon-inner{
	background: linear-gradient(to bottom, #5f9654 0%,#65b045 100%);
}

.ribbon--green .ribbon-bot div{
	background-color: #65B045;
}

.ribbon--blue .ribbon-inner{
	background: linear-gradient(to bottom, #1C91C0 0%,#11A9CC 100%);
}

.ribbon--blue .ribbon-bot div{
	background-color: #11A9CC;
}

.ribbon--edisBlue .ribbon-inner{
	background: linear-gradient(to bottom, #003e90 0%,#3c6090 100%);
	}

.ribbon--edisBlue .ribbon-bot div{
	background-color: #3c6090;
}

.ribbon--edisWhite .ribbon-inner{
	background: linear-gradient(to bottom, #f1f5f8 0%,#e3e7eb 100%);
	}


.ribbon--edisWhite .ribbon-bot div{
	background-color: #e3e7eb;
}

.ribbon--edisWhite .ribbon-inner{
	color: #003e90;
	}

.ribbon--edisWhite2 .ribbon-inner{
	background: linear-gradient(to bottom, #e3e7eb 0%,#fff 100%);
	}


.ribbon--edisWhite2 .ribbon-bot div{
	background-color: #fff;
}

.ribbon--edisWhite2 .ribbon-inner{
	color: #003e90;
	}

.ribbon--purple .ribbon-inner{
	background: linear-gradient(to bottom, #5C3292 0%,#7E3794 100%);
}

.ribbon--purple .ribbon-bot div{
	background-color: #7E3794;
}

.ribbon--borderEdisBlue .ribbon-inner, .ribbon--borderEdisBlue .ribbon-bot div{
	border-color: #003e90;
	border-style: solid;
	}