@import url(https://fonts.googleapis.com/css?family=Cutive);
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300&display=swap);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:600);
@import url(https://fonts.googleapis.com/css?family=Montserrat:700);

* {
    box-sizing: border-box;
}

/* NORMAL BADGES */
.badge-container {
    margin: 0 !important;
}
.badge-container .badge {
	height: 2.4em;
    width: auto;
    font-size: .9em;
}
.badge-container .badge-outline,
.badge-container .badge-circle {
    margin-top: 0.5em;
    margin-left: 0.5em;
}
.badge-container .badge-circle-inside .badge-inner,
.badge-container .badge-circle .badge-inner {
    border-radius: 6px;
    background: #FF6600;
}
.badge-container .badge-inner {
    font-weight: normal;
    padding: 10px 15px;
}

.badge-container .badge-square .secondary {
    background: #FF6600;
}

.badge-container .badge-frame {
    margin-top: 0.15em;
    margin-left: 0.2em;
}

.badge-container .badge-frame .badge-inner {
    border: 4px double #fff;
    color: #fff;
    background: rgba(0,0,0,.2);
    font-size: 1.5em;
}

/* .badge-container {margin: 0 !important;} */

/** POSITIONING */
.canto_superior_esquerdo {
    top: 0;
    left: 0;
}

.canto_superior_esquerdo_3 {
    top: 0;
    left: 0;
    transform: rotate(-90deg);
}

.canto_superior_direito {
    top: 0;
    right: 15px;
}

.canto_superior_direito_2 {
    top: 0;
    right: 5px;
}

.canto_superior_direito_3 {
    top: 0;
    right: 0;
}

.canto_inferior_esquerdo {
    bottom: 25%;
    left: 0;
}

.canto_inferior_direito {
    bottom: 15px;
    right: 15px;
}

.canto_superior_direito_6 {
    top: 0;
    right: 102.5px;
}

/** BADGES STYLES */

/** BADGE STYLE 1 */
.metro-badges-container.badge_estilo_1 {
    margin: 15px 0 0 15px;
    background: #fff;
    border-radius: 50%;
    position: relative;
    box-shadow:
        0 0 4px 1px rgba(0, 0, 0, 0.2),
        0 3px 2px rgba(0, 0, 0, 0.2);
    font-weight: bold;
    color: #ed2400;
    text-align: center;
    font-size: 18px;
    font-family: 'Cutive', serif;
}

.metro-badges-container.badge_estilo_1 {
    width: 75px;
    height: 75px;
    line-height: 50px;
}

.metro-badges-container.badge_estilo_1.promo-no-message {
    width: 60px;
    height: 60px;
    line-height: 55px;
}

.metro-badges-container.badge_estilo_1 span {
    color: #ed2400;
}

.metro-badges-container.badge_estilo_1.promo-no-message>span {
    vertical-align: middle;
}

.metro-badges-container.badge_estilo_1 .role {
    text-transform: uppercase;
    position: absolute;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 10px;
    color: #ff6600;
    left: 50%;
    bottom: 15px;
    line-height: 1;
    text-align: center;
    transform: translate(-50%, 0);
}

.metro-badges-container.badge_estilo_1:after {
    content: "";
    position: absolute;
    border-radius: inherit;
    z-index: -1;
    background: #ed2400;
    background: linear-gradient(#ed2400, #ff6600);
    left: -5px;
    top: -5px;
    right: -5px;
    bottom: -5px;
    box-shadow:
        inset 0 1px 0 rgba(237, 36, 0, 0.9),
        0 1px 0 rgba(255, 102, 0, 0.2);
}

/** BADGE STYLE 2 */
.metro-badges-container.badge_estilo_2 {
    margin: 0;
    background: none;
    position: relative;
    /* font-size: 18px;
    font-family: 'Cutive', serif; */
}

.metro-badges-container.badge_estilo_2 svg {
    max-width: 100%;
    margin-top: -40px;
}

.metro-badges-container.badge_estilo_2 .badge {
    position: relative;
    width: 80px;
    display: inline-block;
    height: auto;
    margin: 5px 0 0 5px;
    vertical-align: top;
}

.metro-badges-container.badge_estilo_2 .title {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-size: 1.2em;
    position: absolute;
    top: 0;
    border-radius: 8px 8px 0 0;
    text-align: center;
    width: 100%;
    background: #fff;
    padding: 5px 0 2px;
    color: #ff6600;
    border-bottom: 3px solid #00205c;
    margin-bottom: 0;
}

.metro-badges-container.badge_estilo_2.promo-no-message .title {
    border-radius: 8px;
    border-bottom: none;
}

.metro-badges-container.badge_estilo_2 .subtitle {
    position: absolute;
    font-family: "Roboto", sans-serif;
    font-size: 0.55em;
    letter-spacing: -0.1em;
    width: 100%;
    text-align: center;
    color: #fff;
    position: absolute;
    top: 60px;
    line-height: 1.1;
    text-transform: uppercase;
    font-variant: small-caps;
}

.metro-badges-container.badge_estilo_2 .subtitle:after {
    content: "★ ★ ★";
    display: block;
    font-size: 0.5em;
    position: relative;
    margin: 10px 0 0;
    transition: all 0.3s;
}

.metro-badges-container.badge_estilo_2:hover .subtitle:after {
    word-spacing: 15px;
}

.metro-badges-container.badge_estilo_2 .red .title {
    background: #DC514E;
}

.metro-badges-container.badge_estilo_2 .red .subtitle:after {
    color: #DC514E;
}

.metro-badges-container.badge_estilo_2 .green .title {
    background: #2ecc71;
}

.metro-badges-container.badge_estilo_2 .green .subtitle:after {
    color: #2ecc71;
}

.metro-badges-container.badge_estilo_2 .gray .title {
    background: #95a5a6;
}

.metro-badges-container.badge_estilo_2 .gray .subtitle:after {
    color: #95a5a6;
}

.metro-badges-container.badge_estilo_2 .yellow .title {
    background: #f1c40f;
}

.metro-badges-container.badge_estilo_2 .yellow .subtitle:after {
    color: #f1c40f;
}

.metro-badges-container.badge_estilo_2 .blue .title {
    background: #3498db;
}

.metro-badges-container.badge_estilo_2 .blue .subtitle:after {
    color: #3498db;
}

/** BADGE STYLE 3 */
.w-100 {
    width: 100%;
}

.metro-badges-container.badge_estilo_3 {
    position: relative;
}

.metro-badges-container.badge_estilo_3 .ribbon {
    position: absolute;
    right: -3px;
    top: -3px;
    z-index: 1;
    overflow: hidden;
    width: 106px;
    height: 106px;
    text-align: right;
}

.metro-badges-container.badge_estilo_3 .ribbon span {
    font-size: 24px;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    line-height: 36px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    width: 150px;
    display: block;
    /* background: #79A70A; */
    /* background: linear-gradient(#033aa1 0%, #00205C 100%); */
    /* background: linear-gradient(#ff4d00 0%, #FF3C00 100%); */
    /* background: linear-gradient(#ff7700 0%, #FF6600 100%); */
    box-shadow: 0 2px 6px -2px rgb(0, 0, 0);
    position: absolute;
    top: 20px;
    right: -34px;
}

.metro-badges-container.badge_estilo_3 .ribbon span::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid #00205C;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #00205C;
}

.metro-badges-container.badge_estilo_3 .ribbon span::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid transparent;
    border-right: 3px solid #00205C;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #00205C;
}

