html,
body {
    font-family: "SJ Sans";
    font-size: 16px;
    font-weight: 400;
	background: #000;
	background-color: #000;
    color: #4d4d4d;
    line-height: 2.25em;
    overflow: hidden;
    padding: 0;
    margin: 0;
}
.article, .landing-page {
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent;
}
/*.article,*/
section.share.section {
    display: none;
}
#global-footer {
    /* opacity: 0; */
    /* display: none; */
    position: absolute;
    z-index: 10000;
    bottom: 0;
    transform: translateY(175px);
    transition: transform 1s;
}
#global-footer.up {
	transform: translateY(0px);
}
.none, #back-top {
    display: none !important;
}
.SeeMeNot {
    opacity: 0;
}
.SeeMe {
    opacity: 1;
}
.noseeMe {
    opacity: 0 !important;
    transition: opacity .25s ease-in-out !important;
    -moz-transition: opacity .25s ease-in-out !important;
    -webkit-transition: opacity .25s ease-in-out !important;
}
.seeMefade25 {
    opacity: 1 !important;
    transition: opacity .25s ease-in-out !important;
    -moz-transition: opacity .25s ease-in-out !important;
    -webkit-transition: opacity .25s ease-in-out !important;
}
.seeMefade5 {
    opacity: 1 !important;
    transition: opacity .5s ease-in-out !important;
    -moz-transition: opacity .5s ease-in-out !important;
    -webkit-transition: opacity .5s ease-in-out !important;
}
.seeMefade5delay {
    opacity: 1 !important;
    transition: opacity .5s ease-in-out !important;
    -webkit-transition: opacity .5s !important;
    -webkit-transition-delay: 5s;
    /* Safari */
    transition-delay: 1s !important;
}
.seeMefade1 {
    opacity: 1 !important;
    transition: opacity 1s ease-in-out !important;
    -moz-transition: opacity 1s ease-in-out !important;
    -webkit-transition: opacity 1s ease-in-out !important;
}
.seeMealways {
    opacity: 1 !important;
    transition: opacity .25s ease-in-out !important;
    -moz-transition: opacity .25s ease-in-out !important;
    -webkit-transition: opacity .25s ease-in-out !important;
}
.no-scroll {
    overflow: hidden;
}
.absolute {
    position: absolute;
}
.triple {
    display: flex;
    justify-content: space-between;
    min-width: 0;
    position: relative;
    perspective: 1000px;
}

.item {
    width: 35%;
    margin: 10px;
    position: relative;
    height: 90vh;
    transform-style: preserve-3d;
}

.item.aaa {
    width: 28%;
    transform: rotateY(30deg) translateX(-500px);
    transform-origin: left;
    min-width: 0;
    transition: transform 1s .7s, filter 1s, opacity .8s;
}

body.ready .item.aaa {
    transform: rotateY(30deg) translateX(0px);
    position: relative;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 10;
}

body.ready .stats {
    transform: translateY(0px);
    opacity: 1;
}

/*********/
img {
    position: absolute;
    height: 100%;
    margin: auto;
}

.two {
    z-index: 2;
}

.cont {
    position: relative;
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/PLBackground_space.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-blend-mode: overlay;
    background-color: darkslategray;
    filter: blur(6px);
    transition: filter 1s;
}

.info,
.aaa {
    align-content: center;
}

.one,
.two {
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    animation-direction: alternate-reverse;
    transform-origin: bottom;
}

.two {
    /*   animation-duration: 9s; */
    transform-origin: center center;
}

.one {
    animation-name: skeOne;
}

.two {
    animation-name: skeTwo;
}

@keyframes skeOne {
    0% {
        transform: skewX(1deg);
    }

    100% {
        transform: skewX(-1deg);
    }
}

@keyframes skeTwo {
    0% {
        transform: translate3d(-15px, 4px, 0px) scale(106%) rotate(1deg);
    }

    100% {
        transform: translate3d(7px, 16px, 0px) scale(111%) rotate(-3deg);
    }
}

.bio {
    transform: rotateY(-30deg) translateX(600px);
    width: 78%;
    color: #fff;
    background-color: #39194b78;
    padding: 10px 16px;
    border-radius: 12px;
    line-height: initial;
    transition: transform 1s, filter 1s, box-shadow .65s 1s, opacity .5s;
    transform-origin: right;
    opacity: 0;
    position: absolute;
    top: calc((90vh / 2) - (65vh / 2) + 35px);
    height: 65vh;
    overflow: visible;
    background-color: #000000b8;
    padding: 4px 20px;
    overflow: visible;
    border: solid 1px #6ed8e8;
    box-shadow: 0 0 10px rgba(0, 255, 255, 0), 0 0 10px rgba(0, 207, 255, 0), 0 0 20px rgba(0, 255, 255, 0);
    clip-path: polygon(65% -10%, 91% 0%, 110% 15%, 110% 110%, 56% 110%, 33% 110%, 10% 100%, -1% 92%, -10% -10%, 64% -10%);
}

