Actions

Work Header

Rating:
Archive Warning:
Fandoms:
Additional Tags:
Language:
English
Stats:
Published:
2026-08-13
Completed:
2026-08-14
Words:
6,134
Chapters:
4/4
Comments:
4
Kudos:
15
Bookmarks:
7
Hits:
1,158

S0LAR1N'S Site Skins

Chapter 4: JestersFreedom

Summary:

jevil themed for a friend, made entirely by me

Chapter Text

#outer {
background: url("https://64.media.tumblr.com/d761695d4125be2814093df0d9c8ada4/d80a2bf6d023fc12-ec/s1280x1920/4287d7ffed1fb24e8d02ae67172c83dd35585852.png");
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
}

#footer {
background: rgba(0,0,0,.5);
}

#main {
color: #e8e161;
}

#main a {
color: #abdb5e;
}

#main a:hover {
color: #6D6DC0;
}

#header .primary {
background: rgba(0,0,0,.5);
box-shadow: 0px 0px 20px #6d6dc0;
}

#header .logo,
#header .heading sup,
#header h1.heading span {
display: none;
}

#header h1.heading a::before {
content: "🎪 ";
color: transparent !important;
text-shadow: 0 0 0 #e8e161;
}

.favorite.module.odd h3.heading,
.latest.news.module h3.heading span.title,
.latest.messages.module.odd h3.heading span.title,
.social.module h3.heading {
color: #e8e161;
text-shadow: 0px 0px 8px #abdb5e;
}

.favorite.module.odd h3.heading,
.latest.news.module h3.heading,
.latest.messages.module.odd h3.heading,
.social.module h3.heading {
border-bottom: 2px solid #6d6dc0;
}

a.tag,
a.tag:visited,
a.tag:link,
li.added.tag {
display: inline-block;
padding: 2px 5px;
margin: 2px 0px;
border-radius: 5px;
border: 2px solid #6d6dc0;
box-shadow: 0px 0px 5px #541c85;
color: #6d6dc0;
}

a.tag:hover {
background: #541c85;
color: #6d6dc0;
}

.commas li:after {
content: "";
}

.splash .favorite li:nth-of-type(2n+1) a,
.splash .favorite li:nth-of-type(2n+2) a {
background: rgba(0,0,0,.3);
color: #e8e161;
}

.splash .favorite li:nth-of-type(2n+1) a::before {
content: "🎭 ";
color: transparent !important;
text-shadow: 0 0 0 #e8e161;
}

.splash .favorite li:nth-of-type(2n+2) a::before {
content: "🎭 ";
color: transparent !important;
text-shadow: 0 0 0 #abdb5e;
}

.splash .favorite li:nth-of-type(2n+1) a:hover,
.splash .favorite li:nth-of-type(2n+2) a:hover {
background: #2d1d57;
color: #6d6dc0 !important;
}

.splash .favorite li:nth-of-type(2n+1) a:hover::before,
.splash .favorite li:nth-of-type(2n+2) a:hover::before {
content: "🎭 ";
color: transparent !important;
text-shadow: 0 0 0 #6d6dc0;
}

.news.index.group li.post.group {
background: rgba(0,0,0,.5);
border: 1px solid #e8e161;
border-radius: 8px;
padding: .5em;
margin-bottom: 2em;
box-shadow: 0px 0px 15px #abdb5e;
}

.notice,
.comment_notice,
.kudos_notice,
ul.notes,
.caution,
.error,
.comment_error,
.kudos_error,
.alert.flash,
.LV_invalid {
background: #541c85;
border-radius: 5px;
border: 2px solid #e8e161;
box-shadow: 0px 0px 15px #6d6dc0;
padding: 1em;
color: #e8e161;
}

.actions a,
.actions a:link,
.action,
.action:link,
.actions button,
.actions input,
input[type="submit"],
button,
.current,
.actions label {
background: rgba(0,0,0, .8);
border: 1px solid #e8e161;
box-shadow: 0px -3px 10px #541c85 inset;
color: #6d6dc0;
}

