Theme Elements UI

Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Example:-

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

Paragraph

Lorem ipsum dolor sit amet, feugiat delicata liberavisse id cum, no quo maiorum intellegebat, liber regione eu sit. Mea cu case ludus integre, vide viderer eleifend ex mea. His at soluta regione diceret, cum et atqui placerat petentium. Per amet nonumy periculis ei. Lorem ipsum dolor sit amet, feugiat delicata liberavisse id cum, no quo maiorum intellegebat, liber regione eu sit.

Example:-

<p>your text here...</p>

Blockquote

Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem.

Example:-

<blockquote>your qute here....</blockquote>

Color Variables

THIS IS EXAMPLE OF CUSTOM FONT STYLE

Lorem ipsum dolor sit amet, feugiat CUSTOM id cum, no quo

Lorem ipsum dolor sit amet, feugiat delicata liberavisse id cum, no quo maiorum intellegebat, liber regione eu sit.

Exampls:-

Custom style for text customization.

use class="red" For Red color between text
use class="Grey" For Grey color between text
use class="orange" For default theme Color between text

Default unordered List

  • H3 ive up feat. kate bush
  • Lenovo ideapad y510p
  • Computers & accessories
  • Amazon website connected

Example:-

<ul>
<li>H3 ive up feat. kate bush</li>
<li>Lenovo ideapad y510p</li>
</ul>

Default ordered List

  1. H3 ive up feat. kate bush
  2. Lenovo ideapad y510p
  3. Computers & accessories
  4. Amazon website connected

Example:-

<ol>
<li>H3 ive up feat. kate bush</li>
<li>Lenovo ideapad y510p</li>
</ol>

Default Links

Exampls: Inline

<a href="#">Content Link </a>

Example: Inline Block

<a href="#" class="blk_anchr">"Block Link" </a>

Buttons

Example: Line Button

<input type="text" class="line-btn" value="Submit" name="">
<button class="line-btn">Use on Button</button>
<a href="#" class="line-btn">Use on "Anchor"</a>

Example: Fill Button

<input type="text" class="fill-btn" value="Submit" name="">
<button class="fill-btn">Use on Button</button>
<a href="#" class="fill-btn">Use on "Anchor"</a>

Example: Inverse Button

<input type="text" class="btn_invrs" value="Submit" name="">
<button class="btn_invrs">Use on Button</button>
<a href="#" class="btn_invrs">Use on "Anchor"</a>

Default Table

Content Content Content
Content Content Content
Content Content Content
Content Content Content

Example:-

<table>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

Theme Design Table

Content Content Content
Content Content Content
Content Content Content

Example:-

<table class="border_table">
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

Images

For default design
<img src="">
Use Border on image
<img src="" class="set_border">
Use Frame on image
<img src="" class="set_frame">
Use Rounded corner image
<img src="" class="round_corner">

Form Elements

Exampls: Default form content

For default use class="form-control"

<input type="text" class="form-control">
<select class="form-control">
    <option>--Select Value--</option>
    <option>Option One</option>
</select>
<textarea class="form-control" ></textarea>

Form Elements

Exampls: Popup Form content

For such use class="form_cls"

<input type="text" class="form_cls">
<select class="form_cls">
    <option>--Select Value--</option>
    <option>Option One</option>
</select>
<textarea class="form_cls" ></textarea>

Accordion

Use Bootstrap Accordion with parent div class "block_accor_design"

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.
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.
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.

Example:-

<div class="block_accor_design">
  <div class="panel-group" id="accordionex" role="tablist" aria-multiselectable="true">
    <div class="panel panel-default">
      <div class="panel-heading" role="tab" id="headingOneex">
        <h4 class="panel-title">
          <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOneex" aria-expanded="true" aria-controls="collapseOne">
Collapsible Group Item #1           </a>
        </h4>
      </div>
     <div id="collapseOneex" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
      <div class="panel-body">
lorema ipsum....       </div>
     </div>
    </div>
  </div>
</div>

Accordion

Use Bootstrap Accordion with parent div class "nrml_accor_design"

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.
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.
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.

Example:-

<div class="nrml_accor_design">
  <div class="panel-group" id="accordionex" role="tablist" aria-multiselectable="true">
    <div class="panel panel-default">
      <div class="panel-heading" role="tab" id="headingOneex">
        <h4 class="panel-title">
          <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOneex" aria-expanded="true" aria-controls="collapseOne">
Collapsible Group Item #1           </a>
        </h4>
      </div>
     <div id="collapseOneex" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
      <div class="panel-body">
lorema ipsum....       </div>
     </div>
    </div>
  </div>
</div>

Contacto

Mortgage Bankers School

Teléfono: 787-753-9237 / Fax: 787-753-9239
Correo electrónico: mbambs@mbaofpr.com

Facebook: fb.com/MBSOFPR
Dirección Física:
Calle Haití # 113
Hato Rey, Puerto Rico