/**
 * Rebar
 * Reading Progress Bar for WordPress
 * Exclusively on https://1.envato.market/rebar
 *
 * @encoding        UTF-8
 * @version         2.1.0
 * @copyright       (C) 2018 - 2021 Merkulove ( https://merkulov.design/ ). All rights reserved.
 * @license         Envato License https://1.envato.market/KYbje
 * @contributors    Dmitry Merkulov (dmitry@merkulov.design)
 * @support         help@merkulov.design
 **/
/** Hig priority for progress bar*/
#mdp-rebar-wrapper {
  z-index: 99999; }
  #mdp-rebar-wrapper.rebar-position-left {
    width: calc( 100vh + ( var(--rebar-height) / 2)) !important;
    left: calc( var(--rebar-height) / 2) !important;
    top: calc( ( 0px - var(--rebar-height) ) / 2); }
  #mdp-rebar-wrapper.rebar-position-right {
    width: calc(100vh + ( var(--rebar-height) / 2)) !important;
    left: unset !important;
    right: calc( var(--rebar-height) / 2);
    top: 100vh; }

#wpadminbar + #mdp-rebar-wrapper {
  margin-top: 32px; }

@media screen and (max-width: 782px) {
  #wpadminbar + #mdp-rebar-wrapper {
    margin-top: 46px; } }

@media screen and (max-width: 600px) {
  #wpadminbar + #mdp-rebar-wrapper {
    margin-top: 0; } }

#mdp-rebar-element {
  z-index: 99999;
  height: var(--rebar-height); }

/**
 * Gradient style
 * Use Ultimate CSS Gradient Generator http://www.colorzilla.com/gradient-editor/ to generate other awesome styles
 **/
.style-gradient #mdp-rebar-element {
  background: #c92c2c;
  background: linear-gradient(to right, #c92c2c 0%, #eae42c 50%, #3cad26 100%); }

/** Rounded Progress Bar */
.style-rounded #mdp-rebar-element {
  border-top-right-radius: 50px;
  border-bottom-right-radius: 50px; }

/** Plastic Style */
.style-plastic #mdp-rebar-element {
  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 #mdp-rebar-element {
  position: relative; }

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

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

@keyframes mdp-rebar-animated {
  0% {
    background-position: 0 0; }
  100% {
    background-position: 50px 50px; } }

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

/** Shine Progress Bar */
.style-shine #mdp-rebar-element {
  position: relative; }

.style-shine #mdp-rebar-element:after {
  content: '';
  opacity: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #fff;
  border-radius: 3px;
  -webkit-animation: mdp-rebar-animate-shine 2s ease-out infinite;
          animation: mdp-rebar-animate-shine 2s ease-out infinite; }

@-webkit-keyframes mdp-rebar-animate-shine {
  0% {
    opacity: 0;
    width: 0; }
  50% {
    opacity: .5; }
  100% {
    opacity: 0;
    width: 95%; } }

@keyframes mdp-rebar-animate-shine {
  0% {
    opacity: 0;
    width: 0; }
  50% {
    opacity: .5; }
  100% {
    opacity: 0;
    width: 95%; } }

/** Glow Progress Bar */
.style-glow #mdp-rebar-element {
  position: relative; }

.style-glow #mdp-rebar-element:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  box-shadow: 0 5px 5px rgba(255, 255, 255, 0.7) inset, 0 -5px 5px rgba(255, 255, 255, 0.7) inset;
  -webkit-animation: mdp-rebar-animate-glow 1s ease-out infinite;
          animation: mdp-rebar-animate-glow 1s ease-out infinite; }

@-webkit-keyframes mdp-rebar-animate-glow {
  0% {
    box-shadow: 0 5px 5px rgba(255, 255, 255, 0.7) inset, 0 -5px 5px rgba(255, 255, 255, 0.7) inset; }
  50% {
    box-shadow: 0 5px 5px rgba(255, 255, 255, 0.3) inset, 0 -5px 5px rgba(255, 255, 255, 0.3) inset; }
  100% {
    box-shadow: 0 5px 5px rgba(255, 255, 255, 0.7) inset, 0 -5px 5px rgba(255, 255, 255, 0.7) inset; } }

@keyframes mdp-rebar-animate-glow {
  0% {
    box-shadow: 0 5px 5px rgba(255, 255, 255, 0.7) inset, 0 -5px 5px rgba(255, 255, 255, 0.7) inset; }
  50% {
    box-shadow: 0 5px 5px rgba(255, 255, 255, 0.3) inset, 0 -5px 5px rgba(255, 255, 255, 0.3) inset; }
  100% {
    box-shadow: 0 5px 5px rgba(255, 255, 255, 0.7) inset, 0 -5px 5px rgba(255, 255, 255, 0.7) inset; } }

/** Positions classes */
.rebar-position-top {
  top: 0; }

.rebar-position-bottom {
  bottom: 0; }

.rebar-position-left {
  transform: rotate(90deg);
  transform-origin: left; }

.rebar-position-right {
  transform: rotate(90deg);
  transform-origin: right; }
