.cq-ribbon-container {
background-color: #fff;
width: 100%;
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25);
position: relative;
}
.cq-ribbon-content .cq-ribbon-text{
margin: 8px 0 0 0;
padding: 4px 18px 10px 18px;
}
.cq-ribbon-content img{
margin: 0;
padding: 0;
border-radius: 0;
box-shadow: none;
}
.cq-ribbon {
width: 100px;
height: 100px;
overflow: hidden;
position: absolute;
z-index: 1002;
}
.cq-ribbon.left {
}
.cq-ribbon.right {
right: 0px;
}
.cq-ribbon > .cq-ribbon-bg {
font: bold 15px sans-serif;
color: #EFEFEF;
text-align: center;
position: relative;
padding: 7px 0;
width: 120px;
background-color: #bd0f23;
}
.cq-ribbon.left > .cq-ribbon-bg {
top: 15px;
left: -30px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.cq-ribbon.right > .cq-ribbon-bg {
top: 15px;
right: -30px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}
.cq-ribbon a, .cq-ribbon a:visited{
color: #5f0812;
text-decoration: none;
}
.cq-ribbon2 {
font-size: 16px !important; width: 70%;
position: relative;
background: #ba89b6;
color: #fff;
text-align: center;
padding: 1em 2em; margin: 2em auto 3em; }
.cq-ribbon2:before, .cq-ribbon2:after {
content: "";
position: absolute;
display: block;
bottom: -1em;
border: 1.5em solid #986794;
}
.cq-ribbon2:before {
left: -2em;
border-right-width: 1.5em;
border-left-color: transparent;
}
.cq-ribbon2:after {
right: -2em;
border-left-width: 1.5em;
border-right-color: transparent;
}
.cq-ribbon2 .cq-ribbon2-content:before, .cq-ribbon2 .cq-ribbon2-content:after {
content: "";
position: absolute;
display: block;
border-style: solid;
border-color: #804f7c transparent transparent transparent;
bottom: -1em;
}
.cq-ribbon2 .cq-ribbon2-content:before {
left: 0;
border-width: 1em 0 0 1em;
}
.cq-ribbon2 .cq-ribbon2-content:after {
right: 0;
border-width: 1em 1em 0 0;
}
.cq-ribbon3, .cq-ribbon4 { position: absolute;
padding: 4px 10px;
margin: 0 0 0 10px;
font-size: 16px;
text-align: center;
color: #fff;
background: #e74c3c;
zoom: 1;
z-index: 8;
font-weight: 600;
}
.cq-ribbon4{
right: 0;
}
.cq-ribbon3 a, .cq-ribbon4 a{
text-decoration: none;
}
.cq-ribbon3 a:visited, .cq-ribbon4 a:visited{
color: #efefef;
}
.cq-ribbon3 > div.arrow {
position: absolute;
content: "";
top: 100%;
left: 0px;
border-width: 0 10px 10px 0;
border-style: solid;
border-color: transparent #d62c1a;
display:none;
}
.cq-ribbon4 > div.arrow {
position: absolute;
content: "";
left: auto;
right: 0;
border-width: 0 0 10px 10px;
border-style: solid;
border-color: transparent #d62c1a;
}