Articles

Typography 1

This page presents most of typographical aspects of Yt Framework. 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. 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.

This is an Heading 3

This is an Heading 4

This is an Heading 5

Lists Style

This is a sample Ordered List.
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur

This is a sample Disc List.
Lorem ipsum dolor sit amet consectetur
Lorem ipsum dolor sit amet consectetur

This is a sample Arrow list.
Use <ul class="yt-typo-list list-arrow"><li><span class="icon"> </span>List's content goes here!</li></ul>
This is a sample Arrowlist.

This is a sample Star list.
Use <ul class="yt-typo-list list-star"><li><span class="icon"> </span>List's content goes here!</li></ul>
This is a sample Starlist.

This is a sample Home list.
Use <ul class="yt-typo-list list-home"><li><span class="icon"> </span>List's content goes here!</li></ul>
This is a sample Checklist.

This is a sample Cal list.
Use <ul class="yt-typo-list list-cal"><li><span class="icon"> </span>List's content goes here!</li></ul>
This is a sample Checklist.

This is a sample Check list.
Use <ul class="yt-typo-list list-check"><li><span class="icon"> </span>List's content goes here!</li></ul>
This is a sample Checklist.

This is a sample Email list.
Use <ul class="yt-typo-list list-email"><li><span class="icon"> </span>List's content goes here!</li></ul>
This is a sample Checklist.

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

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

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

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

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

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

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

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

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

Drop cap symbol

Ihis is special drop cap symbol styling for magazine / newspaper text paragraph. Vestibulum elementum consectetur nunc sed auctor. Phasellus sed nulla enim, vitae dignissim augue.

Boxes Style

This is a sticky. Use <p class="box-sticky">Your clip note goes here!</p> to create a clip note!

This is a download box. Use <p class="box-download">Your download goes here!</p> to create a download box!

Bubbles

<div class="yt-typo-bubble bubble-l1 clearfix">
<div class="yt-typo-box-ct">
<div class="yt-typo-box tl"> </div> <div class="yt-typo-box tr"> </div> <div class="yt-typo-box bl"> </div> <div class="yt-typo-box br"> </div>
Buble's content goes here!
</div>
<span class="yt-typo-arrow"> </span> <span class="yt-typo-author">Put author name here</span>
</div>

Put author name here

This is a sample Bubble. Use <div class="yt-typo-bubble1"> <div> <div> <div> <div> <div> Your Bubble goes here! </div> </div> </div> </div> </div><span class="author">ROUNDED SPEECH BUBBLE </span>

ROUNDED SPEECH BUBBLE

This is a sample Bubble. Use <div class="yt-typo-bubble2"> <div> <div> <div> <div> <div> Your Bubble goes here! </div> </div> </div> </div> </div><span class="author">ROUNDED SPEECH BUBBLE</span>

SQUARE SPEECH BUBBLE

This is a sample Bubble. Use <div class="yt-typo-bubble3"> <div> <div> <div> <div> <div> Your Bubble goes here! </div> </div> </div> </div> </div><span class="author">ROUNDED NOTE BUBBLE</span>

ROUNDED THINKING BUBBLE

This is a sample Bubble. Use <div class="yt-typo-bubble4"> <div> <div> <div> <div> <div> Your Bubble goes here! </div> </div> </div> </div> </div><span class="author">ROUNDED NOTE BUBBLE</span>

SQUARE THINKING BUBBLE

mission

To guide you throughout the process of choosing the right career path, selecting the right institution and visa application based on your academic/financial abilities.
To act as a bridge between you and your institution of choice within our network.
To consider your education interest at all times