BS ; 11 // Wish List
<!---------------------------------------------------------------------------
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; 16.12.15 -- 19.12.15
---------------------------------------------------------------------------!>
<HTML><head>
<link href='https://fonts.googleapis.com/css?family=Snippet' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Megrim' rel='stylesheet' type='text/css'>
<base target='_blank'/><title>; Wish List</title>
<style type="text/css">
#navbar-iframe {display: none;}
body {
background: #fff;
cursor:url(https://i1245.photobucket.com/albums/gg581/elaine960211/CHRISTMAS-CUR_zpsykpped95.png), progress;
font-family:Snippet;
font-size:13px;
color:#aaa;}
::-moz-selection {
background:#fff;
color:#fff;
text-shadow: 0.1em 0.1em #ddd;}
::selection {
background:#fff;
color:#fff;
text-shadow: 0.1em 0.1em #ddd;}
::-webkit-scrollbar { width: 6px;}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment { height:0px; display: block; background-color: #fff;}
::-webkit-scrollbar-track-piece { background-color:#fff; }
::-webkit-scrollbar-thumb{ background:url(https://i.imgur.com/k4ippJn.jpg)center;border:1px solid #ff0000;box-shadow:inset 0 0 10px #fff;}
::webkit-scrollbar-thumb:vertical , ::webkit-scrollbar-thumb:horizontal {background:#fff;}
a:link,a:visited {
color:#aaa;
text-decoration:none;
filter: blur(0px);
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-webkit-transition: 0.6s;
-moz-transition: 0.6s;
padding:2px;}
a:hover {
filter: blur(1px);
-webkit-filter: blur(1px);
-moz-filter: blur(1px);
-webkit-transition: 0.6s;
-moz-transition: 0.6s;
cursor:url(https://i1245.photobucket.com/albums/gg581/elaine960211/CHRISTMAS-CUR2_zpskkcacnm0.png), progress;}
u {
text-decoration:underline;}
u:hover {
text-decoration:none;
-webkit-transition: 0.6s;
-moz-transition: 0.6s;}
b {
text-decoration:bold;
-webkit-transition: .8s;
-moz-transition: .8s;}
b:hover {
-webkit-transform:rotateY(-180deg);
-moz-transform:rotateY(-180deg);
transform:rotateY(-180deg);
-webkit-transition: .8s;
-moz-transition: .8s;}
i {
-webkit-transition: .2s;
-moz-transition: .2s;}
i:hover {
letter-spacing:2px;
-webkit-transition: .2s;
-moz-transition:.2s;}
.post-title{
font-family: 'Megrim';
padding:0 0 3px 5px;
color:#ff0000;
text-align:left;
background:url(https://i.imgur.com/vRSJAST.png) repeat-x;
background-position:bottom left;}
.page-title{
font-family: 'Megrim';
font-size:20px;
color:#ff0000;
padding:0 0 5px 5px;
text-align:left;
background:url(https://i.imgur.com/vRSJAST.png) repeat-x;
background-position:bottom left;}
/* Other
----------------------------------------------- */
blockquote {
text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
text-align:center;
border:1px solid #ddd;
padding:5px;
box-shadow:inset 0 0 20px #eee;
-webkit-transition: .6s;}
blockquote:hover {
box-shadow:inset 0 0 50px #eee;
-webkit-transition: .6s;}
a.li {
border:1px solid #ccc;
padding: 3px;
display:inline-block;
width:100px;
margin: 2px;
background: #fff;}
.content {
position:ABSOLUTE;
left:20%;
top:288px;
width:730px;
padding:10px;
border:1px solid #eee;}
/* Navi
----------------------------------------------- */
nav {
width:750px;
padding:14px 0 22px 0;
text-align:left;
background:rgba(255,255,255,1);
top:250px;
left:20%;
z-index:999;
height:10px;
border:1px solid #eee;
font:11px calibri;
text-transform:uppercase;
position:absolute; }
nav icon:hover {
-webkit-animation-name: icon-pop;
animation-name: icon-pop;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-iteration-count: 5;
animation-iteration-count: 5;}
nav a {
padding-left:10px;
display:inline-block;
letter-spacing:1px;
position: relative;
display: inline-block;
outline: none;
text-transform: uppercase;
letter-spacing: 1px;}
nav a:hover, nav a:focus {outline: none;}
.navi a {
overflow: hidden;
padding: 0 10px;
height: 1em;}
.navi a span {
position: relative;
display: inline-block;
-webkit-transition: -webkit-transform 0.3s;
-moz-transition: -moz-transform 0.3s;
transition: transform 0.3s;}
.navi a span::before {
color:#ff0000;
position: absolute;
top: 100%;
content: attr(data-hover);
text-decoration:bold;
-webkit-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);}
.navi a:hover span, .navi a:focus span {
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
transform: translateY(-100%);}
@-webkit-keyframes icon-pop {
50% {
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
}
@keyframes icon-pop {
50% {
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
}
/* Header
----------------------------------------------- */
.csslider1 {
display: inline-block;
position: absolute;
border:1px solid #eee;
width: 750px;
height:250px;
top: -1px;
left:20%;}
.csslider1 > ul > .cs_skeleton {
width:750px;
height:250px;
visibility: hidden;
font-size: 0px;
line-height: 0;}
.csslider1 > ul > .slide.img img {width: 100%;}
.csslider1 > ul > .slide {
position: relative;
display: inline-block;
width: 100%;
height: 100%;
overflow: hidden;
vertical-align: top;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);}
.csslider1 > .cs_anchor {display: none;}
.csslider1 > ul {overflow: hidden;}
.csslider1 > ul > .slide {
position: absolute;
left: 0;
top: 0;
display: inline-block;
opacity: 0;
z-index: 1;
-webkit-transition: -webkit-transform 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550), opacity 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
transition: -webkit-transform 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550), transform 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550), opacity 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);}
@-webkit-keyframes jump1 {
0%, 47.00854700854701%, 100% {
opacity: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
13.675213675213676%, 33.333333333333336% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
0%, 33.33233333333334% {
z-index: 2;
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
33.33433333333333%, 100% { z-index: 1; }
}
@keyframes jump1 {
0%, 47.00854700854701%, 100% {
opacity: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
13.675213675213676%, 33.333333333333336% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
0%, 33.33233333333334% {
z-index: 2;
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
33.33433333333333%, 100% { z-index: 1; }}
.csslider1 > #cs_play1:checked ~ ul > .slide.num0 {
-webkit-animation: jump1 11700ms infinite -1600ms;
animation: jump1 11700ms infinite -1600ms;}
.csslider1 > #cs_play1:checked ~ ul > .slide.num1 {
-webkit-animation: jump1 11700ms infinite 2300ms;
animation: jump1 11700ms infinite 2300ms;}
.csslider1 > #cs_play1:checked ~ ul > .slide.num2 {
-webkit-animation: jump1 11700ms infinite 6200ms;
animation: jump1 11700ms infinite 6200ms;}
.csslider1 > #cs_play1:checked ~ ul > .slide.num3 {
-webkit-animation: jump1 11700ms infinite 10100ms;
animation: jump1 11700ms infinite 10100ms;}
.csslider1 > #cs_play1:checked ~ ul > .slide,
.csslider1 > .pause:checked ~ ul > .slide {
-webkit-transition: none;
transition: none;}
</style>
<script language="JavaScript">
document.ondragstart = function () { return false; };
</script>
<!-------------------player----------------------->
<div style="position:fixed;bottom:0; left:0;"><embed src="https://www.sheepproductions.com/billy/billy.swf?autoplay=true&f0=https://dl.dropbox.com/s/xyj2vha59cybx86/Fx%20-%20Wish%20List%2012%EC%8B%9C%2025%EB%B6%84.mp3=0&t0=Wish List&total=1" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" /></div>
<!-------------------Header----------------------->
<div class='csslider1 autoplay'>
<input name="cs_anchor1" id='cs_slide1_0' type="radio" class='cs_anchor slide' >
<input name="cs_anchor1" id='cs_slide1_1' type="radio" class='cs_anchor slide' >
<input name="cs_anchor1" id='cs_slide1_2' type="radio" class='cs_anchor slide' >
<input name="cs_anchor1" id='cs_slide1_3' type="radio" class='cs_anchor slide' >
<input name="cs_anchor1" id='cs_play1' type="radio" class='cs_anchor' checked>
<ul>
<li class="cs_skeleton"></li>
<li class='num0 img slide'>
<img src='https://i.imgur.com/hEYevjX.jpg' alt='' title='' /></li>
<li class='num1 img slide'>
<img src='https://i.imgur.com/iKNTSD8.jpg' alt='' title='' /></li>
<li class='num2 img slide'>
<img src='https://i.imgur.com/oo6bfp0.jpg' alt='' title='' /></li>
</ul></div>
<!-------------------Navi----------------------->
<nav class="navi" id="navi">
<center><icon>☆</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('post').innerHTML" title=""><span data-hover="Diary">Diary</span></a> <icon>★</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('about').innerHTML" title=""><span data-hover="Owner">Owner</span></a> <icon>☆</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('link').innerHTML" title=""><span data-hover="Links">Links</span></a> <icon>★</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('stuff').innerHTML" title=""><span data-hover="Stuff">Stuff</span></a> <icon>☆</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('cbox').innerHTML" title=""><span data-hover="Chat">Chat</span></a> <icon>★</icon>
<a class="" href="https://www.blogger.com/"><span data-hover="Home">Home</span></a> <icon>☆</icon>
<a class="" href="https://www.blogger.com/follow-blog.g?blogID=YOUR BLOG ID"><span data-hover="Follow">Follow</span></a> <icon>★</icon>
</center></nav>
<!-------------------Post----------------------->
<div class="content">
<div id="main">
<blogger><br/>
<div class="post-title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
• <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> List(s)</a></BlogItemCommentsEnabled>
<div class="post-body">
<p><$BlogItemBody$></p></div>
</Blogger>
<center><NewerPosts><a href=<$NewerPosts$>>←← Newer</a></NewerPosts> // <OlderPosts><a href=<$OlderPosts$>>Older →→</a></OlderPosts></center>
</div></Blogger></div>
<!-------------------cbox----------------------->
<div id="cbox" style="display: none;"><br/>
<div class="page-title">Credit</div>
<br>
▶ Design by; <a href="https://elaine0211.blogspot.com/">BabeX e.ling</a><br>
▶ Redesign by; <a href="blog link">Your Name</a><br>
▶ Navi; <a href="https://tympanus.net/codrops">Tympanus</a><br>
▶ Sliders; <a href="cssslider.com">css Slider</a>
<br> Best Viewed In Google Chrome. (1366px × 768px)<br/><br/><br/>
<div class="page-title">Chat</div><br>
<center><div id="cboxdiv" style="padding:10px;width:240px;text-align:center;border: 1px dashed transparent;
-moz-border-image: -moz-linear-gradient(top, #ccc,#fff,#fff,#fff,#ccc);
-webkit-border-image: -webkit-linear-gradient(top, #ccc,#fff,#fff,#fff,#ccc);
border-image: linear-gradient(to bottom, #ccc,#fff,#fff,#fff,#ccc);
border-image-slice: 1;">
Cbox Code Here *Width:240px Height:70px </center><br/><br/>
</div></div>
<!-------------------PAGE1----------------------->
<div id="post" style="display: none;"><br/>
<Blogger>
<div class="post-title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
• <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> List(s)</a></BlogItemCommentsEnabled>
<div class="post-body">
<p><$BlogItemBody$></p></div>
</Blogger>
<center><NewerPosts><a href=<$NewerPosts$>>←← Newer</a></NewerPosts> // <OlderPosts><a href=<$OlderPosts$>>Older →→</a></OlderPosts></center>
</div></div></div>
</Blogger>
</div></div>
<!-------------------PAGE2----------------------->
<div id="about" style="display: none;"><br/>
<div class="page-title">Da' Owner</div>
<br>
<center>
<br># Name :
<br># Age :
<br># Birthday :
<br># Tumblr :
<br># Blog :
<br># Facebook :
<br>--- Replace with your profile ---
</center>
</div>
<!-------------------PAGE3----------------------->
<div id="link" style="display: none;"><br/>
<div class="page-title">Beloved Bloggie</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>
<!-------------------PAGE4----------------------->
<div id="stuff" style="display: none;"><br/>
<div class="page-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>
<!-------------------------- END ----------->
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; 16.12.15 -- 19.12.15
---------------------------------------------------------------------------!>
<HTML><head>
<link href='https://fonts.googleapis.com/css?family=Snippet' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Megrim' rel='stylesheet' type='text/css'>
<base target='_blank'/><title>; Wish List</title>
<style type="text/css">
#navbar-iframe {display: none;}
body {
background: #fff;
cursor:url(https://i1245.photobucket.com/albums/gg581/elaine960211/CHRISTMAS-CUR_zpsykpped95.png), progress;
font-family:Snippet;
font-size:13px;
color:#aaa;}
::-moz-selection {
background:#fff;
color:#fff;
text-shadow: 0.1em 0.1em #ddd;}
::selection {
background:#fff;
color:#fff;
text-shadow: 0.1em 0.1em #ddd;}
::-webkit-scrollbar { width: 6px;}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment { height:0px; display: block; background-color: #fff;}
::-webkit-scrollbar-track-piece { background-color:#fff; }
::-webkit-scrollbar-thumb{ background:url(https://i.imgur.com/k4ippJn.jpg)center;border:1px solid #ff0000;box-shadow:inset 0 0 10px #fff;}
::webkit-scrollbar-thumb:vertical , ::webkit-scrollbar-thumb:horizontal {background:#fff;}
a:link,a:visited {
color:#aaa;
text-decoration:none;
filter: blur(0px);
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-webkit-transition: 0.6s;
-moz-transition: 0.6s;
padding:2px;}
a:hover {
filter: blur(1px);
-webkit-filter: blur(1px);
-moz-filter: blur(1px);
-webkit-transition: 0.6s;
-moz-transition: 0.6s;
cursor:url(https://i1245.photobucket.com/albums/gg581/elaine960211/CHRISTMAS-CUR2_zpskkcacnm0.png), progress;}
u {
text-decoration:underline;}
u:hover {
text-decoration:none;
-webkit-transition: 0.6s;
-moz-transition: 0.6s;}
b {
text-decoration:bold;
-webkit-transition: .8s;
-moz-transition: .8s;}
b:hover {
-webkit-transform:rotateY(-180deg);
-moz-transform:rotateY(-180deg);
transform:rotateY(-180deg);
-webkit-transition: .8s;
-moz-transition: .8s;}
i {
-webkit-transition: .2s;
-moz-transition: .2s;}
i:hover {
letter-spacing:2px;
-webkit-transition: .2s;
-moz-transition:.2s;}
.post-title{
font-family: 'Megrim';
padding:0 0 3px 5px;
color:#ff0000;
text-align:left;
background:url(https://i.imgur.com/vRSJAST.png) repeat-x;
background-position:bottom left;}
.page-title{
font-family: 'Megrim';
font-size:20px;
color:#ff0000;
padding:0 0 5px 5px;
text-align:left;
background:url(https://i.imgur.com/vRSJAST.png) repeat-x;
background-position:bottom left;}
/* Other
----------------------------------------------- */
blockquote {
text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
text-align:center;
border:1px solid #ddd;
padding:5px;
box-shadow:inset 0 0 20px #eee;
-webkit-transition: .6s;}
blockquote:hover {
box-shadow:inset 0 0 50px #eee;
-webkit-transition: .6s;}
a.li {
border:1px solid #ccc;
padding: 3px;
display:inline-block;
width:100px;
margin: 2px;
background: #fff;}
.content {
position:ABSOLUTE;
left:20%;
top:288px;
width:730px;
padding:10px;
border:1px solid #eee;}
/* Navi
----------------------------------------------- */
nav {
width:750px;
padding:14px 0 22px 0;
text-align:left;
background:rgba(255,255,255,1);
top:250px;
left:20%;
z-index:999;
height:10px;
border:1px solid #eee;
font:11px calibri;
text-transform:uppercase;
position:absolute; }
nav icon:hover {
-webkit-animation-name: icon-pop;
animation-name: icon-pop;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-iteration-count: 5;
animation-iteration-count: 5;}
nav a {
padding-left:10px;
display:inline-block;
letter-spacing:1px;
position: relative;
display: inline-block;
outline: none;
text-transform: uppercase;
letter-spacing: 1px;}
nav a:hover, nav a:focus {outline: none;}
.navi a {
overflow: hidden;
padding: 0 10px;
height: 1em;}
.navi a span {
position: relative;
display: inline-block;
-webkit-transition: -webkit-transform 0.3s;
-moz-transition: -moz-transform 0.3s;
transition: transform 0.3s;}
.navi a span::before {
color:#ff0000;
position: absolute;
top: 100%;
content: attr(data-hover);
text-decoration:bold;
-webkit-transform: translate3d(0,0,0);
-moz-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);}
.navi a:hover span, .navi a:focus span {
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
transform: translateY(-100%);}
@-webkit-keyframes icon-pop {
50% {
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
}
@keyframes icon-pop {
50% {
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
}
/* Header
----------------------------------------------- */
.csslider1 {
display: inline-block;
position: absolute;
border:1px solid #eee;
width: 750px;
height:250px;
top: -1px;
left:20%;}
.csslider1 > ul > .cs_skeleton {
width:750px;
height:250px;
visibility: hidden;
font-size: 0px;
line-height: 0;}
.csslider1 > ul > .slide.img img {width: 100%;}
.csslider1 > ul > .slide {
position: relative;
display: inline-block;
width: 100%;
height: 100%;
overflow: hidden;
vertical-align: top;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);}
.csslider1 > .cs_anchor {display: none;}
.csslider1 > ul {overflow: hidden;}
.csslider1 > ul > .slide {
position: absolute;
left: 0;
top: 0;
display: inline-block;
opacity: 0;
z-index: 1;
-webkit-transition: -webkit-transform 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550), opacity 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
transition: -webkit-transform 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550), transform 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550), opacity 1600ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);}
@-webkit-keyframes jump1 {
0%, 47.00854700854701%, 100% {
opacity: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
13.675213675213676%, 33.333333333333336% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
0%, 33.33233333333334% {
z-index: 2;
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
33.33433333333333%, 100% { z-index: 1; }
}
@keyframes jump1 {
0%, 47.00854700854701%, 100% {
opacity: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
13.675213675213676%, 33.333333333333336% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
0%, 33.33233333333334% {
z-index: 2;
-webkit-animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
animation-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
33.33433333333333%, 100% { z-index: 1; }}
.csslider1 > #cs_play1:checked ~ ul > .slide.num0 {
-webkit-animation: jump1 11700ms infinite -1600ms;
animation: jump1 11700ms infinite -1600ms;}
.csslider1 > #cs_play1:checked ~ ul > .slide.num1 {
-webkit-animation: jump1 11700ms infinite 2300ms;
animation: jump1 11700ms infinite 2300ms;}
.csslider1 > #cs_play1:checked ~ ul > .slide.num2 {
-webkit-animation: jump1 11700ms infinite 6200ms;
animation: jump1 11700ms infinite 6200ms;}
.csslider1 > #cs_play1:checked ~ ul > .slide.num3 {
-webkit-animation: jump1 11700ms infinite 10100ms;
animation: jump1 11700ms infinite 10100ms;}
.csslider1 > #cs_play1:checked ~ ul > .slide,
.csslider1 > .pause:checked ~ ul > .slide {
-webkit-transition: none;
transition: none;}
</style>
<script language="JavaScript">
document.ondragstart = function () { return false; };
</script>
<!-------------------player----------------------->
<div style="position:fixed;bottom:0; left:0;"><embed src="https://www.sheepproductions.com/billy/billy.swf?autoplay=true&f0=https://dl.dropbox.com/s/xyj2vha59cybx86/Fx%20-%20Wish%20List%2012%EC%8B%9C%2025%EB%B6%84.mp3=0&t0=Wish List&total=1" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" /></div>
<!-------------------Header----------------------->
<div class='csslider1 autoplay'>
<input name="cs_anchor1" id='cs_slide1_0' type="radio" class='cs_anchor slide' >
<input name="cs_anchor1" id='cs_slide1_1' type="radio" class='cs_anchor slide' >
<input name="cs_anchor1" id='cs_slide1_2' type="radio" class='cs_anchor slide' >
<input name="cs_anchor1" id='cs_slide1_3' type="radio" class='cs_anchor slide' >
<input name="cs_anchor1" id='cs_play1' type="radio" class='cs_anchor' checked>
<ul>
<li class="cs_skeleton"></li>
<li class='num0 img slide'>
<img src='https://i.imgur.com/hEYevjX.jpg' alt='' title='' /></li>
<li class='num1 img slide'>
<img src='https://i.imgur.com/iKNTSD8.jpg' alt='' title='' /></li>
<li class='num2 img slide'>
<img src='https://i.imgur.com/oo6bfp0.jpg' alt='' title='' /></li>
</ul></div>
<!-------------------Navi----------------------->
<nav class="navi" id="navi">
<center><icon>☆</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('post').innerHTML" title=""><span data-hover="Diary">Diary</span></a> <icon>★</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('about').innerHTML" title=""><span data-hover="Owner">Owner</span></a> <icon>☆</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('link').innerHTML" title=""><span data-hover="Links">Links</span></a> <icon>★</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('stuff').innerHTML" title=""><span data-hover="Stuff">Stuff</span></a> <icon>☆</icon>
<a class="" onClick="document.getElementById('main').innerHTML=document.getElementById('cbox').innerHTML" title=""><span data-hover="Chat">Chat</span></a> <icon>★</icon>
<a class="" href="https://www.blogger.com/"><span data-hover="Home">Home</span></a> <icon>☆</icon>
<a class="" href="https://www.blogger.com/follow-blog.g?blogID=YOUR BLOG ID"><span data-hover="Follow">Follow</span></a> <icon>★</icon>
</center></nav>
<!-------------------Post----------------------->
<div class="content">
<div id="main">
<blogger><br/>
<div class="post-title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
• <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> List(s)</a></BlogItemCommentsEnabled>
<div class="post-body">
<p><$BlogItemBody$></p></div>
</Blogger>
<center><NewerPosts><a href=<$NewerPosts$>>←← Newer</a></NewerPosts> // <OlderPosts><a href=<$OlderPosts$>>Older →→</a></OlderPosts></center>
</div></Blogger></div>
<!-------------------cbox----------------------->
<div id="cbox" style="display: none;"><br/>
<div class="page-title">Credit</div>
<br>
▶ Design by; <a href="https://elaine0211.blogspot.com/">BabeX e.ling</a><br>
▶ Redesign by; <a href="blog link">Your Name</a><br>
▶ Navi; <a href="https://tympanus.net/codrops">Tympanus</a><br>
▶ Sliders; <a href="cssslider.com">css Slider</a>
<br> Best Viewed In Google Chrome. (1366px × 768px)<br/><br/><br/>
<div class="page-title">Chat</div><br>
<center><div id="cboxdiv" style="padding:10px;width:240px;text-align:center;border: 1px dashed transparent;
-moz-border-image: -moz-linear-gradient(top, #ccc,#fff,#fff,#fff,#ccc);
-webkit-border-image: -webkit-linear-gradient(top, #ccc,#fff,#fff,#fff,#ccc);
border-image: linear-gradient(to bottom, #ccc,#fff,#fff,#fff,#ccc);
border-image-slice: 1;">
Cbox Code Here *Width:240px Height:70px </center><br/><br/>
</div></div>
<!-------------------PAGE1----------------------->
<div id="post" style="display: none;"><br/>
<Blogger>
<div class="post-title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
• <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> List(s)</a></BlogItemCommentsEnabled>
<div class="post-body">
<p><$BlogItemBody$></p></div>
</Blogger>
<center><NewerPosts><a href=<$NewerPosts$>>←← Newer</a></NewerPosts> // <OlderPosts><a href=<$OlderPosts$>>Older →→</a></OlderPosts></center>
</div></div></div>
</Blogger>
</div></div>
<!-------------------PAGE2----------------------->
<div id="about" style="display: none;"><br/>
<div class="page-title">Da' Owner</div>
<br>
<center>
<br># Name :
<br># Age :
<br># Birthday :
<br># Tumblr :
<br># Blog :
<br># Facebook :
<br>--- Replace with your profile ---
</center>
</div>
<!-------------------PAGE3----------------------->
<div id="link" style="display: none;"><br/>
<div class="page-title">Beloved Bloggie</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>
<!-------------------PAGE4----------------------->
<div id="stuff" style="display: none;"><br/>
<div class="page-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>
<!-------------------------- END ----------->