.actions a:hover,
.actions button:hover,
.actions input:hover,
.actions a:focus,
.actions button:focus,
.actions input:focus,
label.action:hover,
.action:hover,
.action:focus {
background: #541c85;
border: 1px solid #abdb5e;
box-shadow: 0px 0px 5px #6d6dc0;
color: #09011c !important;
}

.actions a:active,
.current,
a.current,
a:link.current,
.current a:visited {
background: rgba(0,0,0, .8);
border: 1px solid #6d6dc0;
color: #09011c !important;
}

fieldset,
fieldset dl dl,
fieldset fieldset fieldset,
fieldset fieldset dl dl,
dd.hideme,
form blockquote.userstuff {
background: rgba(0,0,0, .8);
border: 2px solid #b9d0ed;
box-shadow: 0px 0px 15px #6d6dc0;
}

fieldset.warnings,
fieldset fieldset {
background: transparent;
color: #abdb5e !important;
}

input,
textarea,
select {
background: rgba(0,0,0, .8);
color: #e8e161;
border: 1px solid #abdb5e;
box-shadow: 0px 0px 10px #6d6dc0;
}

input:focus,
select:focus,
textarea:focus,
.autocomplete div.dropdown ul,
.search [role="tooltip"] {
background: #09011c;
color: #6d6dc0;
}

.autocomplete.dropdown {
background: rgba(0,0,0, .8);
}

.autocomplete.dropdown p.notice {
background: rgba(0,0,0, .8);
padding: none !important;
}

.required,
.error,
.alert.flash {
color: #a0b9d9;
text-shadow: 0px 0px 10px #6d6dc0;
}

form.verbose legend,
.verbose form legend {
background: rgba(0,0,0, .8);
box-shadow: 0px 0px 15px #6d6dc0;
}

span.question {
background: #abdb5e;
border: 1px solid #6d6dc0;
padding: 1px;
color: #09011c;
box-shadow: 0px 0px 15px #6d6dc0;
}

.resp-sharing-button--twitter,
.resp-sharing-button--tumblr {
background: rgba(0,0,0, .8) !important;
border: 1px solid #6d6dc0 !important;
box-shadow: 0px 0px 10px #541c85;
}

#greeting img.icon {
border-radius: 95%;
border: 1px solid #abdb5e;
padding: 2px;
box-shadow: 0px 0px 20px #6d6dc0;
}

#greeting .menu {
width: 12em !important;
}

#header .menu {
width: 20em;
}

#header .menu {
background: #09011c;
border: 1px solid #e8e161;
box-shadow: 0px 0px 20px #6d6dc0;
}

#header a.dropdown-toggle,
#greeting .user > li:nth-of-type(3) a {
color: #e8e161 !important;
}

#header .menu li a {
color: #e8e161 !important;
}

#header .menu li {
border-bottom: none;
}

#header .dropdown:hover a,
#greeting .user > li:nth-of-type(3) a:hover {
background: #541c85;
}

.toggled form,
.dynamic form,
div.dynamic {
background: transparent;
}

.bookmark .user {
background: rgba(0,0,0, .8);
border: 1px solid #e8e161;
box-shadow: 0px 0px 20px #6d6dc0;
}

.reading h4.viewed {
background: rgba(0,0,0, .8);
border: 1px solid #abdb5e;
border-radius: 5px;
padding: .5em;
margin: .5em;
box-shadow: 0px 0px 15px #6d6dc0;
}

dl.index dd {
background: rgba(0,0,0, .8);
}

dl.subscription.index.group {
background: rgba(8, 12, 15,.5);
padding: 1em;
}

#main.users-edit.dashboard.region dl,
#main.pseuds-edit.dashboard.region dl,
#main.users-change_username.dashboard.region dl,
#main.users-change_password.dashboard.region dl,
#main.users-change_email.dashboard.region dl,
dl.meta {
background: rgba(0,0,0, .8);
border: 2px solid #e8e161;
box-shadow: 0px 0px 20px #6d6dc0;
}

