Shortcodes

Please follow this link to view all bootstrap 4 framework classes

Accordion

Collapsible Group Item #1

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.

Collapsible Group Item #2

Collapsible Group Item #3

Tabs

Home Profile Messages Settings

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Pulvinar fames non phasellus dignissim imperdiet sociosqu magna dictum gravida, tincidunt mattis mauris felis ante montes rhoncus semper, iaculis nisl facilisis malesuada maecenas pharetra metus risus

Ultrices nunc aptent lacus sodales sagittis amet urna viverra ut, elementum habitant at congue rhoncus ultricies nostra vitae bibendum, sed libero vulputate mus dictumst felis imperdiet enim.

Backgrounds

.bg-primary-lighten

.bg-primary

.bg-primary-darken

.bg-secondary-lighten

.bg-secondary

.bg-secondary-darken

.bg-success-lighten

.bg-success

.bg-success-darken

.bg-info-lighten

.bg-info

.bg-info-darken

.bg-warning-lighten

.bg-warning

.bg-warning-darken

.bg-danger-lighten

.bg-danger

.bg-danger-darken

.bg-third-lighten

.bg-third

.bg-third-darken

.bg-fourth-lighten

.bg-fourth

.bg-fourth-darken

.bg-fifth-lighten

.bg-fifth

.bg-fifth-darken

.bg-light-lighten

.bg-light

.bg-light-darken

.bg-dark-lighten

.bg-dark

.bg-dark-darken

.bg-gray-100

.bg-gray-200

.bg-gray-300

.bg-gray-400

.bg-gray-500

.bg-gray-600

.bg-gray-700

.bg-gray-800

.bg-gray-900

Dividers

<hr />

<hr class="border-primary" />

<hr class="border-secondary" />

<hr class="border-success" />

<hr class="border-info" />

<hr class="border-warning" />

<hr class="border-third" />

<hr class="border-fourth" />

<hr class="border-fifth" />

<hr class="border-light" />

<hr class="border-dark" />

Alerts

<div class="alert alert-primary" role="alert"> ... </div>

This is a primary alert-check it out!

<div class="alert alert-secondary" role="alert"> ... </div>

This is a secondary alert-check it out!

<div class="alert alert-success" role="alert"> ... </div>

This is a success alert-check it out!

<div class="alert alert-danger" role="alert"> ... </div>

This is a danger alert-check it out!

<div class="alert alert-warning" role="alert"> ... </div>

This is a warning alert-check it out!

<div class="alert alert-info" role="alert"> ... </div>

This is a info alert-check it out!

<div class="alert alert-third" role="alert"> ... </div>

This is a third alert-check it out!

<div class="alert alert-fourth" role="alert"> ... </div>

This is a fourth alert-check it out!

<div class="alert alert-fifth" role="alert"> ... </div>

This is a fifth alert-check it out!

<div class="alert alert-light" role="alert"> ... </div>

This is a light alert-check it out!

<div class="alert alert-dark" role="alert"> ... </div>

This is a dark alert-check it out!


      <div class="alert alert-warning alert-dismissible fade show" role="alert"> 

      <button type="button" class="close" data-dismiss="alert" aria-label="Close"> 

      <span aria-hidden="true">&times;</span> 

      </button> 

      </div>

Holy guacamole! You should check in on some of those fields below.

Progress

<div class="progress"> <div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div> </div>

<div class="progress"> <div class="progress-bar bg-success" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div> </div>

<div class="progress"> <div class="progress-bar bg-info" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div> </div>

<div class="progress"> <div class="progress-bar bg-warning" role="progressbar" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div> </div>

<div class="progress"> <div class="progress-bar bg-danger" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div> </div>

Websites Built to Give your Business a Rocket Boost

Website

Information

Services

Contact Info

Inroads

205-B Broadway Street
Frederick, MD 21701

301-473-9750
Email Us!