Link to article: OpusConfidant April 1st 2023 Spotlight.
.box.art {
height: min(calc(10rem + 50vh), 28rem);
flex-grow: 1; flex-basis: 25rem;
background-size: contain;
background-repeat: no-repeat;
}
.box .title { box-shadow: inset 0 0.675em 0 rgb(99,99,176);}
.box :is(.title,.footer) p { background: rgb(99,99,176); }
.box :is(.title,.footer)::after {
background: rgb(99,99,176);
}
.box .footer { box-shadow: inset 0 -0.45em 0 rgb(99,99,176); }
.content-grid { margin: 0.75rem 0; }
.content-type-description {
padding-inline: 1rem;
}
.opus {
--box-accent: rgb(99,99,176);
}
.sider {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
max-width: unset!important;
}
.content-type-description.gr {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr) 1.75rem);
grid-gap: 0.5rem;
padding-block: 0.75rem;
}
.alertbar {
color: #6363B0;
font-weight: bold;
-webkit-box-shadow: 0px 0px 13px -7px rgba(5,5,5,0.75);
box-shadow: 0px 0px 13px -7px rgba(5,5,5,0.75);
font-family: 'Overpass Mono', monospace;
font-weight: 600;
font-size: .9rem;
text-align: center;
margin: 0.5rem 0;
padding: 0rem 0.5rem;
position: relative;
z-index: 1;
-webkit-transition: -webkit-box-shadow 300ms ease-in-out;
transition: -webkit-box-shadow 300ms ease-in-out;
-o-transition: box-shadow 300ms ease-in-out;
transition: box-shadow 300ms ease-in-out;
transition: box-shadow 300ms ease-in-out, -webkit-box-shadow 300ms ease-in-out;
}
.box.alertbar::before {
content: " ";
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: url("http://smlt.wdfiles.com/local--files/collab:cassandra-prime:foolio-actual/opconf-b.png") center center no-repeat;
background-size: contain;
opacity: 0.35;
z-index: -1;
}
.alertbar:hover { -webkit-box-shadow: 0px 0px 13px -4px rgba(5,5,5,0.75); box-shadow: 0px 0px 13px -4px rgba(5,5,5,0.75);}
.alertbar > p:nth-child(1) {margin-top: 0.25rem;margin-bottom: 0.5rem;}
.alertbar > p:nth-child(n+2) {margin-bottom: 0.25rem;}
.classified {letter-spacing: 7px; font-size: 3rem;font-family: 'Inter', sans-serif;margin-left: 7px;}
.classified p {margin: -1.6rem;}
.classified a, .classified a:hover, .classified a:visited {color: #6363B0; text-decoration: none;}
.INT-box {
display: flex;
justify-content: center;
align-items: center;
grid-gap: 0.325rem 0.625rem;
flex-wrap: wrap;
box-sizing: border-box;
background-color: #fff;
margin: 0.75rem 0;
padding: 1.25rem 1.875rem 1.875rem;
border-radius: 1.5rem;
border: solid 0.275rem #000;
box-shadow: inset 0 0 0 0.175rem #fff, inset 0 0 0 0.675rem #4b92db;
}
.INT-box > img { width: 12rem; }
.INT-box h1 { margin: 0.125rem 0 0.325rem; }
.INT-box > a {
flex-basis: calc(27.5% + 1rem + 1vw);
max-width: 12.25rem;
min-width: min(100%, 10rem);
padding: 0 0.5rem;
}
.INT-box > .INT-content {
flex-grow: 1;
flex-basis: 14rem;
text-align: center;
}
@supports (text-align-last: center) {
.INT-box > .INT-content p {
text-align: justify;
text-align-last: center;
}
}
.INT-box > .collapsible-block {
flex-basis: 100%;
--col-link-size: min(calc(0.325rem + 1vw), 0.825rem);
--col-border-width: 0.1rem;
}
.INT-box > .collapsible-block .collapsible-block-link {
width: max-content;
max-width: 75%;
text-align: center;
font-weight: bold;
font-size: var(--col-link-size);
margin: 0 auto;
display: block;
color: #4b92db;
background-color: #fff;
padding: 0 0.325em;
z-index: 1;
}
.INT-box > .collapsible-block .collapsible-block-folded {position: relative; z-index: 1;}
.INT-box > .collapsible-block .collapsible-block-folded:not([style*="none"])::before {
content: "";
display: block;
position: absolute;
left: 0; bottom: calc(var(--col-link-size)*0.5 - var(--col-border-width));
width: 100%; height: var(--col-border-width);
background-color: #4b92db;
z-index: -1;
}
.INT-box > .collapsible-block .collapsible-block-unfolded {margin: 0;}
.INT-box > .collapsible-block .collapsible-block-unfolded-link { position: relative; z-index: 1; }
.INT-box > .collapsible-block .collapsible-block-content {
border: var(--col-border-width) solid #4b92db;
border-radius: 0.375rem;
position: relative;
z-index: 0;
margin-top: calc(var(--col-link-size)*-0.5);
padding: 0.875rem 0.325rem 0.125rem;
}
.c_international-body {
display: flex;
flex-wrap: wrap;
}
.c_international-box {
font-size: 96.5%;
}
.c_international-box {
text-align: center;
flex-basis: 8.5rem;
flex-grow: 1;
}
.c_international-box a img {
width: 6.75rem;
}
.c_international-text p {
margin: 0 0 1.25em;
}
@media (max-width: 580px) {
.c_international-box {
flex-basis: 6.5rem;
}
.c_international-box a img {
width: 4.5rem;
}
}
.INT-box > a > img {
filter: invert(.5) sepia(1) hue-rotate(160deg) saturate(2.5);
}
.library { background: #4C0800; }
.library>div.wl-image {
background-image: url(https://smlt.wdfiles.com/local--files/collab:cassandra-prime:foolio-actual/wretched-luncheon-small-v2.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.library>div.wl-image img { opacity: 0; }
.library>div.wl-text {
text-transform: uppercase;
font-family: 'zuijinregular', serif;
}
width:10%;
filter: invert(1); max-width: 16rem; margin: 0 auto;
--num: 99
--num: 83
--num: 91
--num: 110
--num: 83
--num: 110
--num: 65
--num: 136
--num: 70
--num: 60
--num: 64
--num: 100
--num: 190
--num: 33
--num: 58
--num: 33
--num: 58
--num: 33
--num: 20
--num: 10
--num: 55
--num: 15
--num: 20
--num: 80
--num: 30
--num: 35
--num: 30
--num: 95
--num: 45
--num: 90
--num: 99
--num: 83
--num: 91
--num: 110
--num: 83
--num: 110
--num: 75
--num: 80
--num: 91
--num: 80
--num: 87
--num: 75
--num: 99
--num: 83
--num: 91
--num: 110
--num: 83
--num: 110
--num: 1000
--num: 1000
--num: 1000
--num: 1000
--num: 1000
--num: 1000
--num: 105
--num: 150
--num: 100
--num: 120
--num: 100
--num: 80
--num: 100
--num: 80
--num: 80
--num: 160
--num: 70
--num: 105
:scp-wiki:theme:bedrock
[info]
:scp-wiki:fragment:opusconfidant-css
[info]
:scp-wiki:theme:bedrock
[info]
:scp-wiki:fragment:opusconfidant-css
[info]
:scp-wiki:fragment:front-page-gridcode
[info]
:scp-wiki:fragment:nav-generic-css
[info]
:scp-wiki:fragment:wl-front-page-box
[info]
:scp-wiki:fragment:wl-front-page-box
[info]
:scp-wiki:component:license-box
[info]
:scp-wiki:component:license-box-end
[info]
box
alertbar
classified
blockquote
large
content-grid
content-box
opus
content-type-title
content-type-description
content-type-footer
content-box
opus
content-type-title
content-type-description
gr
content-type-footer
INT-box
INT-content
mon-card
sprite
Mortal
stat
blockquote
large
blockquote
large
comment
comment
comment
reply1
comment
comment
comment
comment
mon-card
sprite
auto
mineral
stat
blockquote
large
comment
comment
reply1
comment
reply2
comment
reply3
comment
mon-card
sprite
auto
dread
stat
blockquote
large
comment
comment
reply1
comment
comment
reply1
comment
reply1
mon-card
sprite
nature
mortal
stat
blockquote
large
comment
comment
reply1
comment
comment
reply1
comment
reply2
mon-card
sprite
dread
humor
stat
blockquote
large
comment
comment
reply1
comment
comment
reply1
comment
reply2
mon-card
sprite
mortal
stat
blockquote
large
blockquote
large
comment
comment
comment
reply1
comment
comment
comment
comment
mon-card
sprite
humor
nature
stat
blockquote
large
blockquote
large
comment
comment
reply1
comment
mon-card
sprite
dread
stat
blockquote
large
blockquote
large
comment
comment
comment
reply1
comment
comment
comment
comment
reply1
mon-card
sprite
auto
divine
stat
blockquote
large
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
comment
reply6
comment
reply1
mon-card
sprite
auto
stat
blockquote
large
comment
comment
reply1
comment
reply2
comment
reply3
comment
comment
reply1
mon-card
sprite
solar
stat
blockquote
large
blockquote
large