/**
 * 
 * Reading Time — Reading Progress Bar for Joomla. 42theme.com useful extensions for Joomla! Exclusively on Envato Market: http://codecanyon.net/user/42theme/portfolio?ref=42theme
 * @encoding     UTF-8
 * @version      1.0.0
 * @copyright    Copyright (C) 2017 42theme (https://42theme.com). All rights reserved.
 * @license      http://codecanyon.net/licenses/standard?ref=42theme
 * @author       Alexander Khmelnitskiy (hot@42theme.com)
 * @support      support@42theme.com
 * 
 */

/** Default style */
.style-default #t42-rpb-element {
    box-shadow: 1px 1px 5px #1976d2;
}

/** Gradient style */
/*
 * Use Ultimate CSS Gradient Generator http://www.colorzilla.com/gradient-editor/ to generate other awesome styles
 */
.style-gradient #t42-rpb-element {
    background: #c92c2c; /* Old browsers */
    background: -moz-linear-gradient(left, #c92c2c 0%, #eae42c 50%, #3cad26 100%);
    background: -webkit-linear-gradient(left, #c92c2c 0%,#eae42c 50%,#3cad26 100%);
    background: linear-gradient(to right, #c92c2c 0%,#eae42c 50%,#3cad26 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c92c2c', endColorstr='#3cad26',GradientType=1 ); /* IE6-9 */
}

/** Rounded Progress Bar */
.style-rounded #t42-rpb-element {
    -webkit-border-top-right-radius: 50px;
    -webkit-bottom-right-radius: 50px;
    -moz-border-top-right-radius: 50px;
    -moz-border-bottom-right-radius: 50px;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
}

/** Plastic Style */
.style-plastic #t42-rpb-element {
    -webkit-box-shadow: inset 0 2px 9px rgba(255,255,255,0.3), inset 0 -2px 6px rgba(0,0,0,0.4);
    -moz-box-shadow: inset 0 2px 9px rgba(255,255,255,0.3), inset 0 -2px 6px rgba(0,0,0,0.4);
    box-shadow: inset 0 2px 9px rgba(255,255,255,0.3), inset 0 -2px 6px rgba(0,0,0,0.4);
}

/** Animated Progress Bar */
.style-animated #t42-rpb-element {
    position: relative;
}

.style-animated #t42-rpb-element:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent), to(transparent) );
    background-image: -moz-linear-gradient( -45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, transparent 75%, transparent );
    background-image: linear-gradient( -45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, transparent 75%, transparent );
    z-index: 1;
    -webkit-background-size: 50px 50px;
    -moz-background-size: 50px 50px;
    background-size: 50px 50px;
    -webkit-animation: t42-rpb-animated 2s linear infinite;
    -moz-animation: t42-rpb-animated 2s linear infinite;
    animation: t42-rpb-animated 2s linear infinite;
    overflow: hidden;
}

@-webkit-keyframes t42-rpb-animated {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 50px 50px;
    }
}

@-moz-keyframes t42-rpb-animated {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 50px 50px;
    }
}

@keyframes t42-rpb-animated {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 50px 50px;
    }
}

/** iOS 7 Progress Bar */
.style-ios7 #t42-rpb-element {
    background: -moz-linear-gradient(left, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55); 
    background: -webkit-linear-gradient(left, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);
    background-image: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);
}