/*-------- Colour Coding ----------*/
.synth_lab {
    border-color: #c7f464 !important;
}
    .synth_lab .banner-content:after, .footer .product-loop div.product.product_cat-synth-lab:after{
        content: "";
        background-color: #c7f464;
        width: 27.5%;
        height: 13px;
        display: block;
        transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);
        right: -40px;
        position: absolute;
        bottom: 0;
        box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.5);
    }


.pro_audio{
    border-color: #f4e864 !important;
}
    .pro_audio .banner-content:after, .footer .product-loop div.product.product_cat-pro-audio:after{
        content: "";
        background-color: #f4e864;
        width: 27.5%;
        height: 13px;
        display: block;
        transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);
        right: -40px;
        position: absolute;
        bottom: 0;
        box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.5);
    }


.computer_music{
    border-color: #4ecdc4 !important;
}
    .computer_music .banner-content:after, .footer .product-loop div.product.product_cat-computer-music:after{
        content: "";
        background-color: #4ecdc4;
        width: 27.5%;
        height: 13px;
        display: block;
        transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);
        right: -40px;
        position: absolute;
        bottom: 0;
        box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.5);
    }

.deejay_world{
    border-color: #ff6b6b !important;
}
    .deejay_world .banner-content:after, .footer .product-loop div.product.product_cat-deejay-world:after{
        content: "";
        background-color: #ff6b6b;
        width: 27.5%;
        height: 13px;
        display: block;
        transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);
        right: -40px;
        position: absolute;
        bottom: 0;
        box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.5); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.5);
    }

/* general classic to be used in combination with one of the four color coded class above */
.border_bottom_fat{
    border-bottom-style: solid !important;
    border-bottom-width: 3px;
}

/* Borders of main image wrapper in single products */
body.single-product div.product_cat-synth-lab .main-image-slider, .slide-item .product.product_cat-synth-lab, .products-grid .product.product_cat-synth-lab {
    border-right-color: #c7f464;
    border-bottom-color: #c7f464;
}
body.single-product div.product_cat-pro-audio .main-image-slider, .slide-item .product.product_cat-pro-audio, .products-grid .product.product_cat-pro-audio {
    border-right-color: #f4e864;
    border-bottom-color: #f4e864;
}
body.single-product div.product_cat-computer-music .main-image-slider, .slide-item .product.product_cat-computer-music, .products-grid .product.product_cat-computer-music {
    border-right-color: #4ecdc4;
    border-bottom-color: #4ecdc4;
}
body.single-product div.product_cat-deejay-world .main-image-slider, .slide-item .product.product_cat-deejay-world, .products-grid .product.product_cat-deejay-world {
    border-right-color: #ff6b6b;
    border-bottom-color: #ff6b6b;
}

/* Color ribbons for product cards in footer */
.footer .product-loop div.product:after {
    right: -20px !important;
    box-shadow: 1px 2px 5px rgba(0,0,0,0.2); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.2); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.2); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.2);
}

/* Categories ribbons  */
@media all and (min-width: 1024px) {
    .product_cat-synth-lab .product-image-wrapper:after {
        content: "Synths Lab";
        background-color: #c7f464;
        width: 37.5%;
        height: 13px;
        display: block;
        transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);
        right: -30px;
        position: absolute;
        bottom: 14px;
        box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
        color: #333;
        font-size: 9px;
        text-transform: uppercase;
        text-align: center;
    }
    .product_cat-pro-audio .product-image-wrapper:after {
        content: "Pro Audio";
        background-color: #f4e864;
        width: 37.5%;
        height: 13px;
        display: block;
        transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);
        right: -30px;
        position: absolute;
        bottom: 14px;
        box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
        color: #333;
        font-size: 9px;
        text-transform: uppercase;
        text-align: center;
    }
    .product_cat-computer-music .product-image-wrapper:after {
        content: "Computer";
        background-color: #4ecdc4;
        width: 37.5%;
        height: 13px;
        display: block;
        transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);
        right: -30px;
        position: absolute;
        bottom: 14px;
        box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
        color: #333;
        font-size: 9px;
        text-transform: uppercase;
        text-align: center;
    }
    .product_cat-deejay-world .product-image-wrapper:after {
        content: "Deejay";
        background-color: #ff6b6b;
        width: 37.5%;
        height: 13px;
        display: block;
        transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);
        right: -30px;
        position: absolute;
        bottom: 14px;
        box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -moz-box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,0.3); -ms-box-shadow: 1px 2px 5px rgba(0,0,0,0.3);
        color: #333;
        font-size: 9px;
        text-transform: uppercase;
        text-align: center;
    }
}