@keyframes progress-bar-stripes { from { background-position: 1rem 0; } to { background-position: 0 0; } } .progress { display: block; width: 100%; height: 1rem; margin-bottom: 1rem; } .progress[value] { background-color: #eee; border: 0; appearance: none; border-radius: 0.125rem; } .progress[value]::-ms-fill { background-color: #0074d9; border: 0; } .progress[value]::-moz-progress-bar { background-color: #0074d9; border-bottom-left-radius: 0.125rem; border-top-left-radius: 0.125rem; } .progress[value]::-webkit-progress-value { background-color: #0074d9; border-bottom-left-radius: 0.125rem; border-top-left-radius: 0.125rem; } .progress[value="100"]::-moz-progress-bar { border-bottom-right-radius: 0.125rem; border-top-right-radius: 0.125rem; } .progress[value="100"]::-webkit-progress-value { border-bottom-right-radius: 0.125rem; border-top-right-radius: 0.125rem; } .progress[value]::-webkit-progress-bar { background-color: #eee; border-radius: 0.125rem; } base::-moz-progress-bar, .progress[value] { background-color: #eee; border-radius: 0.125rem; } @media screen and (min-width: 0\0) { .progress { background-color: #eee; border-radius: 0.125rem; } .progress-bar { display: inline-block; height: 1rem; text-indent: -999rem; background-color: #0074d9; border-bottom-left-radius: 0.125rem; border-top-left-radius: 0.125rem; } .progress[width="100%"] { border-bottom-right-radius: 0.125rem; border-top-right-radius: 0.125rem; } } .progress-striped[value]::-webkit-progress-value { background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-size: 1rem 1rem; } .progress-striped[value]::-moz-progress-bar { background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-size: 1rem 1rem; } .progress-striped[value]::-ms-fill { background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-size: 1rem 1rem; } @media screen and (min-width: 0\0) { .progress-bar-striped { background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-size: 1rem 1rem; } } .progress-animated[value]::-webkit-progress-value { animation: progress-bar-stripes 2s linear infinite; } .progress-animated[value]::-moz-progress-bar { animation: progress-bar-stripes 2s linear infinite; } @media screen and (min-width: 0\0) { .progress-animated .progress-bar-striped { animation: progress-bar-stripes 2s linear infinite; } } .progress-success[value]::-webkit-progress-value { background-color: #5cb85c; } .progress-success[value]::-moz-progress-bar { background-color: #5cb85c; } .progress-success[value]::-ms-fill { background-color: #5cb85c; } @media screen and (min-width: 0\0) { .progress-success .progress-bar { background-color: #5cb85c; } } .progress-info[value]::-webkit-progress-value { background-color: #5bc0de; } .progress-info[value]::-moz-progress-bar { background-color: #5bc0de; } .progress-info[value]::-ms-fill { background-color: #5bc0de; } @media screen and (min-width: 0\0) { .progress-info .progress-bar { background-color: #5bc0de; } } .progress-warning[value]::-webkit-progress-value { background-color: #f0ad4e; } .progress-warning[value]::-moz-progress-bar { background-color: #f0ad4e; } .progress-warning[value]::-ms-fill { background-color: #f0ad4e; } @media screen and (min-width: 0\0) { .progress-warning .progress-bar { background-color: #f0ad4e; } } .progress-danger[value]::-webkit-progress-value { background-color: #d9534f; } .progress-danger[value]::-moz-progress-bar { background-color: #d9534f; } .progress-danger[value]::-ms-fill { background-color: #d9534f; } @media screen and (min-width: 0\0) { .progress-danger .progress-bar { background-color: #d9534f; } } /*# sourceMappingURL=rc-progress.css.map */