Codess;;

<!-------Credit: http://chocollyheart.blogspot.com/*Do not remove this section!--------!>
<html>
<head>
<title>Loving Someone</title>

<style>

#navbar-iframe {
display: none;
}

body {
font: 11px trebuchet ms;
color: #555;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQM6TxqVtKR30GiHTno_kipzukv2fbkoNoDfgV6ZVfoyulSg3OJ4bVjgFufURlH5jlrc1Ab4w4d0Dlz2hWVdaauczSc_O78vUjYL9kKdCIxB6Q9tO2a_RZQuZoFYb2I2CWK94NCxgHGyA/s1600/purple.jpg) fixed;
}

a:link,a:visited {
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color: #C285FF;
text-decoration: none;
padding: 2px;
}

a:hover {
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-decoration: none;
-webkit-background-clip: text;
color: white;
-webkit-text-fill-color: transparent;
background-image: -webkit-gradient(linear, left top, right top, from(#ea8711), to(#d96363));
background-image: -webkit-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image: -moz-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image: -ms-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
background-image: -o-linear-gradient(left, #FF0000, #FA5858, #73a6df, #9085fb, #52ca79);
}

blockquote {
padding: 5px;
border: 1px dashed #8F6BB2;
padding-left: 25px;
background: url(http://colourlovers.com.s3.amazonaws.com/images/patterns/66/66087.png) repeat-y;
background-size: 20px 20px;
color: #555;
-webkit-transition: all .4s ease-in-out!important;
-moz-transition: all .4s ease-in-out!important;
-o-transition: all .4s ease-in-out!important;
}

::-webkit-scrollbar {
width: 7px;
height: 7px;
}

::-webkit-scrollbar-track-piece {
background-color: #DBB8FF;
border: 3px solid #fff;
}

::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color: #DBB8FF;
border: 1px solid #FFFFFF;
}

.blogger-labels {
border-top: 1px dashed #ccc;
text-transform: uppercase;
}

.entries-background img {
border: 1px dashed #000;
padding: 10px;
background: url(http://colourlovers.com.s3.amazonaws.com/images/patterns/1706/1706590.png);
}

.entries-position {
right: 40%;
position: absolute;
top: 40px;
width: 620px;
}

.entries-background {
text-align: left!important;
background: url(http://i.imgur.com/7FZWPY1.png);
border: 1px dashed purple;
padding: 10px;
margin-bottom: 50px;
}

.entries-title {
background-image: -webkit-linear-gradient(right, #FFF, #DBB8FF, #DBB8FF, #FFF);
text-align: center;
margin-top: 15px;
text-transform: uppercase;
margin-bottom: 10px;
color: #fff;
font: 18px 'calibri';
letter-spacing: 1px;
padding: 3px;
width: 500px;
display: inline-block;
}

#com {
height: 55px;
border-radius: 111px;
font: 9px trebuchet ms;
width: 55px;
margin-top: -50px;
margin-left: -90px;
padding: 2px;
text-align: center;
position: absolute;
background: #CC99FF;
color: #fff;
opacity: 0;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
z-index: 103;
}

#com a {
color: #fff;
}

#com2 {
height: 55px;
border-radius: 111px;
font: 9px trebuchet ms;
width: 55px;
margin-top: -100px;
margin-left: -90px;
padding: 2px;
text-align: center;
position: absolute;
background: #CC99FF;
color: #fff;
opacity: 0;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
z-index: 103;
}

.entries-background:hover #com {
margin-top: 30px;
opacity: 1;
overflow: hidden;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
}

.entries-background:hover #com2 {
margin-top: 100px;
opacity: 1;
overflow: hidden;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
}

#sidebar-position {
width: 280px;
position: fixed;
top: 200px;
right: 120px;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
}

#sidebar-position:hover #lol {
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
-moz-opacity: 1;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity=1);
}

#lol {
text-align: center;
-moz-opacity: 0;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity=0);
background: transparent;
width: 242px;
font-style: italic;
position: fixed;
top: 200px;
right: 150px;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;
height: 300px;
}

a.linkk {
border-radius: 1111px;
padding: 5px;
width: 50px;
height: 50px;
padding: 5px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
font-family: arial;
font-size: 10px;
text-align: center;
text-decoration: none;
text-transform: uppercase;
display: inline-block;
margin: 4px;
border: 1px solid #F4DEC2;
color: #ccc;
background: #fff;
border: 1px dashed #CC99FF;
}

a.linkk:hover {
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
color: #000!important;
background: #EBD6FF;
border: 1px dashed #CC99FF;
}

#linkies3, #linkies4 {
margin: -4px -3px 0px 0px;
background: #FFE0A3;
width: 23px;
text-transform: uppercase;
height: 30px;
padding: 10px;
text-align: center;
display: inline-block;
color: #FFfE0A3;
position: fixed;
-webkit-transition: 0.3s;
overflow: hidden;
}

