Codes ; Smile to your life




<!---------------------------------------------------------------------------
THIS SKIN IS TOTALLY MADE BY ME, BII. PLEASE DO NOT REMOVE THE CREDITS WHEN YOU ARE USING MY BLOGSKIN. THANKS FOR YOUR CO-OPERATION. DO EDIT THE EDITABLE PART.

BLOG OF OWNER : http://angelbii.blogspot.com/

DESIGNER: BII
DATE OF DESIGN: 18.11.12
---------------------------------------------------------------------------!>

<html>
<head>
<title>Smile to your life ♥</title>
<link href='http://fonts.googleapis.com/css?family=Inder' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Mrs+Saint+Delafield' rel='stylesheet' type='text/css'>


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

::-moz-selection {
color: #ffffff;
text-shadow: 0 0 0.2em  #fecdc9 , 0 0 0.2em #fecdc9;
}

::selection {
color: #ffffff;
text-shadow: 0 0 0.2em  #fecdc9 , 0 0 0.2em #fecdc9;
}

a:link, a:visited{
color: #8B4500;
text-shadow: 0 0 0.2em  #fecdc9 , 0 0 0.2em #fecdc9;
text-decoration: none;
-webkit-transition-duration: .7s;
}

a:hover{
color: #8B4500;
text-shadow: 0 0 0.2em  #fff , 0 0 0.2em #fff;
text-decoration: none;
-webkit-transition-duration: .7s;
}

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

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

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

img {
border-radius: 6px;
-webkit-transition-duration: .5s;
}

img:hover {
border-radius: 3px;
opacity: .7;
-webkit-transition-duration: .5s;
}

u {
-webkit-transition-duration: .4s;
border-bottom: 1px dashed #fecdc9;
}

u:hover {
-webkit-transition-duration: .4s;
border-bottom: 3px double #fecdc9;
opacity: 0;
}

blockquote {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcWHRKqMJQQ9azng0TiCYX8nnkJz1uXKO8xNAXmJydG3B4dqT62DBaD_an4HTgMYC0Ehono2SlNfhLm35El4URAYNqPZOndT4MaHW5z-gsu8oBS65_rWUVuZP4_4WiDqGZEvrc9aAezZ2L/s1600/IMG_5951.JPG);
-webkit-transition-duration: 5s;
padding: 3px;
padding-left: 20px;
border: 2px dashed #ffffff;
}

blockquote:hover {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcWHRKqMJQQ9azng0TiCYX8nnkJz1uXKO8xNAXmJydG3B4dqT62DBaD_an4HTgMYC0Ehono2SlNfhLm35El4URAYNqPZOndT4MaHW5z-gsu8oBS65_rWUVuZP4_4WiDqGZEvrc9aAezZ2L/s1600/IMG_5951.JPG);
-webkit-transition-duration: 5s;
padding: 3px;
padding-left: 20px;
text-shadow: 1px 1px #ccc;
box-shadow: inset 800px 0 0px 0 #FFFAF0;
opacity: .5;
border: 2px dashed #ffffff;
}

body {
background: #FFF5EE;
font-family: 'Inder', sans-serif;
font-size: 12px;
color: #996633;
}

.sidebar-title {
font-family: 'Mrs Saint Delafield', cursive;
font-size: 20px;
color: #996633;
text-align: left;
text-shadow: 1px 1px 1px #ffcccc;
padding-left: 10px;
-webkit-transition-duration:1.5s;
}

.sidebar-title:hover {
font-family: 'Mrs Saint Delafield', cursive;
font-size: 20px;
color: #996633;
text-align: left;
text-shadow: 1px 1px 1px #ffcccc;
padding-left: 80px;
-webkit-transition-duration:1.5s;
}

.content-outer {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhppRBGpBrl5gq92T6mlsu3jWs3GiCEU5-o_aQ0QHj_cTNMIjqCf2GzvnlQHD-kL1s5TkL1niFDcYCx7gSiwJnQVznWHobZxfcmEwGSIk6baUD8fdrImnbPbFt8eo-vf5_9uy8-DNdCPeNS/s1600/IMG_5963.GIF);
width: 600px;
height: 500px;
padding: 15px;
-moz-border-radius-bottomright: 30px;
border-bottom-right-radius: 30px;
-moz-border-radius-topleft: 30px;
border-top-left-radius: 30px;
}