.bio.module {
margin-top: 2em;
background: rgba(0,0,0, .8);
}

.bio.module h3.heading {
visibility: hidden;
}

.bio.module h3.heading::before {
visibility: visible;
content: " A VISITOR LEFT THIS NOTE ";
font-size: 150%;
text-decoration: underline;
}

.index .skins .icon {
background: url("https://64.media.tumblr.com/26bd22b39e05337098e6f53c66f94d22/e7a7eab8ed62e9dd-4c/s250x400/18bcf38426eb4d92e579b640557572760055a04c.png");
background-size: 55px 55px;
background-repeat: no-repeat;
}

.comment .icon .visitor {
background: url("https://64.media.tumblr.com/de4ca4a303e41c86e469210477a2e75d/e7a7eab8ed62e9dd-3f/s250x400/461dfdf6c0fe3f5ecc11f905d502bca2730fb06b.png");
background-size: 100px 100px;
background-repeat: no-repeat;
}

.comment div.icon {
background: #09011c;
border-bottom: 5px solid #6d6dc0;
}

.comment h4.byline {
background: #09011c;
}

div.comment,
li.comment {
background: rgba(0,0,0, .8);
border: 2px solid #e8e161;
box-shadow: 0px 0px 15px #6d6dc0;
}

.thread .even {
background: rgba(0,0,0, .8);
}

ol.comment.index.group .read {
background: rgba(0,0,0, .5);
}

ol.comment.index.group .unread {
background: rgba(0,0,0, .3);
}

.replied,
span.unread {
color: #e8e161 !important;
background: rgba(0,0,0, .6) !important;
box-shadow: 0px 0px 15px #6d6dc0;
text-shadow: 0px 0px 5px #abdb5e;
}

.draft {
border: 2px dashed #6d6dc0;
background: rgba(9, 1, 28, .3);
}

.draft.work .wrapper {
background: rgba(9, 1, 28, .2);
}

#previewpane fieldset {
border: none;
box-shadow: none;
background: none;
}

.own,
.child,
.unwrangled,
.unreviewed {
background: rgba(9, 1, 28, .2);
}

.ui-sortable li {
background: transparent;
border: transparent;
}

.ui-sortable li:hover {
background: #541c85;
border: 1px solid #b9d0ed;
box-shadow: 0px 0px 5px #b9d0ed;
}

h2.collections {
box-shadow: 0px 0px 20px #6d6dc0;
}

#stat_chart svg {
filter: invert(90%) opacity(70%);
}

table {
background: rgba(0,0,0, .7);
}

thead {
background: rgba(9, 1, 28, .2);
color: #e8e161;
font-weight: bold;
font-size: 120%;
border-bottom: 2px solid #e8e161;
}

th,
tr,
td {
background: rgba(9, 1, 28, .3);
}

span.requested.offered {
color: #6d6dc0;
background: rgba(9, 1, 28, .3);
}

span.requested {
color: #6d6dc0;
}

.mystery.header.picture.module div.icon {
background: url("https://64.media.tumblr.com/0a25a59d5ced9cf06f1c6c586a4f4cc3/e7a7eab8ed62e9dd-36/s250x400/e65baf027fa6e59066b331b9e7de39eb537c4467.png");
background-size: 55px 55px;
background-repeat: no-repeat;
}

div.preface .module {
background: rgba(9, 1, 28, .3);
}

#dashboard.own {
background: rgba(109, 109, 192, .1);
border: 3px solid #abdb5e;
box-shadow: 0px 0px 15px #541c85;
}

#dashboard a {
color: #e8e161;
border: 1px solid transparent;
}

#dashboard .current {
background: #541c85;
color: #09011c;
border: 1px solid #abdb5e;
box-shadow: 0px 0px 10px #6d6dc0;
}