#linkies1, #linkies2 {
margin: -4px -3px 0px 0px;
background: #FFE0A3;
width: 23px;
text-transform: uppercase;
height: 30px;
top: 504px;
padding: 10px;
text-align: center;
display: inline-block;
color: #FFfE0A3;
position: fixed;
-webkit-transition: 0.3s;
overflow: hidden;
}

#linkies1:hover, #linkies2:hover {
background: #fff;
color: #aaa;
border-bottom: 4px solid #664C80;
-webkit-transition: 0.3s;
padding: 10px 10px 60px 10px;
}

#linkies3:hover, #linkies4:hover {
background: #fff;
color: #aaa;
-webkit-transition: 0.3s;
padding: 10px 10px 60px 10px;
}

#linkies1 {
right: 340px;
background: #742365;
color: #742365;
height: 30px;
}

#linkies2 {
right: 280px;
background: #FEB89F;
color: #FEB89F;
height: 90px;
}

#linkies3 {
top: 64px;
right: 165px;
background: #E23D75;
color: #E23D75;
height: 120px;
}

#linkies4 {
top: 104px;
right: 230px;
background: #FDCFBF;
color: #FDCFBF;
height: 80px;
}

#linkies1:hover {
padding: 10px 10px 80px 10px;
}

#linkies2:hover {
padding: 10px 10px 50px 10px;
}

#linkies3:hover {
padding: 50px 10px 10px 10px;
top: 20px;
border-top: 4px solid #664C80;
}

#linkies4:hover {
padding: 60px 10px 10px 10px;
top: 50px;
border-top: 4px solid #664C80;
}

a.love {
text-decoration: none;
-webkit-transition-duration: .60s;
background: transparent;
color: #aaa;
font-size: 24px;
font-family: bebasne;
text-transform: none;
letter-spacing: 1px;
}

a.love:hover {
background: transparent;
-webkit-transition-duration: .60s;
color: #444;
border-bottom: 0px solid gray;
}

@font-face {
font-family: "bebasne";src: url('http://static.tumblr.com/ls875kd/nuNlvxgvd/bebasneue.otf');
}

.word {
position: fixed;
width: 200px;
font-size: 14px;
bottom: 20px;
right: -180px;
padding: 5px;
border-radius: 10px;
border: 1px solid pink;
font-family: consolas;
letter-spacing: 2px;
text-transform: uppercase;
color: #888;
text-align: left;
-webkit-transition: 0.8s;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
background: #fff;
border: 1px dashed #aaa;
}

.word:hover {
position: fixed;
right: -50px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}

#sidebar-position:hover .icon {
position: absolute;
right: 200px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}

#sidebar-position:hover .icon2 {
position: absolute;
right: -50px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}

.text {
z-index: 1!important;
position: absolute;
top: 30px;
margin-left: 80px;
width: 210px;
border: 1px dashed #911262;
padding: 7px;
border-left: 0px dashed #911262!important;
background: #fff;
border-top-right-radius: 11111px;
border-bottom-right-radius: 11111px;
}

.icon {
z-index: 999999999999999999999999999999!important;
position: absolute;
top: 30px;
right: 500px;
border: 1px dashed #911262;
padding: 10px;
background: #fff;
border-radius: 111px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}

.text2 {
z-index: 1!important;
position: absolute;
top: 30px;
margin-left: -233px;
width: 210px;
border: 1px dashed #911262;
padding: 7px;
border-right: 0px dashed #ccc!important;
background: #fff;
border-top-left-radius: 11111px;
border-bottom-left-radius: 11111px;
}

.icon2 {
z-index: 999999999999999999999999999999!important;
position: absolute;
top: 150px;
right: -250px;
border: 1px dashed #911262;
padding: 10px;
background: #fff;
border-radius: 111px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}

.icon3 {
margin: 6px;
-webkit-box-shadow: 0px 0px 9px 3px rgba(222,138,222,0.94);
-moz-box-shadow: 0px 0px 9px 3px rgba(222,138,222,0.94);
box-shadow: 0px 0px 9px 3px rgba(222,138,222,0.94);
border: 1px dashed #911262;
padding: 10px;
height: 100px!important;
width: 100px!important;
background: #fff;
border-radius: 111px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}

#linetop {
margin-left: -25px;
position: absolute;
width: 650px;
height: 20px;
background: url(http://colourlovers.com.s3.amazonaws.com/images/patterns/1706/1706590.png);
margin-top: -15px;
border-radius: 1111px;
}

#linebottom {
margin-left: -25px;
position: absolute;
width: 650px;
height: 20px;
background: url(http://colourlovers.com.s3.amazonaws.com/images/patterns/1706/1706590.png);
margin-bottom: -5px;
border-radius: 1111px;
}

</style>

<body>

<div class="word">
<span style="font-size:25px; color:#000;">© </span>
<a style="color:#000;;" href="http://www.blogskins.com/me/tralala-afiqah">THEME</a>
<a style="color:#000;" href="http://chocollyheart.blogspot.com/">BY</a></div>