#content {
padding: 10px;
background: #fff;
opacity: .8;
filter: alpha(opacity=80);
height: 480px;
overflow: auto;
}

post-footer {
font-family: tinytots;
font-size: 8px;
color: #8B636C;
}

a.time-machine {
-webkit-transition-duration: .7s;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhppRBGpBrl5gq92T6mlsu3jWs3GiCEU5-o_aQ0QHj_cTNMIjqCf2GzvnlQHD-kL1s5TkL1niFDcYCx7gSiwJnQVznWHobZxfcmEwGSIk6baUD8fdrImnbPbFt8eo-vf5_9uy8-DNdCPeNS/s1600/IMG_5963.GIF);
width: 45px;
padding: 5px;
display: inline-block;
text-align: center;
font-family: tinytots;
font-size: 8px;
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
}

.img-side{
background: #fff;
color: #000;
width: 275px;
height: 185px;
margin-top:-185px;
opacity: .2;
-webkit-transition:all .5s ease-in-out;
border-radius: 6px;
}

.img-side:hover{
opacity:.7
}

.img-page{
background: #eee;
color: #000;
width: 75px;
height: 20px;
margin-top:-75px;
margin-bottom: 65px;
margin-left:20px;
opacity: 0;
-webkit-transition:all .5s ease-in-out;
font-family: tinytots;
font-size:8px;
}

.img-page:hover{
background: #ffcccc;
opacity:.7;
height: 20px;
width:75px;
margin-top: -75px;
margin-bottom: 65px;
margin-left: 95px;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 10px;
-moz-border-radius-topright: 10px;
border-top-right-radius: 10px;
}

.img-page1{
background: #eee;
color: #000;
width: 75px;
height: 20px;
margin-top:-75px;
margin-bottom: 65px;
margin-right: 20px;
opacity: 0;
-webkit-transition:all .5s ease-in-out;
font-family: tinytots;
font-size:8px;
}

.img-page1:hover{
background: #ffcccc;
opacity:.7;
height: 20px;
width:75px;
margin-top: -75px;
margin-bottom: 65px;
margin-right: 95px;
-moz-border-radius-bottomleft: 10px;
border-bottom-left-radius: 10px;
-moz-border-radius-topleft: 10px;
border-top-left-radius: 10px;
}

a.nav {
-webkit-transition-duration: .5s;
color: #996633;
}

a.nav:hover {
-webkit-transition-duration: .5s;
color: #996633;
}

.pop {
-webkit-transition-duration: .5s;
background-color: #fecdc9;
width:60px;
margin-left: -30px;
padding: 3px;
padding-right: 6px;
text-align:right;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 10px;
-moz-border-radius-topright: 10px;
border-top-right-radius: 10px;
opacity: .5;
}

.pop:hover {
-webkit-transition-duration: .5s;
background-color: #fecdc9;
width:60px;
margin-left: 25px;
padding: 3px;
padding-right: 6px;
text-align:right;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 10px;
-moz-border-radius-topright: 10px;
border-top-right-radius: 10px;
opacity: .5;
}

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

.deleted-comment {
font-style:italic;
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("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEDhiYA8BSIqB50fmlBVu1h-CcsoZ9MkUtd3Sou_EgXlCMms9i8taUpEvjL1u4rSsMcOqxiPGja8PxlAJR9F00jzqWtylFcmy2aTo_9RDjHzE7XFrO5JL5f9IqWuE-D1WMOjv4PyTdSMrR/s1600/3-13.gif") no-repeat 2px .3em;
margin-top:5px !important;
padding-top:5px;
padding-bottom: 5px;
padding-left: 25px;
color:#666;
}

span.comment-icon{display:none}

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

.comment-body {
margin:0px;
}

.comment-body p {
background:#FFFFFF;
border:1px dashed #996633;
margin:0em;
padding:5px;
color:#808080;
}

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

</style>
</head>

<!--------------------------------SIDEBAR--------------------------------!>

