.ribbon {
    clear: left;
    color: #fff;
    height: 30px;
    left: 0;
    line-height: 30px;
    padding: 0 20px;
    position: absolute;
    top: 12px;
    z-index: 2
}

.ribbon-clip {
    left: -14px
}

.ribbon-clip:before {
    border-color: #121313 #121313 transparent transparent;
    border-style: solid;
    border-width: 7px;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    top: 30px;
    width: 0
}

.ribbon-vertical-left-wrapper {
    padding-left: 40px;
    position: relative
}

.ribbon-vertical-right-wrapper {
    padding-right: 40px
}

.ribbon-wrapper-bottom {
    padding-bottom: 40px;
    padding-top: 0
}

.ribbon-wrapper-right-bottom {
    padding-right: 40px
}

.ribbon-space-bottom {
    top: 0
}

.ribbon-bookmark:before {
    border: 15px solid #121313;
    border-right: 10px solid transparent;
    content: "";
    display: block;
    height: 0;
    left: 100%;
    position: absolute;
    top: 0;
    width: 0
}

.ribbon-right {
    left: auto;
    right: -2px
}

.ribbon-clip-right {
    right: -14px
}

.ribbon-clip-right:before {
    border-color: #121313 #121313 transparent transparent;
    border-style: solid;
    border-width: 7px;
    content: "";
    height: 0;
    position: absolute;
    right: 0;
    top: 30px;
    width: 0
}

.ribbon-clip-bottom {
    bottom: 12px;
    left: -14px;
    top: auto
}

.ribbon-clip-bottom:before {
    border-color: #121313 #121313 transparent transparent;
    border-style: solid;
    border-width: 7px;
    bottom: 30px;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    width: 0
}

.ribbon-clip-bottom-right {
    bottom: 12px;
    left: auto;
    right: -14px;
    top: auto
}

.ribbon-clip-bottom-right:before {
    border-color: #121313 #121313 transparent transparent;
    border-style: solid;
    border-width: 7px;
    bottom: 30px;
    content: "";
    height: 0;
    position: absolute;
    right: 0;
    width: 0
}

.ribbon-bookmark.ribbon-right:before {
    border-left: 10px solid transparent;
    border-right: 15px solid #121313;
    left: auto;
    right: 100%
}

.ribbon-vertical-left {
    left: 12px
}

.ribbon-vertical-left,
.ribbon-vertical-right {
    clear: none;
    height: 70px;
    line-height: 70px;
    padding: 0 5px;
    text-align: center;
    top: -2px;
    width: 30px
}

.ribbon-vertical-right {
    left: auto;
    right: 20px
}

[dir=rtl] .ribbon-vertical-right {
    left: auto !important;
    right: 20px !important
}

.ribbon-bookmark.ribbon-vertical-left:before,
.ribbon-bookmark.ribbon-vertical-right:before {
    border-bottom: 10px solid transparent;
    border-right: 15px solid #121313;
    left: 0;
    margin-top: -14px;
    top: 100%
}

.ribbon-primary {
    background: #007D88;
}

.ribbon-bookmark.ribbon-primary:before {
    border-color: #007D88 transparent #007D88 #007D88
}

