go visible [lain]

Tags: serial, experiments, lain, static, vhs, purple, black, gif, animated, simple

Description:

Click here to see full SS. This is my second layout. :-) Feel free to change anything in the code you want. No creds needed. The static and the VHS background are both gifs, but don't need any sort of flash warning imo. Images jiggle when you hover over them. Highlighted text is white text with black highlight. There is an intro animation of Lain that peeks in for just one second before disappearing in the top left corner of the page when the page first loads. Anything hidden can easily be unhidden by removing the display codes. Every display tweak or effect is separated by additional style tags and plenty of spacing so that it's all nice and easy to format to your liking. I've added links at the bottom of the about me box to add/view comments. Make sure you input your profile ID# where it says YOURACCOUNTID#HERE for them to work. You can find your account ID# under account settings. Make sure for the interests box area you only type in the "general" section, otherwise it won't show up bc the other boxes are hidden. Enjoy. ^.^

Preview:

Code:

<!-- (c) Layout created by (https://layouts.spacehey.com/layout?id=30674) --> <center><i>look at all this space to write anything<br/><br/> <img src="https://i.ibb.co/6Y2H5zS/surreal-gif.gif" width="380"/><br/><br/> replace your profile ID# in comment links if wanted<br/> also change anything & never credit me, idgaf 🎔<br/><br/></i> <font size="5"><a href="https://spacehey.com/comments?id=YOURACCOUNTID#HERE"><font size="3">add comment</font></a> <font color="black"><b>☏</b> <a href="https://spacehey.com/addcomment?id=YOURACCOUNTID#HERE"><font size="3">view comments</font></a> <style> /*PASTE SCROLLBAR CODE HERE*/ body{ background-image: url('https://i.ibb.co/5TgwzSY/vhs-overlay.gif'); background-repeat: repeat; background-position:Top Left; background-attachment: fixed; background-size: auto; background-color: #000000; } main{ background-image: url('https://i.ibb.co/5TgwzSY/vhs-overlay.gif'); background-repeat: repeat; background-position:Top Left; background-attachment: fixed; background-size: auto; background-color: #800080; border: 0px Double #000000!important; opacity: 0.9; } .contact, .url-info, .table-section, .blurbs, .friends, .comments { background-image: url('https://i.ibb.co/V258Tr0/static-rainbow.gif'); background-repeat: repeat; background-position:Top Left; background-attachment: scroll; background-size: auto; background-color: #ffffff; border: 3px Double #000000!important; } span[itemprop='name'] { color: #800040; font-family: Courier; text-shadow: 0 0 2px rgba(176, 0, 0, 1); font-size: 18pt; } h4 { color: #000000; font-family: Franklin Gothic Medium; } .section h4, .details-table td:first-child { color: #000000!important; font-family: Franklin Gothic Medium; } a, .count { color: #b00000; font-family: courier; font-weight: bold; font-size: 7.3pt; } a:hover { color: #b00000; text-decoration: none; font-family: courier; font-weight: bold; text-shadow: 0 0 2px rgba(128, 0, 64, 1); font-size: 7.3pt; } body,main { color: #800040; font-family: Franklin Gothic Medium; font-size: 12pt; } .details-table td, .details-table td:first-child{ background: none!important; } .heading{ background: none!important; } .comments-table td{ background: none!important; } </style> <style> .profile-info { display: none; } </style> <style> .comments-table{ display: block; height: 200px; overflow-y: scroll; } </style> <style> .friends{display:none !important;} </style> <style> .logo {content:url("https://i.ibb.co/Ss37dDn/vcr.gif");} </style> <style>* {cursor: url('https://cur.cursors-4u.net/cursors/cur-4/cur330.cur'), auto;}a:hover {cursor: url('https://cur.cursors-4u.net/cursors/cur-4/cur326.cur'), auto;}</style> <style> blurbs .inner .section:nth-child(1) h4{ font-size:0; } </style> <style> .blurbs .inner .section:nth-child(2) h4{ font-size:0; } </style> <style> .blurbs .heading{display:none !important;} </style> <style> .blurbs .inner .section:nth-child(1) h4{ font-size:0; } </style> <style> .url-info{display:none !important;} </style> <style> .blog-preview{display:none !important;} </style> <style> nav{background-color:var(--box_color_and_seethru); !important;border-radius: 0px 0px var(--curve) var(--curve); !important;} nav ul{background:none !important;} nav img{filter: opacity(90%) !important;} nav ul a img, .mood a img{display:none !important;} .top{background:none !important;background-color:rgba(0, 0, 0, 0.8); !important;} </style> <style> footer {background:none !important; line-height:0px !important;} footer ul li a {color: #000000 !important;} </style> <style> .contact .inner a img { font-size: 0; } .contact .inner a img:before { font-size: 1em; display: block } .contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before { /* Add to Friends */ content:url(https://i.ibb.co/dLr1jV1/bullet-error.gif) } .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before { /* Add to Favorites */ content:url(https://i.ibb.co/dLr1jV1/bullet-error.gif) } .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before { /* Send Message */ content:url(https://i.ibb.co/dLr1jV1/bullet-error.gif) } .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before { /* Forward to Friend */ content:url(https://i.ibb.co/dLr1jV1/bullet-error.gif) } .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before { /* Instant Message */ content:url(https://i.ibb.co/dLr1jV1/bullet-error.gif) } .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before { /* Block User */ content:url(https://i.ibb.co/dLr1jV1/bullet-error.gif) } .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before { /* Add to Group */ content:url(https://i.ibb.co/dLr1jV1/bullet-error.gif) } .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before { /* Report Profile */ content:url(https://i.ibb.co/dLr1jV1/bullet-error.gif) } </style> <style> .online{content:url("https://i.ibb.co/981W7Mr/online-stalk-red.gif");} </style> <style> .details-table td:first-child {display:none;} </style> <style> .contact .heading{display: none !important;} </style> <style> .table-section:last-of-type { display: none; } </style> <style> .heading{ display: none;} </style> <style> div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(2), div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(2) {display: none;} </style> <style> div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(3), div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(3) {display: none;} </style> <style> div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4), div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) {display: none;} </style> <style> div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(5), div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(5) {display: none;} </style> <style> div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(6), div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(6) {display: none;} </style></font></font></center> <style> /*Top Links (Background Color/Background Image)*/ .links{ text-align:center; <style></style> <style> nav ul.links a { text-shadow: none; text-decoration: none; } </style> <style> .links .special a:link, .links .special a:visited { color: white; } .links .special a:hover { color: rgb(000,000,000); } </style> <style> .links li a .icon { display: none; } </style> <style>::-moz-selection { /* code for Firefox */ color: white; background-color: rgba(255, 185, 221, 0.8); } ::selection { color: white; background-color: rgba(0, 0, 0, .95); } </style> <style> .profile-pic { border-style: double; border-color: white; box-shadow: 0px 0px 7px #800040; border-radius: 3px; overflow: hidden; animation-name: example; animation-iteration-count: infinite; animation-duration: 0.8s; </style> <style> img:hover , .url-info:hover , .online:hover { animation: shake 1s; animation-iteration-count: infinite; } @keyframes shake { 0% { transform: translate(1px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -2px) rotate(-1deg); } 20% { transform: translate(-3px, 0px) rotate(1deg); } 30% { transform: translate(3px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 2px) rotate(-1deg); } 60% { transform: translate(-3px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-1px, -1px) rotate(1deg); } 90% { transform: translate(1px, 2px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } } </style> <style> main:before { width: 100%; height: 180px; display: block; content: ""; background-image: url('https://i.ibb.co/JsFC2Rs/lain-invisible.gif'); background-position: center center; background-size: cover; } @media only screen and (max-width: 600px) { main:before{ height: 200px; } } </style> <style> nav ul.links a { text-shadow: none; text-decoration: none; } </style> <style> /*Top Links (Background Color/Background Image)*/ .links{ text-align:center; <style></style> <style> nav .links a:hover { color: #b00000; font-weight: bold; font-style: italic; text-decoration: none; text-shadow: 0 0 4px rgba(128, 0, 64, .8); } </style> <style> /*Intro GIF Animation (fade out)*/ body:before { content: " "; height: 100vh; width: 100vw; display: block; position: fixed; top: 0; left: 0; z-index: 100; background-image: url('https://i.ibb.co/1K4RZwZ/lain-gif.gif'); /*gif link here*/ background-size: fixed; background-repeat: no-repeat; animation: yourAnimation 0s ease .3s 1 normal forwards; pointer-events: none; } @keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } </style>

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.