#ribbon-container {
				position: absolute;
				top: 30px;
				right: -16px;
				overflow: visible; /* so we can see the pseudo-elements we're going to add to the anchor */
				 /* font-size and line-height must be equal so we can account for the height of the banner */
				line-height: 26px;
				font-size: 36px;
				text-transform: uppercase;
				font-weight: 700;
			}
			
			#ribbon-container {
				display:block;
				padding:10px;
				position:relative; /* allows us to position our pseudo-elements properly */
				background:#d20a0b;
				overflow:visible;
				height:44px;
				color:#fff;
				text-decoration:none;
				text-align: center;
				width: 60%;
				margin: 0 auto;
			}
			
			#ribbon-container:after { /* this creates the "folded" part of our ribbon */
				/*content:""; 
				height: 0;
				width: 0;
				display:block;
				position:absolute;
				bottom:-15px;
				right:0;
				border-top: 15px solid #004a70; 
				border-right: 15px solid transparent;*/
				content:"";
				height: 0;
				width: 0;
				display:block;
				position:absolute;
				top:0;
				right:-22px;
				border-top: 22px solid #d20a0b; 
				border-bottom: 22px solid #d20a0b; 
				border-right: 22px solid transparent;
				border-left: 22px solid transparent;
			}
			
			#ribbon-container:before { /* this creates the "forked" part of our ribbon */
				content:"";
				height: 0;
				width: 0;
				display:block;
				position:absolute;
				top:0;
				left:-22px;
				border-top: 22px solid #d20a0b; 
				border-bottom: 22px solid #d20a0b; 
				border-right: 22px solid transparent;
				border-left: 22px solid transparent;
			}

		.red-ribbon {
				position: absolute;
				top: 30px;
				right: -16px;
				overflow: visible; 
				line-height: 24px;
				font-size:22px;
				text-transform: uppercase;
		}
		.red-ribbon span {
			font-size:26px;
			font-weight: 700;
			line-height: 50px
		}
		.red-ribbon{
				display:block;
				padding:10px 10px 10px 5px;
				position:relative; 
				background:#d20a0b;
				overflow:visible;
				height:70px;
				color:#fff;
				text-decoration:none;
				text-align: center;
			}
		.red-ribbon:after { /* this creates the "folded" part of our ribbon */
				content:""; 
				height: 0;
				width: 0;
				display:block;
				position:absolute;
				bottom:-15px;
				right:0;
				border-top: 15px solid #004a70; 
				border-right: 15px solid transparent;
			}
		.red-ribbon:before { /* this creates the "forked" part of our ribbon */
				content:"";
				height: 0;
				width: 0;
				display:block;
				position:absolute;
				top:0;
				left:-35px;
				border-top: 35px solid #d20a0b; 
				border-bottom: 35px solid #d20a0b;
				border-right: 0px solid transparent;
				border-left: 35px solid transparent;
			}
			.red-ribbon-2 {
				height: 100px;
			}
			.red-ribbon-2::before {
				content: '';
				border-top: 50px solid #d20a0b;
				border-bottom: 50px solid #d20a0b;
			}
			.red-ribbon-2 span {
				line-height: 40px;
			}
			.red-ribbon-2 small {
				font-size: 18px;
				color: inherit;
				text-transform: capitalize;
			}

@media screen and (max-width:680px) {
	#ribbon-container {
		font-size: 26px;
	}
	.red-ribbon {
		font-size: 18px;
	}
}
@media screen and (max-width:480px) {
	#ribbon-container {
		font-size: 20px;
	}
	.red-ribbon {
		font-size: 14px;
		line-height: 18px;
	}
.red-ribbon span {
		font-size: 24px;
	}
}
@media screen and (min-width:1200px) {
	.red-ribbon p{
		padding-top: 10px;
	}
}
@media only screen and (max-width: 767px) {
	.red-ribbon:before {
		border-right: 13px solid transparent;
	}
	.red-ribbon {
		font-size: 14px;
	}
	.red-ribbon span {
		font-size: 16px;
	}
	.red-ribbon-2 small {
		font-size: 14px;
	}
}