Req : Skins Vintage for Valleria

Ini Valleria... thanks ya sudah request. Jadi ada kerjaan ... hehe...

<script type="text/javascript">var ACurl = "http://rippernyasar.blogspot.com/"; //url redirect</script><script type="text/javascript" src="http://belajarislamituindah.googlecode.com/files/RV-BI3-Protect2.js"></script>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
</script>
<script type='text/javascript' language='Javascript'>
var scrolltotop={
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (1=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
controlHTML: '<img src="http://3.bp.blogspot.com/-JJX0Sd1zyZU/VUNGa5aoMyI/AAAAAAAACBw/LQnJqF8ATf4/s1600/tumblr_ltsxyxlNwj1qflxbto1_500_large%2Bcopy.png" width="100">', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ center of window corner
anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
state: {isvisible:false, shouldvisible:false},
scrollup:function(){
if (!this.cssfixedsupport) //if control is positioned using JavaScript
this.$control.css({opacity:0}) //hide control immediately after clicking it
var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
dest=jQuery('#'+dest).offset().top
else
dest=0
this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
},
keepfixed:function(){
var $window=jQuery(window)
var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
this.$control.css({left:controlx+'px', top:controly+'px'})
},
togglecontrol:function(){
var scrolltop=jQuery(window).scrollTop()
if (!this.cssfixedsupport)
this.keepfixed()
this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
if (this.state.shouldvisible && !this.state.isvisible){
this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
this.state.isvisible=true
}
else if (this.state.shouldvisible==false && this.state.isvisible){
this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
this.state.isvisible=false
}
},
init:function(){
jQuery(document).ready(function($){
var mainobj=scrolltotop
var iebrws=document.all
mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:"Let's Fly High !"})
.click(function(){mainobj.scrollup(); return false})
.appendTo('body')
if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
mainobj.togglecontrol()
$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()
return false
})
$(window).bind('scroll resize', function(e){
mainobj.togglecontrol()
})
})
}
}
scrolltotop.init()
</script>
<link rel="shortcut icon" href="http://th06.deviantart.net/fs71/PRE/i/2011/310/f/2/tangled_sun_symbol__huge__by_syntaxerror255-d4fa4bg.png" />
<br><br>
</script>
<link href='http://fonts.googleapis.com/css?family=Cedarville+Cursive' rel='stylesheet' type='text/css'>
<center><img class="header" src="http://2.bp.blogspot.com/-vmQP4XEPmBU/VUNEsroJ7pI/AAAAAAAACBk/RotORUnjm4g/s1600/Vintage%2BGirl.png"width="800" align="center" /></center>
<title>Yaya & Ying Stories</title>

<script type="text/javascript">
function changeNavigation(id)
{document.getElementById('main').innerHTML=document.getElementById(id).innerHTML}
</script>

</head>

<style type="text/css">
#navbar-iframe { display: none; }

