.ribbon{z-index:1;text-align:right;width:75px;height:75px;position:absolute;top:-5px;right:-5px;overflow:hidden}.ribbon span{color:#fff;text-transform:uppercase;text-align:center;background:linear-gradient(#007bbd 0%,#005a8b 100%);width:100px;font-size:10px;font-weight:700;line-height:20px;display:block;position:absolute;top:19px;right:-21px;transform:rotate(45deg);box-shadow:0 3px 10px -5px #000}.ribbon span:before{content:"";z-index:-1;border:3px solid #0000;border-color:#005a8b #0000 #0000 #005a8b;position:absolute;top:100%;left:0}.ribbon span:after{content:"";z-index:-1;border:3px solid #005a8b;border-color:#005a8b #005a8b #0000 #0000;position:absolute;top:100%;right:0}