Progress Bar

Container

Progress bar has two different visual containers: default, which is the main container for progress bar and all the other elements; and boxed, which adds a border around progress bar to visually highlight it.

Default
50%
<div class="sui-progress">
	<!-- Place progress elements here -->
</div>
Boxed
50%
Status...
<div class="sui-progress-block">

	<div class="sui-progress">
		<!-- Place progress elements here -->
	</div>

</div>