Social Icons

delicious digg dribbble googlebuzz googleplus lastfm linkedin mobypicture plixi skype stubleupon tumbler vimeo youtube
<a class="icon delicious" href="#">delicious</a>
<a class="icon digg" href="#">digg</a>
<a class="icon dribbble" href="#">dribbble</a>
<a class="icon facebook" href="#">facebook</a>
<a class="icon googlebuzz" href="#">googlebuzz</a>
<a class="icon googleplus" href="#">googleplus</a>
<a class="icon lastfm" href="#">lastfm</a>
<a class="icon linkedin" href="#">linkedin</a>
<a class="icon mobypicture" href="#">mobypicture</a>
<a class="icon plixi" href="#">plixi</a>
<a class="icon skype" href="#">skype</a>
<a class="icon stubleupon" href="#">stubleupon</a>
<a class="icon tumbler" href="#">tumbler</a>
<a class="icon twitter" href="#">twitter</a>
<a class="icon vimeo" href="#">vimeo</a>
<a class="icon youtube" href="#">youtube</a>

Videos

Standard video


<iframe width="560" height="315" src="http://www.youtube.com/embed/v_GUm4aOUiM" frameborder="0" allowfullscreen></iframe>


Video flexible (try resize window)


<div class="flexible-video-wrapper">
<iframe width="560" height="315" src="http://www.youtube.com/embed/v_GUm4aOUiM" frameborder="0" allowfullscreen></iframe>
</div>


Video in lightbox


<a href="http://www.youtube.com/watch?v=v_GUm4aOUiM" rel="prettyPhoto"><img src="images/demo-image1.jpg" alt="" /></a>

Typography

Heading and titles


This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5
This is heading 6

This is title 1

<h1 class="title1">This is title 1</h1>


This is heading 1

<h1 class="title2">This is title 2</h1>




Highlights


Nullam vitae velit in felis hendrerit cursus at a leo. Morbi vitae lorem nec urna bibendum malesuada. Aliquam ultricies fermentum lacus fermentum lacus scelerisque gravida. Vivamus imperdiet elit vitae mauris adipiscing vitae semper enim suscipit. Vestibulum suscipit metus non mi condimentum eget commodo est commodo. Aliquam erat volutpat. Curabitur feugiat, eros nec ultrices sollicitudin pellentesque dapibus, sapien ipsum condimentum diam, elementum lobortis sapien eros a est. Curabitur et orci id felis ultrices sollicitudin. Ut varius aliquet sagittis. Curabitur est quam, consequat non mollis nec, varius in metus.

<span class="highlight1">some text here...</span>
<span class="highlight2">some text here...</span>
<span class="highlight3">some text here...</span>


Dropcaps


1 Bibendum molestie fermentum. Phasellus a enim tincidunt velit vel tellus hendrerit ornare. Sed a eleifend orci. Morbi dignissim elementum urna et ultrices. Donec sodales turpis a enim malesuada iaculis dapibus lectus bibendum.

<p><span class="drop1">1</span> 
Some text here...</p>

2 Bibendum molestie fermentum. Phasellus a enim tincidunt velit vel tellus hendrerit ornare. Sed a eleifend orci. Morbi dignissim elementum urna et ultrices. Donec sodales turpis a enim malesuada iaculis dapibus lectus bibendum.

<p><span class="drop2">2</span>
Some text here...</p>

3 Bibendum molestie fermentum. Phasellus a enim tincidunt velit vel tellus hendrerit ornare. Sed a eleifend orci. Morbi dignissim elementum urna et ultrices. Donec sodales turpis a enim malesuada iaculis dapibus lectus bibendum.

<p><span class="drop3">3</span> 
Some text here...</p>


Quotes


In vitae purus ligula, in venenatis ipsum. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Suspendisse potenti. Aliquam mattis lacinia feugiat. Duis aliquam odio vel nunc adipiscing non sagittis est tempus. Suspendisse vulputate facilisis aliquam. Aliquam mattis lacinia feugiat. Duis aliquam odio vel nunc adipiscing non sagittis est tempus. Phasellus nec molestie erat. Vivamus vitae posuere leo. Morbi felis urna, bibendum quis consectetur a, suscipit et enim. Suspendisse aliquet scelerisque gravida. Pellentesque volutpat tristique commodo. Phasellus tincidunt mattis sagittis. Proin vulputate nisi at lacus pulvinar nec mollis magna auctor. Donec nec aliquam nisi

<p><blockquote class="quote-left">Quote text here...</blockquote>
Paragraph text here...</p>

