:root {
    --kickstarter-color: rgb(0, 206, 120, 1);
    --kickstarter-color-translucent: rgb(0, 206, 120, 0.3);
    --kickstarter-color-translucent-light: rgb(0, 206, 120, 0.175);
}

.content {
    filter: none;
    background: none;
    box-shadow: none;
}

.title {
    background: none;
    box-shadow: none;
    position: relative;
    left: unset;
    top: unset;
    transform: none;
    width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    white-space: nowrap;

    color: white;
    text-shadow: 0 0.075em 0 rgba(0, 0, 0, 0.3);

    margin-bottom: 1.5em;
}

.may-break::before {
    content: " ";
}

.fancy-corner {
    display: none;
}

.campaign:has(.logo) .content::before,
.title::before,
#play-video::before {
    content: "";
    background: var(--kickstarter-color);
    mask-repeat: no-repeat;
    mask-position: center center;
    mask-size: contain;
    position: absolute;
    z-index: -1;
    width: var(--size);
    height: var(--size);
}

.campaign:has(.content-header) {
    padding-top: 28em;
    padding-bottom: 0;
}
.campaign:has(.logo) .content::before {
    mask-image: url("../../../res/images/splash9.svg");
    --size: 93%;
    margin-top: -32em;
    margin-left: 1em;
}

.campaign:has(.content-thegame) {
    padding-top: 7em;
}
.campaign:has(.content-thegame) .title::before {
    mask-image: url("../../../res/images/splash0.svg");
    --size: 700%;
    margin-top: -1.1em;
}

.campaign:has(.content-box) {
    padding-top: 5em;
}
.campaign:has(.content-box) .title::before {
    mask-image: url("../../../res/images/splash1.svg");
    --size: 700%;
    margin-top: -1.1em;
}

.campaign:has(.content-rules) {
    padding-top: 7em;
}
.campaign:has(.content-rules) .title::before {
    mask-image: url("../../../res/images/splash2.svg");
    --size: 700%;
    margin-top: -0.9em;
}

.campaign:has(.content-earlybirds) {
    padding-top: 6.5em;
}
.campaign:has(.content-earlybirds) .title::before {
    mask-image: url("../../../res/images/splash3.svg");
    --size: 700%;
    margin-top: -0.7em;
    margin-left: -0.3em;
}

.campaign:has(.content-timeline) {
    padding-top: 15em;
}
.campaign:has(.content-timeline) .title::before {
    mask-image: url("../../../res/images/splash4.svg");
    --size: 1100%;
    margin-top: -0.9em;
    margin-left: 0.7em;
}

.campaign:has(.content-inspirations) {
    padding-top: 11em;
}
.campaign:has(.content-inspirations) .title::before {
    mask-image: url("../../../res/images/splash8.svg");
    --size: 1100%;
    margin-top: 1.4em;
    margin-left: 1.2em;
}

.campaign:has(.content-box) > .title {
    bottom: 14em;
    transform: none;
    color: black;
    text-shadow: none;
    align-items: flex-start;
    line-height: 1.1em;
    font-size: 2.2em;
}

.campaign:has(.content-box) > .title {
    font-family: "Main";
}
.campaign:has(.content-box) > .title::before {
    mask-image: url("../../../res/images/splash6.svg");
    --size: 235%;
    margin-top: -4em;
    margin-left: -3em;
}

.subscribe input {
    box-shadow: none;
    background: white;
    outline: solid 0.15em var(--kickstarter-color);
    padding: 0.25em 0.8em 0;
    font-family: "Title";
}
.subscribe input::placeholder {
    font-family: "Main";
}
.subscribe input.warning {
    outline: solid 0.3em var(--kickstarter-color-translucent);
    background: var(--kickstarter-color);
    box-shadow: none;
}
.subscribe input.warning::placeholder {
    color: white;
    font-family: "Title";
}

.subscribe button {
    box-shadow: none;
    margin-top: -0.1em;
    background: var(--kickstarter-color);
    box-shadow: 0.3em 0.3em 0 var(--kickstarter-color-translucent);
    color: white;
    text-shadow: 0 0.075em 0 rgba(0, 0, 0, 0.3);
}
.subscribe button:hover {
    background: var(--kickstarter-color);
    transform: translate(-0.2em, -0.2em);
    box-shadow: 0.7em 0.7em 0 var(--kickstarter-color-translucent);
}

#play-video {
    box-shadow: none;
    position: relative;
    margin: 0em auto 4em;
}
#play-video:hover {
    background: none;
    outline: solid 0.4em white;
}
#play-video:hover::after {
    background: white;
    transform: scale(1.25);
}
#play-video::before {
    mask-image: url("../../../res/images/splash5.svg");
    --size: 372%;
    margin-top: -8.9em;
    margin-left: -8em;

    /* mask-image: url("../../../res/images/splash7.svg");
    --size: 313%;
    margin-top: -6.9em;
    margin-left: -6.7em; */
}


.turn-action, .content-box .block-sub {
    background: none;
    box-shadow: none;
    border: dotted 0.28em var(--kickstarter-color);
}
.turn-action {
    margin-left: -1em;
    margin-right: 0.2em;
}

.content-box .topsecret {
    background: white;
    box-shadow: none;
    border: none;
    border-radius: 0;
    border-left: solid 0.31em var(--kickstarter-color);
    border-right: solid 0.31em var(--kickstarter-color);
    box-shadow: 0 0 0.75em rgba(0, 0, 0, 0.4);
}
.content-box .topsecret::before {
    color: var(--kickstarter-color);
    font-family: "Title";
    font-size: 2em;
}

.logo-description {
    font-family: "Title";
}
.logo-description .strike {
    color: var(--kickstarter-color);
}
.logo-description .strike::after {
    border-bottom-color: black;
}
.logo-description .level .black {
    background: var(--kickstarter-color);
    border: solid 0.18em var(--kickstarter-color);
    border-radius: 0.2em;
}
.logo-description .level .white {
    border: solid 0.2em var(--kickstarter-color);
    border-radius: 0.2em;
}

body {
    --light-border-line-color: black;
    --light-border-line: solid 0.18em var(--light-border-line-color);
}
.circle {
    border: solid 0.5em var(--kickstarter-color);
    filter: drop-shadow(0 1em 0.5em rgba(0, 0, 0, 0.5));
}

.timeline-end {
    background: transparent;
    box-shadow: none;
}
.timeline-end-icon {
    filter: drop-shadow(0 0.15em 0em rgba(0, 0, 0, 0.85));
}


.card {
    box-shadow: 0 0 3em var(--kickstarter-color-translucent-light), -0.1em -0.1em 2em var(--kickstarter-color-translucent-light);
}

.content-thegame .card.card-achievement {
    box-shadow: 0 0 3em var(--kickstarter-color-translucent-light), -0.1em -0.1em 2em var(--kickstarter-color-translucent-light);
}

.city-wrap .city > div:nth-child(5) {
    box-shadow: 10em 10em 1em var(--kickstarter-color-translucent-light);
}

.ceramic::before {
    background: linear-gradient(to left, var(--kickstarter-color), var(--kickstarter-color-translucent));
}