Serial Experiments Lain Layout

Tags: #layout, #autoplay, #customcursor, #serialexperimentslain, #lain, #anime

Description:

Serial Experiments Lain layout with custom cursor and Duvet by Bôa autoplay.

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Taylor ☘︎ 🃟 (https://layouts.spacehey.com/layout?id=38442) -->

<style>
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&display=swap');
body{font-family: 'Special Elite', cursive;}
</style>

<style>

body{
background: url(https://64.media.tumblr.com/0c87d7c3e08ab37a9d5df2d5cd8cfd73/c789e6cc4463a35c-8d/s2048x3072/03a7bbdd2ab66368742cf5501c64f240c45a08f7.pnj)
}

nav::before {
    content: ' ';
    width: 675px;
    height: 235px;
    display: block;
    margin: 20px auto;
    top: 0;
    left: 0;
    z-index: 100;
    background: url(https://64.media.tumblr.com/6c6109a3c85afbdf627466cc15174509/a2570b42d8636a63-df/s540x810/8efca5d48450e296e9c42dcd194e4f4f85b85366.pnj);
    background-size: cover;
    background-position: center;
}

nav .top {
    background: #000000cc;
    color: #0e791f;
    padding: 15px 10px 14px 10px;
    position: relative;
}

.logo {

content:url("https://64.media.tumblr.com/3a052d332bf12fbf42d2600ae3b469ee/cc9ab1822d53d505-46/s250x400/9ab7920586ddff3b244eaf66ec9e346493232075.pnj");

}

button, input {
    overflow: visible;
    background: #000000cc;
    border: 1px solid #0e791f;
    color: #0e791f;
    font-weight: bold;
}

.logout-btn, .logout-form {
    color: #0e791f;
    text-transform: uppercase;
    display: inline-block;
    font-size: 100%;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
    content: "✉";
    color: #e9f5eb;
}

nav .links {
    background-color: transparent;
    text-align: center;
    padding: 3.5px 16px 5.5px 16px;
}

nav .links a {
    text-decoration: none;
    color: #e9f5eb;
    text-shadow: 0 0 5px #e9f5eb;
    font-size: 0.98em;
    font-size: max(0.98em, 12px);
}

nav .links .special a {
    color: #e9f5eb;
}

nav .links a:hover {
    text-decoration: underline;
    color: #e9f5eb;
    font-weight: bolder;
    text-transform: uppercase;
}

main:before {
    width: auto;
    margin-bottom: 25px;
    border: 1px solid black;
    height: 150px;
    display: block;
    content: "";
    background-image: url(https://64.media.tumblr.com/f6f616ca6be23f7ca4dd859d4e0d20d0/91a91bfb34cdb741-6e/s500x750/00cf51274feb7be5145daf2aa82d45947663e9e0.jpg);
    background-position: center center;
    background-size: cover;
}

main {
    background: #000000cc;
    color: #e9f5eb;
    border: 1px solid #0e791f;
    padding: 6px 0px;
    font-size: 80%;
text-align: center;
}

span {
    text-align: center;
    color: #e9f5eb;
    text-transform: uppercase;
    font-size: 170%;
}

a {
    color: #0e791f;
    text-decoration: none;
}

a:hover, a:active, .blog-entry .kudos-btn:hover, .blog-entry .kudos-btn:active {
    color: #e9f5eb;
    text-transform: uppercase;
    font-weight: bolder;
    font-style: italic;
}

.edit-link {
    font-size: 90%;
    text-align: center;
}

.general-about .profile-pic {
    display: block;
    float: left;
    margin: 0 15px 8px 0;
    border: 1px solid #0e791f;
}

.general-about .details {
    display: flow-root;
    text-align: center;
}

.profile .mood {
    width: 100%;
    display: inline-block;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
}

.mood:after {
    content: "";
    white-space: pre-wrap;
    display: block;
    height: 50px;
    background-image: url(https://64.media.tumblr.com/e5d5f44dd7b8f4f72c302353dfb2ba50/34ec6d5a12765c24-2a/s400x600/d94c7c6c42a316270e948bd3a11f4a0ca76e0bdd.jpg);
    background-position-x: center;
    background-repeat: no-repeat;
    background-size: 300px;
}


.profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {
    background: transparent;
    color: #e9f5eb;
    text-align: center;
    border-bottom: 1px solid #0e791f;
    padding: 2px 7px;
}

.profile .blurbs .section p {
font-size: 15px;
text-align: center;
}


.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {
    width: 100%;
    border: 1px solid #0e791f;
    margin: 10px 0;
}

.details-table td:first-child {
    background: transparent;
    color: #0e791f;
    text-align: center;
    font-weight: bold;
    border: 1px solid #0e791f;
    width: 33%;
}

.details-table td {
    background: transparent;
    color: white;
    border: 1px solid #0e791f;
    vertical-align: top;
}

.profile-info {
    border: 1px solid #0e791f;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 100px 30px;
    margin-bottom: 10px;
}

.profile .profile-info {
	background-image: url();
	padding: 20px;
    border: 1px solid #0e791f;
    
}


.profile .blurbs .heading, .profile .friends .heading {
    background: transparent;
    border-bottom: 1px solid #0e791f;
    color: #0e791f;
    padding: 2px 7px;
    text-align: center;
}

.profile .blurbs {
    margin: 20px 0;
    border: 1px solid #0e791f;
    
}

.profile .blurbs .section h4 {
    margin: 0;
    color: #e9f5eb;
    text-align: center;
}

.friends {
    border: 1px solid #0e791f;
    
}

.count {
    color: #0e791f;
}

.profile .friends .person p {
    color: #0e791f;
    font-weight: bold;
    width: 100%;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 100%;
    text-align: center;
}

.profile .friends .person img:not(.icon) {
    max-width: 95px;
    max-height: 95px;
    display: block;
    margin: 0 auto;
    border: 1px solid #0e791f;
    
}


.friends-grid {
    border-top: 1px solid #0e791f;
    padding-top: 10px;
}

.comments-table td:first-child, .music-table td:first-child {
    background: black;
    border: 1px solid #0e791f;
    text-align: center;
    font-weight: bold;
    width: 38%;
}

.comments-table td:first-child img:not(.icon) {
    width: 90px;
    max-width: 100%;
    max-height: 200px;
    border: 1px solid #0e791f;
    
}

.comments-table td, .music-table td {
    background: #000000;
    border: 1px solid #0e791f;
    vertical-align: top;
}

table.comments-table {
    border: 1px solid #0e791f;
    
}


footer {
    text-align: center;
    font-size: 70%;
    margin: 10px 0 10px;
    padding: 10px 5px;
    background: #00000000;
    color: #cdd8db;
     
}


::-webkit-scrollbar {
    width: 12px;
    height: 12px;
BACKGROUND-COLOR: black;
}
::-webkit-scrollbar-track {
    border-radius: 10px;
    width: 2px;
    border: 1px dotted #e9f5eb;
}
::-webkit-scrollbar-thumb {
    background: #0e791f;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #e9f5eb;  
}

.online {
    content: url(https://64.media.tumblr.com/049b7cefd857e4c09bb4e6a1a5ae608b/e9753ddfff1aa386-87/s100x200/acca2d0749f06fc4cead0ac7eac14257e508209b.gifv)
}

    .icon, .award img {
        content: url(https://64.media.tumblr.com/350ab8b8cf6f7b5f313cd0376590a5dc/7ed850f839aece3a-7a/s75x75_c1/8eaf71eb757a59a1f31ec8d153dae28be58728ba.gifv);
        display: inline-block;
        height: 2.0em;
        width: 2.0em;
        margin: 0 .05em 0 .1em;
        vertical-align: -0.3em;
        color: rgba(0,0,0,0);
    }

HTML,BODY{cursor: 
url(http://www.rw-designer.com/cursor-view/69693.png),
auto;}


A:hover{cursor: 
url(http://www.rw-designer.com/cursor-view/69693.png),
auto;}

body:before {

content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://i.pinimg.com/originals/b6/e6/0c/b6e60c232eea473eb8bce612ed569cd3.gif');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 3s ease 0s 1 normal forwards;
pointer-events: none;

}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 

<style>  body {
text-align: center;
}</style>

<iframe width="0" height="0" src="https://www.youtube.com/embed/o7fgFaXKVa0//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
</iframe>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 51 comments ( View all | Add Comment )

Reivant	1731393440 using Report Comment
Marie >_<	1731111341 Using !!! Report Comment
alex !	1730916950 usingg Report Comment
mary	1729465029 USING!!! Report Comment
StupidRatt	1727588907 Using!! :3 Report Comment
aestxr	1727224669 Using!!!! :D Report Comment
Sachiel Laurel	1727201026 using Report Comment
particle theory	1725307688 using Report Comment
𝘼𝙉𝙂𝙀𝙇(天使)୨୧ᵎᵎ	1724939587 Using!!! Report Comment
Richard	1724583292 using Report Comment
Boris01	1724505144 Using :333 Report Comment
cassius ๋࣭ ⭑	1724456376 using as a base !!! ty Report Comment
nateymatey	1722895851 using (^_^) Report Comment
someya	1722680488 using!!also love that darkthrone pfp lmao Report Comment
Sevval	1721498601 Using Report Comment
Sina	1721081536 using! Report Comment
mar1lov	1720785974 Using!! Report Comment
who up illing they mental?!	1720115480 using!! Report Comment
Yisus	1718592981 Using! Report Comment
hailey☆	1718343628 using! Report Comment