In vitae purus ligula, in venenatis ipsum. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Suspendisse potenti. Aliquam mattis lacinia feugiat. Duis aliquam odio vel nunc adipiscing non sagittis est tempus. Suspendisse vulputate facilisis aliquam. Aliquam mattis lacinia feugiat. Duis aliquam odio vel nunc adipiscing non sagittis est tempus. Phasellus nec molestie erat. Vivamus vitae posuere leo. Morbi felis urna, bibendum quis consectetur a, suscipit et enim. Suspendisse aliquet scelerisque gravida. Pellentesque volutpat tristique commodo. Phasellus tincidunt mattis sagittis. Proin vulputate nisi at lacus pulvinar nec mollis magna auctor. Donec nec aliquam nisi

<p><blockquote class="quote-right">Quote text here...</blockquote>
Paragraph text here...</p>
In vitae purus ligula, in venenatis ipsum. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<blockquote>Quote text here...</blockquote>

Images

Normal images

Nullam vitae velit in felis hendrerit cursus at a leo. Morbi vitae lorem nec urna bibendum malesuada. Aliquam ultricies fermentum lacus scelerisque gravida. Vivamus imperdiet elit vitae mauris adipiscing vitae semper enim suscipit. Vestibulum suscipit metus non mi condimentum eget commodo est commodo. Aliquam erat volutpat. Curabitur feugiat, eros nec pellentesque dapibus, sapien ipsum condimentum diam, elementum lobortis sapien eros a est. Curabitur et orci id felis ultrices sollicitudin. Ut varius aliquet sagittis. Curabitur est quam, consequat non mollis nec, varius in metus.

<img class="article-image-left" src="images/demo-image1.jpg" alt="" alt="" />


Ut vel libero non elit luctus sodales. Phasellus vel lorem felis. Sed eget tellus sem, nec vulputate leo. Sed blandit dapibus tincidunt. Nullam vitae metus velit. Nulla euismod nulla nec felis condimentum commodo at ac metus. Sed vel eros ut dolor sodales posuere. Nullam porttitor sem accumsan nisi fringilla cursus. Fusce adipiscing elementum porttitor. Nam porttitor fringilla cursus. Praesent fermentum volutpat sem, sit amet feugiat magna varius ac. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum vel magna risus. Pellentesque rhoncus eros non dui ultricies ultrices.

<img class="article-image-right" src="images/demo-image1.jpg" alt="" alt="" />


Images withlightbox

Aliquam et nunc a ipsum bibendum convallis. Nunc et lectus lectus, a vestibulum urna. Aliquam auctor pretium mollis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse rhoncus nisi ut sem euismod lobortis porttitor sapien porttitor. In sapien quam, rhoncus non venenatis et, vulputate vitae risus. Nullam bibendum quam pretium dolor bibendum placerat. Nunc adipiscing convallis tincidunt. Integer non lacus turpis, at lobortis lectus. Nam mi mauris, mattis at egestas lacinia, vestibulum dapibus arcu. Aliquam erat volutpat. Morbi at justo nec purus rhoncus commodo et id nisl. Maecenas ac lacinia nisl. Vivamus nec nibh nec metus posuere rhoncus a quis felis. Aliquam convallis, arcu a aliquam auctor, velit felis scelerisque nulla, at gravida nunc ante sed turpis.

<a href="images/demo-image1.jpg" rel="prettyPhoto">
<img class="article-image-left" src="images/demo-image1.jpg" alt="" alt="" />
</a>


Buttons

Default buttons

Read more text

Button tex

Button tex

<a class="readmore1" href="#">Read more text</a>
<a class="button-small" href="#">Button tex</a>
<a class="button-big" href="#">Button tex</a>


Buttons with images

Button Tex Button Tex Button Tex

Button Tex Button Tex Button Tex

Button Tex Button Tex Button Tex

Button Tex

<a class="button-big button-archive" href="#"><span>Button Tex</span></a>
<a class="button-big button-bag" href="#"><span>Button Tex</span></a>
<a class="button-big button-cart" href="#"><span>Button Tex</span></a>
<a class="button-big button-document" href="#"><span>Button Tex</span></a>
<a class="button-big button-download" href="#"><span>Button Tex</span></a>
<a class="button-big button-image" href="#"><span>Button Tex</span></a>
<a class="button-big button-link" href="#"><span>Button Tex</span></a>
<a class="button-big button-mail" href="#"><span>Button Tex</span></a>
<a class="button-big button-upload" href="#"><span>Button Tex</span></a>
<a class="button-big button-video" href="#"><span>Button Tex</span></a>


Buttons with custom color

Button Tex

<a class="button-big button-archive" style="background-color:#e58661;" href="#"><span>Button Tex</span></a>


Más artículos...

  1. Columns
  • Existe una salida

    Sigue con tu embarazo