.metro-badges-container.badge_estilo_3.badge_bg_orange .ribbon span {
    background: linear-gradient(#ff7700 0%, #FF6600 100%);
}

.metro-badges-container.badge_estilo_3.badge_bg_blue .ribbon span {
    background: linear-gradient(#033aa1 0%, #00205C 100%);
}

.metro-badges-container.badge_estilo_3.badge_bg_red .ribbon span {
    background: linear-gradient(#FF2600 0%, #ff0000 100%);
}

.metro-badges-container.badge_estilo_3.badge_bg_bordeaux .ribbon span {
    background: linear-gradient(#673596 0%, #412957 100%);
}

.metro-badges-container.badge_estilo_3.badge_bg_green .ribbon span {
    background: linear-gradient(#117D00 0%, #0c5201 100%);
}

.metro-badges-container.badge_estilo_3.badge_bg_transparent .ribbon span {
    font-size: 32px;
    background: rgba(0, 0, 0, .3);
    font-weight: 900;
}

.metro-badges-container.badge_estilo_3.badge_bg_transparent_red .ribbon span {
    font-size: 32px;
    background: rgba(255, 255, 255, .5);
    color: red;
    font-weight: 900;
}

/** BADGE STYLE 4 */
.metro-badges-container.badge_estilo_4 p {
    position: relative;
    display: block;
}

.metro-badges-container.badge_estilo_4 p span {
    display: inline-block;
}

.metro-badges-container.badge_estilo_4 .firstLine {
    font-size: 42px;
    line-height: 1;
    font-weight: 600;
    margin: .6em 0 0.15em;
    color: #fff;
}

.metro-badges-container.badge_estilo_4.promo-no-message .firstLine {
    font-size: 50px;
    margin: .75em 0 0;
}

.metro-badges-container.badge_estilo_4 .secondLine {
    font-size: 13px;
    line-height: 1.1;
    font-weight: normal;
    color: #fff;
}

.metro-badges-container.badge_estilo_4 {
    position: relative;
    /* margin:140px auto; */
    margin: 35px auto 0;
    /* width:200px;
    height:200px; */
    width: 130px;
    height: 130px;
    /* background:#552F87; */
    /* background: #000; */
    background: #ff6600;
    border: solid 1px red;
    border-radius: 100%;
    color: #fff;
    /* line-height: 25px; */
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    /* font-family: "Roboto",sans-serif; */
    -webkit-animation: 3s ease-in-out 0s normal none infinite running swing;
    -moz-animation: 3s ease-in-out 0s normal none infinite running swing;
    -o-animation: 3s ease-in-out 0s normal none infinite running swing;
    animation: 3s ease-in-out 0s normal none infinite running swing;

    /* -webkit-transform-origin: 100px -71px;
    -moz-transform-origin: 100px -71px;
    -o-transform-origin: 100px -71px;
    transform-origin: 100px -71px; */

    -webkit-transform-origin: 59.5px -71px;
    -moz-transform-origin: 59.5px -71px;
    -o-transform-origin: 59.5px -71px;
    transform-origin: 59.5px -71px;
}

.metro-badges-container.badge_estilo_4:before {
    content: '';
    position: absolute;
    /* top:90px; */
    top: 101px;
    /* left:90px; */
    left: 50px;
    /* width:20px; */
    width: 21px;
    /* height:20px; */
    height: 21px;
    border-radius: 100%;

    -webkit-box-shadow: 0px -98px 6px -3px #fff, 0px -115px #ff6600, 20.5px -112px #ff6600, 39.75px -104px #ff6600,
        55px -91px #ff6600, 66px -73px #ff6600, 71px -52.5px #ff6600, 69.25px -31.75px #ff6600,
        62.5px -12px #ff6600, 50px 3.75px #ff6600, 33px 15px #ff6600, 13.5px 21.5px #ff6600,
        -6.75px 21px #ff6600,

        -26px 15.5px #ff6600, -42.5px 4px #ff6600, -55.5px -11.75px #ff6600, -63px -30px #ff6600,
        -65.5px -50px #ff6600, -61px -70px #ff6600, -51px -87px #ff6600, -36.5px -100.5px #ff6600,
        -19.5px -110px #ff6600;

    -moz-box-shadow: 0px -98px 6px -3px #fff, 0px -115px #ff6600, 20.5px -112px #ff6600, 39.75px -104px #ff6600,
        55px -91px #ff6600, 66px -73px #ff6600, 71px -52.5px #ff6600, 69.25px -31.75px #ff6600,
        62.5px -12px #ff6600, 50px 3.75px #ff6600, 33px 15px #ff6600, 13.5px 21.5px #ff6600,
        -6.75px 21px #ff6600,

        -26px 15.5px #ff6600, -42.5px 4px #ff6600, -55.5px -11.75px #ff6600, -63px -30px #ff6600,
        -65.5px -50px #ff6600, -61px -70px #ff6600, -51px -87px #ff6600, -36.5px -100.5px #ff6600,
        -19.5px -110px #ff6600;

    -o-box-shadow: 0px -98px 6px -3px #fff, 0px -115px #ff6600, 20.5px -112px #ff6600, 39.75px -104px #ff6600,
        55px -91px #ff6600, 66px -73px #ff6600, 71px -52.5px #ff6600, 69.25px -31.75px #ff6600,
        62.5px -12px #ff6600, 50px 3.75px #ff6600, 33px 15px #ff6600, 13.5px 21.5px #ff6600,
        -6.75px 21px #ff6600,

        -26px 15.5px #ff6600, -42.5px 4px #ff6600, -55.5px -11.75px #ff6600, -63px -30px #ff6600,
        -65.5px -50px #ff6600, -61px -70px #ff6600, -51px -87px #ff6600, -36.5px -100.5px #ff6600,
        -19.5px -110px #ff6600;

    box-shadow: 0px -98px 6px -3px #fff, 0px -115px #ff6600, 20.5px -112px #ff6600, 39.75px -104px #ff6600,
        55px -91px #ff6600, 66px -73px #ff6600, 71px -52.5px #ff6600, 69.25px -31.75px #ff6600,
        62.5px -12px #ff6600, 50px 3.75px #ff6600, 33px 15px #ff6600, 13.5px 21.5px #ff6600,
        -6.75px 21px #ff6600,

        -26px 15.5px #ff6600, -42.5px 4px #ff6600, -55.5px -11.75px #ff6600, -63px -30px #ff6600,
        -65.5px -50px #ff6600, -61px -70px #ff6600, -51px -87px #ff6600, -36.5px -100.5px #ff6600,
        -19.5px -110px #ff6600;
}

.metro-badges-container.badge_estilo_4:after {
    content: '';
    position: absolute;
    /* top:-70px; */
    top: -35px;
    /* left:99px; */
    left: 59.5px;
    width: 3px;
    /* height:81px; */
    height: 50px;
    border-radius: 0%;
    /* background:#000; */
    background: rgb(0, 32, 92);
    background: linear-gradient(90deg, rgba(0, 32, 92, 1) 0%, rgba(0, 61, 175, .75) 48%, rgba(134, 169, 235, .5) 100%);
}

@-webkit-keyframes swing {
    0% {
        -webkit-transform: rotate(5deg);
    }

    50% {
        -webkit-transform: rotate(-5deg);
    }

    100% {
        -webkit-transform: rotate(5deg);
    }
}

@-moz-keyframes swing {
    0% {
        -moz-transform: rotate(5deg);
    }

    50% {
        -moz-transform: rotate(-5deg);
    }

    100% {
        -moz-transform: rotate(5deg);
    }
}

@-o-keyframes swing {
    0% {
        -o-transform: rotate(5deg);
    }

    50% {
        -o-transform: rotate(-5deg);
    }

    100% {
        -o-transform: rotate(5deg);
    }
}

@keyframes swing {
    0% {
        transform: rotate(5deg);
    }

    50% {
        transform: rotate(-5deg);
    }

    100% {
        transform: rotate(5deg);
    }
}

/** BADGE STYLE 5 */
.metro-badges-container.badge_estilo_5 {
    /* background-color: #412957; */
    color: #fff;
    display: inline-block;
    /* width: 180px; */
    width: 120px;
    position: relative;
    text-decoration: none;
    padding: 0 9px 4.5px;
    text-align: center;
}

.metro-badges-container.badge_estilo_5:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    /* border-color: #412957 transparent transparent transparent; */
    /* border-width: 40.5px 90px 0 90px; */
    border-width: 40.5px 60px 0 60px;
    position: absolute;
    top: 100%;
    left: 0;
}

.metro-badges-container.badge_estilo_5 .ribbon-inner {
    display: block;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    position: relative;
    height: 100%;
    /* padding: 75px 35px 12px; */
    padding: 15px 10px 0px;
    font-size: 2.2rem;
    letter-spacing: -0.1em;
    ;
}

.metro-badges-container.badge_estilo_5 .ribbon-inner:before,
.metro-badges-container.badge_estilo_5 .ribbon-inner:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    /* border-color: #412957 transparent transparent transparent; */
    /* border-width: 36px 81px 0 81px; */
    border-width: 36px 53px 0 49px;
    margin-top: -1px;
    position: absolute;
    top: 100%;
    left: -1px;
    z-index: 5;
}

.metro-badges-container.badge_estilo_5 .ribbon-inner:before {
    border-color: #fff transparent transparent transparent;
    /* border-width: 36px 81px 0 81px; */
    border-width: 36px 53px 0 49px;
    margin-top: 0;
}

/** COLORS ESTILO 5 */
.metro-badges-container.badge_estilo_5.badge_bg_orange {
    background-color: #ff6600;
}

.metro-badges-container.badge_estilo_5.badge_bg_orange:after {
    border-color: #ff6600 transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_orange .ribbon-inner:before,
.metro-badges-container.badge_estilo_5.badge_bg_orange .ribbon-inner:after {
    border-color: #ff6600 transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_orange .ribbon-inner:before {
    border-color: #fff transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_blue {
    background-color: #00205C;
}

.metro-badges-container.badge_estilo_5.badge_bg_blue:after {
    border-color: #00205C transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_blue .ribbon-inner:before,
.metro-badges-container.badge_estilo_5.badge_bg_blue .ribbon-inner:after {
    border-color: #00205C transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_blue .ribbon-inner:before {
    border-color: #fff transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_red {
    background-color: #ff0000;
}

.metro-badges-container.badge_estilo_5.badge_bg_red:after {
    border-color: #ff0000 transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_red .ribbon-inner:before,
.metro-badges-container.badge_estilo_5.badge_bg_red .ribbon-inner:after {
    border-color: #ff0000 transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_red .ribbon-inner:before {
    border-color: #fff transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_bordeaux {
    background-color: #412957;
}

.metro-badges-container.badge_estilo_5.badge_bg_bordeaux:after {
    border-color: #412957 transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_bordeaux .ribbon-inner:before,
.metro-badges-container.badge_estilo_5.badge_bg_bordeaux .ribbon-inner:after {
    border-color: #412957 transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_bordeaux .ribbon-inner:before {
    border-color: #fff transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_green {
    background-color: #0c5201;
}

.metro-badges-container.badge_estilo_5.badge_bg_green:after {
    border-color: #0c5201 transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_green .ribbon-inner:before,
.metro-badges-container.badge_estilo_5.badge_bg_green .ribbon-inner:after {
    border-color: #0c5201 transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_green .ribbon-inner:before {
    border-color: #fff transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_transparent {
    background-color: rgba(0, 0, 0, .3);
}

.metro-badges-container.badge_estilo_5.badge_bg_transparent:after {
    border-color: rgba(0, 0, 0, .3) transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_transparent .ribbon-inner:before,
.metro-badges-container.badge_estilo_5.badge_bg_transparent .ribbon-inner:after {
    border-color: transparent transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_transparent .ribbon-inner:before {
    border-color: transparent transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_transparent_red {
    background-color: rgba(255, 255, 255, .3);
    color: #ff0000;
}

.metro-badges-container.badge_estilo_5.badge_bg_transparent_red:after {
    border-color: rgba(255, 255, 255, .3) transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_transparent_red .ribbon-inner:before,
.metro-badges-container.badge_estilo_5.badge_bg_transparent_red .ribbon-inner:after {
    border-color: transparent transparent transparent transparent;
}

.metro-badges-container.badge_estilo_5.badge_bg_transparent_red .ribbon-inner:before {
    border-color: transparent transparent transparent transparent;
}

/** BADGE STYLE 6 */
.metro-badges-container.badge_estilo_6.rtl .ribbon-inner {
    right: -8px;
    left: 0;
    padding-right: 25px;
    padding-left: 0;
    text-align: right;
}

.metro-badges-container.badge_estilo_6 .ribbon-inner {
    width: 110px;
    height: 50px;
    line-height: 50px;
    padding-left: 25px;
    position: absolute;
    left: -8px;
    top: 20px;
    font-size: 1.8rem;
    /* font-weight: bold; */
    font-family: 'Montserrat', 'sans-serif';
    /* background: #59324C;
    color: #fff; */
}

.metro-badges-container.badge_estilo_6.rtl .ribbon-inner:before {
    right: 0.1px;
    left: auto;
    border-right: 9px solid transparent;
    border-left: none;
}

.metro-badges-container.badge_estilo_6.badge_bg_transparent_red .ribbon-inner:before,
.metro-badges-container.badge_estilo_6.rtl.badge_bg_transparent_red .ribbon-inner:before {
    border-right: none;
    border-left: none;
}

.metro-badges-container.badge_estilo_6 .ribbon-inner:before {
    height: 0;
    width: 0;
    top: -8.5px;
    left: 0.1px;
    border-bottom: 9px solid black;
    border-left: 9px solid transparent;
}

.metro-badges-container.badge_estilo_6 .ribbon-inner:before,
.metro-badges-container.badge_estilo_6 .ribbon-inner:after {
    content: "";
    position: absolute;
}

.metro-badges-container.badge_estilo_6.rtl .ribbon-inner:after {
    right: 110px;
    border-right: 15px solid #ff6600;
    border-left: none;
}

.metro-badges-container.badge_estilo_6 .ribbon-inner:after {
    height: 0;
    width: 0;
    right: -15.5px;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    border-left-style: solid;
    border-left-width: 15px;
    /* border-left: 15px solid #59324C; */
}

/** COLORS ESTILO 6 */
.metro-badges-container.badge_estilo_6.badge_bg_orange .ribbon-inner {
    background: #ff6600;
    color: #fff;
}

.metro-badges-container.badge_estilo_6.rtl.badge_bg_orange .ribbon-inner:after {
    border-right-color: #ff6600;
}

.metro-badges-container.badge_estilo_6.badge_bg_orange .ribbon-inner:after {
    border-left-color: #ff6600;
}

.metro-badges-container.badge_estilo_6.badge_bg_blue .ribbon-inner {
    background: #00205C;
    color: #fff;
}

.metro-badges-container.badge_estilo_6.rtl.badge_bg_blue .ribbon-inner:after {
    border-right-color: #00205C;
}

.metro-badges-container.badge_estilo_6.badge_bg_blue .ribbon-inner:after {
    border-left-color: #00205C;
}

.metro-badges-container.badge_estilo_6.badge_bg_red .ribbon-inner {
    background: #ff0000;
    color: #fff;
}

.metro-badges-container.badge_estilo_6.rtl.badge_bg_red .ribbon-inner:after {
    border-right-color: #ff0000;
}

.metro-badges-container.badge_estilo_6.badge_bg_red .ribbon-inner:after {
    border-left-color: #ff0000;
}

.metro-badges-container.badge_estilo_6.badge_bg_bordeaux .ribbon-inner {
    background: #412957;
    color: #fff;
}

.metro-badges-container.badge_estilo_6.rtl.badge_bg_bordeaux .ribbon-inner:after {
    border-right-color: #412957;
}

.metro-badges-container.badge_estilo_6.badge_bg_bordeaux .ribbon-inner:after {
    border-left-color: #412957;
}

.metro-badges-container.badge_estilo_6.badge_bg_green .ribbon-inner {
    background: #0c5201;
    color: #fff;
}

.metro-badges-container.badge_estilo_6.rtl.badge_bg_green .ribbon-inner:after {
    border-right-color: #0c5201;
}

.metro-badges-container.badge_estilo_6.badge_bg_green .ribbon-inner:after {
    border-left-color: #0c5201;
}

.metro-badges-container.badge_estilo_6.badge_bg_transparent .ribbon-inner {
    background-color: rgba(0, 0, 0, .3);
    color: #fff;
}

.metro-badges-container.badge_estilo_6.rtl.badge_bg_transparent .ribbon-inner:after {
    border-right-color: rgba(0, 0, 0, .3);
}

.metro-badges-container.badge_estilo_6.badge_bg_transparent .ribbon-inner:after {
    border-left-color: rgba(0, 0, 0, .3);
}

.metro-badges-container.badge_estilo_6.badge_bg_transparent_red .ribbon-inner {
    background-color: rgba(255, 255, 255, .3);
    color: #ff0000;
}

.metro-badges-container.badge_estilo_6.rtl.badge_bg_transparent_red .ribbon-inner:after {
    border-right-color: rgba(255, 255, 255, .3);
}

.metro-badges-container.badge_estilo_6.badge_bg_transparent_red .ribbon-inner:after {
    border-left-color: rgba(255, 255, 255, .3);
}

/** BADGE STYLE 7 */
.metro-badges-container.badge_estilo_7 {
    font-family: 'Source Sans Pro', 'sans-serif';
    line-height: .8em;
    font-size: 1.8em;
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    text-shadow: 1px 1px 5px rgba(0, 0, 0, .15);
    letter-spacing: -2px;
    display: block;
    width: 6rem;
    height: 4rem;
    /* background: linear-gradient(to bottom, #999999 0%,#CCCCCC 100%); */
    color: white;
    margin: .5em .5em 0;
    float: left;
    padding-top: 1.3rem;
    position: relative;
    text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.6);
    -webkit-filter: drop-shadow(0 .5rem .3em rgba(0, 0, 0, .5));
    /* what gives? filters make text blurry */
    transform: translate3d(0, 0, 0);
}

.metro-badges-container.badge_estilo_7:after {
    content: "";
    width: 0;
    height: 0;
    border-right: 3rem solid transparent;
    border-left: 3rem solid transparent;
    border-top: 1.5rem solid #CCCCCC;
    position: absolute;
    top: 4rem;
    left: 0;
}

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

.metro-badges-container.badge_estilo_7.ribbon--red:after {
    border-top: 1.5rem solid #E57368;
}

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

.metro-badges-container.badge_estilo_7.ribbon--orange:after {
    border-top: 1.5rem solid #F7981D;
}

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

.metro-badges-container.badge_estilo_7.ribbon--green:after {
    border-top: 1.5rem solid #65B045;
}

.metro-badges-container.badge_estilo_7.ribbon--blue {
    /* background: linear-gradient(to bottom, #1C91C0 0%,#11A9CC 100%); */
    background: linear-gradient(to bottom, #00205c 0%, #003dad 100%);
}

.metro-badges-container.badge_estilo_7.ribbon--blue:after {
    /* border-top: 1.5rem solid #11A9CC; */
    border-top: 1.5rem solid #003dad;
}

.metro-badges-container.badge_estilo_7.ribbon--bordeaux {
    background: linear-gradient(to bottom, #5C3292 0%, #7E3794 100%);
}

.metro-badges-container.badge_estilo_7.ribbon--bordeaux:after {
    border-top: 1.5rem solid #7E3794;
}

.metro-badges-container.badge_estilo_7.ribbon--transparent {
    background: linear-gradient(to bottom, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .3) 100%);
}

.metro-badges-container.badge_estilo_7.ribbon--transparent:after {
    border-top: 1.5rem solid rgba(0, 0, 0, .3);
}

.metro-badges-container.badge_estilo_7.ribbon--transparent_red {
    background: linear-gradient(to bottom, rgba(255, 255, 255, .3) 0%, rgba(255, 255, 255, .5) 100%);
    color: #ff0000;
}

.metro-badges-container.badge_estilo_7.ribbon--transparent_red:after {
    border-top: 1.5rem solid rgba(255, 255, 255, .5);
}

/** BADGE STYLE 8 */
.metro-badges-container.badge_estilo_8 {
    font-size: 16px !important;
    width: 100%;
    position: relative;
    color: #fff;
    text-align: center;
    padding: .5em 2em;
    margin: 1em auto 0;
    line-height: 1.1;
    text-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
    -webkit-filter: drop-shadow(0 .5rem .3em rgba(0, 0, 0, .4));
    /* what gives? filters make text blurry */
    transform: translate3d(0, 0, 0);
}
.metro-badges-container.badge_estilo_8 span {
    display: block;
}
.metro-badges-container.badge_estilo_8 span.ribbon-content-value {
    font-size:40px;
}
.metro-badges-container.badge_estilo_8 span.ribbon-content-message {
    font-size: 12px;
}

.metro-badges-container.badge_estilo_8.ribbon--orange {
    background: linear-gradient(to bottom, #E7711B 0%, #F7981D 100%);
    opacity: .9;
}

.metro-badges-container.badge_estilo_8.ribbon--blue {
    background: linear-gradient(to bottom, #00205c 0%, #003dad 100%);
    opacity: .9;
}

.metro-badges-container.badge_estilo_8.ribbon--red {
    background: linear-gradient(to bottom, #D3362D 0%, #E57368 100%);
    opacity: .9;
}

.metro-badges-container.badge_estilo_8.ribbon--bordeaux {
    background: linear-gradient(to bottom, #5C3292 0%, #7E3794 100%);
    opacity: .9;
}

.metro-badges-container.badge_estilo_8.ribbon--green {
    background: linear-gradient(to bottom, #5f9654 0%, #65b045 100%);
    opacity: .9;
}

.metro-badges-container.badge_estilo_8.ribbon--transparent {
    background: linear-gradient(to bottom, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .3) 100%);
}

.metro-badges-container.badge_estilo_8.ribbon--transparent_red {
    background: linear-gradient(to bottom, rgba(255, 255, 255, .3) 0%, rgba(255, 255, 255, .5) 100%);
    color: #ff0000;
    text-shadow: 1px 1px 5px rgba(255, 255, 255, .5);
}

/** END BADGES */
.metro-span-reference {
    display: block;
    font-size: 0.75rem;
    color: #50555c;
    margin-bottom: 0.25rem;
}