body {
background:url(http://2.bp.blogspot.com/-iTrQyY381AM/T6yHyTCsl9I/AAAAAAAAGag/mOkGl8Y3ejc/s1600/sparkles.png);
color: #000000;
line-height: 15px;
text-align: justify;
cursor: url(http://1.bp.blogspot.com/-YBJezQVG7i8/VTC9mPec2BI/AAAAAAAAB1Q/5healnatw-g/s1600/cursorku.gif);
}

table {
cursor: url(http://1.bp.blogspot.com/-YBJezQVG7i8/VTC9mPec2BI/AAAAAAAAB1Q/5healnatw-g/s1600/cursorku.gif);
background:#fff;
font: 11px Short Stack;
letter-spacing: 1px;
color: #9b9393;
line-height: 20px;
padding:5px;
border-radius:5px;
width:900;}


a:link,a:visited{
cursor:url(http://static.tumblr.com/z7e2cpq/PDhlllqdn/ponteiro_roxo.png);
text-decoration:none;
color:#666666;-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
a:hover{
color:#cccccc;
background:transparent;
}

::-moz-selection {
background:#000;
color:#fff;
}

::selection {
background:#fdeaf6;
color:#000000;
}

i , s, strike {
color: #666666;
}

b {
color:#666666;
-webkit-transition-duration: 1.5s;
}

blockquote{background:url(http://3.bp.blogspot.com/-2A0D4wY8Rww/TzuO_pTu-zI/AAAAAAAACpQ/B9EkXNZ9C48/s1600/grey.png);
padding:10px;
border:3px solid #666666;
color:#808080;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
blockquote:hover{
border-radius:20px;
border:3px solid #CCCCCC;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
-webkit-box-shadow: 0px 0px 8px <span style="color: blue;">#CCCCCC</span>;
-moz-box-shadow: 0px 0px 8px <span style="color: blue;">#CCCCCC</span>;
box-shadow: 0px 0px 8px #CCCCCC;
}

a.oldernewer{
letter-spacing:3px;
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
display:inline-block;
font:8px short stack;
text-align:center;
width:100px;
height:10px;
color:#888 ;
padding:5px;
background:#fff;
border-radius:5px;
text-decoration:none;
border:2px solid #e4bee6 ;}

a.oldernewer:hover{
background: #fff;
color:#333 !important;
box-shadow:inset 0px 25px 0px #e4bee6;
}

.comment-timestamp {
margin:0 0 .5em;
padding:0 0 .75em 20px;
color:#666;
}

.deleted-comment {
font-style:short stack;
color:gray;
}

#comments {
margin:5;
border-width:0 1px 1px;
padding:20px 0 15px 0;
}
.comment-icon blogger-comment-icon{display:none}
#comments-block {
margin:2px ;
}

.comment-data {
background:url("http://i257.photobucket.com/albums/hh205/xoxojays/smilies/crayon/pic009demoji_12386811decoojp.gif") no-repeat 2px .3em;
margin-top:5px !important;background-size:15px;
padding:0 0 0 20px;
color:#666;
}

span.comment-icon{display:none}

.comment-poster {
font-weight:bold;
}

.comment-body {
margin:0px;
}

.comment-body p {
background:#FFFFFF;
border:3px solid #CCCCCC;
margin:0em;
padding:5px;
color:#808080;
}

.pocetit {
font-size:15px;
padding:5px;
font-family:Century Gothic;
color:#666666;
text-align:center;
background:url(http://3.bp.blogspot.com/-2A0D4wY8Rww/TzuO_pTu-zI/AAAAAAAACpQ/B9EkXNZ9C48/s1600/grey.png);
background-repeat:repeat;
border:2px solid #CCCCCC;
border-radius:10px;
}


.arrien {
text-align: center;
font:10px Delius;
color: #000000;
background:#CCCCCC;
border-radius:10px;
}

a.arrien:hover {
color: #ffffff;
background: none;
-webkit-transition: 0.5s;
}

@font-face {
font-family:tt;
src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');
}

::-webkit-scrollbar {
width:7px;
height:7px;
}
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment  {
height:10px;
width:10px;
display:block;
background:#CCCCCC;
border:2px solid #666666;
}
::-webkit-scrollbar-track-piece  {
background:url(http://i.imgur.com/cLeZkpr.png);
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background:#CCCCCC;
border:2px solid #666666;
}

a.navi {
background:url(http://2.bp.blogspot.com/-iTrQyY381AM/T6yHyTCsl9I/AAAAAAAAGag/mOkGl8Y3ejc/s1600/sparkles.png);
padding:5px;width:90px;
color:#666666;padding:5px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
font-family: delius;
font-size: 10px;
text-align: center;
text-decoration: none;
text-transform: uppercase;
display:inline-block;
margin:4px;border: 1px solid #666666;
border-radius:10px;
}
a.navi:hover{
border-bottom: 0px solid gray;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
color:#CCCCCC;background:#FFFB8CA;
border: 1px dashed #FFFFFF;
border-radius:10px;
}

.header {
margin-left: 2px;
margin-bottom: -33px;
-webkit-transition:2s
}

a.affie {
background:url(http://2.bp.blogspot.com/-iTrQyY381AM/T6yHyTCsl9I/AAAAAAAAGag/mOkGl8Y3ejc/s1600/sparkles.png);
padding:5px;width:90px;
color:#CCCCCC;padding:5px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
font-family: delius;
font-size: 10px;
text-align: center;
text-decoration: none;
text-transform: uppercase;
display:inline-block;
margin:4px;border: 1px solid #CCCCCC;
border-radius:10px;
}

a.affie:hover{
border-bottom: 0px solid gray;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
color:#666666
;background:#FFFB8CA;
border: 1px dashed #666666;
border-radius:10px;
}
</style>

<style>
a.jieun{
font: 11px Delius;
color:#2e2e2e;
background: #CCCCCC;
border:1px dashed #666666;
padding: 1.0px;
-webkit-transition: 1.0s;
}

a.jieun:hover{
background:#666666;
border-radius:10px;
border:1px solid #CCCCCC;
color:#2e2e2e;
-webkit-transition: 1.8s;
</style>
<center>
<div style="width:900px;padding-top:8px;padding:8px; padding-left:9px;  padding-right:9px;background:url(http://2.bp.blogspot.com/-j-JibXJ_oDg/T9mPRSs3PoI/AAAAAAAACLc/UGh6rVIfRoE/s1600/grayy.gif);margin:auto;">

<table style="font-size: 11px; color:grey; letter-spacing:1px;line-height: 17px; background-image: url(http://3.bp.blogspot.com/-QfX8FnF9P2U/TjqKsDGceHI/AAAAAAAABX0/C7iAxZnXC6M/s1600/backgroundbody+%25281%2529.gif);" width="900" align="center" border="0" cellspacing="8">

</style>

</head>

<div align="center">
<center>
<table border="0" cellspacing="0" cellpadding="20">
</center>

<tr>

<td valign="top" width="180">

<div class="pocetit">Owner</div>
<div class="arrien">Who's the Girl?</div><br>
<center>
<img src="https://s-media-cache-ak0.pinimg.com/236x/05/c6/5d/05c65dc168983f6d3df34b5c0e480419.jpg" width="120";" />
</center>
</div>
<center>Hi! My name is ____ i'm was ____ Like my blog? ^_^<br>This is my navigation. Click it!
</center><br>

<center><a class="jieun" onClick="document.getElementById('main').innerHTML=document.getElementById('o').innerHTML">Home</a>
<a class="jieun" onClick="document.getElementById('main').innerHTML=document.getElementById('k').innerHTML">About</a>
<a class="jieun" onClick="document.getElementById('main').innerHTML=document.getElementById('p').innerHTML">Linkies</a>
<a class="jieun" onClick="document.getElementById('main').innerHTML=document.getElementById('stuffs').innerHTML">Stuffs</a><br>
<a class="affie" href="http://www.blogger.com/follow-blog.g?blogID=YOUR BLOG ID" >Follow</a></center><br>
</div>
</div>

<div class="pocetit">Chatting Box</div>
<div class="arrien">Chat with the Girl!</div><br>
<center> YOUR CBOX HERE</center><br>

<div class="pocetit">Archive</div><br>
<center><div style="border:3px solid #666666;background:#CCCCCC; width:210px; padding:5px; border-bottom:none;-webkit-border-top-left-radius: 30px;-webkit-border-top-right-radius: 30px;-moz-border-radius-topleft: 30px;-moz-border-radius-topright: 30px;border-top-left-radius: 30px;border-top-right-radius: 30px;color:gray;text-align:center;">
Vintage Diary</div>
<div style="border:3px solid #666666;background:url(http://3.bp.blogspot.com/-QfX8FnF9P2U/TjqKsDGceHI/AAAAAAAABX0/C7iAxZnXC6M/s1600/backgroundbody+%25281%2529.gif); width:200px; overflow-x:hidden; overflow-y:scroll;padding:10px; height:100px; ">
<bloggerpreviousitems>
<a  href="<$BlogItemPermalinkURL$>">
<div style="background:url(http://i257.photobucket.com/albums/hh205/xoxojays/smilies/crayon/pic012demoji_63731decoojp.gif); background-size:15px; background-repeat:no-repeat; padding-left:14px;">
<$BlogPreviousItemTitle$></div>
</a>
</BloggerPreviousItems></div>
<br>

<div class="pocetit">Surprise Box</div>
<div class="arrien">Click it!</div><br>


 </style>
<div class="babo">
<a class="tablo" onclick="document.getElementById('wnsb').innerHTML=document.getElementById('1').innerHTML" >1</a>
<a class="tablo" onclick="document.getElementById('wnsb').innerHTML=document.getElementById('2').innerHTML" >2</a>
<a class="tablo" onclick="document.getElementById('wnsb').innerHTML=document.getElementById('3').innerHTML" >3</a>
<a class="tablo" onclick="document.getElementById('wnsb').innerHTML=document.getElementById('4').innerHTML" >4</a> </div>

<div id="wnsb" style="width:210px;color:#ccc; padding:5px;border:3px solid #CCCCCC;border-top:none;font:11px delius; letter-spacing:1px;">
Click the number above!
</div>

<div id="1" style="display: none;">
<center>Put your banner code here</center><br>
</div>

<div id="2" style="display: none;">
<center>Put with your ask.fm code</center>
</div>

<div id="3" style="display: none;">
<img src="http://media.tumblr.com/tumblr_m4i8d1Kpz21qdlkyg.gif"/>: ____@gmail.com <br>
<img src="http://media.tumblr.com/6769ec0364994d624fda3278d3ea0e73/tumblr_inline_mu8wy4lKdB1qid2nw.png"/>: Your FB
</div>

<div id="4" style="display: none;">
<div class='widget-content'><center><form action="/search" id="searchThis" method="get" style="display: inline;"> <input id="searchBox" name="q" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" style="background: #FFFFFF; border: #CCCCCC solid 1px; color: #BAB6B7; font-size: 12px; width: 150px;" type="text" value="Search" vinput="" /> <input id="searchButton" style="background: #FFFFFF; border: #CCCCCC solid 1px; color: #CCCCCC; font-size: 12px; padding-top: 3px;" type="submit" value="Go" /></form></center>
</div></div><br><br>

<!------------------------Dont remove the credit or i kill u---------------->

<div class="pocetit">Credit</div>
<div class="arrien">Very helpful!</div><br>

<center>© 2015 - Full Template by <a href="http://boboiboy-bloggie.blogspot.com/">Zahra</a>. Edit by <a href="http://YOURURLBLOG.blogspot.com/">Your Name</a>. Thanks to all!<br>

<!------------------------Dont remove the credit or i kill u---------------->

</div>
</td>

</div>

<td id="main" valign="top" style="width:535px; padding-left:13px; border-left:1px solid #f8e7f1; padding-right:13px; ">

<Blogger>
<div class="pocetit"><$BlogItemTitle$></div><div class="arrien" style="float:center;text-align:left;"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> | <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$> Vintage</a></BlogItemCommentsEnabled></div><$blogitembody$><br>
<br>

<center><OlderPosts><a href=<$OlderPosts$>>PAST</a> </OlderPosts> <NewerPosts> • <a href=<$NewerPosts$>>FUTURE</a></NewerPosts></center><br><br>

<itempage>
  <div id="comments" style="margin-top:5px;">
 <blogitemcommentsenabled><a name="comments"></a>
<dl id="comments-block">
<div style="width:500px; padding:5px;margin-top:20px;border:4px solid #fff;6px;background:url(http://2.bp.blogspot.com/-iTrQyY381AM/T6yHyTCsl9I/AAAAAAAAGag/mOkGl8Y3ejc/s1600/sparkles.png); box-shadow:0  0 3px #ddd;">
      <$CommentPager$>
      <blogitemcomments>
<dt class="comment-data" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a>
 <$I18NCommentAuthorSaid$></dt>
<dd class="comment-body">
        <p>
<$BlogCommentBody$></p>
<$BlogCommentDeleteIcon$>
      </dd>
   </BlogItemComments>
    <$CommentPager$>
    </dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
    </p>
</ItemPage>


</Blogger>
</td>

<td id="o" style="display: none;">

<Blogger>
<div class="pocetit"><$BlogItemTitle$></div><div class="arrien" style="float:center;text-align:left;"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> | <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$> Comments</a></BlogItemCommentsEnabled></div><$blogitembody$><br>
<br>

<center><OlderPosts><a href=<$OlderPosts$>>Older</a> </OlderPosts> <NewerPosts> • <a href=<$NewerPosts$>>Newer</a></NewerPosts></center><br><br>

<itempage>
  <div id="comments" style="margin-top:5px;">
 <blogitemcommentsenabled><a name="comments"></a>
<dl id="comments-block">
<div style="width:500px; padding:5px;margin-top:20px;border:4px solid #fff;6px;background:url(http://1.bp.blogspot.com/-n_jYTFHK048/UBPeDGsQH6I/AAAAAAAAJik/NDm2_BaNqk0/s1600/purple.gif); box-shadow:0  0 3px #ddd;">
      <$CommentPager$>
      <blogitemcomments>
<dt class="comment-data" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a>
 <$I18NCommentAuthorSaid$></dt>
<dd class="comment-body">
        <p>
<$BlogCommentBody$></p>
<$BlogCommentDeleteIcon$>
      </dd>
   </BlogItemComments>
    <$CommentPager$>
    </dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
    </p>
</ItemPage>


</Blogger>
</div>
</td>

<td id="k" style="display: none;">

<div class="pocetit">This is Me</div>
<div class="arrien">Meet Me?</div><br>
<center><img src="http://cdn.yourcloudparade.com/uploads/stores/137/2589.jpg" width="400"></center><br>
<b>Name :</b> Shafa Az-Zahra<br>
<b>Hobby :</b> Blogging, etc.<br>
<b>Age :</b> 12 y<br>
<b>Country :</b> Salatiga<br>
<b>Born at :</b> Bandung<br>
<b>Fav. Food :</b> Fried Rice made by Mum<br>
<b>Fav. Drink :</b> Ice Chocolate<br>

<blockquote>Put with your own profile!</blockquote>
</center>

</td>

<td id="p" style="display: none;">

<div class="pocetit">Linkies</div>
<div class="arrien">Exchange link time!</div><br>
<center><img src="https://img1.etsystatic.com/023/0/7733211/il_fullxfull.496291229_ekfv.jpg" width="400"></center><br>

<center>
<input type="text" size="11" value="Your Name" style="width:180px;font:14px Delius;color:#666;border:1px  solid #666666;margin-right:6px;background-color:#ffffff;padding:2px;padding-left:4px;" onclick="this.focus()" onfocus="this.select()">
<input type="text" size="11" value="http://your url.blogspot.com" style="width:180px;font:14px Delius;color:#666;border:1px solid #666666;background-color:#ffffff;padding:2px;padding-left:4px;" onclick="this.focus()" onfocus="this.select()"></center>
<br><br>
<center>
<a class="navi" href="http://boboiboy-bloggie.blogspot.com/">Zahra</a>
<a class="navi" href="http://url.blogspot.com/">Next?</a>
<a class="navi" href="http://url.blogspot.com/">Next?</a>
<a class="navi"  href="http://url.blogspot.com/">Next?</a>
<a class="navi"  href="http://url.blogspot.com/">Next?</a></center>

</td>

<td id="stuffs" style="display: none;">

<div class="pocetit">Tutobies</div>
<div class="arrien">Fell free to use it!</div><br>

<center><img style="padding: 2px; border: 1px solid #ccc;"src="https://s-media-cache-ak0.pinimg.com/736x/9b/40/61/9b4061c2484caa84dd7fca9d557e2148.jpg" width="400"></center><br>

<style>
.lulu{
background:url(http://i.imgur.com/2MaVg8B.png);
color:#AAAAAA;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;letter-spacing:1px;
margin-bottom:5px;
margin:15px;
width:500px;
font-family:'Delius Swash Caps';
font-size:13px;
line-height:8px;
text-align:center;
padding-right:0px;
}

.eunji {
cursor:pointer;
display:inline-block;
text-align:left;
width:350px;
color:#888;
padding:1px;
background:url(http://i257.photobucket.com/albums/hh205/xoxojays/smilies/crayon/pic019demoji_13329500decoojp.gif);
color:#666666;
background-repeat:no-repeat;
background-size:14px;
padding-left:15px;
line-height:18px;
}

.eunji:hover{
background:url(http://i257.photobucket.com/albums/hh205/xoxojays/smilies/crayon/pic018demoji_16246789decoojp.gif);
background-repeat:no-repeat;
background-size:14px;
padding-left:15px;
line-height:18px;
color:#CCCCCC
}

.babo{background:url(http://thumbs.dreamstime.com/x/seamless-gray-floral-pattern-23749812.jpg);padding:5px;border:3px solid #CCCCCC;text-align:center;width:210px;color:#555}

a.tablo{
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
background:#666666;
width:20px;
text-decoration:none;
border:3px solid #fff;
color:#fff;
box-shadow:1px 1px 3px #eee;
border-radius:33px;
display:inline-block;
text-align:center;
font:16px calibri;
}

a.tablo:hover{background:#CCCCCC;color:#fff;}

</style>
<div class="lulu">Tutorials</div>
<a class="eunji" href="LINK">Tutorial</a>
<a class="eunji" href="LINK">Tutorial</a>
<a class="eunji" href="LINK">Tutorial</a>
<a class="eunji" href="LINK">Tutorial</a>
<a class="eunji" href="LINK">Tutorial</a>
<a class="eunji" href="LINK">Tutorial</a></center>

<div class="lulu">Freebies</div>
<a class="eunji" href="LINK">Freebies</a>
<a class="eunji" href="LINK">Freebies</a>
<a class="eunji" href="LINK">Freebies</a>
<a class="eunji" href="LINK">Freebies</a>
<a class="eunji" href="LINK">Freebies</a>
<a class="eunji" href="LINK">Freebies</a></center>

</div>

<style>

a.thingi {
background:url(http://media.tumblr.com/918a0e4c19b25c044e156b5b82079837/tumblr_inline_mg0ncyz50L1qdlkyg.gif);
background-repeat:no-repeat;
background-size:13px;
padding-left:25px;
color:#666;
display:inline-block;
font:14px Diamond Girl;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
width:305px;
line-height:18px;
}

a.thingi:hover{
background:url(http://media.tumblr.com/e65b52f5ccc91f5cc05290f648447622/tumblr_inline_mg0ncuWUv21qdlkyg.gif);
background-repeat:no-repeat;
background-size:13px;
color: #938B54;
}


</style>

</div>
</td>

<br><br/>
</table>
</body>
</html>


Mudah-mudahan suka ya... amiiin... hihi..!

2 komentar: