Woedenaz Theme
@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100..900;1,100..900&display=swap&subset=latin-ext"); @import url('https://fonts.googleapis.com/css2?family=Rammetto+One&display=swap'); :root { /* theme colors */ --w-color1: rgba(252, 213, 184, 1); --w-color2: rgba(47, 61, 88, 1); --w-color3: rgba(228, 87, 78, 1); --w-color4: rgba(36, 38, 61, 1); --w-color5: rgba(246, 160, 103, 1); /* nu-SCP Color Replace */ --bright-accent: 228, 87, 78; --grey-monochrome: 47, 61, 88; --dark-accent: 246, 160, 103; --black-monochrome: 36, 38, 61; /* base font size ranges */ --w-unitless-min-font-size: 0.875; --w-unitless-max-font-size: 1.5; /* base viewport size ranges */ --w-unitless-min-viewport: 300; --w-unitless-max-viewport: 700; /* base line height size ranges */ --w-min-lineheight: 1.2; --w-max-lineheight: 1.5; /* calculating size differences */ --w-font-size-difference: -webkit-calc(var(--w-unitless-max-font-size) - var(--w-unitless-min-font-size)); --w-font-size-difference: -moz-calc(var(--w-unitless-max-font-size) - var(--w-unitless-min-font-size)); --w-font-size-difference: calc(var(--w-unitless-max-font-size) - var(--w-unitless-min-font-size)); --w-lineheight-difference: -webkit-calc(var(--w-max-lineheight) - var(--w-min-lineheight)); --w-lineheight-difference: -moz-calc(var(--w-max-lineheight) - var(--w-min-lineheight)); --w-lineheight-difference: calc(var(--w-max-lineheight) - var(--w-min-lineheight)); --w-viewport-range-difference: -webkit-calc(var(--w-unitless-max-viewport) - var(--w-unitless-min-viewport)); --w-viewport-range-difference: -moz-calc(var(--w-unitless-max-viewport) - var(--w-unitless-min-viewport)); --w-viewport-range-difference: calc(var(--w-unitless-max-viewport) - var(--w-unitless-min-viewport)); --w-min-viewport-difference: -webkit-calc(90vw - (var(--w-unitless-min-viewport) * 1px)); --w-min-viewport-difference: -moz-calc(90vw - (var(--w-unitless-min-viewport) * 1px)); --w-min-viewport-difference: calc(90vw - (var(--w-unitless-min-viewport) * 1px)); /* responsive fluid type formula */ --w-fontCalc: -webkit-calc((var(--w-unitless-min-font-size) * 1em) + var(--w-font-size-difference) * var(--w-min-viewport-difference) / var(--w-viewport-range-difference)); --w-fontCalc: -moz-calc((var(--w-unitless-min-font-size) * 1em) + var(--w-font-size-difference) * var(--w-min-viewport-difference) / var(--w-viewport-range-difference)); --w-fontCalc: calc((var(--w-unitless-min-font-size) * 1em) + var(--w-font-size-difference) * var(--w-min-viewport-difference) / var(--w-viewport-range-difference)); --w-lineCalc: -webkit-calc(var(--w-min-lineheight) + var(--w-lineheight-difference) * var(--w-min-viewport-difference) / var(--w-viewport-range-difference)); --w-lineCalc: -moz-calc(var(--w-min-lineheight) + var(--w-lineheight-difference) * var(--w-min-viewport-difference) / var(--w-viewport-range-difference)); --w-lineCalc: calc(var(--w-min-lineheight) + var(--w-lineheight-difference) * var(--w-min-viewport-difference) / var(--w-viewport-range-difference)); /* BG Pattern */ background-image: -webkit-gradient(linear, left bottom, right top, color-stop(20%, rgba(18, 19, 31, 0.45)), color-stop(55%, rgba(25, 33, 47, 0.15)), to(rgba(73, 118, 134, 0.5))); background-image: -webkit-linear-gradient(bottom left, rgba(18, 19, 31, 0.45) 20%, rgba(25, 33, 47, 0.15) 55%, rgba(73, 118, 134, 0.5)); background-image: -moz-linear-gradient(bottom left, rgba(18, 19, 31, 0.45) 20%, rgba(25, 33, 47, 0.15) 55%, rgba(73, 118, 134, 0.5)); background-image: -o-linear-gradient(bottom left, rgba(18, 19, 31, 0.45) 20%, rgba(25, 33, 47, 0.15) 55%, rgba(73, 118, 134, 0.5)); background-image: linear-gradient(to top right, rgba(18, 19, 31, 0.45) 20%, rgba(25, 33, 47, 0.15) 55%, rgba(73, 118, 134, 0.5)); background-color: var(--w-color3); } body { background-image: -webkit-linear-gradient(top left, var(--w-color4) 0%, var(--w-color2) 100%), -webkit-linear-gradient(top, rgba(var(--black-monochrome),1) 7.5rem, var(--w-color3) 7.625rem, var(--w-color3) -webkit-calc(100% - 0.125rem), var(--w-color3) -webkit-calc(100% - 0.125rem), rgba(var(--black-monochrome),1) 100%); background-image: -moz-linear-gradient(top left, var(--w-color4) 0%, var(--w-color2) 100%), -moz-linear-gradient(top, rgba(var(--black-monochrome),1) 7.5rem, var(--w-color3) 7.625rem, var(--w-color3) -moz-calc(100% - 0.125rem), var(--w-color3) -moz-calc(100% - 0.125rem), rgba(var(--black-monochrome),1) 100%); background-image: -webkit-gradient(linear, left top, right bottom, from(var(--w-color4)), to(var(--w-color2))), -webkit-gradient(linear, left top, left bottom, color-stop(7.5rem, rgba(var(--black-monochrome),1)), color-stop(7.625rem, var(--w-color3)), color-stop(var(--w-color3)), color-stop(var(--w-color3)), to(rgba(var(--black-monochrome),1))); background-image: -o-linear-gradient(top left, var(--w-color4) 0%, var(--w-color2) 100%), -o-linear-gradient(top, rgba(var(--black-monochrome),1) 7.5rem, var(--w-color3) 7.625rem, var(--w-color3) calc(100% - 0.125rem), var(--w-color3) calc(100% - 0.125rem), rgba(var(--black-monochrome),1) 100%); background-image: linear-gradient(to bottom right, var(--w-color4) 0%, var(--w-color2) 100%), linear-gradient(to bottom, rgba(var(--black-monochrome),1) 7.5rem, var(--w-color3) 7.625rem, var(--w-color3) calc(100% - 0.125rem), var(--w-color3) calc(100% - 0.125rem), rgba(var(--black-monochrome),1) 100%); background-color: rgba(252, 213, 184,0.5); } a { color: var(--w-color-4) } a:visited { color: var(--w-color-4) } #header h1 a { font-family: 'Rammetto One', sans-serif !important; } #page-title { display: none; } #header h1, #header h2 { --wght: 500; font-weight: 500; } #side-bar { background: var(--w-color1); } #side-bar .side-block { background-color: transparent !important; } div.WoedContainer * { -webkit-transition-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1); -moz-transition-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1); -o-transition-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } div.WoedContainer { border-width: -webkit-calc(var(--w-fontCalc) * 2); border-width: -moz-calc(var(--w-fontCalc) * 2); border-width: calc(var(--w-fontCalc) * 2); -webkit-border-image: -webkit-gradient(linear, left bottom, right top, from(var(--w-color5)), color-stop(55%, var(--w-color1)), to(var(--w-color1))); -webkit-border-image: -webkit-linear-gradient(bottom left, var(--w-color5) 0%, var(--w-color1) 55%, var(--w-color1) 100%); -moz-border-image: -moz-linear-gradient(bottom left, var(--w-color5) 0%, var(--w-color1) 55%, var(--w-color1) 100%); -o-border-image: -o-linear-gradient(bottom left, var(--w-color5) 0%, var(--w-color1) 55%, var(--w-color1) 100%); border-image: -webkit-gradient(linear, left bottom, right top, from(var(--w-color5)), color-stop(55%, var(--w-color1)), to(var(--w-color1))); border-image: linear-gradient(to top right, var(--w-color5) 0%, var(--w-color1) 55%, var(--w-color1) 100%); border-image-slice: 1; border-style: double; background: -webkit-gradient(linear, left bottom, right top, color-stop(20%, var(--w-color4)), color-stop(55%, var(--w-color2)), to(var(--w-color2))); background: -webkit-linear-gradient(bottom left, var(--w-color4) 20%, var(--w-color2) 55%, var(--w-color2)); background: -moz-linear-gradient(bottom left, var(--w-color4) 20%, var(--w-color2) 55%, var(--w-color2)); background: -o-linear-gradient(bottom left, var(--w-color4) 20%, var(--w-color2) 55%, var(--w-color2)); background: linear-gradient(to top right, var(--w-color4) 20%, var(--w-color2) 55%, var(--w-color2)); background-clip: padding-box; overflow: hidden; width: 100%; margin: 0; padding: 0 0 2em 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; position: -webkit-sticky; position: sticky; -webkit-font-kerning: normal !important; font-kerning: normal !important; font-family: 'Exo 2', sans-serif; line-height: var(--w-lineCalc); -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } div.WoedContainer div.skips > div.labels { height: 2em; width: 100%; text-align: center; margin: 2rem 0 1rem 1vw; display: -webkit-inline-box; display: -webkit-inline-flex; display: -moz-inline-box; display: -ms-inline-flexbox; display: inline-flex; font-size: -webkit-calc(var(--w-fontCalc) + 0.5vw + 0.5vh); font-size: -moz-calc(var(--w-fontCalc) + 0.5vw + 0.5vh); font-size: calc(var(--w-fontCalc) + 0.5vw + 0.5vh); -webkit-flex-shrink: 2; -ms-flex-negative: 2; flex-shrink: 2 } div.WoedContainer div.skips > div.labels > div.title { font-family: 'Rammetto One', sans-serif !important; margin: 0; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; text-align: left; } div.WoedContainer.left-side div.skips > div.labels > div.title[style*="ZCOOL"], div.WoedContainer.left-side div.skips > div.labels > div.title[style*="ZCOOL"] > a, div.WoedContainer.left-side div.skips > div.labels > div.title[style*="ZCOOL"]::before, div.WoedContainer.left-side div.skips > div.labels > div.title[style*="ZCOOL"]::after, div.WoedContainer.right-side div.skips > div.labels > div.title[style*="ZCOOL"], div.WoedContainer.right-side div.skips > div.labels > div.title[style*="ZCOOL"] > a, div.WoedContainer.right-side div.skips > div.labels > div.title[style*="ZCOOL"]::before, div.WoedContainer.right-side div.skips > div.labels > div.title[style*="ZCOOL"]::after { font-size: 1.5rem; text-align: center; } div.WoedContainer > div.name { width: 100%; top: 1vh; right: 1vw; writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr; -webkit-box-flex: 2; -webkit-flex-grow: 2; -moz-box-flex: 2; -ms-flex-positive: 2; flex-grow: 2; position: relative; -webkit-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start; } div.WoedContainer > div.name > div.wrapper { margin: 0; position: absolute; -webkit-transform-origin: bottom right; -moz-transform-origin: bottom right; -ms-transform-origin: bottom right; -o-transform-origin: bottom right; transform-origin: bottom right; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; font-size: -webkit-calc(var(--w-fontCalc) + 8vh); font-size: -moz-calc(var(--w-fontCalc) + 8vh); font-size: calc(var(--w-fontCalc) + 8vh); font-family: 'Rammetto One', sans-serif; } div.WoedContainer div.labels > .title, div.WoedContainer > div.name > div.wrapper { color: var(--w-color3); text-transform: uppercase; text-align: center; letter-spacing: .15em; position: relative; word-break: normal !important; } div.WoedContainer div.skips > div.labels > .title::before, div.WoedContainer div.skips > div.labels > .title::after, div.WoedContainer div.name > div.wrapper::before, div.WoedContainer div.name > div.wrapper::after { -webkit-font-kerning: auto; font-kerning: auto; orphans: 2; word-break: normal !important; text-rendering: optimizeLegibility } div.WoedContainer div.skips > div.labels > div::before, div.WoedContainer div.name > div.wrapper::before { font-family: 'Rammetto One', sans-serif; content: attr(data-heading); color: var(--w-color1); mix-blend-mode: screen; position: absolute; left: 0; top: 0 } div.WoedContainer div.skips > div.labels > .title::after, div.WoedContainer div.name > div.wrapper::after { font-family: 'Rammetto One', sans-serif; content: attr(data-heading); color: var(--w-color4); mix-blend-mode: screen; position: absolute; left: 0; top: 0 } div.WoedContainer div.skips > div.labels > .title::after { -webkit-transform: translate(-1%, 0); -moz-transform: translate(-1%, 0); -ms-transform: translate(-1%, 0); -o-transform: translate(-1%, 0); transform: translate(-1%, 0); width: 100% } div.WoedContainer div.skips > div.labels > .title::before { -webkit-transform: translate(1%, 0); -moz-transform: translate(1%, 0); -ms-transform: translate(1%, 0); -o-transform: translate(1%, 0); transform: translate(1%, 0); width: 100% } div.WoedContainer > div.name > div.wrapper::after { -webkit-transform: translate(7%, 0); -moz-transform: translate(7%, 0); -ms-transform: translate(7%, 0); -o-transform: translate(7%, 0); transform: translate(7%, 0); width: 100% } div.WoedContainer > div.name > div.wrapper::before { -webkit-transform: translate(-7%, 0); -moz-transform: translate(-7%, 0); -ms-transform: translate(-7%, 0); -o-transform: translate(-7%, 0); transform: translate(-7%, 0); width: 100% } div.WoedContainer .skips { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-flow: column wrap; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-align: stretch; -webkit-align-items: stretch; -moz-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start; -webkit-box-flex: 2; -webkit-flex-grow: 2; -moz-box-flex: 2; -ms-flex-positive: 2; flex-grow: 2; height: 100%; width: 100%; -webkit-flex-basis: 1000vw; -ms-flex-preferred-size: 1000vw; flex-basis: 1000vw; } div.WoedContainer #u-scps-block, div.WoedContainer .scps-block { --wght: 900; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; text-transform: uppercase; font-weight: 900; letter-spacing: .1em; margin: 2vh 1vw 0 1vw; border: .125rem solid var(--w-color3); background: var(--w-color3); list-style-type: none; z-index: 9999; -webkit-box-flex: 2; -webkit-flex-grow: 2; -moz-box-flex: 2; -ms-flex-positive: 2; flex-grow: 2; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; max-width: -webkit-calc(100% - (var(--w-fontCalc) * 3)); max-width: -moz-calc(100% - (var(--w-fontCalc) * 3)); max-width: calc(100% - (var(--w-fontCalc) * 3)); -webkit-box-shadow: -0.188em 0.25rem 0.25rem 0.188em rgba(36, 38, 61, 0.25); -moz-box-shadow: -0.188em 0.25rem 0.25rem 0.188em rgba(36, 38, 61, 0.25); box-shadow: -0.188em 0.25rem 0.25rem 0.188em rgba(36, 38, 61, 0.25); } #u-scps-block > .list-pages-box, .scps-block > .list-pages-box { position: relative; background: var(--w-color3); -webkit-box-flex: 2; -webkit-flex-grow: 2; -moz-box-flex: 2; -ms-flex-positive: 2; flex-grow: 2; padding: var(--w-fontCalc); } div.collapsible-block-unfolded:not([style*="display: none;"]) { opacity: 1; } div.collapsible-block-unfolded[style*="display: none;"] { opacity: 0; } div.collapsible-block-unfolded, #u-scps-block > .list-pages-box, .scps-block > .list-pages-box { -o-transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1); -moz-transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1); transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1); -webkit-transition: opacity 300ms cubic-bezier(0.4, 0.0, 0.2, 1); } #u-scps-block a.collapsible-block-link, .scps-block a.collapsible-block-link { width: 95%; padding-top: -webkit-calc(var(--w-fontCalc) * 0.5); padding-top: -moz-calc(var(--w-fontCalc) * 0.5); padding-top: calc(var(--w-fontCalc) * 0.5); padding-bottom: -webkit-calc(var(--w-fontCalc) * 0.5); padding-bottom: -moz-calc(var(--w-fontCalc) * 0.5); padding-bottom: calc(var(--w-fontCalc) * 0.5); font-size: -webkit-calc(var(--w-fontCalc) * 1.5); font-size: -moz-calc(var(--w-fontCalc) * 1.5); font-size: calc(var(--w-fontCalc) * 1.5); white-space: pre-line; vertical-align: middle; cursor: pointer; background: var(--w-color3); color: #fff; position: relative; display: inline-block; word-break: break-word; word-break: normal; text-shadow: 0 0 0 rgba(36, 38, 61, 0), 0 0 0 rgba(47, 61, 88, 0); -o-transition: text-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1); -moz-transition: text-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1); transition: text-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1); -webkit-transition: text-shadow 300ms cubic-bezier(0.4, 0.0, 0.2, 1); } #u-scps-block a.collapsible-block-link:hover, .scps-block a.collapsible-block-link:hover { text-decoration: none; text-shadow: -0.125rem 0.125rem 0 var(--w-color4), -0.188rem 0.188em 0 var(--w-color2); } #u-scps-block div.collapsible-block-content, .scps-block div.collapsible-block-content { margin-top: 1em; height: auto; padding-top: 2em } #u-scps-block div.collapsible-block-content > ul, .scps-block div.collapsible-block-content > ul { display: -webkit-inline-box; display: -webkit-inline-flex; display: -moz-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; list-style: none; -webkit-padding-start: 0; -moz-padding-start: 0; padding-inline-start: 0; padding-bottom: 0.5em; -webkit-margin-after: 0; margin-block-end: 0; margin: 0; width: 100%; background-color: var(--w-color1) } #u-scps-block > div > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-attachment: fixed; background-blend-mode: soft-light; } #u-scps-block > div:nth-child(1) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div:nth-child(1) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-image: url("/local--files/component%3Awoedauthor%3Atheme/2105.png"); background-position: 7rem center; } #u-scps-block > div:nth-child(2) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div:nth-child(2) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { -webkit-background-size: auto auto; -moz-background-size: auto; -o-background-size: auto; background-size: auto; background-image: url(/local--files/component%3Awoedauthor%3Atheme/4378.JPG); } #u-scps-block > div:nth-child(3) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div:nth-child(3) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-image: url(/local--files/component%3Awoedauthor%3Atheme/4205.JPG); -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; background-position: 33rem center; } #u-scps-block > div:nth-child(4) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div:nth-child(4) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-image: url("/local--files/component%3Awoedauthor%3Atheme/COMPWAN.jpg"); } #u-scps-block div.collapsible-block-content > ul > li, .scps-block div.collapsible-block-content > ul > li { padding: 0.25em; } #u-scps-block > div > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul > li:nth-child(1), .scps-block > div > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul > li:nth-child(1) { --wght: 500; margin: var(--w-fontCalc); padding: var(--w-fontCalc) 4em; color: var(--w-color2); width: 100%; font-size: 75%; font-weight: 500; font-family: 'Rammetto One', sans-serif; background: var(--w-color1); } #u-scps-block div.collapsible-block-content > ul > li:nth-child(5), .scps-block div.collapsible-block-content > ul > li:nth-child(5) { --wght: 400; background-color: var(--w-color2); border-left: 0.625em solid var(--w-color3); quotes: "\201C""\201D""\2018""\2019"; color: var(--w-color1); -webkit-align-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; width: 90%; margin: 1em; padding: 1em; font-weight: 400; text-align: justify; text-transform: initial; line-height: 135%; font-size: var(--w-fontCalc); } #u-scps-block div.collapsible-block-content > ul > li > a::before, .scps-block div.collapsible-block-content > ul > li > a::before { --wght: 600; content: "Click To Read!"; font-family: 'Exo 2', sans-serif; font-size: -webkit-calc(var(--w-fontCalc) * 1.5); font-size: -moz-calc(var(--w-fontCalc) * 1.5); font-size: calc(var(--w-fontCalc) * 1.5); font-weight: 600; display: block; color: var(--w-color4); cursor: pointer; text-decoration: none; position: relative; width: 100%; height: 100%; top: -webkit-calc(var(--w-fontCalc) * 0.25); top: -moz-calc(var(--w-fontCalc) * 0.25); top: calc(var(--w-fontCalc) * 0.25); word-break: normal; } #u-scps-block div.collapsible-block-content > ul > li > a, .scps-block div.collapsible-block-content > ul > li > a { --wght: 600; font-weight: 600; display: -webkit-inline-box; display: -webkit-inline-flex; display: -moz-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: .5vh .5vw 0 .5vw; margin: .5vh .5vw; -webkit-border-radius: .25vw; -moz-border-radius: .25vw; border-radius: .25vw; background: var(--w-color3); color: transparent; transition-property: -webkit-backdrop-filter, backdrop-filter, box-shadow, background-color; -moz-transition-duration: 300ms; -o-transition-duration: 300ms; transition-duration: 300ms; -moz-transition-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1); -o-transition-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1); -webkit-transition-property: -webkit-backdrop-filter, backdrop-filter, box-shadow, background-color; -webkit-transition-duration: 300ms; -webkit-transition-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1); } #u-scps-block div.collapsible-block-content > ul > li > a:hover, .scps-block div.collapsible-block-content > ul > li > a:hover { -webkit-box-shadow: 0 .188rem .25rem rgba(0, 0, 0, .8); -moz-box-shadow: 0 .188rem .25rem rgba(0, 0, 0, .8); box-shadow: 0 .188rem .25rem rgba(0, 0, 0, .8); background: var(--w-color5); text-decoration: none } #u-scps-block div.collapsible-block-content > ul > li > a::before:visited, .scps-block div.collapsible-block-content > ul > li > a::before:visited { color: var(--w-color1) } div.collapsible-block-content > ul > li:nth-child(3) > span::before { content: " \25e5 Posted On \21dd " } div.collapsible-block-content > ul > li:nth-child(4)::before { content: " \25e5 Current Rating \21dd " } div.collapsible-block-content > ul > li:nth-child(3) > span::after { content: "\25e4" } div.collapsible-block-content > ul > li:nth-child(4)::after { content: "\25e4" } #u-scps-block > div.collapsible-block, .scps-block > div.collapsible-block { border-top: -webkit-calc(var(--w-fontCalc) /3) double var(--w-color2); border-top: -moz-calc(var(--w-fontCalc) /3) double var(--w-color2); border-top: calc(var(--w-fontCalc) /3) double var(--w-color2); padding-top: -webkit-calc(var(--w-fontCalc) * 0.5); padding-top: -moz-calc(var(--w-fontCalc) * 0.5); padding-top: calc(var(--w-fontCalc) * 0.5); } #u-scps-block > div.collapsible-block > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div.collapsible-block > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-color: var(--w-color2); color: var(--w-color1); } #u-scps-block > div.collapsible-block > div.collapsible-block-unfolded > div.collapsible-block-content > ul > li, .scps-block > div.collapsible-block > div.collapsible-block-unfolded > div.collapsible-block-content > ul > li { --wght: 400; -webkit-align-self: center; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; width: 90%; margin: 1em; padding: 1em; font-weight: 400; text-align: justify; text-transform: initial; line-height: 135%; } #u-scps-block > div.collapsible-block > div.collapsible-block-unfolded > div.collapsible-block-content > ul > li > br, .scps-block > div.collapsible-block > div.collapsible-block-unfolded > div.collapsible-block-content > ul > li > br { display: block; content: " "; margin: 1em; } @media (max-width: 768px) { #header h1 { font-size: var(--base-font-size); } #header h2 { font-size: -webkit-calc(var(--base-font-size) * 0.85); font-size: -moz-calc(var(--base-font-size) * 0.85); font-size: calc(var(--base-font-size) * 0.85); } div.WoedContainer { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: auto; margin-top: 1.5rem; } div.WoedContainer .skips { -webkit-flex-basis: auto; -ms-flex-preferred-size: auto; flex-basis: auto; } div.WoedContainer div.skips > div.labels { margin: 2rem auto 1rem auto; width: initial; font-size: -webkit-calc(var(--w-fontCalc) + 1vw + 1vh); font-size: -moz-calc(var(--w-fontCalc) + 1vw + 1vh); font-size: calc(var(--w-fontCalc) + 1vw + 1vh); } div.WoedContainer div.skips > div.labels > div.title { text-align: center; } div.WoedContainer #u-scps-block, div.WoedContainer .scps-block { max-width: -webkit-calc(100% - (var(--w-fontCalc) * 2)); max-width: -moz-calc(100% - (var(--w-fontCalc) * 2)); max-width: calc(100% - (var(--w-fontCalc) * 2)); margin: 1vh auto 2vh auto; } div.WoedContainer > div.name { -ms-writing-mode: inherit; writing-mode: inherit; -webkit-writing-mode: inherit; -webkit-transform: inherit; -moz-transform: inherit; -ms-transform: inherit; -o-transform: inherit; transform: inherit; right: auto; } div.WoedContainer > div.name > div.wrapper { font-size: -webkit-calc(var(--w-fontCalc) + 4.5vw); font-size: -moz-calc(var(--w-fontCalc) + 4.5vw); font-size: calc(var(--w-fontCalc) + 4.5vw); } div.WoedContainer > div.name > div.wrapper::before { -webkit-transform: translate(0, -7%); -moz-transform: translate(0, -7%); -ms-transform: translate(0, -7%); -o-transform: translate(0, -7%); transform: translate(0, -7%); } div.WoedContainer > div.name > div.wrapper::after { -webkit-transform: translate(0, 7%); -moz-transform: translate(0, 7%); -ms-transform: translate(0, 7%); -o-transform: translate(0, 7%); transform: translate(0, 7%); } #u-scps-block div.list-pages-box > div.collapsible-block, .scps-block div.list-pages-box > div.collapsible-block { max-width: 68vw; } #u-scps-block > div > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul > li:nth-child(1), .scps-block > div > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul > li:nth-child(1) { padding: var(--w-fontCalc); } #u-scps-block div.collapsible-block-content > ul > li, .scps-block div.collapsible-block-content > ul > li { width: auto; } #u-scps-block div.collapsible-block-content > ul > li > a::before, .scps-block div.collapsible-block-content > ul > li > a::before { top: -webkit-calc(var(--w-fontCalc) * 0.5); top: -moz-calc(var(--w-fontCalc) * 0.5); top: calc(var(--w-fontCalc) * 0.5); } } @supports (-webkit-overflow-scrolling: touch) { #u-scps-block > div > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-repeat: no-repeat; } #u-scps-block > div:nth-child(1) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div:nth-child(1) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-image: url("/local--files/component%3Awoedauthor%3Atheme/2105.png"); background-position: 42rem center; } #u-scps-block > div:nth-child(2) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div:nth-child(2) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-position: 37rem center; } #u-scps-block > div:nth-child(3) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div:nth-child(3) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-image: url(/local--files/component%3Awoedauthor%3Atheme/4205.JPG); -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; background-position: 33rem center; } #u-scps-block > div:nth-child(4) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul, .scps-block > div:nth-child(4) > div > div.collapsible-block-unfolded > div.collapsible-block-content > ul { background-image: url("/local--files/component%3Awoedauthor%3Atheme/COMPWAN.jpg"); } }
page revision: 250, last edited: 05 Apr 2021 18:08