<div style="position:fixed; width:275px; left:0px; background:#FFFAF0; height:1500px; border-right:3px solid #996633; padding:10px;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdsKVhyphenhyphenSOwlxZRQE1_NsGVJ0DXdB2ivA9uhGJeNfdhtDj62MUC1lPJmG9vWtc8NWfxW2FIjl64q4_CANzOzmd68Z_ehL45FHR_Y73ERGoVN2HwJaiKFNx1WI1EHaluPPEYJVZap3cW5UY/s1600/16.jpg" width="275" />
<div class="img-side"><br />
<center>
Change it with your cbox code.</center>
</div>
<br>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicd_G7eFJV9L9QY_2z8JhowE0kRQzqqQBgwFkIfOfigAwwfkwfAh0OHMoc9-OpB9IgYFAYVxIZRmG0QF-vWyexhbTQhwsk0tPTOhqLXvuQaOpkbiP3a241QP-aL41RLj_VTc7bilHQs1Y/s1600/orangeflower.png" height="10" width="275" style="border-radius:10px;">
<div class="sidebar-title">. Disclaimer</div>
Welcome here. This is the first blogskin that made by Bii. Change the words here with your words. But make sure, do not remove the credits.<br>
<br>
<center>- change it with your words -</center>
<br><br>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicd_G7eFJV9L9QY_2z8JhowE0kRQzqqQBgwFkIfOfigAwwfkwfAh0OHMoc9-OpB9IgYFAYVxIZRmG0QF-vWyexhbTQhwsk0tPTOhqLXvuQaOpkbiP3a241QP-aL41RLj_VTc7bilHQs1Y/s1600/orangeflower.png" height="10" width="275" style="border-radius:10px;">
<div class="sidebar-title">. Navigation</div>
<left>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrSBYkvhH1T-jZ6kyreTLNFXq7fwA1_1uLoCG1acNFAkJ-EIBrqAN7zkdT_NFkqfrr_caFKZT2Mo6gtX43W4jr-p-36lNp_i5LtbeUiYiYlgGmz95SwXeAasJ1Fs8QjBpIYFMiyF19ZWUf/s1600/a1+-2.gif" width="75" style="margin-left:20px;">
<div class="img-page"><br />
<center>
<a class="nav" onClick="document.getElementById('content').innerHTML=document.getElementById('entry').innerHTML" title="">HOME</a></center>
</div>
</left>
<div align="right">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6T84xb4xJ1ZtdMzjCaGO-Gg4j63t51srJS9BQDklw69pszw83qNGs_IkHUm9WyMNSadx6Z31jD_ZLt5-SQYKeu2kV_mgy57g7fQ-B1HJXdhhMNnlcpJBVRGmhoi2NbZxW4JFo7DiVyX1O/s1600/a1+-17.gif" width="75" style="margin-top:-30px; margin-right:20px">
<div class="img-page1"><br />
<center>
<a class="nav" onClick="document.getElementById('content').innerHTML=document.getElementById('profile').innerHTML" title="">PROFILE</a></center>
</div>
</div>
<left>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxBC9B2etgSXQeTYo1PK_3HgJVQHravKmmSqhiwFhyphenhyphenzRMZiMbKq8SofUILP0i4o6FJZd64khFlmwdyKtb65cTGsK4T8QdxrJeU-K0MmNrqK6ORjTlJ4758nC-vBVoXdHnQ8IEjRv3vBUG7/s1600/a1+-13.gif" width="75" style="margin-top:-30px; margin-left:20px;">
<div class="img-page"><br />
<center>
<a class="nav" onClick="document.getElementById('content').innerHTML=document.getElementById('links').innerHTML" title="">LINKS</a></center>
</div></left>
<center>- choose for your way -</center>
<br><br>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicd_G7eFJV9L9QY_2z8JhowE0kRQzqqQBgwFkIfOfigAwwfkwfAh0OHMoc9-OpB9IgYFAYVxIZRmG0QF-vWyexhbTQhwsk0tPTOhqLXvuQaOpkbiP3a241QP-aL41RLj_VTc7bilHQs1Y/s1600/orangeflower.png" height="10" width="275" style="border-radius:10px;">
<div class="sidebar-title">. Credits</div>
Blogskin design by - <a href="http://angelbii.blogspot.com/">Bii</a>. <br>
Image supported by - <a href="https://www.google.com.my/">Google</a> / <a href="http://s1198.beta.photobucket.com/">Photobucktet</a><br>
<br>
Please do nicely to my basecode. Do not remove the credits here. Respect the owner please! <br>
<br>
<center>- END HERE -</center>
</div>

