Hometypograpy

typograpy

Typography

This is a Heading 1

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.

This is a Heading 2

This is a Heading 3

This is a Heading 4

This is a Heading 5

This is a Heading 6

Below is a sample of <pre> or code class

#right{
  width: 180px;
  float: right;
  color: #EEEEEE;
}

Lorem Ipsum is simply dummy text of the printing and typesetting industry.standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

Stickynote and Download

This is a sample clip note. Use class stickynote for tag p to form a clip note!

This is a sample download. Use class download for tag p to form a download!

Icon styles example

This is a sample p with class error

This is a sample p with class warn

This is a sample p with class tips

This is a sample p with class help

This is a sample p with class info

This is a sample p with class email

This is a sample p with class print

This is a sample p with class rss

This is a sample p with class save

This is a sample p with class lock

This is a sample p with class user

This is a sample p with class new

This is a sample p with class house

This is a sample p with class tag

Unordered list examples

This is a sample unordered list

ul with class arrow

ul with class arrow-2

ul with class star

ul with class rss

This is a sample ordered list

ul with class check

ul with class minus

ul with class add

ul with class delete

This is a Magazine Style Drop Cap. 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.

Legend style

Lorem ipsum dolor sit amet consectetuer at elit augue In lorem. Quis Donec libero at Vivamus mi fringilla neque commodo at vitae. A mauris risus consequat ac egestas netus est Vestibulum Curabitur consectetuer.

01Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

02Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

03Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

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!

Block1 example

This is a div with class sp-block1
Lorem ipsum dolor sit amet, sic genero nomine Piscatore mihi. Dicis Deducitur potest flens praemio quod non dum veniens indica enim.

Block2 example

This is a div with class sp-block2
Lorem ipsum dolor sit amet, sic genero nomine Piscatore mihi. Dicis Deducitur potest flens praemio quod non dum veniens indica enim.

Block3 example

This is a div with class sp-block3
Lorem ipsum dolor sit amet, sic genero nomine Piscatore mihi. Dicis Deducitur potest flens praemio quod non dum veniens indica enim.

Block4 example

This is a div with class sp-block4
Lorem ipsum dolor sit amet, sic genero nomine Piscatore mihi. Dicis Deducitur potest flens praemio quod non dum veniens indica enim.

Block5 example

This is a div with class sp-block5
Lorem ipsum dolor sit amet, sic genero nomine Piscatore mihi. Dicis Deducitur potest flens praemio quod non dum veniens indica enim.

Block6 example

This is a div with class sp-block6
Lorem ipsum dolor sit amet, sic genero nomine Piscatore mihi. Dicis Deducitur potest flens praemio quod non dum veniens indica enim.

Block7 example

This is a div with class sp-block7
Lorem ipsum dolor sit amet, sic genero nomine Piscatore mihi. Dicis Deducitur potest flens praemio quod non dum veniens indica enim.

Inline labels

Labels	Markup
Default	`<span class="sp-label">Default</span>`
Success	`<span class="sp-label label-success">Success</span>`
Warning	`<span class="sp-label label-warning">Warning</span>`
Important	`<span class="sp-label label-important">Important</span>`
Info	`<span class="sp-label label-info">Info</span>`
Inverse	`<span class="sp-label label-inverse">Inverse</span>`

Badges

Name	Example	Markup
Default	1	`<span class="sp-badge">1</span>`
Success	2	`<span class="sp-badge badge-success">2</span>`
Warning	4	`<span class="sp-badge badge-warning">4</span>`
Important	6	`<span class="sp-badge badge-important">6</span>`
Info	8	`<span class="sp-badge badge-info">8</span>`
Inverse	10	`<span class="sp-badge badge-inverse">10</span>`

Alert Warning

Warning! Best check yo self, you're not looking too good.

Alert Danger

Danger! Best check yo self, you're not looking too good.

Alert Success

Success! Best check yo self, you're not looking too good.

Alert Information

Information! Best check yo self, you're not looking too good.

Tables examples

Table with data on the right head side

+545

Column 1	Column 2	Column 3	Column 4
Row 1	Row 1	Row 1	Row 1
Row 2	Row 2	Row 2	Row 2
Row 3	Row 3	Row 3	Row 3
Row 4	Row 4	Row 4	Row 4
Row 5	Row 5	Row 5	Row 5

شرکت پادگین طب