; Blogskins Codes
BS ; 13 // LAVENDERR





<!---------------------------------------------------------------------------
Don't COPY Any Code From This Template ! 101% Made & Create By Elaine0211 !
Designed By; Elaine0211
Designer's Blog; https://elaine0211.blogspot.com/
Date Of Design; 01.02.17 -- 02.02.17
---------------------------------------------------------------------------!>
<HTML><head>

<base target='_blank'/><title>; LAVENDERR ♥</title>

<style type="text/css">

#navbar-iframe {display: none;}

body{
background:#f8e1ff;
font: 12px arial;
line-height:1.3;
color:#df9cf5;
cursor: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKeMrqY0_Yj80j0Rhli8zQ6WcaopTh40Xo0V_-G4Tq6nk-iy_K3CpLNeI5CQnA8IU8LJQpMLKhZO9pasZdcKxI24cXQocZLuowCB5lE61-IX18hlwSGNGhyYXON300PPTRRCoxWWIdveyS/s1600/04.gif), progress;}

::-moz-selection {
background:#fff;
color:#fff;
text-shadow: 1px 2px 2px #e4b5f4;}
::selection {
background:#fff;
color:#fff;
text-shadow: 1px 2px 2px #e4b5f4;}

::-webkit-scrollbar {width:2px;}
::-webkit-scrollbar-button:start:decrement{height:0px; display:block; background:none;}
::-webkit-scrollbar-button:end:increment{height:0px; display: block; background:none;}
::-webkit-scrollbar-track-piece {background-color:#fff;}
::-webkit-scrollbar-thumb{ background:#e4b5f4;}

a:link,a:visited {
color:#df9cf5;
text-decoration:none;
-webkit-transition: .3s;
-moz-transition: .3s;}

a:hover {
color:#f4d1ff;
-webkit-transition: .3s;
-moz-transition: .3s;}

b{
text-decoration:bold;
-webkit-filter: hue-rotate(0deg);
-webkit-transition: .5s;
-moz-transition: .5s;}
b:hover{
-webkit-filter: hue-rotate(360deg);
-webkit-transition: .5s;
-moz-transition: .5s;}

u{
text-decoration:underline;
border-bottom:1px dashed #e4b5f4;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;}

i{-webkit-transition: .4s;}
i:hover{letter-spacing:2px;-webkit-transition: .4s;}

/* Other
----------------------------------------------- */
blockquote {
border-left:3px double #e5b1f6;
border-right:3px double #e5b1f6;
padding: 5px 15px;}


/* links
----------------------------------------------- */
a.li {
text-align:center;
border-left:3px double #e5b1f6;
border-right:3px double #e5b1f6;
padding: 2px;
display:inline-block;
width:100px;
margin: 2px;
background: #fff;
overflow: hidden;
-webkit-transition: .6s;
-moz-transition: .6s;}

a.li:hover{
border-left:3px double #f4d1ff;
border-right:3px double #f4d1ff;
-webkit-transition: .6s;
-moz-transition: .6s;}

/* navi
----------------------------------------------- */
@-webkit-keyframes buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
@keyframes buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
.navi {
width:35px;
height:10px;
padding:4px;
font: 8px etiny;
letter-spacing:1px;
line-height:1.6;
background:#fff;
border:1px solid #e5b1f6;
display: inline-block;
text-align:center;
margin-left:5px;
display: inline-block;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px transparent;}

.navi:hover, .navi:focus, .navi:active {
-webkit-animation-name: buzz-out;
animation-name: buzz-out;
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;}

/* post
----------------------------------------------- */
#title {
width:520px;
border-left:6px double #e5b1f6;
border-right:6px double #e5b1f6;
margin: 5px auto;
text-align:center;}

#ending {
width:524px;
background:url(https://i.imgur.com/Lb1Dv4z.png) left top repeat-x;
padding-top:15px;
margin: 10px auto;
text-align:right;}

.date{
background:#fff;
font-size:10px;
border-left:3px double #e5b1f6;
border-right:3px double #e5b1f6;
line-height: 13px;
padding:2px 4px;
width:170px;
height: 13px;
margin: 4px auto;
text-align:center;}

.content {
position:fixed;
top:50px;
left:520px;
width:660px;
height:530px;
padding:10px;
background:#fff;
border:6px double #f8e1ff;}

#main{
position:fixed;
width:640px;
height:510px;
overflow-x:hidden;
background:#fff;
padding:10px;}

/* sidebar
----------------------------------------------- */
.bannertil{
color:#fff;
padding:5px;
position:absolute;
margin:-12px 41px;
background:#e5b1f6;
width:300px;
height:18px;
text-align:center;
LINE-HEIGHT:1.6;}

.banner{
position:absolute;
background:#df9cf5;
width:380px;
height:15px;
padding:5px;
text-align:center;}

.banner::after {
top: 100%;
right:0%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
border-right-color: #f8e1ff;
border-width: 14px;
margin-top:-27px;}

.banner::before {
top: 100%;
left:0%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
border-left-color: #f8e1ff;
border-width: 14px;
margin-top:-27px;}

#sidebox{
position:absolute;
margin: 0px 50px;
width:280px;
height:440px;
padding:5px;
border-top:0px solid #fff;
border:1px solid #df9cf5;
background:#fff;}

#tri{
position:absolute;
margin-top:15px;
margin-left:41px;
border-top: 10px solid #d086e8;
border-left: 10px solid transparent;}

#tri2{
position:absolute;
margin-top:15px;
margin-left:342px;
border-top: 10px solid #d086e8;
border-right: 10px solid transparent;}

@font-face {
font-family: "etiny";
src: url('https://dl.dropbox.com/s/t74az3yznkqxe3o/tinytots.ttf'); }

</style>

<script language="JavaScript">
document.ondragstart = function () { return false; };
</script>

<!-------------------Sidebar----------------------->
<div style="position:fixed; top:110px; left:50px;">
<div class="banner"></div>
<div id="sidebox"><BR/><BR/>
<CENTER>
<img src="https://i.imgur.com/X5AnJeV.gif" style="width:220px;"></img><br/><br/>
<a class="navi" onClick="document.getElementById('main').innerHTML=document.getElementById('post').innerHTML">HOME</a>
<a class="navi" onClick="document.getElementById('main').innerHTML=document.getElementById('stuff').innerHTML">STUFF</a>
<a class="navi" onClick="document.getElementById('main').innerHTML=document.getElementById('about').innerHTML">ABOUT</a>
<a class="navi" onClick="document.getElementById('main').innerHTML=document.getElementById('link').innerHTML">LINKS</a>
<a class="navi" href="https://www.blogger.com/follow-blog.g?blogID=YOUR BLOG ID">FOLLOW</a></CENTER>
<br/><br/>*Your can replace your cbox here*
<br/><br/>PLEASE DON'T REMOVE THE CREDITS.</div>
<div id="tri"></div><div id="tri2"></div>
<div class="bannertil">LAVENDERR</div></div>


<!-------------------Main----------------------->
<div class="content">
<div id="main">
<blogger>
<div id="title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div><br/>
<div class="post-body"><p><$BlogItemBody$></p></div>
<div class="date"><BlogDateHeader><$BlogDateHeaderDate$> </BlogDateHeader><$BlogItemDateTime$> || <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> Message(s)</a></BlogItemCommentsEnabled></div>
</Blogger>
<div id="ending">
<span style="margin-right:20px;line-height:1.3;">© 2017 Designed By <a href="https://elaine0211.blogspot.my/">Elaine0211</a>.</span>
<NewerPosts><a href=<$NewerPosts$>><img src="https://sweetmissy.net/adoptable/pixels/98.gif"></img></a></NewerPosts> <OlderPosts><a href=<$OlderPosts$>><img src="https://sweetmissy.net/adoptable/pixels/88.gif"></img></a></OlderPosts>
<br/></div>
</div></div>

<!-------------------diary----------------------->
<div id="post" style="display: none;">
<blogger>
<div id="title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div><br/>
<div class="post-body"><p><$BlogItemBody$></p></div>
<div class="date"><BlogDateHeader><$BlogDateHeaderDate$> </BlogDateHeader><$BlogItemDateTime$> || <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> Message(s)</a></BlogItemCommentsEnabled></div>
</Blogger>
<div id="ending">
<span style="margin-right:20px;line-height:1.3;">© 2017 Designed By <a href="https://elaine0211.blogspot.my/">Elaine0211</a>.</span>
<NewerPosts><a href=<$NewerPosts$>><img src="https://sweetmissy.net/adoptable/pixels/98.gif"></img></a></NewerPosts> <OlderPosts><a href=<$OlderPosts$>><img src="https://sweetmissy.net/adoptable/pixels/88.gif"></img></a></OlderPosts>
<br/></div>
</div>

<!-------------------PAGE2----------------------->
<div id="about" style="display: none;">
<div id="title">About</div><br/>
<center>
<br># Name :
<br># Age :
<br># Birthday :
<br># Tumblr :
<br># Blog :
<br># Facebook :
<br>--- Replace with your profile ---
</center>
</div>

<!-------------------stuff----------------------->
<div id="stuff" style="display: none;">
<div id="title">Stuff</div><br/>
<b> Tutorial ; </b>
<br><br>
• <a href="URL">List 1</a><br>
• <a href="URL">List 2</a><br>
• <a href="URL">List 3</a><br>
• <a href="URL">List 4</a><br>
• <a href="URL">List 5</a><br>
<br><br>
<b> Material ;</b>
<br><br>
• <a href="URL">List 1</a><br>
• <a href="URL">List 2</a><br>
• <a href="URL">List 3</a><br>
• <a href="URL">List 4</a><br>
• <a href="URL">List 5</a><br>
<br><br>
<blockquote class="tr_bq">Coming Soon..</blockquote>
</div>

<!-------------------link----------------------->
<div id="link" style="display: none;">
<div id="title">Links</div><br/>
<center>
<br><br>
<a class="li"href="URL">NAME</a>
<a class="li"href="URL">NAME</a>
<a class="li"href="URL">NAME</a>
<a class="li"href="URL">NAME</a>
<br>
<a class="li"href="URL">NAME</a>
<a class="li"href="URL">NAME</a>
<a class="li"href="URL">NAME</a>
<a class="li"href="URL">NAME</a>
<br><br><br><br>
</center>
</div>

<!-------------------------- END ----------->

Other Blogskins templete :

» BS ; 12 // M.A.D.E
» BS ; 11 // Wish List
» BS ; 10 // Blossom
» BS ; 09 // Secret
» BS ; 08 // Bunny Bunny
» BS ; 07 // Forever Friend
» BS ; 06 // Hi Darling
» BS ; 05 // Paris Lovee
» BS ; 04 // f(x) - Red Light
» BS ; 03 // Beloved Café

© 2012-2020 Designed By Elaine0211