<div id="sidebar-position">
<div id="lol">
<a href="#"><div class="icon"><img src="http://i794.photobucket.com/albums/yy223/azureveur/Icons%20and%20Avatars/SNSD16.png" height="70" width="70" style="border-radius:333px;"><div class="text">Extra Link</div></div></a>
<a href="#"><div class="icon2"><img src="http://i794.photobucket.com/albums/yy223/azureveur/Icons%20and%20Avatars/SNSD86.png" height="70" width="70" style="border-radius:333px;"><div class="text2">Extra Link</div></div></div></a>
<img src="http://25.media.tumblr.com/9c40b3ec24ef6c5ed1dd8532a9da7f1a/tumblr_momxibgaVU1qewtmpo1_500.png" style="width:240px; border:9px solid #911262;">
</div>

<div id="linkies1" onClick="document.getElementById('main').innerHTML=document.getElementById('one').innerHTML"><br/>A<br/>B<br/>O<br/>U<br/>T<br/></div>
<div id="linkies2" onClick="document.getElementById('main').innerHTML=document.getElementById('two').innerHTML"><br/>P<br/>O<br/>S<br/>T<br/></div>
<div id="linkies3" onClick="document.getElementById('main').innerHTML=document.getElementById('three').innerHTML"><br/>B<br/>I<br/>A<br/>S<br/></div>
<div id="linkies4" onClick="document.getElementById('main').innerHTML=document.getElementById('four').innerHTML"><br/>A<br/>f<br/>f<br/>i</div>

<div class="entries-position">
<div id="main"><blogger><div class="entries-background"><div id="linetop"></div>
<center><div class="entries-title"><$BlogItemTitle$></BlogItemTitle>
<div id="com"><br/><a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>>comment </a>(<$BlogItemCommentCount$>)</BlogItemCommentsEnabled></div>
<div id="com2"><br/><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader></div>
</div></center>
<$BlogItemBody$>
<div id="linebottom"></div></div></blogger>
</div></div>

<div style="float: left;position:fixed; top :150px; right:300px;"><a class="love" href=>← newer </a></div><div style="float: right;position:fixed; top :530px; right:170px;"><a class="love" href="<$OlderPosts$>">older →</a></div>

<div id="one" style="display: none;"><div class="entries-background"><div id="linetop"></div>
<center><div class="entries-title">Owner of The Blog</div></center>
<br/>
<center><img src="http://24.media.tumblr.com/c0f27f51bd1edeb3da81a69293a5fde8/tumblr_mp4vofZCmG1s777ijo3_400.gif"></center>
<br/>
Manarie li que vaqeriao |At vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae. Et harumd dereud facilis est er expedit distinct. Yoii rockem sockem mow-em yown. Manarie li que vaqeriao.
Occae et harumb bet theap. Est praesent luptatum. Ha! Bis nostrud exercitation ullam mmodo consequet. Duis aute in voluptate velit esse cillum dolore eu fugiat nulla pariatur. At vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae. Et harumd dereud facilis est er expedit distinct. Et harumd dereud facilis est er expedit distinct. Yoii rockem sockem mow-em yown. Manarie li que vaqeriao. Occae et harumb bet theap. Est praesent luptatum. Dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae.
Et harumd dereud facilis est er expedit distinct. Et harumd dereud facilis est er expedit distinct. Yoii rockem sockem mow-em yown. Manarie li que vaqeriao. Occae et harumb bet theap. Est praesent luptatum. Ha! Bis nostrud exercitation ullam mmodo consequet. Duis aute in voluptate velit esse cillum dolore eu fugiat nulla pariatur. At vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae. Et harumd dereud facilis est er expedit distinct.
<br/>
<div id="linebottom"></div></div></div>

<div id="two" style="display: none;">
<div id="main"><blogger><div class="entries-background"><div id="linetop"></div>
<center><div class="entries-title"><$BlogItemTitle$></BlogItemTitle>
<div id="com"><br/><a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>>comment </a>(<$BlogItemCommentCount$>)</BlogItemCommentsEnabled></div>
<div id="com2"><br/><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader></div>
</div></center>
<$BlogItemBody$>
<div id="linebottom"></div></div></blogger>
</div></div>

<div id="three" style="display: none;"><div class="entries-background"><div id="linetop"></div>
<center><div class="entries-title">Bias</div></center>
<br/>
<center><blockquote>AWESOME</blockquote>
<br/>
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/019.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/013.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/017.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/023.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/011.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/008.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/028.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/025.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/009.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/007.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/015.png" height="100" width="100" style="border-radius:333px; margin:3px;">
<img class="icon3" src="http://i1094.photobucket.com/albums/i445/heartnseoul/061311/001.png" height="100" width="100" style="border-radius:333px; margin:3px;">

</center>

<br/><br/>
<div id="linebottom"></div></div></div>

<div id="four" style="display: none;"><div class="entries-background"><div id="linetop"></div>
<center><div class="entries-title">Friends</div></center>
<br/>
<center><blockquote>Exchange link OPEN</blockquote></center>
<br/>
<center><a class="linkk" href="http://chocollyheart.blogspot.com/"><br/>Afiqah</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
<a class="linkk" href=""><br/>Friends</a>
</center>
<br/>
<div id="linebottom"></div></div></div>

</body></head></html>