Typography

Image Borders

<img class="img-rounded" src="/pe-services/image.jpg" />

Typography

<img class="img-circle" src="/pe-services/image.jpg" />

Typography

<img class="img-polaroid" src="/pe-services/image.jpg" />

Typography

Headings

This is Heading One (h1)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.

 

This is Heading Two (h2)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.

 

This is Heading Three (h3)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.

This is Heading Four (h4)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.

 

This is Heading Five (h5)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.

 

This is Heading Six (h6)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris convallis porta lacinia bibendum felis.

Numered blocks

<p class="pe-block"><span class="pe">01</span>Text goes here</p>

01Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.

02Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.

03Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.

<p class="pe-block second"><span class="pe">a</span>Text goes here</p>

aLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.

bLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.

cLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis viverra leo sed turpis convallis sit amet condimentum diam vehicula. Morbi suscipit nisl odio, nec sodales tellus. Aenean quis sapien suscipit mauris.

Colored Blocks

<div class=“alert“>Text goes here</div>
<div class=“alert alert-error“>Text goes here</div>
<div class=“alert alert-success“>Text goes here</div>
<div class=“alert alert-info“>Text goes here</div>

Blockquote

<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<small>John Doe</small>
</blockquote>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

John Doe

<blockquote class="pull-right">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
<small>John Doe</small>
</blockquote>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

John Doe

Unordered lists

<ul>
<-- list goes here -->
</ul>
  • Duis tincidunt nunc sit amet ipsum
  • Duis tincidunt nunc sit amet ipsum
  • Duis tincidunt nunc sit amet ipsum
    • Duis tincidunt nunc sit amet ipsum
    • Duis tincidunt nunc sit amet ipsum
    • Duis tincidunt nunc sit amet ipsum
      • Duis tincidunt nunc sit amet ipsum
      • Duis tincidunt nunc sit amet ipsum
      • Duis tincidunt nunc sit amet ipsum
<ul class="pe-custom-list">
<-- list goes here -->
</ul>
  • Duis tincidunt nunc sit amet ipsum
  • Duis tincidunt nunc sit amet ipsum
  • Duis tincidunt nunc sit amet ipsum
    • Duis tincidunt nunc sit amet ipsum
    • Duis tincidunt nunc sit amet ipsum

Ordered lists

<ol>
<-- list goes here -->
</ol>
  1. Duis tincidunt nunc sit amet ipsum
  2. Duis tincidunt nunc sit amet ipsum
  3. Duis tincidunt nunc sit amet ipsum
    1. Duis tincidunt nunc sit amet ipsum
    2. Duis tincidunt nunc sit amet ipsum
      1. Duis tincidunt nunc sit amet ipsum
      2. Duis tincidunt nunc sit amet ipsum
      3. Duis tincidunt nunc sit amet ipsum
<ol class="pe-roman">
<-- list goes here -->
</ol>
  1. Duis tincidunt nunc sit amet ipsum
  2. Duis tincidunt nunc sit amet ipsum
  3. Duis tincidunt nunc sit amet ipsum
    1. Duis tincidunt nunc sit amet ipsum
    2. Duis tincidunt nunc sit amet ipsum
      1. Duis tincidunt nunc sit amet ipsum
      2. Duis tincidunt nunc sit amet ipsum
      3. Duis tincidunt nunc sit amet ipsum
<ol class="pe-alpha">
<-- list goes here -->
</ol>
  1. Duis tincidunt nunc sit amet ipsum
  2. Duis tincidunt nunc sit amet ipsum
  3. Duis tincidunt nunc sit amet ipsum
    1. Duis tincidunt nunc sit amet ipsum
    2. Duis tincidunt nunc sit amet ipsum
      1. Duis tincidunt nunc sit amet ipsum
      2. Duis tincidunt nunc sit amet ipsum
      3. Duis tincidunt nunc sit amet ipsum

Read More Button

<p class="readmore"><a class="btn" href="#">Read more</a></p>

Read more

Glyphicon Font