<div style="top:20px; left:325px; position:fixed;"><img src="http://i1198.photobucket.com/albums/aa448/shehjing/blogskin%20material/header-1.gif"></div>

<!------------------------------POST------------------------------------!>
<div style="top:225px; left:930px; position:absolute;">
<div class="pop"><a href="http://www.blogger.com/follow-blog.g?blogID=5844858100638941379">FOLLOW   +</a></div>
</div>
<div style="top:175px; left:325px; position:fixed;">
<div class="content-outer"><div id="content">
<blogger>
<div style="margin-top:-10px; margin-left:150px; width:300px; -moz-border-radius-bottomright: 20px; border-bottom-right-radius: 20px; -moz-border-radius-bottomleft: 20px; border-bottom-left-radius: 20px; background-color: #ffcccc; text-align:center; padding:5px; color:#fff; opacity:2;">
<BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
<br>
<$BlogItemBody$>
<post-footer>♥ Post by XXX @ <BlogDateHeader><$BlogDateHeaderDate$> </BlogDateHeader><$BlogItemDateTime$><br>
<div align="right">Leave a comment for me? <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> Comment</a></BlogItemCommentsEnabled></div>

</post-footer>

<itempage>
  <div id="comments" style="margin-top:5px;">
 <blogitemcommentsenabled><a name="comments"></a>
<dl id="comments-block">
<div style="width:540px; padding:5px;margin-top:20px;border:4px solid #fff;6px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrFyCVEMcC3uY1P5kpPvhMbPLhTXMO0qBJ0VWFYRh1vfe0PqdC3LMFdrb2RsrxBVlREciLneb3SQs4zUlhqsB-rqQ5O6aDvPJzpzOcD5Fn3XhM_UIkfeHGP_nQbDI1cx_juvXyH_Zgrb4J/s1600/IMG_5945.JPG); box-shadow:0  0 3px #FFEBCD;">
      <$CommentPager$>
      <blogitemcomments>
<dt class="comment-data" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a>
<$I18NCommentAuthorSaid$></dt><br>
<dd class="comment-body">
        <p>
<$BlogCommentBody$></p>
<$BlogCommentDeleteIcon$>
      </dd>
   </BlogItemComments>
    <$CommentPager$>
    </dl>
</div>
<p class="comment-timestamp">
<$BlogItemCreate$>
    </p>
</div>
</ItemPage>
</blogger>
</div>
<br>

<div style=float:left;"><a class="time-machine" href=<$NewerPosts$>>NEWER</a></NewerPosts></div><div style=float:right;"><OlderPosts><a class="time-machine" href=<$OlderPosts$>>OLDER</a> </OlderPosts></div>
</div>

<!-------------------------------PAGE 1------------------------------------!>
<div id="entry" style="display: none;">
<blogger>
<div style="margin-top:-10px; margin-left:150px; width:300px; -moz-border-radius-bottomright: 20px; border-bottom-right-radius: 20px; -moz-border-radius-bottomleft: 20px; border-bottom-left-radius: 20px; background-color: #ffcccc; text-align:center; padding:5px; color:#fff; opacity:2;">
<BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
<br>
<$BlogItemBody$>
<post-footer>♥ Post by XXX @ <BlogDateHeader><$BlogDateHeaderDate$> </BlogDateHeader><$BlogItemDateTime$><br>
<div align="right">Leave a comment for me? <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> Comment</a></BlogItemCommentsEnabled></div>

</post-footer>

<itempage>
  <div id="comments" style="margin-top:5px;">
 <blogitemcommentsenabled><a name="comments"></a>
