/* Promotion */

* { font-family: Helvetica, Arial, sans-serif; }

.promoBox {
    display: flex;
    align-items: center;
    justify-content: center;

    height: 150px;
    /*display: inline-block;*/
    position: relative;
    /*margin: 5px;*/
    padding: 10px;
    width: 300px;
    /*border: 2px solid #ddd;*/
    -webkit-border-radius: 8px;
    border-radius: 8px;
    overflow: hidden;

    background: #ffffff;
    background: -moz-linear-gradient(-45deg, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#ffffff), color-stop(50%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6));
    background: -webkit-linear-gradient(-45deg, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    background: -o-linear-gradient(-45deg, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    background: -ms-linear-gradient(-45deg, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    background: linear-gradient(135deg, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=1 );

    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
}

.promoBox aside {
    position: absolute;
    width: 230px;
    right: 0;
    margin: 0 -65px 0 0;
    -webkit-transform: rotate(35deg);
    -khtml-transform: rotate(35deg);
    -moz-transform: rotate(35deg);
    -ms-transform: rotate(35deg);
    transform: rotate(35deg);
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
    text-align: center;
    text-transform: uppercase;
    font-size: 10px;

    color: #fff;
    background: #4f85bb;
    background: -moz-linear-gradient(-45deg, #4f85bb 0%, #4f85bb 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#4f85bb), color-stop(100%,#4f85bb));
    background: -webkit-linear-gradient(-45deg, #4f85bb 0%,#4f85bb 100%);
    background: -o-linear-gradient(-45deg, #4f85bb 0%,#4f85bb 100%);
    background: -ms-linear-gradient(-45deg, #4f85bb 0%,#4f85bb 100%);
    background: linear-gradient(135deg, #4f85bb 0%,#4f85bb 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f85bb', endColorstr='#4f85bb',GradientType=1 );

}

.promoBox aside p { padding: 10px 80px 10px 80px; margin: 0; }
.promoBox h4 {
    font-size: 20px;
    margin: 0;
    padding: 30px 0;
    line-height: 25px;
    /*border-bottom: 1px solid #ddd;*/

}
.promoBox p { font-size: 14px; }

/* COLOR: Box & Text
\* --------------------------------- */
.promoBox.info-box {
    background: #e0f3fa;
    background: -moz-linear-gradient(-45deg, #e0f3fa 0%, #d8f0fc 50%, #b8e2f6 51%, #b6dffd 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#e0f3fa), color-stop(50%,#d8f0fc), color-stop(51%,#b8e2f6), color-stop(100%,#b6dffd));
    background: -webkit-linear-gradient(-45deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
    background: -o-linear-gradient(-45deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
    background: -ms-linear-gradient(-45deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
    background: linear-gradient(135deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0f3fa', endColorstr='#b6dffd',GradientType=1 );
    border-color: #b6e1f6;
}
.promoBox.info-box h4 { color: #225b9c; border-color: #8dc2dd; }

.promoBox.warning-box {
    background: #fceabb;
    background: -moz-linear-gradient(-45deg, #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#fceabb), color-stop(50%,#fccd4d), color-stop(51%,#f8b500), color-stop(100%,#fbdf93));
    background: -webkit-linear-gradient(-45deg, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
    background: -o-linear-gradient(-45deg, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
    background: -ms-linear-gradient(-45deg, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
    background: linear-gradient(135deg, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 );
    border-color: #fccf5a;
}
.promoBox.warning-box h4 { color: #fff; border-color: #9e8135; }

.promoBox.danger-box {
    background: #f85032;
    background: -moz-linear-gradient(-45deg, #f85032 0%, #f16f5c 50%, #f6290c 51%, #f02f17 71%, #e73827 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f85032), color-stop(50%,#f16f5c), color-stop(51%,#f6290c), color-stop(71%,#f02f17), color-stop(100%,#e73827));
    background: -webkit-linear-gradient(-45deg, #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%);
    background: -o-linear-gradient(-45deg, #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%);
    background: -ms-linear-gradient(-45deg, #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%);
    background: linear-gradient(135deg, #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=1 );
    border-color: #ff433e;
    color: #fff;
}
.promoBox.danger-box h4 { color: #fff; border-color: #ff706d; }

.promoBox.success-box {
    background: #9dd53a;
    background: -moz-linear-gradient(-45deg, #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#9dd53a), color-stop(50%,#a1d54f), color-stop(51%,#80c217), color-stop(100%,#7cbc0a));
    background: -webkit-linear-gradient(-45deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
    background: -o-linear-gradient(-45deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
    background: -ms-linear-gradient(-45deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
    background: linear-gradient(135deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#7cbc0a',GradientType=1 );
    border-color: #9dd53a;
    color: #fff;
}
.promoBox.success-box h4 { color: #4d690b; border-color: #ccfc5a; }

/* COLOR: Ribbon
\* --------------------------------- */
.promoBox.info-ribbon aside {
    background: #1e5799;
    background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8));
    background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
    background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
    background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
    background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 );
}

.promoBox.warning-ribbon aside {
    background: #f9c667;
    background: -moz-linear-gradient(-45deg, #f9c667 0%, #f79621 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f9c667), color-stop(100%,#f79621));
    background: -webkit-linear-gradient(-45deg, #f9c667 0%,#f79621 100%);
    background: -o-linear-gradient(-45deg, #f9c667 0%,#f79621 100%);
    background: -ms-linear-gradient(-45deg, #f9c667 0%,#f79621 100%);
    background: linear-gradient(135deg, #f9c667 0%,#f79621 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9c667', endColorstr='#f79621',GradientType=1 );
}

.promoBox.danger-ribbon aside {
    background: #ff3019;
    background: -moz-linear-gradient(45deg, #ff3019 0%, #cf0404 100%);
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#ff3019), color-stop(100%,#cf0404));
    background: -webkit-linear-gradient(45deg, #ff3019 0%,#cf0404 100%);
    background: -o-linear-gradient(45deg, #ff3019 0%,#cf0404 100%);
    background: -ms-linear-gradient(45deg, #ff3019 0%,#cf0404 100%);
    background: linear-gradient(45deg, #ff3019 0%,#cf0404 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=1 );
}

.promoBox.success-ribbon aside {
    background: #a9db80;
    background: -moz-linear-gradient(-45deg, #a9db80 0%, #96c56f 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#a9db80), color-stop(100%,#96c56f));
    background: -webkit-linear-gradient(-45deg, #a9db80 0%,#96c56f 100%);
    background: -o-linear-gradient(-45deg, #a9db80 0%,#96c56f 100%);
    background: -ms-linear-gradient(-45deg, #a9db80 0%,#96c56f 100%);
    background: linear-gradient(135deg, #a9db80 0%,#96c56f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9db80', endColorstr='#96c56f',GradientType=1 );
}

/*.owl-carousel {*/
    /*max-width: 320px;*/
/*}*/
/*.owl-carousel .owl-nav {*/
    /*padding-top: 0.4em;*/
    /*font-family: sans-serif;*/
    /*font-size: 0.8em;*/
/*}*/
/*.owl-carousel .owl-nav > div {*/
    /*padding: 0.4em 1.4em;*/
    /*border: 1px solid #333;*/
    /*background: #000;*/
    /*color: white;*/
    /*border-radius: 0.4em;*/
    /*background-image: linear-gradient(rgba(255, 255, 255, 0.3), rgba(0, 0, 0, 0.2));*/
    /*box-shadow: 0.1em 0.1em 0.4em rgba(0, 0, 0, 0.5);*/
/*}*/
/*.owl-carousel .owl-nav > div:hover {*/
    /*background-color: #333;*/
/*}*/
/*.owl-carousel .owl-nav .owl-prev {*/
    /*float: left;*/
/*}*/
/*.owl-carousel .owl-nav .owl-next {*/
    /*float: right;*/
/*}*/

.carousel-inner.vertical {
    height: 100%; /*Note: set specific height here if not, there will be some issues with IE browser*/
}
.carousel-inner.vertical > .item {
    -webkit-transition: .6s ease-in-out top;
    -o-transition: .6s ease-in-out top;
    transition: .6s ease-in-out top;
}

@media all and (transform-3d),
(-webkit-transform-3d) {
    .carousel-inner.vertical > .item {
        -webkit-transition: -webkit-transform .6s ease-in-out;
        -o-transition: -o-transform .6s ease-in-out;
        transition: transform .6s ease-in-out;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-perspective: 1000;
        perspective: 1000;
    }
    .carousel-inner.vertical > .item.next,
    .carousel-inner.vertical > .item.active.right {
        -webkit-transform: translate3d(0, 33.33%, 0);
        transform: translate3d(0, 33.33%, 0);
        top: 0;
    }
    .carousel-inner.vertical > .item.prev,
    .carousel-inner.vertical > .item.active.left {
        -webkit-transform: translate3d(0, -33.33%, 0);
        transform: translate3d(0, -33.33%, 0);
        top: 0;
    }
    .carousel-inner.vertical > .item.next.left,
    .carousel-inner.vertical > .item.prev.right,
    .carousel-inner.vertical > .item.active {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        top: 0;
    }
}

.carousel-inner.vertical > .active {
    top: 0;
}
.carousel-inner.vertical > .next,
.carousel-inner.vertical > .prev {
    top: 0;
    height: 100%;
    width: auto;
}
.carousel-inner.vertical > .next {
    left: 0;
    top: 33.33%;
    right:0;
}
.carousel-inner.vertical > .prev {
    left: 0;
    top: -33.33%;
    right:0;
}
.carousel-inner.vertical > .next.left,
.carousel-inner.vertical > .prev.right {
    top: 0;
}
.carousel-inner.vertical > .active.left {
    left: 0;
    top: -33.33%;
    right:0;
}
.carousel-inner.vertical > .active.right {
    left: 0;
    top: 33.33%;
    right:0;
}

#carousel-pager .carousel-control.left {
    bottom: initial;
    width: 100%;
    background-image: none !important;
}
#carousel-pager .carousel-control.right {
    top: initial;
    width: 100%;
    background-image: none !important;
}