<span class="icon-joomla">&nbsp</span>
icon-asterisk
icon-plus
icon-euro
icon-minus
icon-cloud
icon-envelope
icon-pencil
icon-glass
icon-music
icon-search
icon-heart
icon-star
icon-star-empty
icon-user
icon-film
icon-th-large
icon-th
icon-th-list
icon-ok
icon-remove
icon-zoom-in
icon-zoom-out
icon-off
icon-signal
icon-cog
icon-trash
icon-home
icon-file
icon-time
icon-road
icon-download-alt
icon-download
icon-upload
icon-inbox
icon-play-circle
icon-repeat
icon-refresh
icon-list-alt
icon-lock
icon-flag
icon-headphones
icon-volume-off
icon-volume-down
icon-volume-up
icon-qrcode
icon-barcode
icon-tag
icon-tags
icon-book
icon-bookmark
icon-print
icon-camera
icon-font
icon-bold
icon-italic
icon-text-height
icon-text-width
icon-align-left
icon-align-center
icon-align-right
icon-align-justify
icon-list
icon-indent-left
icon-indent-right
icon-facetime-video
icon-picture
icon-map-marker
icon-adjust
icon-tint
icon-edit
icon-share
icon-check
icon-move
icon-step-backward
icon-fast-backward
icon-backward
icon-play
icon-pause
icon-stop
icon-forward
icon-fast-forward
icon-step-forward
icon-eject
icon-chevron-left
icon-chevron-right
icon-plus-sign
icon-minus-sign
icon-remove-sign
icon-ok-sign
icon-question-sign
icon-info-sign
icon-screenshot
icon-remove-circle
icon-ok-circle
icon-ban-circle
icon-arrow-left
icon-arrow-right
icon-arrow-up
icon-arrow-down
icon-share-alt
icon-resize-full
icon-resize-small
icon-exclamation-sign
icon-gift
icon-leaf
icon-fire
icon-eye-open
icon-eye-close
icon-warning-sign
icon-plane
icon-calendar
icon-random
icon-comment
icon-magnet
icon-chevron-up
icon-chevron-down
icon-retweet
icon-shopping-cart
icon-folder-close
icon-folder-open
icon-resize-vertical
icon-resize-horizontal
icon-hdd
icon-bullhorn
icon-bell
icon-certificate
icon-thumbs-up
icon-thumbs-down
icon-hand-right
icon-hand-left
icon-hand-up
icon-hand-down
icon-circle-arrow-right
icon-circle-arrow-left
icon-circle-arrow-up
icon-circle-arrow-down
icon-globe
icon-wrench
icon-tasks
icon-filter
icon-briefcase
icon-fullscreen
icon-dashboard
icon-paperclip
icon-heart-empty
icon-link
icon-phone
icon-pushpin
icon-usd
icon-gbp
icon-sort
icon-sort-by-alphabet
icon-sort-by-alphabet-alt
icon-sort-by-order
icon-sort-by-order-alt
icon-sort-by-attributes
icon-sort-by-attributes-alt
icon-unchecked
icon-expand
icon-collapse-down
icon-collapse-up
icon-log-in
icon-flash
icon-log-out
icon-new-window
icon-record
icon-save
icon-open
icon-saved
icon-import
icon-export
icon-send
icon-floppy-disk
icon-floppy-saved
icon-floppy-remove
icon-floppy-save
icon-floppy-open
icon-credit-card
icon-transfer
icon-cutlery
icon-header
icon-compressed
icon-earphone
icon-phone-alt
icon-tower
icon-stats
icon-sd-video
icon-hd-video
icon-subtitles
icon-sound-stereo
icon-sound-dolby
icon-sound-5-1
icon-sound-6-1
icon-sound-7-1
icon-copyright-mark
icon-registration-mark
icon-cloud-download
icon-cloud-upload
icon-tree-conifer
icon-tree-deciduous

Awesome Font

