O4Uelements

Download And Demo button:

<div style="text-align: center;"><ul class="button"><li><a class="demo" href="URL HERE" target="_blank">Demo</a></li>
<li><a class="download" href="URL HERE" target="_blank">Download</a></li>
</ul></div>


Style 1


Style 2


Style 3

Info:

<div class='warning'><b>INFO</b>Info text here by onet4u</div>

INFO
Info text here by onet4u

<div class='tips'><b>INFO</b>Info text here by onet4u</div>

INFO
Info text here by onet4u

<div class='info'><b>INFO</b>Info text here by onet4u</div>

INFO
Info text here by onet4u


Code:

<pre><code>Your html/js/css code here</code></pre>

Your html/js/css code here

Blockquote:

Bagi yang ingin menggunakan efek transisi lain, sobat bisa buka link ini Daftar Efek CSS Transform atau CSS Animation

Kotak (Box)
Isi tulisan. Kotak akan berwarna default.
Isi tulisan. Kotak akan berwarna hijau.
Isi tulisan. Kotak akan berwarna biru.
Isi tulisan. Kotak akan berwarna merah.
Isi tulisan. Kotak akan berwarna kuning.

<div class="box">Isi tulisan. Kotak akan berwarna default.</div>

<div class="box green">Isi tulisan. Kotak akan berwarna hijau.</div>

<div class="box blue">Isi tulisan. Kotak akan berwarna biru.</div>

<div class="box red">Isi tulisan. Kotak akan berwarna merah.</div>

<div class="box yellow">Isi tulisan. Kotak akan berwarna kuning.</div>

Youtube

<div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="//www.youtube.com/embed/UQbNtP1F3pg">
</div>
</div>
</div>