#dashboard a:hover {
background: #541c85;
color: #09011c;
border: 1px solid #6d6dc0;
}

#dashboard ul {
border-top: none;
}

.listbox,
fieldset fieldset.listbox {
background: rgba(9, 1, 28, .3);
border: 2px solid #e8e161;
box-shadow: 0px 0px 20px #6d6dc0;
}

.listbox .index {
background: transparent;
box-shadow: none;
}

.listbox > .heading {
font-variant: small-caps;
font-weight: bold;
color: #e8e161;
text-shadow: 0px 0px 2px #6d6dc0;
}

li.blurb {
background: rgba(9, 1, 28, .3);
border: 2px solid #e8e161;
box-shadow: 0px 0px 20px #abdb5e;
margin-bottom: 2em;
}

.warnings .tag {
background: rgba(45, 29, 87, .9);
color: #abdb5e !important;
}

.relationships .tag {
background: rgba(9, 1, 28, .6);
color: #e8e161 !important;
}

li.warnings + li.relationships:before,
li.relationships + li.characters:before,
li.relationships + li.characters:before,
li.characters + li.freeforms:before,
li.warnings + li.characters:before,
li.warnings + li.freeforms:before,
li.relationships + li.freeforms:before {
content: " ";
color: transparent !important;
text-shadow: 0 0 0 #6d6dc0;
}

#workskin {
margin-top: 2em;
background: rgba(9, 1, 28, .5);
}

p.kudos {
background: url("https://64.media.tumblr.com/40025c1405d6e6e05e12e8e2d78358cb/e7a7eab8ed62e9dd-5c/s250x400/adcf43fe61bc34a8664f0b22385fc42699836f7b.png") no-repeat;
}

span.complete-no.iswip,
span.category-slash.category,
span.category-het.category,
span.category-multi.category,
span.rating-explicit.rating,
span.warning-yes.warnings,
span.complete-yes.iswip,
span.rating-general-audience.rating,
span.category-gen.category,
span.rating-teen.rating,
span.rating-mature.rating,
span.warning-choosenotto.warnings,
span.category-femslash.category {
filter: opacity(90%) saturate(40%);
box-shadow: 0px 0px 10px #6d6dc0;
}

span.rating-notrated.rating,
span.category-none.category,
span.warning-no.warnings {
filter: brightness(0%);
}

.blurb h4 a:visited {
color: #6d6dc0 !important;
}

.tag .primary .icon,
.tagset .primary .icon {
background: url("https://64.media.tumblr.com/40025c1405d6e6e05e12e8e2d78358cb/e7a7eab8ed62e9dd-5c/s250x400/adcf43fe61bc34a8664f0b22385fc42699836f7b.png");
background-size: 100px 100px;
background-repeat: no-repeat;
border: 1px solid #b9d0ed;
box-shadow: 0px 0px 15px #b9d0ed;
}

.filters .expander {
color: #e8e161;
border: 1px solid #abdb5e;
border-radius: 5px;
margin-bottom: .5em;
box-shadow: none;
background: #09011c;
}

filters .expanded .expander {
background: #09011c !important;
background-image: none !important;
}

.filters .expander::before {
content: "↕ ";
}

form dt {
border-bottom: none;
}

.userstuff hr {
border: none;
width: 12.5em;
}

.userstuff hr:before {
content: "⌞ 🃏ˎˊ˗ 🎭 ⸝ ⌝";
}

#kudos_message.kudos_error,
#kudos_message.notice {
font-size: 1pt;
color: transparent !important;
}

#kudos_message.notice::before {
font-size: 14pt !important;
color: #e8e161 !important;
content: "WHAT A FUN GAME, GAME!";
padding: 1em;
}

#kudos_message.kudos_error::before {
font-size: 14pt !important;
color: #09011c !important;
content: "PLAY AGAIN! AGAIN!";
padding: 1em;
}

Notes:

if you want help customizing some parts, leave a comment and i'll help to the best of my abilities