.bio h3,
.bio p {
	color: #fff;
    filter: drop-shadow(2px 2px 1px #37194b);
}
.bio p:first-child {
    margin-top: 30px;
}
.bio h3 {
	color: #fff;
    font-size: 3rem;
    line-height: initial;
    margin: auto;
	font-weight: 800;
}

.bio h3 span {
    display: block;
    font-size: 1.5rem;
    position: relative;
}

.bio h3 span::before {
    content: "";
    position: absolute;
    height: 2px;
    width: 23%;
    top: 0;
    left: 0;
    background-color: #fff;
}

body.switchBack .bio {
    transform: rotateY(-122deg) translateZ(-60px);
    filter: blur(14px);
    opacity: 0;
}

body.switchBack .hero img.one,
body.switchBack .hero img.two {
    filter: contrast(0) blur(10px);
    transform: translateX(-150px) skew(0) scale(50%);
    animation: none;
    transform-origin: bottom !important;
    opacity: 0;
    transition: filter 1s, transform 1s, opacity 1s;
}

/*
        .hero {
            display: none;
            opacity: 0;
        }
*/

.hero {
    display: block;
    opacity: 0;
    transition: opacity .75s;
}

body.rawry .hero.maelin {
    display: block;
    opacity: 1;
}

body.taffi .hero.luna {
    display: block;
    opacity: 1;
}

body.monster .hero.ty-monster {
    display: block;
    opacity: 1;
}

body.alien .hero.ty-alien {
    display: block;
    opacity: 1;
}

body.fvrfghtr .hero.ethan {
    display: block;
    opacity: 1;
}

body.monster .heroAssets,
body.alien .heroAssets,
body.fvrfghtr .heroAssets {
	transform: translateY(0);
	filter: blur(0px);
	opacity: 1;
	transition: transform 1s, filter 1s .4s, opacity .9s;
}

.hero::before {
    content: "";
    position: absolute;
    background-color: #98627c;
    width: 90%;
    height: 100px;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    right: 0;
    left: 0;
    filter: drop-shadow(0px 12px 0 #543674);
    display: none;
}

.sitem {
    border: 2px solid black;
    margin: 5px;
    padding: 10px;
    width: 50%;
    height: calc((70vh - 50px) / 6);
    background-color: #211c2d;
    /* #f7bf8d; */
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: none;
    transition: box-shadow .4s;
    transition: border .75s;
}

body .sitem:hover {
    border: solid 2px transparent;
}

body.rawry .sitem:hover,
body.taffi .sitem:hover,
body.monster .sitem:hover,
body.alien .sitem:hover,
body.fvrfghtr .sitem:hover {
    border: solid 2px #fff;
    transition: border .75s;
    cursor: pointer;
}


.char {
    position: fixed;
    /*			background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/rarwy1.png");*/
    background-repeat: no-repeat;
    background-size: 68%;
    background-position: 80% 10%;
    width: 45vw;
    height: 80vh;
    top: 0;
    left: 0;
    opacity: 0;
    filter: blur(30px);
    transition: filter .6s, opacity .5s;
}

.rawry,
.taffi,
.monster,
.alien,
.fvrfghtr {
    background-repeat: no-repeat;
    background-size: 100%;
    /*            background-attachment: fixed;*/
}

/****** RAWRY ******/
.rawry:not(body.rawry) {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/rarwy1.png");
    background-position: 50px 20%;
}

body.rawry .sitem.rawry {
    border: solid 4px aliceblue;
    filter: drop-shadow(0 0 3px aliceblue);
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 20px rgba(0, 207, 255, 0.7), 0 0 70px rgba(0, 255, 255, 0.3);
    z-index: 2;
}

body.rawry .bio.maelinBio {
    /*            display: block;*/
    transform: rotateY(-30deg) translateX(0px);
    opacity: 1;
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
}

/*
		body.rawry .bio.maelinBio.sss {
  transform: rotateY(0deg);
  transition: transform 1s;
}
*/

body.rawry .char {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/rarwy1.png");
    filter: blur(0);
    opacity: .35;
}

/****** add PL icon ******/
/*
		.sitem.rawry::before {
		  content: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/playlive-icon.svg");
		  width: 50px;
		  height: 50px;
		  top: calc(50% - 25px);
		  bottom: 0;
		  left: calc(-23px);
		  display: block;
		  z-index: 50;
		  position: absolute;
		  transform: scaleX(90%);
			display: none;
		}
*/
/****** TAFFI ******/
.taffi:not(body.taffi) {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/taffi.png");
    background-position: 33px 31%;
}

body.taffi .sitem.taffi {
    border: solid 4px aliceblue;
    filter: drop-shadow(0 0 3px aliceblue);
    /*            box-shadow: 0 0 30px rgba(0, 255, 255, 0.9), 0 0 60px rgba(0, 207, 255, 0.9), 0 0 90px rgba(0, 255, 255, 0.9);*/
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 20px rgba(0, 207, 255, 0.7), 0 0 70px rgba(0, 255, 255, 0.3);
    z-index: 2;
}

body.taffi .bio.lunaBio {
    /*            display: block;*/
    transform: rotateY(-30deg) translateX(0px);
    opacity: 1;
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
}

body.taffi .char {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/taffi.png");
    filter: blur(0);
    opacity: .35;
}

/****** MONSTER & ALIEN ******/
.monster:not(body.monster) {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/monster1.png");
    background-position: 60px 23%;
}

body.monster .sitem.monster {
    border: solid 4px aliceblue;
    filter: drop-shadow(0 0 3px aliceblue);
    /*            box-shadow: 0 0 30px rgba(0, 255, 255, 0.9), 0 0 60px rgba(0, 207, 255, 0.9), 0 0 90px rgba(0, 255, 255, 0.9);*/
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 20px rgba(0, 207, 255, 0.7), 0 0 70px rgba(0, 255, 255, 0.3);
    z-index: 2;
}

.alien:not(body.alien) {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/alien.png");
    background-position: 60px 48%;
}

body.alien .sitem.alien {
    border: solid 4px aliceblue;
    filter: drop-shadow(0 0 3px aliceblue);
    /*            box-shadow: 0 0 30px rgba(0, 255, 255, 0.9), 0 0 60px rgba(0, 207, 255, 0.9), 0 0 90px rgba(0, 255, 255, 0.9);*/
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 20px rgba(0, 207, 255, 0.7), 0 0 70px rgba(0, 255, 255, 0.3);
    z-index: 2;
}

body.monster .bio.tyBio,
body.alien .bio.tyBio {
    /*            display: block;*/
    transform: rotateY(-30deg) translateX(0px);
    opacity: 1;
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
}

body.monster .char {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/monster1.png");
    filter: blur(0);
    opacity: .35;
}

body.alien .char {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/alien.png");
    filter: blur(0);
    opacity: .35;
}

/****** FEVER FIGHTER ******/
.fvrfghtr:not(body.fvrfghtr) {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/fvr1.png");
    background-position: 50px 30%;
}

body.fvrfghtr .sitem.fvrfghtr {
    border: solid 4px aliceblue;
    filter: drop-shadow(0 0 3px aliceblue);
    /*            box-shadow: 0 0 30px rgba(0, 255, 255, 0.9), 0 0 60px rgba(0, 207, 255, 0.9), 0 0 90px rgba(0, 255, 255, 0.9);*/
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 20px rgba(0, 207, 255, 0.7), 0 0 70px rgba(0, 255, 255, 0.3);
    z-index: 2;
}

body.fvrfghtr .bio.ethanBio {
    /*            display: block;*/
    transform: rotateY(-30deg) translateX(0px);
    opacity: 1;
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
}

body.fvrfghtr .char {
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/fvr1.png");
    filter: blur(0);
    opacity: .35;
}

/****** end char ******/

.select {
    height: 80vh;
    padding-left: 50px;
    padding-top: 40px;
}

.select .sitem p {
    position: absolute;
    bottom: 0px;
    left: 0px;
    margin: 0;
    /*! text-transform: uppercase; */
    font-size: 1.85rem;
    color: #fff;
    /*! background-color: #39194b91; */
    padding: 6px 0 0 5px;
    width: 100%;
    /*! font-weight: 800; */
}

.sitem p {
    text-shadow: 0 0 10px rgba(0, 253, 253, 0.9), 0 0 20px rgba(17, 186, 225, 0.7), 0 0 70px rgba(0, 255, 255, 0.3);
}

.hdr {
    color: aliceblue;
    font-size: 2.2rem;
    padding-left: 10px;
    width: 100%;
    text-transform: uppercase;
    text-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
    font-weight: 800;
    transform-origin: left;
    transform: scaleX(80%);
    font-style: italic;
    margin: auto auto 20px;
}

/* Star styling */
.star {
    position: absolute;
    background: #dfe2bf;
    border-radius: 50%;
    width: 5px;
    height: 5px;
    opacity: 0.8;
    animation: twinkle 3s 8s infinite ease;
    top: 20%;
    left: 39%;
    filter: blur(1px) drop-shadow(0 0 3px #fff);
}

.star.b {
    top: 16%;
    left: 60%;
    animation: twinkle 5s infinite ease;
}

.star.c {
    top: 9%;
    left: 62%;
}

.star.d {
    top: 56%;
    left: 38%;
}

.star.e {
    top: 40%;
    left: 64%;
    width: 4px;
    height: 4px;
    animation: twinkle 4s infinite ease;
}

.star.f {
    top: 16%;
    left: 42%;
    width: 4px;
    height: 4px;
    animation: twinkle 4s infinite ease;
}

/* Twinkle animation definition */
@keyframes twinkle {

    0%,
    100% {
        opacity: 0.8;
    }

    50% {
        opacity: 0.1;
    }
}

.falling {
    position: absolute;
    top: 0%;
    left: 70%;
    width: 4px;
    height: 4px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.1), 0 0 0 8px rgba(255, 255, 255, 0.1), 0 0 20px rgba(255, 255, 255, 0.1);
    animation: animate 10s 20s linear infinite;
    transform: rotate(315deg) translateX(0);
    opacity: 0
}

.falling::before {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 300px;
    height: 1px;
    background: linear-gradient(90deg, #fff, transparent);
}

@keyframes animate {
    0% {
        transform: rotate(315deg) translateX(0);
        opacity: 1;
    }

    20% {
        transform: rotate(315deg) translateX(-900px);
        opacity: 0;
    }

    50.5%,
    100% {
        transform: rotate(315deg) translateX(-1000px);
        opacity: 0;
    }
}

/* end animation */

.stats {
    /*  background-color: aliceblue;*/
    padding: 6px;
    display: flex;
    justify-content: space-around;
    align-self: flex-start;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    width: 100%;
    max-width: 400px;
    transition: transform 1s, filter 1s, opacity .8s;
    transform: translateY(-100px);
    opacity: 0;
}

.box {
    flex: 1;
    /*! padding: 0 10px; */
    text-align: center;
    margin: 1px;
    background-color: #f0f8ff24;
    color: #f0f8ff;
    border: solid 1px #f0f8ff;
    border-radius: 4px;
    align-content: flex-start;
    height: 75px;
	padding: 6px;
}

.box:hover {
    box-shadow: 0 0 30px rgba(0, 255, 255, 0.9), 0 0 60px rgba(0, 207, 255, 0.9), 0 0 90px rgba(0, 255, 255, 0.9);
    z-index: 2;
}

.box p {
    line-height: initial;
    font-size: .85rem;
    margin: auto;
}

.box.tools {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' id='Preference Gear' viewBox='0 0 64 64'%3E%3Cdefs%3E%3Cstyle%3E.st0{fill:%23FFFFFF}%3C/style%3E%3C/defs%3E%3Cpath d='M47.11 26.76a.6.6 0 0 0-.05-.18c-.05-.13-.11-.26-.16-.39-.1-.27-.22-.53-.33-.79-.12-.27-.25-.53-.38-.79-.11-.2-.22-.4-.34-.6-.16-.28-.33-.57-.51-.84-.11-.16-.23-.32-.34-.47-.2-.28-.41-.57-.63-.84-.11-.13-.23-.25-.35-.38-.23-.26-.45-.53-.7-.78-.7-.7-1.45-1.31-2.23-1.85-.05-.04-.1-.08-.16-.11-.31-.21-.63-.39-.95-.58-.14-.08-.27-.17-.42-.25-.25-.14-.52-.25-.78-.37-.22-.11-.44-.22-.67-.31-.19-.08-.38-.14-.57-.21-.31-.12-.62-.23-.94-.33-.11-.03-.21-.05-.32-.08-1.37-.38-2.8-.6-4.28-.6s-2.92.22-4.28.6c-.11.03-.21.05-.32.08-.32.1-.63.21-.94.33-.19.07-.38.13-.57.21-.23.09-.45.2-.67.31-.26.12-.53.24-.78.38-.14.08-.27.16-.41.24-.32.19-.64.37-.96.58-.05.03-.09.07-.14.1-.79.54-1.55 1.15-2.25 1.86s-1.33 1.47-1.87 2.27c-.03.04-.06.08-.08.11-.22.32-.41.65-.6.99-.07.13-.15.25-.22.37-.15.27-.27.55-.4.82-.1.21-.2.41-.29.62s-.15.42-.23.63c-.11.29-.22.58-.31.88-.04.13-.07.27-.1.4-.1.38-.2.75-.28 1.14 0 .04-.01.08-.02.11-.18.96-.28 1.94-.28 2.95 0 .38.04.75.06 1.13.01.15 0 .29.02.44.03.36.09.71.15 1.06.03.18.05.37.09.55.07.33.15.65.24.97l.18.65c.09.28.19.56.29.84.1.26.21.53.32.79.06.13.1.27.16.4.03.06.06.11.1.16.76 1.57 1.77 3.04 3.07 4.34s2.78 2.31 4.34 3.07c.05.03.1.07.16.1.12.06.25.1.38.15q.405.18.81.33a13 13 0 0 0 1.49.47c.31.08.63.17.94.23.2.04.4.07.59.1q.51.09 1.02.15c.19.02.37.02.56.03.34.02.67.05 1.01.05.98 0 1.93-.1 2.86-.27l.21-.03c.36-.07.72-.17 1.07-.26l.48-.12c.28-.08.55-.19.82-.28.23-.08.47-.16.69-.25.19-.08.37-.17.56-.26.3-.14.6-.27.89-.43.1-.06.2-.12.31-.18.36-.2.71-.41 1.06-.64l.02-.02c.83-.56 1.62-1.2 2.35-1.93.29-.29.56-.61.83-.92.07-.08.15-.16.21-.24.24-.29.45-.59.67-.89.1-.14.21-.28.3-.42.19-.28.36-.58.53-.88.11-.19.22-.37.32-.56.14-.27.27-.54.4-.82.11-.25.22-.5.32-.76.05-.14.12-.27.17-.4.02-.06.03-.13.05-.19.57-1.64.9-3.4.9-5.23s-.33-3.59-.9-5.24ZM20.1 37.22c-.1-.22-.18-.44-.27-.66-.08-.22-.16-.43-.23-.65-.06-.19-.11-.38-.16-.57-.07-.25-.13-.49-.18-.74-.04-.18-.06-.36-.09-.54-.04-.26-.09-.51-.11-.77-.02-.21-.02-.43-.04-.65-.05-.95 0-1.9.16-2.83.02-.11.03-.22.05-.33.05-.26.12-.51.19-.76.04-.16.08-.33.13-.49.06-.19.13-.38.2-.58.08-.22.15-.44.24-.65.05-.13.12-.25.17-.37.12-.27.25-.54.39-.8.03-.06.07-.11.1-.16 1.17-2.08 2.89-3.81 4.96-4.98.08-.04.15-.09.23-.14.23-.13.48-.23.72-.35.15-.07.31-.15.46-.21.17-.07.36-.13.53-.2.23-.08.46-.17.7-.24.11-.03.22-.05.32-.08.31-.08.62-.17.94-.23h.04c1.99-.38 4.04-.29 6 .26.06.02.12.03.18.05.29.09.57.19.85.3.13.05.25.09.38.14.22.09.43.2.64.3.18.09.36.16.53.26.16.08.31.18.46.27.22.13.44.25.65.39.1.07.2.15.31.23.25.18.49.35.72.54l.04.04c.45.37.86.79 1.26 1.22.17.18.34.36.5.55s.3.4.45.6c.11.15.23.31.33.47.14.21.26.42.39.64.1.17.2.35.3.53.11.2.2.41.3.62s.19.43.27.65c.57 1.47.9 3.06.9 4.73s-.33 3.26-.9 4.73c-.08.22-.17.43-.27.64-.1.22-.2.43-.31.64-.09.17-.18.33-.28.49-.13.23-.27.46-.41.68-.09.14-.19.26-.28.4-.16.23-.33.46-.5.67-.09.11-.2.22-.29.33-.71.81-1.52 1.54-2.41 2.15l-.09.06c-.27.18-.54.34-.82.5-.09.05-.19.11-.28.17-.23.12-.47.23-.7.34-.16.07-.31.15-.47.22-.18.08-.37.14-.55.2-.22.08-.45.17-.67.23-.13.04-.26.07-.39.1q-.435.12-.87.21l-.19.03c-1.02.18-2.05.24-3.08.18q-.255 0-.51-.03c-.27-.03-.55-.07-.82-.12-.16-.03-.33-.05-.49-.08-.26-.05-.52-.12-.78-.19-.18-.05-.36-.09-.53-.15a9 9 0 0 1-.69-.24c-.21-.08-.41-.16-.61-.25-1.45-.63-2.81-1.53-4-2.71a12.9 12.9 0 0 1-2.7-3.97Z' class='st0'/%3E%3Cpath d='m61.63 25.76-5.71-.49c-.02-.09-.05-.17-.08-.26l-.09-.29c-.14-.45-.29-.9-.45-1.34-.05-.13-.1-.27-.15-.4-.17-.43-.34-.85-.53-1.26-.05-.11-.09-.22-.14-.32-.25-.52-.51-1.04-.79-1.54l3.69-4.38c.5-.6.46-1.48-.09-2.03l-6.71-6.71c-.55-.55-1.43-.59-2.03-.09l-.93.78-3.46 2.91c-1.71-.96-3.53-1.71-5.42-2.24l-.18-2.11-.31-3.6c-.07-.77-.72-1.37-1.49-1.37h-9.5c-.74 0-1.35.55-1.47 1.27 0 .04-.03.07-.03.1l-.49 5.71c-1.89.53-3.71 1.28-5.42 2.24l-4.38-3.69c-.59-.5-1.48-.46-2.03.09l-6.72 6.72c-.55.55-.59 1.43-.09 2.03l3.13 3.72.56.67a25.2 25.2 0 0 0-2.25 5.42l-5.71.49a1.5 1.5 0 0 0-1.37 1.49v9.5c0 .37.14.71.37.97.25.29.6.49 1 .52l5.71.49c.16.55.34 1.1.53 1.64.04.12.09.24.14.36.16.42.32.83.5 1.24.06.14.12.28.19.42.19.42.4.84.62 1.25.05.09.09.18.14.27l.12.24-3.68 4.38c-.5.59-.46 1.48.09 2.03l6.71 6.71c.55.55 1.43.59 2.03.09l4.38-3.69c.08.04.16.08.23.12.1.05.19.1.29.15.41.22.82.42 1.24.62.14.06.27.12.41.18.41.18.82.35 1.24.5.12.05.24.09.36.14.54.19 1.09.37 1.64.53l.49 5.71.03.1c.06.41.29.74.6.97.25.18.54.3.87.3h9.49c.78 0 1.43-.6 1.49-1.37l.49-5.71q2.13-.6 4.11-1.56c.04-.02.07-.04.11-.06q.6-.3 1.2-.63l1.88 1.58 2.5 2.11c.11.1.24.15.38.21.04.02.07.05.11.06.52.18 1.12.05 1.54-.36l6.72-6.71c.55-.55.59-1.43.09-2.03l-3.47-4.13-.22-.26c.28-.5.53-1 .78-1.51.07-.14.13-.28.19-.42.17-.38.34-.77.49-1.15.06-.16.13-.33.19-.49.14-.39.28-.79.4-1.2.04-.14.09-.29.13-.43.02-.07.05-.14.07-.21l5.71-.49a1.5 1.5 0 0 0 1.37-1.49v-9.5c0-.78-.59-1.43-1.37-1.49ZM60 35.37l-5.4.47c-.65.06-1.18.52-1.33 1.15-.54 2.31-1.45 4.51-2.7 6.52-.34.54-.29 1.22.1 1.72 0 .01.01.03.02.04l.46.55 3.02 3.6-4.77 4.77-4.14-3.49c-.37-.31-.87-.42-1.32-.31-.11.03-.22.08-.33.14-.03.02-.07.02-.11.04a21.7 21.7 0 0 1-6.52 2.7 1.5 1.5 0 0 0-1.15 1.33l-.47 5.39h-6.74l-.47-5.39c-.06-.65-.52-1.18-1.15-1.33h-.04c-2.3-.54-4.48-1.44-6.49-2.69-.55-.34-1.26-.29-1.76.13l-4.14 3.48-4.77-4.77 3.48-4.14c.42-.5.47-1.21.13-1.76a21.6 21.6 0 0 1-2.69-6.49V37c-.07-.32-.25-.59-.48-.79s-.53-.33-.85-.36L4 35.38v-6.74l5.4-.47c.65-.06 1.18-.52 1.33-1.15.54-2.31 1.45-4.51 2.7-6.52.34-.55.29-1.26-.13-1.76l-.25-.3-3.23-3.84 4.77-4.77 4.14 3.48c.5.42 1.21.47 1.76.13 2.02-1.25 4.21-2.16 6.52-2.7.32-.07.59-.25.79-.48s.33-.53.36-.85l.47-5.39h6.74l.11 1.23.36 4.16c.06.65.52 1.19 1.15 1.33 2.31.54 4.5 1.45 6.52 2.7.51.32 1.16.28 1.64-.06.04-.03.08-.04.12-.07l4.14-3.48 1.06 1.06 3.71 3.71-3.47 4.13-.02.02c-.42.5-.47 1.21-.13 1.76 0 .01.02.02.02.04 1.24 2 2.14 4.18 2.68 6.48.15.63.69 1.1 1.33 1.15l5.4.47v6.74Z' class='st0'/%3E%3C/svg%3E");

    background-size: 54%;
    background-repeat: no-repeat;
    background-position: 50% 86%;
/*    filter: brightness(10);*/
}

.box.donate {
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='iso-8859-1'?%3E%3C!-- Generator: Adobe Illustrator 23.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Donate2_B' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 806.093 806.093' style='enable-background:new 0 0 806.093 806.093;' xml:space='preserve'%3E%3Cg%3E%3Cpath style='fill:%23FFFFFF;' d='M774.411,246.157c-20.301-47.997-49.359-91.098-86.368-128.107s-80.11-66.067-128.106-86.369 C510.234,10.659,457.448,0,403.046,0c-54.402,0-107.188,10.659-156.89,31.681c-47.997,20.301-91.098,49.36-128.107,86.369 s-66.067,80.11-86.369,128.107C10.659,295.859,0,348.644,0,403.046s10.659,107.188,31.681,156.89 c20.301,47.997,49.36,91.099,86.369,128.107s80.11,66.067,128.107,86.368c49.702,21.022,102.487,31.682,156.89,31.682 c54.402,0,107.188-10.659,156.89-31.682c47.996-20.301,91.098-49.359,128.106-86.368s66.067-80.11,86.368-128.107 c21.022-49.702,31.682-102.487,31.682-156.89S795.434,295.859,774.411,246.157z M660.466,660.466 c-68.759,68.76-160.179,106.627-257.419,106.627c-97.24,0-188.66-37.867-257.419-106.627C76.867,591.708,39,500.287,39,403.046 s37.867-188.66,106.627-257.419C214.386,76.867,305.806,39,403.046,39c97.241,0,188.661,37.867,257.419,106.627 c68.76,68.759,106.627,160.179,106.627,257.419S729.226,591.708,660.466,660.466z'/%3E%3Cpath style='fill:%23FFFFFF;' d='M507.321,412.174c-20.476-14.644-48.34-24.602-84.785-30.259V252.799 c29.561,4.26,56.873,16.056,81.562,35.286c8.496,6.618,20.748,5.094,27.367-3.402c6.617-8.497,5.094-20.749-3.402-27.366 c-31.821-24.783-67.175-39.464-105.527-43.897v-38.152c0-10.77-8.73-19.5-19.5-19.5c-10.77,0-19.5,8.73-19.5,19.5v37.128 c-2.136,0.125-4.277,0.27-6.428,0.453c-62.075,5.291-105.428,46.731-105.428,100.776c0,28.32,9.999,51.599,29.717,69.189 c18.912,16.871,45.88,27.844,82.139,33.379v136.18c-34.87-5.29-67.302-19.877-88.628-40.919c-7.666-7.564-20.012-7.48-27.577,0.186 c-7.564,7.666-7.481,20.012,0.185,27.576c18.756,18.507,43.876,33.297,72.645,42.771c14.033,4.622,28.631,7.88,43.375,9.742v39.207 c0,10.77,8.73,19.5,19.5,19.5c10.77,0,19.5-8.73,19.5-19.5v-37.594c1.459-0.065,2.916-0.14,4.37-0.234 c30.568-1.981,58.935-11.109,79.874-25.704c26.672-18.588,40.77-44.964,40.77-76.275 C547.55,457.831,534.015,431.266,507.321,412.174z M310.679,313.625c0-33.479,28.026-58.362,69.74-61.917 c1.042-0.089,2.079-0.16,3.117-0.232v125.2C318.701,365.205,310.679,335.666,310.679,313.625z M484.481,535.409 c-15.186,10.583-36.529,17.253-60.097,18.781c-0.616,0.04-1.232,0.062-1.849,0.096V421.439 c76.511,13.373,86.014,45.643,86.014,69.69C508.55,509.636,500.677,524.121,484.481,535.409z'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: 50% 86%;
/*    filter: brightness(10);*/
	display: none;
}

.box.register {
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='iso-8859-1'?%3E%3C!-- Generator: Adobe Illustrator 23.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Participate_B' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 64 64' style='enable-background:new 0 0 64 64;' xml:space='preserve'%3E%3Cg%3E%3Cpath style='fill:%23FFFFFF;' d='M24.977,54.748H4V9.247h45.501v11.526c0,0.829,0.672,1.5,1.5,1.5c0.828,0,1.5-0.671,1.5-1.5V7.747 c0-0.829-0.672-1.5-1.5-1.5H2.5c-0.829,0-1.5,0.671-1.5,1.5v48.501c0,0.828,0.671,1.5,1.5,1.5h22.477c0.829,0,1.5-0.672,1.5-1.5 C26.477,55.42,25.805,54.748,24.977,54.748z'/%3E%3Cpath style='fill:%23FFFFFF;' d='M61.049,22.953c-1.197-1.117-2.741-1.703-4.396-1.644c-1.638,0.057-3.154,0.749-4.27,1.947 L31.099,46.078c-0.176,0.19-0.3,0.42-0.361,0.671l-2.216,9.17c-0.128,0.526,0.039,1.08,0.435,1.449 c0.282,0.263,0.649,0.403,1.023,0.403c0.152,0,0.305-0.023,0.453-0.07l8.993-2.851c0.246-0.078,0.468-0.218,0.643-0.406 L61.353,31.62c1.116-1.198,1.699-2.759,1.643-4.396C62.939,25.588,62.248,24.071,61.049,22.953z M38.144,52.11l-6.081,1.928 l1.498-6.201l8.129-8.717l4.582,4.273L38.144,52.11z M59.159,29.574L48.319,41.2l-4.582-4.273l10.841-11.624 c0.57-0.612,1.345-0.965,2.181-0.995c0.825-0.027,1.634,0.27,2.245,0.84c0.613,0.571,0.966,1.346,0.995,2.181 C60.027,28.165,59.728,28.963,59.159,29.574z'/%3E%3Cpath style='fill:%23FFFFFF;' d='M37.257,21.609L22.373,37.57l-6.158-6.598c-0.565-0.604-1.514-0.638-2.12-0.073 c-0.605,0.566-0.638,1.515-0.073,2.12l7.255,7.774c0.284,0.304,0.681,0.477,1.097,0.477c0.416,0,0.813-0.173,1.097-0.477 l15.98-17.138c0.565-0.606,0.532-1.555-0.073-2.12C38.77,20.971,37.821,21.002,37.257,21.609z'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: 50% 86%;
/*    filter: brightness(10);*/
}

.box.infoGear {
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='iso-8859-1'?%3E%3C!-- Generator: Adobe Illustrator 23.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Request_Info_B' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 64 64' style='enable-background:new 0 0 64 64;' xml:space='preserve'%3E%3Cg%3E%3Cg%3E%3Cg%3E%3Cpath style='fill:%23FFFFFF;' d='M54.776,50.293c-0.345,0-0.69-0.118-0.974-0.359c-0.63-0.538-0.704-1.485-0.166-2.115 c3.676-4.302,5.85-9.517,6.285-15.08c0.609-7.807-2.2-15.444-7.709-20.953c-5.508-5.508-13.14-8.317-20.954-7.707 c-5.562,0.435-10.776,2.608-15.078,6.285c-0.629,0.539-1.577,0.465-2.115-0.166c-0.539-0.63-0.464-1.577,0.165-2.115 c4.787-4.092,10.595-6.511,16.794-6.996c8.685-0.676,17.179,2.447,23.309,8.577c6.13,6.129,9.257,14.625,8.578,23.308 c-0.485,6.2-2.903,12.008-6.994,16.795C55.621,50.114,55.2,50.293,54.776,50.293z'/%3E%3Cpath style='fill:%23FFFFFF;' d='M4.42,62.073c-0.647,0-1.281-0.253-1.762-0.733c-0.732-0.732-0.938-1.816-0.527-2.763 l5.683-13.099c-1.371-2.352-2.406-4.871-3.083-7.502c-0.77-2.993-1.064-6.097-0.873-9.224c0.378-6.207,2.691-12.057,6.69-16.917 c0.526-0.64,1.471-0.731,2.111-0.205c0.64,0.526,0.731,1.472,0.205,2.111c-3.595,4.368-5.674,9.622-6.013,15.194 c-0.171,2.814,0.093,5.605,0.785,8.294c0.667,2.592,1.721,5.063,3.136,7.348c0.259,0.418,0.296,0.937,0.101,1.387L5.388,58.608 l12.644-5.484c0.45-0.196,0.969-0.157,1.387,0.101c2.286,1.416,4.758,2.472,7.348,3.137c2.692,0.693,5.484,0.96,8.295,0.786 c5.573-0.339,10.827-2.418,15.196-6.013c0.641-0.526,1.586-0.434,2.111,0.205c0.526,0.64,0.435,1.585-0.205,2.111 c-4.86,4-10.712,6.313-16.92,6.69c-3.124,0.193-6.229-0.104-9.225-0.874c-2.629-0.676-5.149-1.713-7.501-3.084L5.42,61.864 C5.097,62.005,4.757,62.073,4.42,62.073z'/%3E%3C/g%3E%3Cpath style='fill:%23FFFFFF;' d='M33.403,44.081c-0.829,0-1.5-0.672-1.5-1.5V27.529c0-0.829,0.671-1.5,1.5-1.5 c0.828,0,1.5,0.671,1.5,1.5v15.052C34.903,43.409,34.231,44.081,33.403,44.081z'/%3E%3C/g%3E%3Cpath style='fill:%23FFFFFF;' d='M31.087,19.519c0-1.28,1.037-2.317,2.317-2.317c1.28,0,2.317,1.037,2.317,2.317 c0,1.28-1.037,2.317-2.317,2.317C32.125,21.836,31.087,20.799,31.087,19.519z'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: 50% 86%;
/*    filter: brightness(10);*/
}

.box.playlive {
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22750%22%20height%3D%22750%22%3E%3Cpath%20fill%3D%22%23d11947%22%20stroke%3D%22%22%20stroke-width%3D%22%22%20d%3D%22M389.53%20436.478a2.526%202.526%200%200%201-2.074%201.64%2092.274%2092.274%200%200%200-67.675%2031.869s-2.047%201.987-7.216-2.075a5.434%205.434%200%200%201-2.504-6.347c7.047-17.748%2025.213-29.451%2053.94-34.764l.843-.123c5.88-.807%2019.561-2.697%2024.22%206.497a4.64%204.64%200%200%201%20.466%203.303m82.147%2087.968l-.165-.215a248.594%20248.594%200%200%201%2029.175-36.996c.355-.162.613-.268%201.008-.452a49.736%2049.736%200%200%200%2025.858-7.764%20166.71%20166.71%200%200%200%2012.616-11.647%20114.902%20114.902%200%200%200%207.544-15.484v-.014l-.195.356.706-1.641.115-.439%201.15-3.558a3.005%203.005%200%200%200-1.567-2.553%204.291%204.291%200%200%200-2.42-.263l.066-.215a10.178%2010.178%200%200%200%201.123-3.658v-.255a3.475%203.475%200%200%200-1.763-2.614%205.362%205.362%200%200%200-3.712-.21%205.896%205.896%200%200%200-1.634-1.527c-.289-.207-1.95-.798-5.01%201.057a13.567%2013.567%200%200%200-3.356%203.193l.23-1.881a3.293%203.293%200%200%200-2.064-2.233%205.739%205.739%200%200%200-5.058.974%2027.35%2027.35%200%200%200-5.28%206.615%2022.206%2022.206%200%200%200-4.747%205.408%2016.129%2016.129%200%200%201-9.294%201.009%2027.106%2027.106%200%200%200%206.665-4.909%2017.292%2017.292%200%200%200%204.587-10.26%208.34%208.34%200%200%200-.129-1.5%204.267%204.267%200%200%200-2.13-3.026c-2.966-1.478-6.51%201.522-7.19%202.145-.052.075-1.034%201.11-1.571%201.689a12.5%2012.5%200%200%200-5.018%202.346%2010.722%2010.722%200%200%201-3.908%201.904%2016.462%2016.462%200%200%200-5.906%203.04l-.155.119.142-.093c-.369.255-3.624%202.422-4.632%203.106a37.312%2037.312%200%200%200-9.813%207.523c-5.249%205.224-11.83%2011.695-41.311%2021.464-.253-10.8-6.91-39.813-8.255-50.915-2.723-19.609-25.445-46.6-41.787-63.676%2015.41%208.957%2024.033%2010.212%2032.515-1.347%202.238-3.5%205.772.277%208.97-.342%204.662-2.426%204.058-3.729%204.058-7.106%201.368-3.619%205.032-1.834%207.754-2.272%206.865-1.136%202.784-8.344%205.47-11.962%2030.183-1.803-3.85-29.566%2016.466-41.063a57.906%2057.906%200%200%200%2024.102-22.35c4.868-6.562%205.876-1.434%209.517-6.825%206.577-23.66-4.778-52.845-19.401-72.922-74.9-96.356-160.421-51.929-185.355%207.75-10.31%2015.165-7.127%2037.212-7.705%2055.346-1.94%206.308-5.724%206.133-11.163%202.409a13.732%2013.732%200%200%200%202.916%2010.77%2013.71%2013.71%200%200%200%209.948%205.043c.458%201.601%203.309%204.036%204.498%205.703a27.671%2027.671%200%200%201-14.72-2.567%209.877%209.877%200%200%200%202.513%207.752%2017.926%2017.926%200%200%200%2012.767%2014.69c12.016%204.878%206.377%2021.359%204.97%2028.127-.44%201.496-.898%202.987-1.293%204.413a32.199%2032.199%200%200%200-21.461%2023.345c-1.355%2025.302-14.397%2046.3-14.166%2072.484a40.114%2040.114%200%200%200%200%205.396c6.479%2028.324-1.798%2065.447-.43%2094.644A726.148%20726.148%200%200%200%200%20614.692a1009.198%201009.198%200%200%201%20375.005-69.677A1009.13%201009.13%200%200%201%20750%20614.691a731.796%20731.796%200%200%200-278.323-90.245%22%2F%3E%3C%2Fsvg%3E);
    background-size: 65%;
    background-repeat: no-repeat;
    background-position: 50% 100%;
/*    filter: brightness(10);*/
}

.heroAssets {
	width: 200px;
	position: absolute;
	bottom: 0;
	right: 0;
	transform: translateY(100%);
	filter: blur(5px);
	opacity: 0;
  transition: transform .7s, filter .4s, opacity .9s;
}

.heroAssets img {
    position: relative;
    height: auto;
    width: 100%;
}

body.rawry .sitem.rawry,
body.taffi .sitem.taffi,
body.monster .sitem.monster,
body.alien .sitem.alien,
body.fvrfghtr .sitem.fvrfghtr {
    z-index: initial;
    filter: none;
    overflow: visible;
    box-shadow: none;
    border: solid 2px transparent;
    transition: border .75s;
}

body.rawry .sitem.rawry:before,
body.taffi .sitem.taffi:before,
body.monster .sitem.monster:before,
body.alien .sitem.alien:before,
body.fvrfghtr .sitem.fvrfghtr:before,
body.rawry .sitem.rawry:after,
body.taffi .sitem.taffi:after,
body.monster .sitem.monster:after,
body.alien .sitem.alien:after,
body.fvrfghtr .sitem.fvrfghtr:after {
    content: "";
    position: absolute;
    left: -4px;
    top: -4px;
    background: linear-gradient(45deg, #ff0000, #fb0094, #0000ff, #00ff00, #ffff00, #ff0000, #fb0094,
            #0000ff, #00ff00, #ffff00, #ff0000);
    background-size: 400%;
    width: calc(100% + 8px);
    height: calc(100% + 8px);
    z-index: -1;
    animation: steam 60s linear infinite;
    border-radius: 8px
}

@keyframes steam {
    0% {
        background-position: 0 0;
    }

    50% {
        background-position: 400% 0;
    }

    100% {
        background-position: 0 0;
    }
}

body.rawry .sitem.rawry:after,
body.taffi .sitem.taffi:after,
body.monster .sitem.monster:after,
body.alien .sitem.alien:after,
body.fvrfghtr .sitem.fvrfghtr:after {
    filter: blur(50px);
}

body.rawry .one,
body.taffi .one,
body.monster .one,
body.alien .one,
body.fvrfghtr .one {
    filter: brightness(100%) blur(0px);
    opacity: 1;
}

.one {
    filter: brightness(400%) blur(10px);
    /* Brightness on hover */
    opacity: 0;
    transition: filter .5s ease, opacity .75s ease;
    transition: filter .5s ease, opacity .75s ease;
    -webkit-mask-image: linear-gradient(to bottom, black 88%, transparent 98%);
    mask-image: linear-gradient(to bottom, black 88%, transparent 98%);
}

.artPlate {
    background-color: #000000b8;
    position: absolute;
    left: 0;
    bottom: 50px;
    z-index: 500;
    height: auto;
    display: block;
    color: #fff;
    padding: 8px 12px;
    border-radius: 6px;
    opacity: 1;
    right: 0;
    max-width: 62%;
    width: fit-content;
    line-height: normal;
    transform: scale(0);
    transform-origin: bottom right;
    transition: transform .35s, filter .25s .4s;
    filter: brightness(0);
    border: solid 1px #6ed8e8;
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
    clip-path: polygon(0, calc(120% + 120px) 0, 120% -150px, 120% 120%, -150px 120%, 0 calc(120% - 0px));
    right: 0;
    margin: auto;
	display: none;
}

.artPlate.view {
    transform: scale(100%);
    filter: brightness(1);
}

.artPlate::after {
    content: "";
    display: inline-block;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0px 18px 18px 0px;
    border-color: transparent #6ed8e8 transparent transparent;
    position: absolute;
    right: 0;
    top: 0;
    bottom: auto;
    /*! z-index: 11; */
}

body.monster .artPlate,
body.alien .artPlate,
body.fvrfghtr .artPlate {
    margin: 0;
}

.foreground {
    position: fixed;
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/foreground-rocks.png");
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 1;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.foreground img {
    width: 100%;
}

/*
		.bio.sss::before {
  content: "Profile";
  color: aliceblue;
  font-size: 2.2rem;
  padding-left: 10px;
  width: 100%;
  text-transform: uppercase;
  text-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
  font-weight: 800;
  transform-origin: left;
  transform: scaleX(80%);
  font-style: italic;
  margin: 0 auto 20px;
  top: -55px;
  position: absolute;
}
*/
.profHdr {
    color: aliceblue;
    font-size: 2.2rem;
    width: 100%;
    text-transform: uppercase;
    text-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
    font-weight: 800;
    transform-origin: left;
    transform: scaleX(80%);
    font-style: italic;
    margin: 0 auto 20px;
    top: -55px;
    position: absolute;
    left: 17px;
}

.sss.bio .profHdr {
    animation: blinkMe 1s .3s linear;
}

@keyframes blinkMe {
    0% {
        opacity: 0;
    }

    2% {
        opacity: .5;
    }

    4% {
        opacity: 0;
    }

    6% {
        opacity: .25;
    }

    10% {
        opacity: 0;
    }

    12% {
        opacity: 1;
    }

    19% {
        opacity: .25;
    }

    27% {
        opacity: 1;
    }

    45% {
        opacity: 1;
    }

    47% {
        opacity: .25;
    }

    50% {
        opacity: 1;
    }
}

.handle {
    position: absolute;
    top: -20px;
    height: 20px;
    width: 100px;
    background-color: #000000b8;
    left: 0;
    z-index: 50;
}

/*
		.artPlate::before {
  content: "";
  position: absolute;
  right: -25px;
  top: calc(50% - 22px);
  width: 0px;
  height: 0px;
  border-top: 22px solid transparent;
  border-bottom: 22px solid transparent;
  border-left: 22px solid #6ed8e8;
  filter: blur(3px);
}
*/
.cont::before {
    content: "";
    position: absolute;
    background-image: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/PLBackground_space-lines.png");
    background-size: cover;
    mask: linear-gradient(#0000 0 0), linear-gradient(-65deg, #0000 30%, #000 50%, #0000 70%) content-box 140% 100% / 300% 200% no-repeat;
    mask-composite: add, add;
    mask-position-x: 0%, 140%;
    mask-position-y: 0%, 100%;
    mask-composite: exclude;
    transition: 8.5s ease-in-out;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.wire.cont::before {
    mask-position: 0% 0%;
}




.intro {
    align-items: center;
    background-color: #000000b8;
    padding: 4px 20px;
    clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 40px, 100% 100%, 40px 100%, 0 calc(100% - 40px));
    overflow: visible;
    border: solid 1px #6ed8e8;
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
    color: #fff;
    backdrop-filter: blur(10px);
    text-align: center;
    height: 25px;
    width: 0px;
    transition: width .5s .35s, height .5s, opacity .75s .6s;
    transform-origin: center;
    display: grid;
    grid-template-columns: auto auto auto auto;
    row-gap: 0;
    margin: auto;
}

.intro p {
    opacity: 0;
    transition: opacity .5s;
}

.introWrapper {
    position: absolute;
    align-items: center;
    /*  display: flex;*/
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    height: fit-content;
    width: fit-content;
    margin: auto;
    text-align: center;
    display: none;
    align-content: center;
}

.intro.go {
    height: 400px;
    width: 600px;
    transition: width .5s, height .5s .6s;
}

.intro.go p {
    opacity: 1;
    transition: opacity .75s .75s;
    grid-column: 1 / 1;
}

.introWrapper:before,
.bio::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0px 34px 31px 0px;
    border-color: transparent #6ed8e8 transparent transparent;
    position: absolute;
    right: 0;
    top: 0;
}

.introWrapper::after,
.bio::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 28px 0px 0px 28px;
    border-color: transparent transparent transparent #6ed8e8;
    position: absolute;
    left: 0;
    bottom: 0;
    top: auto;
}

.bio::after,
.bio::before {
    content: "";
    position: absolute;
    z-index: -2;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/*
.bio::after {
    border-width: 34px 0px 0px 34px;
}
*/

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) {
    .bio {
        clip-path: none;
    }

    .introWrapper:before,
    .bio:before {
        border-width: 0px 40px 40px 0px !important;
        top: -5px;
        right: 20px;
        z-index: 1;
    }

    .introWrapper:after,
    .bio:after {
        border-width: 40px 0 0px 40px !important
		;
        bottom: -5px;
        left: -5px;
    }
}

@media all and (min--moz-device-pixel-ratio:0) and (min-resolution: 3e1dpcm) {
    .bio {
        clip-path: polygon(65% -10%, 91% 0%, 110% 15%, 110% 110%, 56% 110%, 33% 110%, 10% 100%, -1% 92%, -10% -10%, 64% -10%);
    }
}

body::after {
    background: radial-gradient(#166871, #000);
    /* #167116 */
    box-shadow: inset 0 0 30rem #020202;
    position: fixed;
    inset: 0;
    content: "";
    display: block;
    z-index: 1;
    opacity: .5;
    mix-blend-mode: hue;
    pointer-events: none;
}

.start,
.close {
    display: block;
    padding: 2px 0px 0 0;
    margin: auto;
    background-color: transparent;
    /*! border: solid 2px #70e2ad; */
    color: #70e2ad;
    width: auto;
    /*! border-radius: 10px; */
    opacity: 0;
    border: none;
    position: relative;
    ;
}

.startBtn,
.closeInfo {
    grid-column: 1 / 1;
    align-self: flex-start;
}

.start:hover {
    /* 			background-color: #70e2ad;
			border: solid 2px #70e2ad;
			color: #000; */
    font-style: italic;
    cursor: pointer;
}

.start:hover .pliconStart {
    padding-right: 2px;
    animation: none;
}

.start:hover::before {
    animation: none;
    transform: translateX(25px);
    opacity: 0;
}

.start:hover::after {
    animation: none;
    transform: translateX(-25px) rotate(180deg);
    opacity: 0;
}

.intro.go .start {
    opacity: 1;
    transition: opacity .1s 1.4s;
    animation: blinkMe 1s 1.4s linear;
}

.pl-end {
    position: relative;
    width: 30px;
    height: 30px;
    aspect-ratio: 1/1;
    margin: 0 auto;
    padding-top: 12px;
    display: block;
    padding-bottom: 12vh;
}

body.ready .cont {
    filter: blur(0px);
}

body.ready::after {
    opacity: 0;
}

.pliconStart {
    width: 30px;
    height: 30px;
    position: relative;
    /*! left: 0; */
    filter: invert(1);
    display: inline-block;
    margin: auto auto 3px;
    vertical-align: middle;
    animation: blink-animation 2.5s .4s linear infinite;
    padding-right: 10px;
    transition: padding .5s;
}

.start:before {
    content: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/playlive-icon.svg");
    width: 24px;
    height: 24px;
    top: calc(50% - 12px);
    bottom: 0;
    left: -22px;
    display: block;
    z-index: 2;
    position: absolute;
    animation: blink-animation 2.5s linear infinite;
    filter: invert(1);
    transition: transform .75s, opacity .5s;
}

.start:after {
    content: url("/content/dam/en_US/alsac/media-publishing-assets/playlive/playlive-icon.svg");
    width: 24px;
    height: 24px;
    top: calc(50% - 12px);
    bottom: 0;
    right: -22px;
    display: block;
    z-index: 2;
    position: absolute;
    transform: rotate(180deg);
    animation: blink-animation 2.5s linear infinite;
    filter: invert(1);
    transition: transform .75s, opacity .5s;
    /*! opacity: 1; */
}

.pliconStart:last-of-type {
    transform: rotate(180deg);
}

@keyframes blink-animation {
    20% {
        opacity: 1;
    }

    50% {
        opacity: .15;
    }

    80% {
        opacity: 1;
    }
}


body.ready.infoView .introWrapper {
/*    display: block !important;*/
    z-index: 10;
}

body.ready.infoView .intro.go {
    width: 88%;
    height: 70vh;
    margin: auto;
    padding: 20px 16px;
    transition: width .5s, height .5s .6s;
    overflow: hidden;
    clip-path: none;
    max-width: 500px;
}

body.ready.infoView .intro.go p {
    height: initial;
}

body.ready.infoView .introWrapper::before,
body.ready.infoView .introWrapper::after {
    border-width: 34px 0px 0 34px;
}

body.ready.infoView::after {
    opacity: 1;
}

body.ready.infoView .cont {
    opacity: .25;
}

body.ready.infoView .close {
    opacity: 1;
}

.bio-cont {
    height: 50vh;
    overflow: scroll;
    mask-image: linear-gradient(to bottom, black 78%, transparent 90%);
}




.btn-icon.sound-toggle.spread-bar-sound {
    height: 32px;
    width: 32px;
    /* min-height: 40px; */
    /* min-width: 40px; */
    right: 0;
    /* position: absolute; */
}

.audio-bar-holder {
    width: 22px;
    margin: auto;
    height: 22px;
    display: flex;
	filter: saturate(0) brightness(.3);
	display: none;
}

.playing .audio-bar-holder {
    filter: saturate(1);
}

.sound-toggle-bar {
    display: block;
    float: left;
    width: 3px;
    height: 20px;
    margin-right: 1px;
    background: #fff;
    /* rgba(255, 255, 255, 0.6); */
    -webkit-transform: scale(1, 0.1);
    transform: scale(1, 0.1);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
}

.btn-icon {
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    min-height: 30px;
    min-width: 30px;
    padding: 9px;
    border: 0;
    background: none;
    font-size: 11px;
    font-style: italic;
    margin-left: 4px;
}

.playing .sound-toggle-bar {
    -webkit-animation: sound-toggle 2s infinite;
    animation: sound-toggle 2s infinite
}

.playing .sound-toggle-bar:nth-child(2) {
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s
}

.playing .sound-toggle-bar:nth-child(3) {
    -webkit-animation-delay: .3s;
    animation-delay: .3s
}

.playing .sound-toggle-bar:nth-child(4) {
    -webkit-animation-delay: 1.7s;
    animation-delay: 1.7s
}

.playing .sound-toggle-bar:nth-child(5) {
    -webkit-animation-delay: .4s;
    animation-delay: .4s
}

@-webkit-keyframes sound-toggle {
    0% {
        -webkit-transform: scale(1, 0.1);
        transform: scale(1, 0.1)
    }

    25% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    50% {
        -webkit-transform: scale(1, 0.3);
        transform: scale(1, 0.3)
    }

    75% {
        -webkit-transform: scale(1, 0.6);
        transform: scale(1, 0.6)
    }

    100% {
        -webkit-transform: scale(1, 0.1);
        transform: scale(1, 0.1)
    }
}

@keyframes sound-toggle {
    0% {
        -webkit-transform: scale(1, 0.1);
        transform: scale(1, 0.1)
    }

    25% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    50% {
        -webkit-transform: scale(1, 0.3);
        transform: scale(1, 0.3)
    }

    75% {
        -webkit-transform: scale(1, 0.6);
        transform: scale(1, 0.6)
    }

    100% {
        -webkit-transform: scale(1, 0.1);
        transform: scale(1, 0.1)
    }
}

.sound-toggle {
    /* position: absolute; */
    color: #fff;
    left: -25px;
    text-align: right;
    bottom: 4px;
    margin: 0;
    height: 30px;
    right: 0;
    width: 30px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' id='Strategic_Plan_B' viewBox='0 0 64 64'%3E%3Cdefs%3E%3Cstyle%3E.st0{fill:%23d11947}%3C/style%3E%3C/defs%3E%3Cpath d='M51.65 5.51c0-1.51-.6-2.39-1.11-2.86-.47-.44-1.3-.93-2.62-.82-.32.03-2.23.37-2.35.4L19.76 7.2c-.89.19-1.61.52-2.2 1-.73.6-1.2 1.48-1.36 2.53-.05.32-.07.67-.07 1.06v28.29c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V11.8c0-.3.02-.51.04-.6.07-.48.25-.62.31-.67.18-.15.46-.27.88-.37s25.8-4.97 25.8-4.97c.21-.04 1.84-.33 2.03-.35s.29.01.32.04c.04.04.14.22.14.64v33.32a9.4 9.4 0 0 0-6.46-2.57c-5.22 0-9.46 4.25-9.46 9.46s4.24 9.46 9.46 9.46 9.46-4.24 9.46-9.46c0-.28-.02-.55-.04-.83.03-.11.04-.22.04-.34zm-9.46 46.67c-3.56 0-6.46-2.9-6.46-6.46s2.9-6.46 6.46-6.46 6.46 2.9 6.46 6.46-2.9 6.46-6.46 6.46' class='st0'/%3E%3Cpath d='M44.44 18.57v15.81c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V18.65c0-1.12-.33-1.96-.98-2.5-1-.83-2.33-.58-2.78-.49-.96.19-19.78 4.15-20.62 4.33-1.91.46-2.72 1.52-2.72 3.55v21.27a9.4 9.4 0 0 0-6.46-2.57c-5.22 0-9.46 4.24-9.46 9.46s4.24 9.46 9.46 9.46 9.46-4.25 9.46-9.46V23.54c0-.28.02-.43.04-.52.06-.03.17-.06.34-.1.2-.04 19.6-4.13 20.53-4.31.07-.01.14-.02.19-.03ZM13.87 58.14c-3.56 0-6.46-2.9-6.46-6.46s2.9-6.46 6.46-6.46 6.46 2.9 6.46 6.46-2.9 6.46-6.46 6.46' class='st0'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    filter: brightness(5);
}

#play-button.mute,
#effects-button.mute {
    filter: saturate(0) brightness(1);
}

#effects-button {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' id='Strategic_Plan_B' viewBox='0 0 64 64'%3E%3Cdefs%3E%3Cstyle%3E.st0{fill:%23d11947}%3C/style%3E%3C/defs%3E%3Cpath d='M33.23 55.83c-.35 0-.7-.12-.98-.37L16.74 42.04H2.67c-.83 0-1.5-.67-1.5-1.5V23.06c0-.83.67-1.5 1.5-1.5h14.31L32.26 8.34c.44-.38 1.07-.47 1.61-.23.53.24.88.78.88 1.36v44.85c0 .59-.34 1.12-.88 1.36-.2.09-.41.14-.62.14ZM4.17 39.05h13.14c.36 0 .71.13.98.37l13.45 11.63V12.76L18.52 24.2c-.27.24-.62.37-.98.37H4.17zM53.57 56.02c-.33 0-.66-.11-.94-.33-.65-.52-.75-1.46-.23-2.11 9.92-12.35 9.92-30.27 0-42.62-.52-.65-.42-1.59.23-2.11s1.59-.42 2.11.23c10.79 13.44 10.79 32.94 0 46.37-.3.37-.73.56-1.17.56Zm-5.95-5.95a1.501 1.501 0 0 1-1.21-2.39c6.79-9.22 6.79-21.6 0-30.81a1.501 1.501 0 1 1 2.42-1.78c7.58 10.28 7.58 24.09 0 34.37-.29.4-.75.61-1.21.61m-6.5-6.5c-.28 0-.57-.08-.82-.25a1.5 1.5 0 0 1-.43-2.08c3.58-5.45 3.58-12.5 0-17.95-.46-.69-.26-1.62.43-2.08.69-.45 1.62-.26 2.08.43a19.32 19.32 0 0 1 0 21.24c-.29.44-.77.68-1.25.68Z' class='st0'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    /* position: absolute; */
    right: 80px;
    width: 30px;
    height: 30px;
    /* min-height: 30px; */
    /* min-width: 30px; */
    bottom: 5px;
    filter: brightness(5);
}


.hal {
    position: fixed;
    bottom: 7px;
    left: 0;
    z-index: 10;
    width: 50%;
    right: 0;
    /*! height: 100px; */
}

.hal span {
    display: block;
    color: aliceblue;
    position: relative;
    width: 0em;
    /*  max-height: 1em;*/
    font-size: .65rem;
    /*  font-family: monospace;*/
    overflow: hidden;
    white-space: nowrap;
    text-overflow: clip;
    margin: 0;
    padding: 0;
    line-height: .75rem;
    text-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
}

.hal.ld span {
    -webkit-animation: typecon 1s 5s;
    -webkit-animation-fill-mode: forwards;
}

.hal.ld span::after {
    content: '';
    position: absolute;
    right: 0px;
    bottom: 0px;
    height: .85rem;
    width: .85rem;
    background: aliceblue;
    /*  box-shadow: -1em 0px 30px 10px aliceblue;*/
    -webkit-animation: typeconCur 1s 5s;
    -webkit-animation-fill-mode: forwards;
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
}

@-webkit-keyframes typecon {
    from {
        width: 16px;
    }

    to {
        width: 100%;
    }
}

@-webkit-keyframes typeconCur {
    60% {
        opacity: 0.85;
    }

    100% {
        opacity: 0;
        /*		box-shadow:  -1em 0px 30px 0px red;*/
        box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 10px rgba(0, 207, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.3);
    }
}

.hal.ld span:nth-child(1),
.hal.ld span:nth-child(1):after {
    -webkit-animation-delay: 0s
}

.hal.ld span:nth-child(2),
.hal.ld span:nth-child(2):after {
    -webkit-animation-delay: 1s
}

.hal.ld span:nth-child(3),
.hal.ld span:nth-child(3):after {
    -webkit-animation-delay: 2s
}

.hal.ld span:nth-child(4),
.hal.ld span:nth-child(4):after {
    -webkit-animation-delay: 3s
}

.hal.ld span:nth-child(5),
.hal.ld span:nth-child(5):after {
    -webkit-animation-delay: 4s
}

.hal.ld span:nth-child(6),
.hal.ld span:nth-child(6):after {
    -webkit-animation-delay: 5s
}

.hal.ld span:nth-child(7),
.hal.ld span:nth-child(7):after {
    -webkit-animation-delay: 6s
}
/*

span.share-title-text {
    display: none;
}
.social-share li.title {
    display: none;
}
.social-share ul li {
    display: inline-block;
    height: 45px;
    width: 45px;
    margin: 0 10px;
    align-content: center;
    aspect-ratio: 1/1;
}
.sticky-bar .social-share ul {
    width: fit-content;
    background: transparent;
    opacity: 1;
    visibility: visible;
    display: inline-block;
    right: 160px;
    bottom: 12px;
	box-shadow: none;
}

.action {
    display: none;
}
*/

/*
span.share-title-text {
    display: none;
}
.social-share li.title {
    display: none;
}
.social-share ul li {
    display: inline-block;
    height: 45px;
    width: 45px;
    margin: 0 10px;
    align-content: center;
    aspect-ratio: 1/1;
}
.sticky-bar .social-share ul {
    width: fit-content;
    background: transparent;
    opacity: 1;
    visibility: visible;
    display: inline-block;
    right: 160px;
    bottom: 12px;
	box-shadow: none;
}

.action {
    display: none;
}

section.share.section {
    display: inline-block;
}

.social-share ul li .share-button.share-twitter:after {
    background-size: 90%;
}
.social-share ul li .share-button.share-facebook:after,
.social-share ul li .share-button.share-linkedin:after,
.social-share ul li .share-button.share-email:after {
    background-size: 160%;
}
.social-share ul li .share-button.share-linkedin:hover {
    background: #1b85bd;
    height: 45px;
    aspect-ratio: 1/1;
    border-radius: 6px;
}

.social-share ul li .share-button.share-twitter:hover {
    background: #000;
    height: 45px;
    aspect-ratio: 1/1;
    border-radius: 6px;
}

.social-share ul li .share-button.share-facebook:hover {
    background: #324d8f;
    height: 45px;
    aspect-ratio: 1/1;
    border-radius: 6px;
}

.social-share ul li .share-button.share-facebook:after {
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22750%22%20height%3D%22750%22%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%22%20stroke-width%3D%22%22%20d%3D%22M434.72%20375.1h-38.77v138.22h-57.46V375.1h-27.31v-48.84h27.31v-31.6c0-22.63%2010.75-58%2058-58l42.56.16v47.41h-30.9c-5%200-12.17%202.52-12.17%2013.31v28.7h43.78l-5.04%2048.86z%22%2F%3E%3C%2Fsvg%3E);
}

.social-share ul li .share-button.share-twitter:after {
    background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22750%22%20height%3D%22750%22%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%22%20stroke-width%3D%22%22%20transform%3D%22translate(-415.39%20-275)%22%20d%3D%22m485.39%20356.79%20230.07%20307.62-231.52%20250.11h52.11l202.7-218.98%20163.77%20218.98h177.32L836.82%20589.6l215.5-232.81h-52.11L813.54%20558.46%20662.71%20356.79H485.39zm76.63%2038.38h81.46l359.72%20480.97h-81.46L562.02%20395.17z%22%2F%3E%3C%2Fsvg%3E')
}

.social-share ul li .share-button.share-linkedin:after {
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22750%22%20height%3D%22750%22%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%22%20stroke-width%3D%22%22%20d%3D%22M385.32%20361.53v-.42a4.94%204.94%200%200%201-.27.42h.27z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%22%20stroke-width%3D%22%22%20d%3D%22M491.51%20237.41h-233c-11.011-.111-20.04%208.7-20.2%2019.71v235.76c.16%2011.01%209.189%2019.821%2020.2%2019.71h233c11.019.122%2020.06-8.691%2020.22-19.71V257.12c-.16-11.019-9.201-19.832-20.22-19.71zM321.15%20467.78h-41.3V343.51h41.3v124.27zM300.5%20326.53h-.27c-13.85%200-22.82-9.55-22.82-21.47%200-12.2%209.25-21.47%2023.37-21.47%2014.12%200%2022.82%209.28%2023.1%2021.47%200%2011.94-8.97%2021.47-23.38%2021.47zm169.61%20141.24H428.8v-66.5c0-16.7-6-28.1-20.92-28.1-11.41%200-18.21%207.69-21.2%2015.12-1.09%202.64-1.35%206.36-1.35%2010.07v69.42H344s.54-112.63%200-124.27h41.3v17.59c5.48-8.46%2015.3-20.52%2037.22-20.52%2027.18%200%2047.57%2017.76%2047.57%2055.92l.02%2071.27z%22%2F%3E%3C%2Fsvg%3E)
}

.social-share ul li:nth-of-type(4) {
    margin-right: 0;
}
*/

.gap-4 div {
    width: 30px;
    height: 30px;
    display: inline-block;
    background-color: #fff;
    aspect-ratio: 1/1;
    margin: auto 12px;
}

.gap-4 {
    width: 60%;
    display: inline-block;
    border-right: solid 1px #fff;
}

.gap-4 a img {
    width: 33px;
    height: 33px;
    margin: auto 12px;
}
.dis {
	mask: url('https://playlive.experience.stjude.org/assets/discord-icon-CXYDm9nu.png') center center / contain no-repeat;
}
.insta {
	mask: url('https://playlive.experience.stjude.org/assets/instagram-icon-social-CkUSNviN.png') center center / contain no-repeat;
}
.twit {
	mask: url('https://playlive.experience.stjude.org/assets/twitter-icon-MOrcnmVJ.png') center center / contain no-repeat;
}
.controls {
    position: fixed;
	width: 30%;
	  max-width: 400px;
	  left: auto;
    right: 0;
    bottom: 18px;
    z-index: 10;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}

/********** RES *********/

@media screen and (max-width: 768px) {

    body.ready .cont {
        filter: none;
        height: 100vh;
        overflow: hidden;
    }

    .intro.go {
        width: 88%;
        height: 70vh;
        margin: auto;
        padding: 0px 14px;
        transition: width .5s .5s, height .5s;
        overflow: hidden;
    }

    body.ready .intro.go {
        width: 0%;
        height: 0;
    }

    body.ready .intro.go p {
        height: 0;
    }

    .bio {
        transition: transform 1s, filter 1s, box-shadow .65s 1s, opacity .0s;
    }

    .introWrapper::before {
        border-width: 0px 34px 34px 0px;
    }
	.bio::before {
		display: none;
	}

    .introWrapper::after {
        border-width: 34px 0px 0 34px;
    }

    .cont {
        padding-bottom: 160px;
        height: 100vh;
        ;
    }

    .cont,
    .cont::before {
        background-attachment: fixed;
        background-position: 75% 0px;
    }

    .profHdr {
        position: relative;
        top: initial;
        margin: auto;
        font-size: 1.5rem;
        left: 0;
        right: 0;
        transform-origin: center;
        transition: opacity .1s, height .2s;
        overflow: hidden;
        display: none;
    }

    .bio h3 span::before {
        right: 0;
        margin: auto;
    }

    .bio h3 span {
        padding-top: 6px;
    }


    .stats {
		display: block;
        width: 50px;
        top: 84px;
        right: 14px;
    }

    .box {
        display: block;
        aspect-ratio: 1/1;
        border-radius: 50%;
        background-position: center !important;
        height: 48px;
        border: none;
        background-size: 60% !important;
    }

    .box p {
        display: none;
        ;
    }

    .foreground {
        display: none;
    }

    .hero {
        height: 0;
        top: 0;
    }

    body.rawry .hero.maelin,
    body.taffi .hero.luna,
    body.alien .hero.ty-alien,
    body.monster .hero.ty-monster,
    body.fvrfghtr .hero.ethan {
        height: 68%;
        align-content: end;
        align-items: end;
        display: flex;
        justify-content: center;
    }

    body.rawry .bio.maelinBio,
    body.taffi .bio.lunaBio,
    body.alien .bio.tyBio,
    body.monster .bio.tyBio,
    body.fvrfghtr .bio.ethanBio {
        top: auto;
        display: block;
        clip-path: none;
        bottom: 0;
        position: absolute;
        height: fit-content;
        right: 0;
        left: 0;
        background-color: #081332;
        color: #f5f5f5;
        pointer-events: all;
        transition: transform 1s, filter 1s, opacity .8s, box-shadow .65s 1s;
        border-radius: 8px;
    }

    .char {
        width: 80%;
        height: 60vh;
        background-position: -55px 0;
        background-size: 80%;
        position: absolute;
    }

    .one {
        margin-left: 0;
    }

    .hal {
        display: none;
    }

    .hdr {
        padding: 0;
        transform-origin: center;
        font-size: 1.25rem;
        margin-bottom: 6px;
        bottom: 28px;
        position: absolute;
    }

    .heroAssets {
        bottom: 43vh;
        right: auto;
        left: 10vw;
        width: 30vw;
    }

    .sitem.rawry::before {
        display: none;
        transform: rotate(270deg);
        height: 32px;
        width: 32px;
        left: calc(50% - 15px);
        right: 0;
        top: calc(100% - 15px);
    }

    .select .sitem p {
        font-size: 1rem;
        line-height: initial
    }

    .sitem {
        text-align: center;
        padding: 0;
        background-position: center !important;
        background-size: 80%;
        aspect-ratio: 1/1;
        height: auto;
    }

    .item.aaa,
    .item {
        width: 100%;
        margin: 0 auto;
        text-align: center;
        height: 100vh;
        transform-style: flat;
        display: block;
        align-content: flex-start;
        transform: none !important;
        position: absolute;
        inset: 0;
    }

    .item.aaa {
        background: linear-gradient(to bottom, #0000, #000 30%);
        position: fixed !important;
        height: 175px;
        bottom: 0;
        right: 0;
        left: 0;
        z-index: 10;
        top: auto;
        opacity: 0;
    }

    .triple {
        perspective: none;
        display: block;
        position: fixed;
        inset: 0;
        margin-top: 75px;
    }

    .hero::before {
        display: none;
    }

    img.one {
        position: relative;
        width: 92%;
        height: auto;
        margin: 0 8vw 0 0;
        transition: width .8s, margin .75s, filter .75s;
        transform-origin: bottom;
    }

    .bio {
        position: relative;
        transform: none !important;
        height: auto;
        width: 86%;
        box-shadow: 0px 6px 0 #fd6eb2bf;
        margin: auto;
        clip-path: none;
        border-r: 8px;
        ;
        opacity: 0;
        pointer-events: none;
    }

    .sitem {
        width: 50px;
        display: inline-block;
        padding: 0;
        margin: 0;
        border-radius: 50%;
        border: solid 1px #f5f5f5;
        position: absolute;
        transform: scale(1);
        right: auto;
        left: auto;
        box-shadow: 0 0 10px rgba(0, 255, 255, 0), 0 0 10px rgba(0, 207, 255, 0), 0 0 20px rgba(0, 255, 255, 0);
        transition: transform .6s ease-in, bottom .6s ease-in, right .6s ease-in, left .6s ease-in, box-shadow .5s 4s;
        transition: all .5s;
    }

    .select {
        height: fit-content;
        padding: 0;
    }

    .cont::after {
        display: none;
    }

    .introWrapper {
        height: fit-content;
            width: 90%;
    }

    .introWrapper::after {
        bottom: -4px;
        left: 20px;
    }

    .mobileHide {
        display: none;

    }

    .pl-end {
        padding-bottom: 0;
    }

    .grow {
        transform: scale(2.5);
        bottom: 112px !important;
        z-index: 10 !important;
        left: calc(50% - 22px);
        border: solid 1px #6ed8e8;
        box-shadow: 0 0 2px rgba(0, 255, 255, 0.9), 0 0 4px rgba(0, 207, 255, 0.7), 0 0 10px rgba(0, 255, 255, 0.3) !important;
    }

    body.rawry .sitem.rawry:before,
    body.taffi .sitem.taffi:before,
    body.monster .sitem.monster:before,
    body.alien .sitem.alien:before,
    body.fvrfghtr .sitem.fvrfghtr:before,
    body.rawry .sitem.rawry:after,
    body.taffi .sitem.taffi:after,
    body.monster .sitem.monster:after,
    body.alien .sitem.alien:after,
    body.fvrfghtr .sitem.fvrfghtr:after {
        display: none;
    }

    .sitem p {
        display: none;
    }

    .pos-endR {
        bottom: 76px;
        left: calc(90% - 25px);
    }

    .pos-endL {
        left: 20px;
        bottom: 76px;
    }

    .pos-midR {
        left: calc(26vw - 25px);
        bottom: 93px;
    }

    .pos-midL {
        bottom: 93px;
        left: calc(76% - 25px);
    }

    .mid {
        left: calc(50% - 22px);
        bottom: 100px;
    }

    .sss.bio .profHdr {
        animation: none;
        opacity: 0;
        height: 0;
        transition: opacity .3s .5s, height .2s;
        display: block;
    }

    .bio-cont {
        opacity: 0;
        transform: scaleY(0);
        height: 300px;
        transition: height .75s, transform .75s, padding-bottom .75s;
    }

    body.ready .stats.moveit {
        transform: translateX(75px);
        opacity: 0;
    }

    body.ready .item.aaa {
        opacity: 1;
        transition: transform 1s .7s, filter 1s, opacity .8s 1.2s;
    }


    .triple.gooby .char {
        opacity: 0;
    }

    .triple.gooby .bio-cont {
        opacity: 1;
        transform: scaleY(1);
        height: calc(55vh - 0px);
        overflow: scroll;
        padding-bottom: 290px;
        transform-origin: bottom;
    }

    .triple.gooby .bio-cont.view {
        transition: transform .5s ease-in-out, height .5s ease-in-out, opacity .7s;
        transform: scaleY(1);
        transform-origin: top;
        opacity: 1;
        height: 70vh;
    }

    .triple .item.peeps::before {
        content: "";
        position: absolute;
        background-color: #f0f8ffe3;
        inset: 0;
        width: 250px;
        height: 250px;
        border-radius: 50%;
        left: calc(50% - 125px);
        z-index: 0;
        transform: scale(0);
        transform-origin: center;
        transition: transform .6s, opacity .25s;
        border: solid 1px #081c42;
        opacity: 0;
        top: 60px;
    }

    .triple.gooby .item.peeps::before {
        content: "";
        transform: scale(1);
        transition: transform .7s .8s;
        opacity: 1;
        box-shadow: 0 0 10px rgba(0, 255, 255, 0.9), 0 0 24px rgba(0, 207, 255, 0.7), 0 0 45px rgba(0, 255, 255, 0.3);
    }

    .one {
        -webkit-mask-image: linear-gradient(to bottom, black 78%, transparent 90%);
        mask-image: linear-gradient(to bottom, black 78%, transparent 90%);
    }

    .triple.gooby img.one {
        width: 50%;
        margin: 0 0% 32vh 0%;
    }

    .triple.gooby .sss.bio .profHdr {
        animation: blinkMe 1s .75s linear;
        opacity: 1;
        height: 28px;
        transition: opacity .3s .75s, height .75s;
    }

    .triple.gooby .pos-midR,
    .triple.gooby .pos-midL,
    .triple.gooby .pos-endL,
    .triple.gooby .pos-endR {
        filter: grayscale(1);
        opacity: 0.2;
        pointer-events: none;
    }

    .mobProfile {
        content: "";
        border-radius: 50%;
        top: -16px;
        right: 10px;
        background: linear-gradient(75deg, rgb(27, 125, 33) 10%, rgb(24, 202, 102) 60%, rgb(69, 252, 158) 100%);
        background-color: #6ed8e8;
        width: 36px;
        height: 36px;
        background-size: 150%;
        transform: rotate(-90deg);
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        border: solid 2px #fff;
        z-index: 10;
    }

    .mobProfile.upsies {
        transform: rotate(90deg);
        background: linear-gradient(-75deg, rgb(125, 27, 27) 10%, rgb(253, 29, 29) 60%, rgb(252, 176, 69) 100%);
    }

    .mobProfile::after {
        content: "";
        background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22750%22%20height%3D%22750%22%3E%3Cpath%20fill%3D%22white%22%20stroke%3D%22%22%20stroke-width%3D%22%22%20d%3D%22M319.562%20511.77a24.57%2024.57%200%200%201-18.17-41.1l86.71-95.39-86.73-95.89c-8.498-10.117-7.478-25.142%202.31-34.018%209.787-8.876%2024.84-8.426%2034.08%201.018l116.99%20128.65-117%20128.69a24.52%2024.52%200%200%201-18.19%208.04z%22%2F%3E%3C%2Fsvg%3E);
        position: absolute;
        height: 36px;
        width: 36px;
        top: 0;
        z-index: 100;
        left: 0;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 160%;

    }

    .triple.gooby .hdr {
        opacity: 0;
    }
	
	#global-footer {
		position: relative;
		display: none;
	}
	
	.controls {
		width: 100%;
		left: 0;
	}

}