<dl id="comments-block">
<div style="width:540px; padding:5px;margin-top:20px;border:4px solid #fff;6px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrFyCVEMcC3uY1P5kpPvhMbPLhTXMO0qBJ0VWFYRh1vfe0PqdC3LMFdrb2RsrxBVlREciLneb3SQs4zUlhqsB-rqQ5O6aDvPJzpzOcD5Fn3XhM_UIkfeHGP_nQbDI1cx_juvXyH_Zgrb4J/s1600/IMG_5945.JPG); box-shadow:0  0 3px #FFEBCD;">
      <$CommentPager$>
      <blogitemcomments>
<dt class="comment-data" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a>
<$I18NCommentAuthorSaid$></dt><br>
<dd class="comment-body">
        <p>
<$BlogCommentBody$></p>
<$BlogCommentDeleteIcon$>
      </dd>
   </BlogItemComments>
    <$CommentPager$>
    </dl>
</div>
<p class="comment-timestamp">
<$BlogItemCreate$>
    </p>
</div>
</ItemPage>
</blogger>
</div>
<br>
</div>

<!-------------------------------PAGE 2------------------------------------!>
<div id="profile" style="display: none;">
<div style="margin-top:-10px; margin-left:150px; width:300px; -moz-border-radius-bottomright: 20px; border-bottom-right-radius: 20px; -moz-border-radius-bottomleft: 20px; border-bottom-left-radius: 20px; background-color: #ffcccc; text-align:center; padding:5px; color:#fff; opacity:2;">
About the owner of the blog</div><br>
Replace the information here with your personal profile
<br>
<br>
<br>
<br>
<br>
<hr>
<div style="margin-top:-7px; margin-left:150px; width:300px; -moz-border-radius-bottomright: 20px; border-bottom-right-radius: 20px; -moz-border-radius-bottomleft: 20px; border-bottom-left-radius: 20px; background-color: #ffcccc; text-align:center; padding:5px; color:#fff; opacity:2;">
Rewind</div><br>
<bloggerpreviousitems>
<a  href="<$BlogItemPermalinkURL$>">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx7h1nfTsmZtt_MgKNuJLKYN4YZDSgzpPcSOz6PE9k481eCdoOtpc6M6FHKxgXlCCmjJloDP7bata1GFNdxqpN4qxgeHvVFthTbhK5xEVPXF1n7nCDPrGbsUJfI4kqfJpuPMZizx0Jq3A/s1600/rib_8_1.gif">
<$BlogPreviousItemTitle$>
</a><br>
</BloggerPreviousItems>
</div>

<!-------------------------------PAGE 2------------------------------------!>
<div id="links" style="display: none;">
<div style="margin-top:-10px; margin-left:150px; width:300px; -moz-border-radius-bottomright: 20px; border-bottom-right-radius: 20px; -moz-border-radius-bottomleft: 20px; border-bottom-left-radius: 20px; background-color: #ffcccc; text-align:center; padding:5px; color:#fff; opacity:2;">
Visit'em ?</div><br>


<style type="text/css">
a.linkies {
width:125px;
border:2px solid #996633;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmgVSle33FM7YZ2Y0ER0r4qO9J-6mV5HQtQUzBxrqyW2eEdXX7iQmaUziw3u-O2IhPJsRAz8JRB-CJdBxueXWoQ9FkDh8E-gaVRsHXC_hfe65bAR0FQsPu-u_GIL7ZGM6-vGV4bBvbOCCk/s1600/IMG_5961.JPG);
padding:3px;
margin: 3px;
-webkit-transition-duration: .7s;
}

a.linkies:hover {
width:125px;
border:2px solid #fecdc9;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmgVSle33FM7YZ2Y0ER0r4qO9J-6mV5HQtQUzBxrqyW2eEdXX7iQmaUziw3u-O2IhPJsRAz8JRB-CJdBxueXWoQ9FkDh8E-gaVRsHXC_hfe65bAR0FQsPu-u_GIL7ZGM6-vGV4bBvbOCCk/s1600/IMG_5961.JPG);
padding:3px;
margin: 3px;
-webkit-transition-duration: .7s;
}
</style>
<center>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a><br><br>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
<a class="linkies" href="LINKS">friend</a>
</center>
</div>
</html>