.ribbon-bookmark.ribbon-right.ribbon-primary:before {
    border-left-color: transparent;
    border-right-color: #007D88
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-primary:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-primary:before {
    border-bottom-color: transparent;
    border-right-color: #007D88
}

.ribbon-primary.ribbon-corner:before {
    border-left-color: #007D88;
    border-top-color: #007D88
}

.ribbon-primary.ribbon-corner.ribbon-right:before {
    border-left-color: transparent;
    border-right-color: #007D88
}

.ribbon-primary.ribbon-corner.ribbon-bottom:before {
    border-bottom-color: #007D88;
    border-top-color: transparent
}

.ribbon-primary.ribbon-clip:before {
    border-color: #1b3b3b #1b3b3b transparent transparent
}

.ribbon-primary.ribbon-clip-right:before {
    border-left-color: #1b3b3b;
    border-right-color: transparent;
    border-top-color: #1b3b3b
}

.ribbon-primary.ribbon-clip-bottom:before {
    border-bottom-color: #1b3b3b;
    border-right-color: #1b3b3b;
    border-top-color: transparent
}

.ribbon-primary.ribbon-clip-bottom-right:before {
    border-color: transparent transparent #1b3b3b #1b3b3b
}

.ribbon-secondary {
    background: #c06240
}

.ribbon-bookmark.ribbon-secondary:before {
    border-color: #c06240 transparent #c06240 #c06240
}

.ribbon-bookmark.ribbon-right.ribbon-secondary:before {
    border-left-color: transparent;
    border-right-color: #c06240
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-secondary:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-secondary:before {
    border-bottom-color: transparent;
    border-right-color: #c06240
}

.ribbon-secondary.ribbon-corner:before {
    border-left-color: #c06240;
    border-top-color: #c06240
}

.ribbon-secondary.ribbon-corner.ribbon-right:before {
    border-left-color: transparent;
    border-right-color: #c06240
}

.ribbon-secondary.ribbon-corner.ribbon-bottom:before {
    border-bottom-color: #c06240;
    border-top-color: transparent
}

.ribbon-secondary.ribbon-clip:before {
    border-color: #9a4e33 #9a4e33 transparent transparent
}

.ribbon-secondary.ribbon-clip-right:before {
    border-left-color: #9a4e33;
    border-right-color: transparent;
    border-top-color: #9a4e33
}

.ribbon-secondary.ribbon-clip-bottom:before {
    border-bottom-color: #9a4e33;
    border-right-color: #9a4e33;
    border-top-color: transparent
}

.ribbon-secondary.ribbon-clip-bottom-right:before {
    border-color: transparent transparent #9a4e33 #9a4e33
}

.ribbon-success {
    background: #28a745
}

.ribbon-bookmark.ribbon-success:before {
    border-color: #28a745 transparent #28a745 #28a745
}

.ribbon-bookmark.ribbon-right.ribbon-success:before {
    border-left-color: transparent;
    border-right-color: #28a745
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-success:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-success:before {
    border-bottom-color: transparent;
    border-right-color: #28a745
}

.ribbon-success.ribbon-corner:before {
    border-left-color: #28a745;
    border-top-color: #28a745
}

.ribbon-success.ribbon-corner.ribbon-right:before {
    border-left-color: transparent;
    border-right-color: #28a745
}

.ribbon-success.ribbon-corner.ribbon-bottom:before {
    border-bottom-color: #28a745;
    border-top-color: transparent
}

.ribbon-success.ribbon-clip:before {
    border-color: #1e7e34 #1e7e34 transparent transparent
}

.ribbon-success.ribbon-clip-right:before {
    border-left-color: #1e7e34;
    border-right-color: transparent;
    border-top-color: #1e7e34
}

.ribbon-success.ribbon-clip-bottom:before {
    border-bottom-color: #1e7e34;
    border-right-color: #1e7e34;
    border-top-color: transparent
}

.ribbon-success.ribbon-clip-bottom-right:before {
    border-color: transparent transparent #1e7e34 #1e7e34
}

.ribbon-danger {
    background: #dc3545
}

.ribbon-bookmark.ribbon-danger:before {
    border-color: #dc3545 transparent #dc3545 #dc3545
}

.ribbon-bookmark.ribbon-right.ribbon-danger:before {
    border-left-color: transparent;
    border-right-color: #dc3545
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-danger:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-danger:before {
    border-bottom-color: transparent;
    border-right-color: #dc3545
}

.ribbon-danger.ribbon-corner:before {
    border-left-color: #dc3545;
    border-top-color: #dc3545
}

.ribbon-danger.ribbon-corner.ribbon-right:before {
    border-left-color: transparent;
    border-right-color: #dc3545
}

.ribbon-danger.ribbon-corner.ribbon-bottom:before {
    border-bottom-color: #dc3545;
    border-top-color: transparent
}

.ribbon-danger.ribbon-clip:before {
    border-color: #bd2130 #bd2130 transparent transparent
}

.ribbon-danger.ribbon-clip-right:before {
    border-left-color: #bd2130;
    border-right-color: transparent;
    border-top-color: #bd2130
}

.ribbon-danger.ribbon-clip-bottom:before {
    border-bottom-color: #bd2130;
    border-right-color: #bd2130;
    border-top-color: transparent
}

.ribbon-danger.ribbon-clip-bottom-right:before {
    border-color: transparent transparent #bd2130 #bd2130
}

.ribbon-info {
    background: #17a2b8
}

.ribbon-bookmark.ribbon-info:before {
    border-color: #17a2b8 transparent #17a2b8 #17a2b8
}

.ribbon-bookmark.ribbon-right.ribbon-info:before {
    border-left-color: transparent;
    border-right-color: #17a2b8
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-info:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-info:before {
    border-bottom-color: transparent;
    border-right-color: #17a2b8
}

.ribbon-info.ribbon-corner:before {
    border-left-color: #17a2b8;
    border-top-color: #17a2b8
}

.ribbon-info.ribbon-corner.ribbon-right:before {
    border-left-color: transparent;
    border-right-color: #17a2b8
}

.ribbon-info.ribbon-corner.ribbon-bottom:before {
    border-bottom-color: #17a2b8;
    border-top-color: transparent
}

.ribbon-info.ribbon-clip:before {
    border-color: #117a8b #117a8b transparent transparent
}

.ribbon-info.ribbon-clip-right:before {
    border-left-color: #117a8b;
    border-right-color: transparent;
    border-top-color: #117a8b
}

.ribbon-info.ribbon-clip-bottom:before {
    border-bottom-color: #117a8b;
    border-right-color: #117a8b;
    border-top-color: transparent
}

.ribbon-info.ribbon-clip-bottom-right:before {
    border-color: transparent transparent #117a8b #117a8b
}

.ribbon-light {
    background: #f5f5f5
}

.ribbon-bookmark.ribbon-light:before {
    border-color: #f5f5f5 transparent #f5f5f5 #f5f5f5
}

.ribbon-bookmark.ribbon-right.ribbon-light:before {
    border-left-color: transparent;
    border-right-color: #f5f5f5
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-light:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-light:before {
    border-bottom-color: transparent;
    border-right-color: #f5f5f5
}

.ribbon-light.ribbon-corner:before {
    border-left-color: #f5f5f5;
    border-top-color: #f5f5f5
}

.ribbon-light.ribbon-corner.ribbon-right:before {
    border-left-color: transparent;
    border-right-color: #f5f5f5
}

.ribbon-light.ribbon-corner.ribbon-bottom:before {
    border-bottom-color: #f5f5f5;
    border-top-color: transparent
}

.ribbon-light.ribbon-clip:before {
    border-color: #007D88 #007D88 transparent transparent
}

.ribbon-light.ribbon-clip-right:before {
    border-left-color: #007D88;
    border-right-color: transparent;
    border-top-color: #007D88
}

.ribbon-light.ribbon-clip-bottom:before {
    border-bottom-color: #007D88;
    border-right-color: #007D88;
    border-top-color: transparent
}

.ribbon-light.ribbon-clip-bottom-right:before {
    border-color: transparent transparent #007D88 #007D88
}

.ribbon-dark {
    background: #121313
}

.ribbon-bookmark.ribbon-dark:before {
    border-color: #121313 transparent #121313 #121313
}

.ribbon-bookmark.ribbon-right.ribbon-dark:before {
    border-left-color: transparent;
    border-right-color: #121313
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-dark:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-dark:before {
    border-bottom-color: transparent;
    border-right-color: #121313
}

.ribbon-dark.ribbon-corner:before {
    border-left-color: #121313;
    border-top-color: #121313
}

.ribbon-dark.ribbon-corner.ribbon-right:before {
    border-left-color: transparent;
    border-right-color: #121313
}

.ribbon-dark.ribbon-corner.ribbon-bottom:before {
    border-bottom-color: #121313;
    border-top-color: transparent
}

.ribbon-dark.ribbon-clip:before {
    border-color: #000 #000 transparent transparent
}

.ribbon-dark.ribbon-clip-right:before {
    border-left-color: #000;
    border-right-color: transparent;
    border-top-color: #000
}

.ribbon-dark.ribbon-clip-bottom:before {
    border-bottom-color: #000;
    border-right-color: #000;
    border-top-color: transparent
}

.ribbon-dark.ribbon-clip-bottom-right:before {
    border-color: transparent transparent #000 #000
}

.ribbon-warning {
    background: #eeb407
}

.ribbon-bookmark.ribbon-warning:before {
    border-color: #eeb407 transparent #eeb407 #eeb407
}

.ribbon-bookmark.ribbon-right.ribbon-warning:before {
    border-left-color: transparent;
    border-right-color: #eeb407
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-warning:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-warning:before {
    border-bottom-color: transparent;
    border-right-color: #eeb407
}

.ribbon-warning.ribbon-corner:before {
    border-left-color: #eeb407;
    border-top-color: #eeb407
}

.ribbon-warning.ribbon-corner.ribbon-right:before {
    border-left-color: transparent;
    border-right-color: #eeb407
}

.ribbon-warning.ribbon-corner.ribbon-bottom:before {
    border-bottom-color: #eeb407;
    border-top-color: transparent
}

.ribbon-warning.ribbon-clip:before {
    border-color: #bc8f06 #bc8f06 transparent transparent
}

.ribbon-warning.ribbon-clip-right:before {
    border-left-color: #bc8f06;
    border-right-color: transparent;
    border-top-color: #bc8f06
}

.ribbon-warning.ribbon-clip-bottom:before {
    border-bottom-color: #bc8f06;
    border-right-color: #bc8f06;
    border-top-color: transparent
}

.ribbon-warning.ribbon-clip-bottom-right:before {
    border-color: transparent transparent #bc8f06 #bc8f06
}