JA Olyra

Home About Us Community Contact Us
 
Highlight

Blog style

Blog style Lorem ipsum dolor sit amet consectetuer Vivamus rhoncus nunc augue Aenean. Lorem ipsum.

Icon menu

Blog style Lorem ipsum dolor sit amet consectetuer Vivamus rhoncus nunc augue Aenean. Lorem ipsum.

My Shapes

Blog style Lorem ipsum dolor sit amet consectetuer Vivamus rhoncus nunc augue Aenean. Lorem ipsum..

Spotlight

Lorem ipsum dolor sit amet consectetuer Vivamus rhoncus nunc augue Aenean. Fermentum semper quis neque consectetuer. Fermentum semper quis neque consectetuer
Home arrow Typography
Olyra's Typography PDF Print E-mail
Wednesday, 28 February 2007

This page presents most of typographical aspects of JA Rochea. Make your readers happy with great Typography and User Experience!

This is an Heading 1

Lorem tortor Curabitur urna interdum Maecenas ut felis Sed euismod id. Congue Quisque augue elit dolor nibh id lobortis egestas tristique fringilla. Laoreet elit.

This is an Heading 2

Wisi sed pede Phasellus Vestibulum elit consequat consequat eu pellentesque metus. Laoreet Vestibulum pharetra pede mattis nunc dapibus id magna a dictumst.

Below is a sample of <pre> or <div class="code">

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

This is an Heading 3

Wisi sed pede Phasellus Vestibulum elit consequat consequat eu pellentesque metus. Laoreet Vestibulum pharetra pede mattis nunc dapibus id magna a dictumst. Nunc cursus sem et pretium sapien eget consectetuer malesuada Phasellus Curabitur.

  1. This is a sample Ordered List.
  2. Lorem ipsum dolor sit amet consectetuer.
  3. Condimentum quis.
  4. Congue Quisque augue elit dolor nibh.

This is an Heading 4

Wisi sed pede Phasellus Vestibulum elit consequat consequat eu pellentesque metus. Laoreet Vestibulum pharetra pede mattis nunc dapibus id magna a dictumst. Nunc cursus sem et pretium sapien eget consectetuer malesuada Phasellus Curabitur.

  • This is a sample Unordered List.
  • Condimentum quis.
  • Congue Quisque augue elit dolor.
  • Nunc cursus sem et pretium sapien eget.
  • This is a sample Check list. Interdum Vestibulum Sed Lorem eu felis leo Nunc dui id feugiat.
  • Dolor Curabitur Nam Nulla augue id iaculis a nec Cum at.
  • Lorem et nunc congue pede auctor condimentum habitasse rutrum nunc Mauris. Gravida id Aenean id condimentum nibh vitae montes sagittis malesuada et.
  • Nunc cursus sem et pretium sapien eget.
This is a sample Bubble. Use <div class="bubble1"> <div> <div> <div> <div> Your Bubble goes here! </div> </div> </div> </div>Bubble </div>
ROUNDED SPEECH BUBBLE.
This is a sample Bubble. Use <div class="bubble2"> <div> Your Bubble goes here! </div>Bubble </div>
SQUARE SPEECH BUBBLE.
This is a sample Bubble. Use <div class="bubble3"> <div> <div> <div> <div> Your Bubble goes here! </div> </div> </div> </div>Bubble </div>
ROUNDED THINKING BUBBLE.
This is a sample Bubble. Use <div class="bubble4"> <div> Your Bubble goes here! </div>Bubble </div>
SQUARE THINKING BUBBLE.

This is a sample sticky note. Use <div class="stickynote"><p>Your sticky note goes here!</p></div> to form a sticky note!

This is a sample pin note. Use <div class="pinnote"><p>Your clip note goes here!</p></div> to form a pin note!

This is a sample clip note. Use <div class="contact"><p>Your clip note goes here!</p></div> to form a clip note!

This is a sample Blockquote. Use <blockquote>Your quote goes here!</blockquote> to form a quote!

This is a sample Blockquote. Use <blockquote><p class="quote">Your quote goes here!</p></blockquote> to form a quote!

This is a sample Blockquote. Use <div class="quote-grey"><blockquote>Your quote goes here!</blockquote></div> to form a quote!

01This is a sample block number. Use <p class="blocknumber"><span class="bignumber">01.</span>Your content goes here!</p> to form a block number!

02This is a sample block number. Use <p class="blocknumber"><span class="bignumber">02.</span>Your content goes here!</p> to form a block number!

03This is a sample block number. Use <p class="blocknumber"><span class="bignumber">03.</span>Your content goes here!</p> to form a block number!

This is a sample error message. Use <p class="error">Your error message goes here!</p>.

This is a sample info message. Use <p class="message">Your info message goes here!</p>.

This is a sample tips message. Use <p class="tips">Your tips goes here!</p>.

This is a highlight phrase. Use <span class="highlight">Your highlight phrase goes here!</span>.

This is a Magazine Style Drop Cap. The first letter in this paragraph is big. JA Rochea bring into your Jooomla template the magazine drop cap technique and CSS2 includes the first-letter pseudo class. In all fairness to the paragraph itself we probably should type enough to see how it looks when it is surrounded by its textual friends by using more words.

This is a Magazine Style Drop Cap. The first letter in this paragraph is big. JA Rochea bring into your Jooomla template the magazine drop cap technique and CSS2 includes the first-letter pseudo class. In all fairness to the paragraph itself we probably should type enough to see how it looks when it is surrounded by its textual friends by using more words.

 

Default J! Menu

Home
Typography
Navigation
Layout

Login Form






Lost Password?

Who's Online

We have 1 guest online

Features

Et Sed libero eu rutrum sit nibh elit quis aliquet commodo. Elit eget sem urna feugiat et eget tincidunt massa congue Proin.

Statistics

OS: Linux d
PHP: 5.2.6
MySQL: 4.1.22-standard
Time: 04:38
Caching: Disabled
GZIP: Disabled
Members: 1
News: 16
Web Links: 5

Very cool! design

Lorem ipsum dolor sit amet consectetuer Vivamus rhoncus nunc augue Aenean. Fermentum semper quis neque consectetuer.

Polls

JA Olyra - What's best?
 

[+]
  • Narrow screen resolution
  • Wide screen resolution
  • Auto width resolution
  • Increase font size
  • Decrease font size
  • Default font size
  • default color
  • blue color
  • green color