<span class="fa fa-joomla">&nbsp</span>
fa-adjust
fa-adn
fa-align-center
fa-align-justify
fa-align-left
fa-align-right
fa-ambulance
fa-anchor
fa-android
fa-angellist
fa-angle-double-down
fa-angle-double-left
fa-angle-double-right
fa-angle-double-up
fa-angle-down
fa-angle-left
fa-angle-right
fa-angle-up
fa-apple
fa-archive
fa-area-chart
fa-arrow-circle-down
fa-arrow-circle-left
fa-arrow-circle-o-down
fa-arrow-circle-o-left
fa-arrow-circle-o-right
fa-arrow-circle-o-up
fa-arrow-circle-right
fa-arrow-circle-up
fa-arrow-down
fa-arrow-left
fa-arrow-right
fa-arrow-up
fa-arrows
fa-arrows-alt
fa-arrows-h
fa-arrows-v
fa-asterisk
fa-at
fa-automobile
fa-backward
fa-ban
fa-bank
fa-bar-chart
fa-bar-chart-o
fa-barcode
fa-bars
fa-beer
fa-behance
fa-behance-square
fa-bell
fa-bell-o
fa-bell-slash
fa-bell-slash-o
fa-bicycle
fa-binoculars
fa-birthday-cake
fa-bitbucket
fa-bitbucket-square
fa-bitcoin
fa-bold
fa-bolt
fa-bomb
fa-book
fa-bookmark
fa-bookmark-o
fa-briefcase
fa-btc
fa-bug
fa-building
fa-building-o
fa-bullhorn
fa-bullseye
fa-bus
fa-cab
fa-calculator
fa-calendar
fa-calendar-o
fa-camera
fa-camera-retro
fa-car
fa-caret-down
fa-caret-left
fa-caret-right
fa-caret-square-o-down
fa-caret-square-o-left
fa-caret-square-o-right
fa-caret-square-o-up
fa-caret-up
fa-cc
fa-cc-amex
fa-cc-discover
fa-cc-mastercard
fa-cc-paypal
fa-cc-stripe
fa-cc-visa
fa-certificate
fa-chain
fa-chain-broken
fa-check
fa-check-circle
fa-check-circle-o
fa-check-square
fa-check-square-o
fa-chevron-circle-down
fa-chevron-circle-left
fa-chevron-circle-right
fa-chevron-circle-up
fa-chevron-down
fa-chevron-left
fa-chevron-right
fa-chevron-up
fa-child
fa-circle
fa-circle-o
fa-circle-o-notch
fa-circle-thin
fa-clipboard
fa-clock-o
fa-close
fa-cloud
fa-cloud-download
fa-cloud-upload
fa-cny
fa-code
fa-code-fork
fa-codepen
fa-coffee
fa-cog
fa-cogs
fa-columns
fa-comment
fa-comment-o
fa-comments
fa-comments-o
fa-compass
fa-compress
fa-copy
fa-copyright
fa-credit-card
fa-crop
fa-crosshairs
fa-css3
fa-cube
fa-cubes
fa-cut
fa-cutlery
fa-dashboard
fa-database
fa-dedent
fa-delicious
fa-desktop
fa-deviantart
fa-digg
fa-dollar
fa-dot-circle-o
fa-download
fa-dribbble
fa-dropbox
fa-drupal
fa-edit
fa-eject
fa-ellipsis-h
fa-ellipsis-v
fa-empire
fa-envelope
fa-envelope-o
fa-envelope-square
fa-eraser
fa-eur
fa-euro
fa-exchange
fa-exclamation
fa-exclamation-circle
fa-exclamation-triangle
fa-expand
fa-external-link
fa-external-link-square
fa-eye
fa-eye-slash
fa-eyedropper
fa-facebook
fa-facebook-square
fa-fast-backward
fa-fast-forward
fa-fax
fa-female
fa-fighter-jet
fa-file
fa-file-archive-o
fa-file-audio-o
fa-file-code-o
fa-file-excel-o
fa-file-image-o
fa-file-movie-o
fa-file-o
fa-file-pdf-o
fa-file-photo-o
fa-file-picture-o
fa-file-powerpoint-o
fa-file-sound-o
fa-file-text
fa-file-text-o
fa-file-video-o
fa-file-word-o
fa-file-zip-o
fa-files-o
fa-film
fa-filter
fa-fire
fa-fire-extinguisher
fa-flag
fa-flag-checkered
fa-flag-o
fa-flash
fa-flask
fa-flickr
fa-floppy-o
fa-folder
fa-folder-o
fa-folder-open
fa-folder-open-o
fa-font
fa-forward
fa-foursquare
fa-frown-o
fa-futbol-o
fa-gamepad
fa-gavel
fa-gbp
fa-ge
fa-gear
fa-gears
fa-gift
fa-git
fa-git-square
fa-github
fa-github-alt
fa-github-square
fa-gittip
fa-glass
fa-globe
fa-google
fa-google-plus
fa-google-plus-square
fa-google-wallet
fa-graduation-cap
fa-group
fa-h-square
fa-hacker-news
fa-hand-o-down
fa-hand-o-left
fa-hand-o-right
fa-hand-o-up
fa-hdd-o
fa-header
fa-headphones
fa-heart
fa-heart-o
fa-history
fa-home
fa-hospital-o
fa-html5
fa-ils
fa-image
fa-inbox
fa-indent
fa-info
fa-info-circle
fa-inr
fa-instagram
fa-institution
fa-ioxhost
fa-italic
fa-joomla
fa-jpy
fa-jsfiddle
fa-key
fa-keyboard-o
fa-krw
fa-language
fa-laptop
fa-lastfm
fa-lastfm-square
fa-leaf
fa-legal
fa-lemon-o
fa-level-down
fa-level-up
fa-life-bouy
fa-life-buoy
fa-life-ring
fa-life-saver
fa-lightbulb-o
fa-line-chart
fa-link
fa-linkedin
fa-linkedin-square
fa-linux
fa-list
fa-list-alt
fa-list-ol
fa-list-ul
fa-location-arrow
fa-lock
fa-long-arrow-down
fa-long-arrow-left
fa-long-arrow-right
fa-long-arrow-up
fa-magic
fa-magnet
fa-mail-forward
fa-mail-reply
fa-mail-reply-all
fa-male
fa-map-marker
fa-maxcdn
fa-meanpath
fa-medkit
fa-meh-o
fa-microphone
fa-microphone-slash
fa-minus
fa-minus-circle
fa-minus-square
fa-minus-square-o
fa-mobile
fa-mobile-phone
fa-money
fa-moon-o
fa-mortar-board
fa-music
fa-navicon
fa-newspaper-o
fa-openid
fa-outdent
fa-pagelines
fa-paint-brush
fa-paper-plane
fa-paper-plane-o
fa-paperclip
fa-paragraph
fa-paste
fa-pause
fa-paw
fa-paypal
fa-pencil
fa-pencil-square
fa-pencil-square-o
fa-phone
fa-phone-square
fa-photo
fa-picture-o
fa-pie-chart
fa-pied-piper
fa-pied-piper-alt
fa-pinterest
fa-pinterest-square
fa-plane
fa-play
fa-play-circle
fa-play-circle-o
fa-plug
fa-plus
fa-plus-circle
fa-plus-square
fa-plus-square-o
fa-power-off
fa-print
fa-puzzle-piece
fa-qq
fa-qrcode
fa-question
fa-question-circle
fa-quote-left
fa-quote-right
fa-ra
fa-random
fa-rebel
fa-recycle
fa-reddit
fa-reddit-square
fa-refresh
fa-remove
fa-renren
fa-reorder
fa-repeat
fa-reply
fa-reply-all
fa-retweet
fa-rmb
fa-road
fa-rocket
fa-rotate-left
fa-rotate-right
fa-rouble
fa-rss
fa-rss-square
fa-rub
fa-ruble
fa-rupee
fa-save
fa-scissors
fa-search
fa-search-minus
fa-search-plus
fa-send
fa-send-o
fa-share
fa-share-alt
fa-share-alt-square
fa-share-square
fa-share-square-o
fa-shekel
fa-sheqel
fa-shield
fa-shopping-cart
fa-sign-in
fa-sign-out
fa-signal
fa-sitemap
fa-skype
fa-slack
fa-sliders
fa-slideshare
fa-smile-o
fa-soccer-ball-o
fa-sort
fa-sort-alpha-asc
fa-sort-alpha-desc
fa-sort-amount-asc
fa-sort-amount-desc
fa-sort-asc
fa-sort-desc
fa-sort-down
fa-sort-numeric-asc
fa-sort-numeric-desc
fa-sort-up
fa-soundcloud
fa-space-shuttle
fa-spinner
fa-spoon
fa-spotify
fa-square
fa-square-o
fa-stack-exchange
fa-stack-overflow
fa-star
fa-star-half
fa-star-half-empty
fa-star-half-full
fa-star-half-o
fa-star-o
fa-steam
fa-steam-square
fa-step-backward
fa-step-forward
fa-stethoscope
fa-stop
fa-strikethrough
fa-stumbleupon
fa-stumbleupon-circle
fa-subscript
fa-suitcase
fa-sun-o
fa-superscript
fa-support
fa-table
fa-tablet
fa-tachometer
fa-tag
fa-tags
fa-tasks
fa-taxi
fa-tencent-weibo
fa-terminal
fa-text-width
fa-th
fa-th-large
fa-th-list
fa-thumb-tack
fa-thumbs-down
fa-thumbs-o-down
fa-thumbs-o-up
fa-thumbs-up
fa-ticket
fa-times
fa-times-circle
fa-times-circle-o
fa-tint
fa-toggle-down
fa-toggle-left
fa-toggle-off
fa-toggle-on
fa-toggle-right
fa-toggle-up
fa-trash
fa-trash-o
fa-tree
fa-trello
fa-trophy
fa-truck
fa-try
fa-tty
fa-tumblr
fa-tumblr-square
fa-turkish-lira
fa-twitch
fa-twitter
fa-twitter-square
fa-umbrella
fa-underline
fa-undo
fa-university
fa-unlink
fa-unlock
fa-unlock-alt
fa-unsorted
fa-upload
fa-usd
fa-user
fa-user-md
fa-users
fa-video-camera
fa-vimeo-square
fa-vine
fa-vk
fa-volume-down
fa-volume-off
fa-volume-up
fa-warning
fa-wechat
fa-weibo
fa-weixin
fa-wheelchair
fa-wifi
fa-windows
fa-won
fa-wordpress
fa-wrench
fa-xing
fa-xing-square
fa-yahoo
fa-yelp
fa-yen
fa-youtube
fa-youtube-play
fa-youtube-square

Social

<a class="facebook" href="#"><i>?</i></a>
<a class="twitter" href="#"><i>?</i></a>
<a class="google-plus" href="#"><i>?</i></a>
<a class="youtube" href="#"><i>?</i></a>

Box1

<div class="box1">
<span class="icon-search"></span>
<p><a href="?page_id=314">Advanced</a></p>
<p>SEARCH</p>
</div>

Advanced

SEARCH

Box2

<div class="box2">
<span class="icon-pencil"></span>
<p><a href="?page_id=707">Submit Your</a></p>
<p>RECIPE</p>
</div>