.banner {
    position: relative;
    width: 100%;
    height: 100vh;
    background: url("../img/seasons/bg2.png");
    background-size: cover;
    background-position: bottom;
    display: flex;
    justify-content: center;
    align-items: center;
}

.banner-s2 {
    position: relative;
    width: 100%;
    height: 95vh;
    background: url('../img/seasons/s5/bg7.jpg');
    background-size: cover;
    background-position: bottom;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow:hidden;
}

.banner-s2 video {
    width: 100%;
    height: 100%;
    position: absolute;
    object-fit: cover;
    z-index: 0;
}

.banner-gradient {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 150px;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0); /* IE6-9 */
    z-index: 1;
}

.banner-s2 #text {
    position: absolute;
    color: #fff;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.seasons-header {
    font-size: 8em;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
    color: #fff;
}

@media screen and (max-width: 600px) {
    .seasons-header {
        font-size: 65px;
    }
}

@media screen and (max-width: 1100px) {
    .crystals {
        display: none;
    }
}


.banner .clouds {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
}

.banner .clouds img {
    position: absolute;
    bottom: -50px;
    max-width: 100%;
    animation: animate calc(4s * var(--i)) ease-in infinite;
}

@keyframes animate {
    0% {
        opacity: 0;
        transform: scale(1);
    }
    25%, 75% {
        opacity: 1;
    }
    100% {
        transform: scale(3);
    }
}

.bounce-in-fwd {
    -webkit-animation: bounce-in-fwd 1.1s both;
    animation: bounce-in-fwd 1.1s both
}

@-webkit-keyframes bounce-in-fwd {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    38% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1
    }
    55% {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    72% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    81% {
        -webkit-transform: scale(.84);
        transform: scale(.84);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    89% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    95% {
        -webkit-transform: scale(.95);
        transform: scale(.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

@keyframes bounce-in-fwd {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    38% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1
    }
    55% {
        -webkit-transform: scale(.7);
        transform: scale(.7);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    72% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    81% {
        -webkit-transform: scale(.84);
        transform: scale(.84);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    89% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    95% {
        -webkit-transform: scale(.95);
        transform: scale(.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

.first-section {
    position: relative;
    background: url("../img/seasons/texture.jpg");
    text-align: center;
    color: #222;
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 200px;
    margin-top: -10px;
}

.first-section-s2 {
    position: relative;
    background: url("../img/seasons/texture2.jpg");
    text-align: center;
    color: #222;
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 200px;
    margin-top: -100px;
}

.aos {
    width: 100%;
    height: 100%;
    position: absolute;
}

.crystals img {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -800px;
    width: 1650px;
    height: 100%;
    object-fit: cover;
    filter: drop-shadow(0 0 0.75rem rgba(0, 0, 0, 0.62));
    pointer-events: none;
}

.video-container {
    width: 200px;
    height: 130px;
    background: rgba(10, 0, 0, 0.61);
    margin: 20px;
    border: 2px solid transparent;
    border-image: url(../img/user/login_border.png) 30 stretch;
    filter: drop-shadow(0 0 0.75rem black);
}

.coming {
    color: #b18276;
    font-size: 20px;
    margin-bottom: 8px;
}

.subtitle {
    color: #ffa216;
    font-size: 20px;
    margin-bottom: 8px;
    text-align: center;
}

.layer {
    width: 1920px;
}

.seasons-intro-text {
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.season-2-intro-text {
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.seasons-intro-text h2 {
    position: relative;
    font-size: 50px;
    margin-bottom: 15px;
    color: #000;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
}

.season-2-intro-text h2 {
    position: relative;
    font-size: 50px;
    margin-bottom: 15px;
    color: #fff;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
}

.seasons-intro-text p {
    margin-left: auto;
    margin-right: auto;
    color: #222;
    font-size: 1.1em;
    width: 700px;
    max-width: 95%;
}

.season-2-intro-text p {
    margin-left: auto;
    margin-right: auto;
    color: #b5b4b4;
    font-size: 1.1em;
    width: 700px;
    max-width: 95%;
}

.first-section .gradient-white {
    position: absolute;
    top: 0;
    width: 100%;
    height: 150px;
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=0); /* IE6-9 */

}

.fade-in-bottom {
    -webkit-animation: fade-in-bottom .6s cubic-bezier(.39, .575, .565, 1.000) .5s both;
    animation: fade-in-bottom .6s cubic-bezier(.39, .575, .565, 1.000) .5s both
}

@-webkit-keyframes fade-in-bottom {
    0% {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes fade-in-bottom {
    0% {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}


.link-video-wrapper {
    position: absolute;
    width: 100%;
    top: -245px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}


.link-video {
    position: relative;
    width: 330px;
    height: 190px;
    margin: 10px;
    padding: 5px;
    cursor: pointer;
    filter: brightness(90%);
    transition: 0.2s;
}

.link-video-border {
    position: absolute;
    width: 330px;
    height: 190px;
    left: 0px;
    top: 0px;
}

.link-video-play {
    height: 100px;
    width: 100px;
    position: absolute;
    left: 50%;
    margin-left: -50px;
    top: 50%;
    margin-top: -50px;
    opacity: 0.6;
    transition: 0.2s;
}

.link-video:hover {
    filter: brightness(100%);
}

.link-video:hover .link-video-play {
    opacity: 1;
}

.link-video-element {
    height: 180px;
    width: 320px;
}


.Modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9000;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.85);
    cursor: pointer;
}

.Modal-box {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
}

.Modal-box > .video-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 75vw;
    max-width: 164.78vh;
    height: 37.25vw;
    max-height: 100vh;
    margin: auto;
    overflow: hidden;
}

.Modal-box > .video-container > iframe,
.Modal-box > .video-container > object,
.Modal-box > .video-container > embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.Modal-close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 9001;
    padding: 5px 10px;
    color: #fff;
    font-size: 16px;
    line-height: 1;
    background-color: rgba(0, 0, 0, 0.85);
}

.Modal-cancel-overflow {
    overflow: hidden;
}

.second-section {
    position: relative;
    width: 100%;
    background: url(../img/seasons/dark_section.jpg);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: -10px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 100px;
}

.boat-section {
    position: relative;
    width: 100%;
    background: url(../img/seasons/s5/map-bg.png);
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: -10px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 100px;
}

.s3-second-section {
    position: relative;
    width: 100%;
    background: url(../img/seasons/s3_scroll_section.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: -10px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 100px;
}

.s3-second-section h2 {
    position: relative;
    font-size: 50px;
    margin-bottom: 15px;
    color: #fff;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
    text-align: center;
}

.s3-second-section p {
    margin-left: auto;
    margin-right: auto;
    color: #b5b4b4;
    font-size: 1.1em;
    width: 700px;
    max-width: 95%;
    text-align: center;
}

.perks-text-container {
    max-width: 95%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.perks-text-container h2 {
    position: relative;
    font-size: 50px;
    margin-bottom: 15px;
    color: #fff;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
    text-align: center;
}

.perks-text-container p {
    margin-left: auto;
    margin-right: auto;
    color: #b5b4b4;
    font-size: 1.1em;
    width: 700px;
    max-width: 95%;
    text-align: center;
}


.morions-image {
    max-height: 370px;
    max-width: 95%;
    position: relative;
    filter: drop-shadow(0 0 0.75rem black);
}

.astral-boat-map {
    max-width: 95%;
    position: relative;
}
.astral-boat-map-image {
    max-width: 95%;
    position: relative;
}

.compass {
    position: absolute;
    bottom: -75px;
    left: -135px;
    height: 200px;
    animation: spin 10s linear infinite;
}

@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}

.rewards-section {
    margin-top: -10px;
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 100px;
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(238, 238, 238, 1) 35%, rgba(218, 218, 218, 1) 100%);
    text-align: center;
    color: #222;
    overflow: hidden;
}

.skills-section {
    margin-top: -10px;
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 100px;
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(238, 238, 238, 1) 35%, rgba(218, 218, 218, 1) 100%);
    text-align: center;
    color: #222;
    overflow: hidden;
}

.skills-section h2 {
    position: relative;
    font-size: 50px;
    margin-bottom: 15px;
    color: #000;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
    text-align: center;
}

.skills-section p {
    margin-left: auto;
    margin-right: auto;
    color: #222;
    font-size: 1.1em;
    width: 700px;
    max-width: 95%;
    text-align: center;
}

.skills-background-image {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    background: url("../img/seasons/s5/morions-pets.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    pointer-events: none;
    z-index: 0;
}

.rewards-text-container {
    max-width: 95%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.rewards-text-container h2 {
    position: relative;
    font-size: 50px;
    margin-bottom: 15px;
    color: #000;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
    text-align: center;
}

.rewards-text-container p {
    margin-left: auto;
    margin-right: auto;
    color: #222;
    font-size: 1.1em;
    width: 700px;
    max-width: 95%;
    text-align: center;
}

.prs-image {
    position: absolute;
    width: 1600px;
    left: 50%;
    margin-left: -800px;
    height: 100%;
    top: 0;
    background: url("../img/seasons/prs.png");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    pointer-events: none;
    z-index: 0;
}

.golem-image {
    position: absolute;
    width: 1600px;
    left: 50%;
    margin-left: -800px;
    height: 100%;
    top: 0;
    background: url("../img/seasons/s3_rewards.png");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    pointer-events: none;
    z-index: 0;
}

.reward-table-wrapper {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    z-index: 2;
    margin-bottom: 50px;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

th, td {
    padding: 16px;
    color: black;
}

tr:nth-child(even) {
    background-image: linear-gradient(to right, rgba(38, 5, 5, 0) 20px, rgba(60, 5, 5, 0.71) 30px, rgba(0, 0, 0, 0));
}

tr:nth-child(odd) {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 20px, rgba(0, 0, 0, 0.21) 30px, rgba(0, 0, 0, 0));
}

.table-header {
    color: black;
}

.reward-img-bottom {
    z-index: 2;
    width: 95%;
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
    border: 3px solid transparent;
    border-image: url(../img/user/login_border.png) 15 stretch;
    filter: drop-shadow(0 0 0.4rem rgba(0, 0, 0, 0.76));
}

.reward-img-wrapper {
    position: relative;
    z-index: 2;
}

.changes-section {
    margin-top: -10px;
    position: relative;
    width: 100%;
    min-height: 1111px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 150px;
    padding-bottom: 100px;
    text-align: center;
    color: #222;
    overflow: hidden;
 }

.changes-text-container {
    max-width: 95%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.changes-text-container h2 {
    position: relative;
    font-size: 50px;
    margin-bottom: 15px;
    color: #fff;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
    text-align: center;
}

.changes-text-container p {
    margin-left: auto;
    margin-right: auto;
    color: #b5b4b4;
    font-size: 1.1em;
    width: 700px;
    max-width: 95%;
    text-align: center;
}

.group-image {
    position: absolute;
    width: 1600px;
    left: 50%;
    margin-left: -800px;
    height: 100%;
    max-height: 1111px;
    top: 0;
    background: url("../img/seasons/group.png");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    pointer-events: none;
    z-index: 0;
}

.changes-list {
    width: 700px;
    max-width: 100%;
    text-align: left;
    color: #b5b4b4;
}

.action-button {
    margin-top: 80px;
    text-align: center;
    font-size: 20px;
    width: 200px;
    padding: 15px 0;
    position: relative;
    background: rgba(0, 0, 0, 0.61);
    border: 2px solid transparent;
    border-image: url(../img/user/login_border.png) 30 stretch;
    cursor: pointer;
    transition: 0.5s;
    filter: drop-shadow(0 0 0.75rem black);
    overflow: hidden;
}

.action-button:after {
    background: #fff;
    content: "";
    height: 155px;
    left: -75px;
    opacity: .1;
    position: absolute;
    top: -50px;
    transform: rotate(35deg);
    transition: all 750ms cubic-bezier(0.19, 1, 0.22, 1);
    width: 40px;
}

.action-button:hover:after {
    left: 108%;
}

.action-button:hover {
    background: rgb(184, 117, 25);
    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

.play-now-link:hover {
    text-decoration: none;
}

.countdown-container {
    position: absolute;
    bottom: 30px;
    width: 100%;
}

.countdown-container ul {
    margin: 0;
    padding: 0;
}

.countdown-component {
    display: inline-block;
    font-size: 1.1em;
    list-style-type: none;
    padding: 1em;
    text-transform: uppercase;
    color: #000;
}

.countdown-component span {
    display: block;
    font-size: 4.5rem;
}


.character-changes-header {
    margin-top: 20px;
    user-select: none;
}

/*.character-changes-header:hover {*/
    /*color: #ffa216;*/
/*}*/

.show-hide-toggle:hover {
    color: #ffa216;
    cursor: pointer;
}


@media screen and (max-width: 600px) {
    .countdown-component {
        font-size: 12px;
        padding: 12px;
    }
    .countdown-component span {
        display: block;
        font-size: 22px;
        padding: 12px;
    }
}

.ends-in-title {
    color: #000;
    font-size: 40px;
}


.text-animation-s2 {
    color:#fff;
    opacity:0;
    filter:drop-shadow(8px 8px 10px #160000);
}

.text-animation-s2 span {
    position:relative;
    top:10px;
    left:10px;
    font-size: 8em;
    font-family: 'MedievalSharp', cursive;
    font-weight: bold;
    opacity:0;
    text-transform:uppercase;
    animation:fade 400ms ease-in-out forwards;
    background-image: linear-gradient(to bottom, #d0a537 32%, #ffdd9a 50%, #625325 72%);
    color:transparent;
    -webkit-background-clip:text;
}

@media screen and (max-width: 600px) {
    .text-animation-s2 span {
        font-size: 65px;
    }
}


@keyframes fade {
    0% {
        top:10px;
        left:10px;
        filter:blur(15px);
        opacity:0;
    }
    50% {
        filter:blur(10px);
        opacity:0.9;
    }
    100% {
        top:0px;
        left:0px;
        filter:blur(0px);
        opacity:1;
    }
}

.animation-wrapper {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.particle,
.particle:after {
    background: transparent;
}

.particle:after {
    position: absolute;
    content: "";
    top: 2560px;
}

.particle-1 {
    animation: animParticle 65s linear infinite;
    box-shadow: 0px 0px #dc5e38, 2241px 2030px #dc5e38, 1116px 1296px #dc5e38, 2171px 603px #dc5e38, 2232px 433px #dc5e38, 1691px 1285px #dc5e38, 2432px 266px #dc5e38, 1730px 1676px #dc5e38, 944px 1091px #dc5e38, 46px 1800px #dc5e38, 95px 1309px #dc5e38, 1823px 2487px #dc5e38, 2320px 841px #dc5e38, 2459px 1166px #dc5e38, 103px 1521px #dc5e38, 1088px 852px #dc5e38, 2308px 940px #dc5e38, 801px 136px #dc5e38, 353px 367px #dc5e38, 1633px 2120px #dc5e38, 1954px 349px #dc5e38, 2194px 614px #dc5e38, 2555px 1759px #dc5e38, 2213px 789px #dc5e38, 1174px 2069px #dc5e38, 1024px 1089px #dc5e38, 1333px 2142px #dc5e38, 1421px 1910px #dc5e38, 1149px 1427px #dc5e38, 1015px 88px #dc5e38, 770px 2070px #dc5e38, 232px 905px #dc5e38, 153px 197px #dc5e38, 482px 883px #dc5e38, 253px 217px #dc5e38, 884px 1415px #dc5e38, 1309px 1832px #dc5e38, 717px 1998px #dc5e38, 2071px 1375px #dc5e38, 2464px 2506px #dc5e38, 2137px 1731px #dc5e38, 2149px 652px #dc5e38, 823px 2332px #dc5e38, 1837px 989px #dc5e38, 341px 649px #dc5e38, 147px 210px #dc5e38, 679px 1723px #dc5e38, 1517px 1377px #dc5e38, 1900px 2335px #dc5e38, 2252px 129px #dc5e38, 445px 1010px #dc5e38, 2022px 2531px #dc5e38, 2259px 2008px #dc5e38, 588px 2056px #dc5e38, 1974px 1073px #dc5e38, 6px 543px #dc5e38, 1145px 2010px #dc5e38, 1167px 2124px #dc5e38, 1696px 935px #dc5e38, 704px 1274px #dc5e38, 915px 1874px #dc5e38, 1643px 269px #dc5e38, 1709px 1322px #dc5e38, 2213px 1623px #dc5e38, 1213px 1652px #dc5e38, 1953px 843px #dc5e38, 965px 1228px #dc5e38, 1845px 176px #dc5e38, 2279px 594px #dc5e38, 844px 1445px #dc5e38, 833px 1598px #dc5e38, 1272px 2283px #dc5e38, 757px 2413px #dc5e38, 1801px 1651px #dc5e38, 1211px 645px #dc5e38, 2509px 2535px #dc5e38, 2085px 2209px #dc5e38, 713px 531px #dc5e38, 1922px 339px #dc5e38, 290px 1709px #dc5e38, 1096px 125px #dc5e38, 1304px 759px #dc5e38, 2095px 2494px #dc5e38, 60px 246px #dc5e38, 629px 353px #dc5e38, 715px 1495px #dc5e38, 461px 962px #dc5e38, 2417px 1424px #dc5e38, 450px 2004px #dc5e38, 223px 253px #dc5e38, 2404px 1698px #dc5e38, 233px 98px #dc5e38, 1924px 2175px #dc5e38, 2004px 1194px #dc5e38, 1572px 2254px #dc5e38, 25px 1349px #dc5e38, 2164px 1174px #dc5e38, 669px 232px #dc5e38, 2388px 250px #dc5e38, 1466px 1571px #dc5e38, 1010px 2072px #dc5e38, 1163px 2022px #dc5e38, 1273px 862px #dc5e38, 2139px 1727px #dc5e38, 1900px 2390px #dc5e38, 2243px 1495px #dc5e38, 1151px 370px #dc5e38, 193px 2373px #dc5e38, 38px 395px #dc5e38, 217px 1680px #dc5e38, 1050px 724px #dc5e38, 790px 1570px #dc5e38, 344px 2010px #dc5e38, 1693px 755px #dc5e38, 450px 2340px #dc5e38, 748px 127px #dc5e38, 1805px 233px #dc5e38, 1548px 2091px #dc5e38, 2295px 2208px #dc5e38, 2391px 1063px #dc5e38, 2120px 1461px #dc5e38, 2037px 1037px #dc5e38, 1686px 135px #dc5e38, 1402px 655px #dc5e38, 1148px 2096px #dc5e38, 2094px 849px #dc5e38, 937px 2011px #dc5e38, 1127px 864px #dc5e38, 429px 708px #dc5e38, 1805px 2066px #dc5e38, 1171px 2150px #dc5e38, 2001px 896px #dc5e38, 1059px 71px #dc5e38, 1864px 434px #dc5e38, 231px 618px #dc5e38, 1975px 2255px #dc5e38, 859px 2272px #dc5e38, 904px 1502px #dc5e38, 1479px 2072px #dc5e38, 2147px 1068px #dc5e38, 2389px 2381px #dc5e38, 2324px 486px #dc5e38, 887px 1495px #dc5e38, 2028px 2052px #dc5e38, 1808px 597px #dc5e38, 2200px 2508px #dc5e38, 651px 2226px #dc5e38, 2244px 1006px #dc5e38, 1385px 1560px #dc5e38, 543px 904px #dc5e38, 209px 130px #dc5e38, 882px 400px #dc5e38, 2062px 1834px #dc5e38, 630px 1306px #dc5e38, 199px 2453px #dc5e38, 2134px 1403px #dc5e38, 758px 2510px #dc5e38, 237px 183px #dc5e38, 1802px 431px #dc5e38, 2293px 1212px #dc5e38, 1649px 1191px #dc5e38, 1350px 1094px #dc5e38, 1416px 1741px #dc5e38, 1198px 1180px #dc5e38, 1732px 546px #dc5e38, 1124px 367px #dc5e38, 596px 1268px #dc5e38, 1157px 1912px #dc5e38, 2079px 200px #dc5e38, 2286px 1902px #dc5e38, 443px 2556px #dc5e38, 1138px 6px #dc5e38, 2298px 545px #dc5e38, 1935px 872px #dc5e38, 259px 1598px #dc5e38, 678px 764px #dc5e38, 1811px 1318px #dc5e38, 2253px 141px #dc5e38, 1279px 2418px #dc5e38, 617px 1405px #dc5e38, 2290px 1724px #dc5e38, 2522px 1751px #dc5e38, 53px 1395px #dc5e38, 1414px 1874px #dc5e38, 2516px 1113px #dc5e38, 765px 778px #dc5e38, 2279px 1836px #dc5e38, 1573px 1084px #dc5e38, 2199px 737px #dc5e38, 1544px 1718px #dc5e38, 603px 937px #dc5e38, 480px 2523px #dc5e38, 1543px 670px #dc5e38, 508px 1135px #dc5e38, 2418px 2332px #dc5e38, 2098px 2334px #dc5e38, 1623px 2314px #dc5e38, 1462px 1789px #dc5e38, 254px 302px #dc5e38, 1922px 446px #dc5e38, 2100px 1605px #dc5e38, 367px 969px #dc5e38, 168px 2173px #dc5e38, 1754px 1358px #dc5e38, 537px 944px #dc5e38, 1053px 748px #dc5e38, 1055px 2031px #dc5e38, 222px 27px #dc5e38, 568px 2557px #dc5e38, 2487px 2200px #dc5e38, 863px 1915px #dc5e38, 2242px 1944px #dc5e38, 2056px 2164px #dc5e38, 258px 1537px #dc5e38, 2327px 483px #dc5e38, 23px 1731px #dc5e38, 1898px 18px #dc5e38, 2457px 1558px #dc5e38, 2173px 1888px #dc5e38, 516px 1435px #dc5e38, 916px 437px #dc5e38, 989px 2184px #dc5e38, 169px 2368px #dc5e38, 2425px 1707px #dc5e38, 927px 1774px #dc5e38, 1777px 721px #dc5e38, 54px 675px #dc5e38, 2373px 2203px #dc5e38, 918px 174px #dc5e38, 1055px 1766px #dc5e38, 236px 1928px #dc5e38, 183px 133px #dc5e38, 148px 2421px #dc5e38, 1408px 1988px #dc5e38, 2484px 2277px #dc5e38, 355px 2362px #dc5e38, 2184px 570px #dc5e38, 365px 1230px #dc5e38, 1852px 1326px #dc5e38, 2009px 564px #dc5e38, 668px 2321px #dc5e38, 467px 1237px #dc5e38, 363px 831px #dc5e38, 369px 462px #dc5e38, 408px 2243px #dc5e38, 352px 2467px #dc5e38, 857px 624px #dc5e38, 1517px 1623px #dc5e38, 1272px 1640px #dc5e38, 401px 2402px #dc5e38, 2178px 29px #dc5e38, 43px 1574px #dc5e38, 630px 1808px #dc5e38, 48px 1375px #dc5e38, 250px 2029px #dc5e38, 1695px 1973px #dc5e38, 2274px 285px #dc5e38, 2354px 828px #dc5e38, 919px 1683px #dc5e38, 2247px 1313px #dc5e38, 985px 824px #dc5e38, 2409px 2358px #dc5e38, 218px 1499px #dc5e38, 57px 1732px #dc5e38, 836px 96px #dc5e38, 2396px 1601px #dc5e38, 2296px 1834px #dc5e38, 2033px 877px #dc5e38, 873px 411px #dc5e38, 395px 2016px #dc5e38, 1403px 709px #dc5e38, 101px 1032px #dc5e38, 2201px 372px #dc5e38, 1771px 743px #dc5e38, 1401px 1118px #dc5e38, 143px 1974px #dc5e38, 269px 78px #dc5e38, 2324px 1236px #dc5e38, 1101px 539px #dc5e38, 2072px 1404px #dc5e38, 69px 178px #dc5e38, 64px 1076px #dc5e38, 2160px 2245px #dc5e38, 1108px 628px #dc5e38, 1798px 1099px #dc5e38, 2290px 1106px #dc5e38, 1839px 1942px #dc5e38, 523px 835px #dc5e38, 2371px 555px #dc5e38, 755px 1326px #dc5e38, 510px 274px #dc5e38, 2346px 657px #dc5e38, 1119px 1717px #dc5e38, 294px 860px #dc5e38, 983px 1207px #dc5e38, 142px 1900px #dc5e38, 695px 217px #dc5e38, 2363px 1007px #dc5e38, 314px 444px #dc5e38, 954px 621px #dc5e38, 2001px 363px #dc5e38;
    height: 7px;
    width: 7px;
    border-radius: 50%;
    opacity: 0.5;
}

.particle-1:after {
    box-shadow: 0px 0px #dc5e38, 2459px 698px #dc5e38, 2554px 2078px #dc5e38, 1652px 219px #dc5e38, 2557px 1411px #dc5e38, 1612px 1723px #dc5e38, 2314px 871px #dc5e38, 2335px 1857px #dc5e38, 1343px 99px #dc5e38, 440px 1789px #dc5e38, 67px 306px #dc5e38, 2352px 2531px #dc5e38, 314px 1429px #dc5e38, 578px 1584px #dc5e38, 1544px 322px #dc5e38, 761px 1445px #dc5e38, 1615px 2517px #dc5e38, 1202px 2492px #dc5e38, 823px 1698px #dc5e38, 724px 1728px #dc5e38, 1904px 912px #dc5e38, 2057px 1046px #dc5e38, 1760px 916px #dc5e38, 2518px 707px #dc5e38, 2389px 797px #dc5e38, 2112px 2050px #dc5e38, 2122px 1909px #dc5e38, 499px 916px #dc5e38, 392px 1687px #dc5e38, 1178px 1179px #dc5e38, 902px 2223px #dc5e38, 731px 1117px #dc5e38, 1664px 2239px #dc5e38, 1271px 281px #dc5e38, 430px 1556px #dc5e38, 2023px 1601px #dc5e38, 2066px 343px #dc5e38, 183px 1310px #dc5e38, 1265px 2344px #dc5e38, 303px 2311px #dc5e38, 1328px 1763px #dc5e38, 1003px 1119px #dc5e38, 362px 428px #dc5e38, 762px 81px #dc5e38, 47px 2129px #dc5e38, 1741px 908px #dc5e38, 1326px 2170px #dc5e38, 1980px 2205px #dc5e38, 1251px 1580px #dc5e38, 1256px 2390px #dc5e38, 1496px 651px #dc5e38, 1655px 1414px #dc5e38, 274px 2512px #dc5e38, 1090px 1248px #dc5e38, 321px 560px #dc5e38, 1502px 1949px #dc5e38, 71px 2469px #dc5e38, 1265px 233px #dc5e38, 2527px 1672px #dc5e38, 454px 1899px #dc5e38, 503px 2155px #dc5e38, 2469px 565px #dc5e38, 1640px 2212px #dc5e38, 2127px 2206px #dc5e38, 1248px 2551px #dc5e38, 1370px 678px #dc5e38, 1316px 706px #dc5e38, 2182px 2444px #dc5e38, 1891px 1073px #dc5e38, 987px 1373px #dc5e38, 1787px 1144px #dc5e38, 809px 1928px #dc5e38, 1665px 2553px #dc5e38, 2425px 207px #dc5e38, 198px 1137px #dc5e38, 1779px 2049px #dc5e38, 58px 51px #dc5e38, 125px 1473px #dc5e38, 1px 2013px #dc5e38, 1415px 564px #dc5e38, 309px 1943px #dc5e38, 1173px 371px #dc5e38, 979px 331px #dc5e38, 84px 2524px #dc5e38, 581px 1897px #dc5e38, 897px 403px #dc5e38, 144px 1675px #dc5e38, 236px 1708px #dc5e38, 1540px 246px #dc5e38, 1002px 1062px #dc5e38, 325px 632px #dc5e38, 410px 1561px #dc5e38, 342px 278px #dc5e38, 1899px 1135px #dc5e38, 1446px 1780px #dc5e38, 2126px 424px #dc5e38, 1663px 2355px #dc5e38, 1178px 704px #dc5e38, 1080px 2090px #dc5e38, 508px 2236px #dc5e38, 2296px 1491px #dc5e38, 1481px 1961px #dc5e38, 1029px 202px #dc5e38, 934px 2420px #dc5e38, 2544px 232px #dc5e38, 1768px 2498px #dc5e38, 2220px 848px #dc5e38, 2026px 1852px #dc5e38, 2516px 1229px #dc5e38, 2536px 2072px #dc5e38, 252px 2457px #dc5e38, 2174px 1999px #dc5e38, 1931px 855px #dc5e38, 1960px 2015px #dc5e38, 2224px 518px #dc5e38, 2311px 2259px #dc5e38, 787px 559px #dc5e38, 2200px 1590px #dc5e38, 439px 185px #dc5e38, 168px 1873px #dc5e38, 1739px 1405px #dc5e38, 2064px 1930px #dc5e38, 1727px 182px #dc5e38, 1255px 2042px #dc5e38, 484px 1308px #dc5e38, 2449px 1945px #dc5e38, 1009px 2078px #dc5e38, 1497px 441px #dc5e38, 2545px 778px #dc5e38, 741px 2443px #dc5e38, 1588px 2538px #dc5e38, 371px 1733px #dc5e38, 1675px 1287px #dc5e38, 2070px 2226px #dc5e38, 1868px 2478px #dc5e38, 920px 1318px #dc5e38, 2112px 840px #dc5e38, 1348px 1499px #dc5e38, 2061px 79px #dc5e38, 2014px 2469px #dc5e38, 1092px 2164px #dc5e38, 621px 997px #dc5e38, 682px 745px #dc5e38, 1027px 2461px #dc5e38, 772px 1060px #dc5e38, 2051px 1051px #dc5e38, 1844px 2130px #dc5e38, 2520px 1299px #dc5e38, 77px 2484px #dc5e38, 1154px 1919px #dc5e38, 490px 968px #dc5e38, 1194px 844px #dc5e38, 2096px 1222px #dc5e38, 83px 1590px #dc5e38, 1009px 2253px #dc5e38, 684px 1944px #dc5e38, 188px 399px #dc5e38, 1527px 2508px #dc5e38, 2150px 1195px #dc5e38, 2511px 1871px #dc5e38, 1722px 2036px #dc5e38, 2391px 105px #dc5e38, 1052px 1440px #dc5e38, 1809px 246px #dc5e38, 1298px 502px #dc5e38, 1229px 751px #dc5e38, 1857px 149px #dc5e38, 2476px 291px #dc5e38, 918px 807px #dc5e38, 1427px 33px #dc5e38, 2194px 1987px #dc5e38, 2063px 882px #dc5e38, 300px 2186px #dc5e38, 50px 2491px #dc5e38, 2252px 535px #dc5e38, 2017px 75px #dc5e38, 506px 1847px #dc5e38, 2242px 595px #dc5e38, 1143px 1017px #dc5e38, 1409px 2226px #dc5e38, 547px 1331px #dc5e38, 1870px 323px #dc5e38, 2234px 2145px #dc5e38, 441px 1489px #dc5e38, 1829px 814px #dc5e38, 1657px 2194px #dc5e38, 2117px 378px #dc5e38, 1511px 218px #dc5e38, 169px 1516px #dc5e38, 347px 2124px #dc5e38, 863px 1675px #dc5e38, 1084px 2079px #dc5e38, 2056px 1005px #dc5e38, 1307px 1079px #dc5e38, 2443px 2402px #dc5e38, 807px 1836px #dc5e38, 321px 846px #dc5e38, 2543px 1571px #dc5e38, 2119px 2336px #dc5e38, 1092px 42px #dc5e38, 1928px 1294px #dc5e38, 1875px 991px #dc5e38, 1894px 429px #dc5e38, 2530px 970px #dc5e38, 1129px 2399px #dc5e38, 2426px 1370px #dc5e38, 1214px 2053px #dc5e38, 2259px 614px #dc5e38, 81px 1429px #dc5e38, 2369px 1219px #dc5e38, 395px 971px #dc5e38, 2420px 2473px #dc5e38, 2156px 500px #dc5e38, 900px 2409px #dc5e38, 2039px 1413px #dc5e38, 281px 38px #dc5e38, 2229px 622px #dc5e38, 349px 510px #dc5e38, 996px 993px #dc5e38, 1129px 804px #dc5e38, 223px 581px #dc5e38, 1849px 264px #dc5e38, 835px 1155px #dc5e38, 1696px 104px #dc5e38, 1867px 2024px #dc5e38, 539px 2264px #dc5e38, 2339px 2293px #dc5e38, 2515px 1057px #dc5e38, 1116px 726px #dc5e38, 146px 280px #dc5e38, 2244px 2092px #dc5e38, 444px 1590px #dc5e38, 756px 125px #dc5e38, 161px 102px #dc5e38, 1266px 704px #dc5e38, 2214px 121px #dc5e38, 9px 1015px #dc5e38, 2029px 1727px #dc5e38, 449px 1082px #dc5e38, 642px 842px #dc5e38, 209px 1698px #dc5e38, 532px 2267px #dc5e38, 1975px 242px #dc5e38, 2052px 396px #dc5e38, 367px 1909px #dc5e38, 526px 967px #dc5e38, 949px 244px #dc5e38, 1598px 1065px #dc5e38, 2286px 2025px #dc5e38, 1288px 1551px #dc5e38, 157px 250px #dc5e38, 144px 421px #dc5e38, 2133px 1736px #dc5e38, 1516px 665px #dc5e38, 92px 1437px #dc5e38, 1088px 1928px #dc5e38, 271px 1309px #dc5e38, 1774px 2470px #dc5e38, 1929px 290px #dc5e38, 377px 2038px #dc5e38, 112px 2438px #dc5e38, 1451px 1329px #dc5e38, 1394px 1567px #dc5e38, 2161px 155px #dc5e38, 679px 1137px #dc5e38, 1653px 2085px #dc5e38, 25px 1983px #dc5e38, 146px 684px #dc5e38, 2088px 264px #dc5e38, 1197px 2056px #dc5e38, 1270px 823px #dc5e38, 2470px 1396px #dc5e38, 1505px 1278px #dc5e38, 1777px 1513px #dc5e38, 87px 1978px #dc5e38, 1620px 1433px #dc5e38, 1380px 1270px #dc5e38, 2546px 1479px #dc5e38, 347px 205px #dc5e38, 785px 145px #dc5e38, 286px 1499px #dc5e38, 761px 2295px #dc5e38, 610px 1940px #dc5e38, 1986px 618px #dc5e38, 1992px 2506px #dc5e38, 1227px 181px #dc5e38, 2008px 460px #dc5e38, 1037px 2170px #dc5e38, 448px 1294px #dc5e38, 634px 207px #dc5e38, 1935px 1036px #dc5e38, 473px 1489px #dc5e38, 1254px 922px #dc5e38, 1771px 1279px #dc5e38, 1313px 1002px #dc5e38, 871px 1320px #dc5e38, 1670px 2392px #dc5e38, 2472px 2145px #dc5e38, 1925px 2072px #dc5e38, 1425px 1925px #dc5e38, 667px 2316px #dc5e38;
    height: 1px;
    width: 1px;
}

.particle-2 {
    animation: animParticle 120s linear infinite;
    box-shadow: 0px 0px #dc5e38, 733px 482px #dc5e38, 584px 1269px #dc5e38, 465px 1646px #dc5e38, 1px 406px #dc5e38, 528px 1381px #dc5e38, 1912px 2505px #dc5e38, 2012px 2268px #dc5e38, 1954px 602px #dc5e38, 1743px 2229px #dc5e38, 2094px 1252px #dc5e38, 145px 337px #dc5e38, 429px 1112px #dc5e38, 1197px 2492px #dc5e38, 238px 1270px #dc5e38, 28px 2155px #dc5e38, 1266px 585px #dc5e38, 2374px 578px #dc5e38, 2527px 1457px #dc5e38, 1497px 187px #dc5e38, 1535px 838px #dc5e38, 1397px 473px #dc5e38, 482px 2454px #dc5e38, 427px 1950px #dc5e38, 2069px 1009px #dc5e38, 2535px 1908px #dc5e38, 417px 2042px #dc5e38, 1356px 1457px #dc5e38, 1051px 2190px #dc5e38, 353px 1240px #dc5e38, 169px 269px #dc5e38, 1404px 2402px #dc5e38, 2206px 565px #dc5e38, 2336px 601px #dc5e38, 1066px 132px #dc5e38, 2524px 346px #dc5e38, 564px 143px #dc5e38, 2077px 2010px #dc5e38, 966px 2427px #dc5e38, 2001px 171px #dc5e38, 1550px 1693px #dc5e38, 1904px 2480px #dc5e38, 358px 1831px #dc5e38, 987px 1818px #dc5e38, 1103px 1190px #dc5e38, 1380px 1952px #dc5e38, 1899px 75px #dc5e38, 1450px 732px #dc5e38, 1988px 1667px #dc5e38, 2542px 2120px #dc5e38, 1992px 165px #dc5e38, 618px 300px #dc5e38, 1211px 2178px #dc5e38, 1517px 1658px #dc5e38, 513px 2248px #dc5e38, 2389px 1081px #dc5e38, 157px 2538px #dc5e38, 1806px 129px #dc5e38, 322px 395px #dc5e38, 418px 1892px #dc5e38, 209px 2351px #dc5e38, 1384px 2446px #dc5e38, 1962px 2179px #dc5e38, 901px 724px #dc5e38, 1843px 382px #dc5e38, 2407px 1827px #dc5e38, 1219px 964px #dc5e38, 1094px 2066px #dc5e38, 614px 1911px #dc5e38, 1874px 633px #dc5e38, 1259px 619px #dc5e38, 1231px 2467px #dc5e38, 2063px 2518px #dc5e38, 423px 2373px #dc5e38, 1705px 1290px #dc5e38, 810px 2397px #dc5e38, 972px 693px #dc5e38, 2415px 2170px #dc5e38, 1836px 1313px #dc5e38, 2373px 1787px #dc5e38, 978px 943px #dc5e38, 380px 1798px #dc5e38, 1841px 2407px #dc5e38, 2459px 2120px #dc5e38, 9px 786px #dc5e38, 835px 146px #dc5e38, 513px 2352px #dc5e38, 1579px 90px #dc5e38, 221px 225px #dc5e38, 697px 1137px #dc5e38, 1680px 2345px #dc5e38, 61px 885px #dc5e38, 2495px 1208px #dc5e38, 1114px 1152px #dc5e38, 1413px 1802px #dc5e38, 2225px 1610px #dc5e38, 682px 1192px #dc5e38, 219px 342px #dc5e38, 1527px 2286px #dc5e38, 2403px 768px #dc5e38, 1162px 2100px #dc5e38;
    height: 2px;
    width: 2px;
    border-radius: 50%;
}

.particle-2:after {
    box-shadow: 0px 0px #dc5e38, 2097px 2124px #dc5e38, 1443px 2003px #dc5e38, 1315px 132px #dc5e38, 2437px 1942px #dc5e38, 1360px 950px #dc5e38, 765px 1028px #dc5e38, 360px 1173px #dc5e38, 1952px 2471px #dc5e38, 1418px 2496px #dc5e38, 822px 1892px #dc5e38, 565px 2070px #dc5e38, 921px 95px #dc5e38, 1979px 2317px #dc5e38, 714px 2073px #dc5e38, 2279px 537px #dc5e38, 1851px 535px #dc5e38, 929px 633px #dc5e38, 80px 1110px #dc5e38, 1765px 375px #dc5e38, 1986px 63px #dc5e38, 1469px 1311px #dc5e38, 1962px 2388px #dc5e38, 1488px 2032px #dc5e38, 1932px 2156px #dc5e38, 2297px 449px #dc5e38, 387px 122px #dc5e38, 469px 2346px #dc5e38, 2218px 1594px #dc5e38, 1976px 2545px #dc5e38, 198px 994px #dc5e38, 564px 1602px #dc5e38, 703px 2546px #dc5e38, 111px 343px #dc5e38, 213px 563px #dc5e38, 419px 2099px #dc5e38, 1636px 2115px #dc5e38, 227px 528px #dc5e38, 854px 1459px #dc5e38, 1038px 2183px #dc5e38, 2530px 1428px #dc5e38, 588px 1572px #dc5e38, 1486px 2459px #dc5e38, 939px 2428px #dc5e38, 972px 1795px #dc5e38, 1002px 1219px #dc5e38, 1372px 850px #dc5e38, 376px 74px #dc5e38, 27px 614px #dc5e38, 870px 1965px #dc5e38, 2327px 1860px #dc5e38, 1406px 2458px #dc5e38, 588px 2358px #dc5e38, 2107px 459px #dc5e38, 600px 2104px #dc5e38, 713px 126px #dc5e38, 1158px 1698px #dc5e38, 612px 1227px #dc5e38, 1732px 1886px #dc5e38, 1853px 1979px #dc5e38, 835px 2035px #dc5e38, 1975px 1011px #dc5e38, 5px 1313px #dc5e38, 874px 2358px #dc5e38, 460px 42px #dc5e38, 2185px 323px #dc5e38, 2064px 1529px #dc5e38, 1678px 826px #dc5e38, 2007px 1283px #dc5e38, 736px 675px #dc5e38, 348px 1599px #dc5e38, 1346px 495px #dc5e38, 991px 618px #dc5e38, 1573px 1810px #dc5e38, 817px 1150px #dc5e38, 2443px 985px #dc5e38, 1240px 1115px #dc5e38, 1934px 1503px #dc5e38, 993px 2223px #dc5e38, 13px 725px #dc5e38, 1855px 1608px #dc5e38, 2520px 1104px #dc5e38, 308px 819px #dc5e38, 1323px 113px #dc5e38, 1894px 210px #dc5e38, 2409px 2465px #dc5e38, 195px 772px #dc5e38, 871px 1541px #dc5e38, 527px 1478px #dc5e38, 2425px 1225px #dc5e38, 27px 199px #dc5e38, 510px 2130px #dc5e38, 1106px 1268px #dc5e38, 2555px 1494px #dc5e38, 688px 221px #dc5e38, 1491px 2102px #dc5e38, 1853px 454px #dc5e38, 903px 150px #dc5e38, 472px 731px #dc5e38, 2211px 2216px #dc5e38, 1193px 691px #dc5e38;
    height: 2px;
    width: 2px;
}

.particle-3 {
    animation: animParticle 180s linear infinite;
    box-shadow: 0px 0px #dc5e38, 1621px 1700px #dc5e38, 330px 148px #dc5e38, 1991px 1387px #dc5e38, 2143px 1622px #dc5e38, 2250px 815px #dc5e38, 1817px 604px #dc5e38, 1394px 2429px #dc5e38, 375px 2400px #dc5e38, 2495px 874px #dc5e38, 1716px 646px #dc5e38, 1676px 624px #dc5e38, 2480px 2241px #dc5e38, 2246px 1923px #dc5e38, 2277px 1307px #dc5e38, 362px 1869px #dc5e38, 2042px 990px #dc5e38, 12px 2315px #dc5e38, 1166px 2535px #dc5e38, 465px 59px #dc5e38, 1911px 800px #dc5e38, 2191px 616px #dc5e38, 2288px 2475px #dc5e38, 652px 1473px #dc5e38, 1720px 1605px #dc5e38, 2510px 2232px #dc5e38, 2453px 2131px #dc5e38, 1527px 2017px #dc5e38, 541px 836px #dc5e38, 2464px 2509px #dc5e38, 63px 875px #dc5e38, 534px 471px #dc5e38, 2504px 1536px #dc5e38, 1748px 52px #dc5e38, 203px 2192px #dc5e38, 139px 1238px #dc5e38, 596px 2512px #dc5e38, 2558px 2476px #dc5e38, 1088px 1318px #dc5e38, 2402px 754px #dc5e38, 832px 134px #dc5e38, 1785px 1752px #dc5e38, 1617px 1549px #dc5e38, 1708px 400px #dc5e38, 2467px 2184px #dc5e38, 1409px 859px #dc5e38, 733px 1007px #dc5e38, 1684px 804px #dc5e38, 224px 1182px #dc5e38, 300px 1692px #dc5e38, 994px 1325px #dc5e38;
    height: 3px;
    width: 3px;
    border-radius: 50%;
}

.particle-3:after {
    box-shadow: 0px 0px #dc5e38, 1497px 2496px #dc5e38, 299px 2078px #dc5e38, 2123px 2332px #dc5e38, 235px 1694px #dc5e38, 1830px 233px #dc5e38, 798px 565px #dc5e38, 1841px 1790px #dc5e38, 556px 1165px #dc5e38, 1134px 320px #dc5e38, 2190px 798px #dc5e38, 476px 2524px #dc5e38, 1147px 1854px #dc5e38, 601px 672px #dc5e38, 1287px 153px #dc5e38, 1035px 2088px #dc5e38, 1292px 1197px #dc5e38, 1694px 683px #dc5e38, 529px 317px #dc5e38, 729px 661px #dc5e38, 1611px 1782px #dc5e38, 618px 1479px #dc5e38, 1590px 2348px #dc5e38, 1561px 1770px #dc5e38, 1109px 1964px #dc5e38, 2451px 2146px #dc5e38, 94px 475px #dc5e38, 1135px 419px #dc5e38, 2243px 1762px #dc5e38, 1090px 354px #dc5e38, 1438px 1863px #dc5e38, 785px 1988px #dc5e38, 1245px 341px #dc5e38, 793px 972px #dc5e38, 124px 964px #dc5e38, 679px 289px #dc5e38, 2422px 1347px #dc5e38, 2489px 2495px #dc5e38, 730px 1250px #dc5e38, 1802px 673px #dc5e38, 426px 1274px #dc5e38, 921px 169px #dc5e38, 776px 1664px #dc5e38, 449px 1652px #dc5e38, 239px 705px #dc5e38, 171px 2153px #dc5e38, 2358px 1685px #dc5e38, 48px 1951px #dc5e38, 2052px 1581px #dc5e38, 1610px 330px #dc5e38, 1053px 1454px #dc5e38;
    height: 3px;
    width: 3px;
}

.particle-4 {
    animation: animParticle 600s linear infinite;
    box-shadow: 0px 0px #dc5e38, 36px 2154px #dc5e38, 2085px 275px #dc5e38, 2413px 2482px #dc5e38, 1202px 1052px #dc5e38, 1425px 709px #dc5e38, 413px 565px #dc5e38, 1290px 428px #dc5e38, 271px 1746px #dc5e38, 265px 788px #dc5e38, 1131px 812px #dc5e38, 959px 894px #dc5e38, 1036px 1116px #dc5e38, 1343px 1281px #dc5e38, 1496px 1814px #dc5e38, 679px 2100px #dc5e38, 6px 726px #dc5e38, 2111px 1958px #dc5e38, 1592px 1981px #dc5e38, 43px 1637px #dc5e38, 1145px 467px #dc5e38, 2478px 189px #dc5e38, 922px 1628px #dc5e38, 2501px 2289px #dc5e38, 871px 695px #dc5e38, 1460px 835px #dc5e38, 1338px 549px #dc5e38, 577px 964px #dc5e38, 581px 1628px #dc5e38, 122px 1231px #dc5e38, 2111px 633px #dc5e38, 1598px 1000px #dc5e38, 2041px 1805px #dc5e38, 1547px 859px #dc5e38, 2038px 929px #dc5e38, 920px 586px #dc5e38, 149px 322px #dc5e38, 1946px 1611px #dc5e38, 1881px 1895px #dc5e38, 2105px 1241px #dc5e38, 2218px 1486px #dc5e38, 1702px 46px #dc5e38, 125px 2098px #dc5e38, 1880px 702px #dc5e38, 2442px 1639px #dc5e38, 608px 2441px #dc5e38, 2122px 619px #dc5e38, 1986px 2430px #dc5e38, 670px 845px #dc5e38, 300px 2478px #dc5e38, 1772px 548px #dc5e38, 2461px 251px #dc5e38, 854px 1451px #dc5e38, 946px 29px #dc5e38, 2368px 810px #dc5e38, 1409px 1311px #dc5e38, 2470px 1284px #dc5e38, 1640px 812px #dc5e38, 1794px 214px #dc5e38, 2009px 178px #dc5e38, 390px 2045px #dc5e38, 2390px 1030px #dc5e38, 258px 1646px #dc5e38, 1234px 628px #dc5e38, 1963px 1370px #dc5e38, 2069px 489px #dc5e38, 2180px 448px #dc5e38, 862px 210px #dc5e38, 1450px 178px #dc5e38, 2378px 981px #dc5e38, 321px 792px #dc5e38, 1436px 1464px #dc5e38, 687px 2039px #dc5e38, 321px 1090px #dc5e38, 1778px 2087px #dc5e38, 2261px 1867px #dc5e38, 2196px 638px #dc5e38, 2010px 562px #dc5e38, 1359px 1477px #dc5e38, 206px 2386px #dc5e38, 278px 2241px #dc5e38, 2529px 892px #dc5e38, 537px 1708px #dc5e38, 617px 374px #dc5e38, 1151px 180px #dc5e38, 821px 1565px #dc5e38, 838px 314px #dc5e38, 1px 2183px #dc5e38, 2452px 265px #dc5e38, 1018px 875px #dc5e38, 2159px 1149px #dc5e38, 1585px 1076px #dc5e38, 2466px 1542px #dc5e38, 1499px 2053px #dc5e38, 1723px 2015px #dc5e38, 1633px 545px #dc5e38, 2311px 694px #dc5e38, 2154px 504px #dc5e38, 2269px 2177px #dc5e38, 1558px 270px #dc5e38, 2057px 235px #dc5e38, 890px 2464px #dc5e38, 1068px 283px #dc5e38, 34px 1431px #dc5e38, 694px 1147px #dc5e38, 1185px 2167px #dc5e38, 607px 1342px #dc5e38, 2071px 308px #dc5e38, 274px 1923px #dc5e38, 351px 2179px #dc5e38, 1592px 792px #dc5e38, 2382px 1054px #dc5e38, 1958px 1768px #dc5e38, 1852px 446px #dc5e38, 903px 278px #dc5e38, 473px 441px #dc5e38, 2010px 21px #dc5e38, 1182px 1103px #dc5e38, 1306px 886px #dc5e38, 667px 2420px #dc5e38, 867px 1753px #dc5e38, 95px 1681px #dc5e38, 1212px 1349px #dc5e38, 146px 2014px #dc5e38, 1817px 1773px #dc5e38, 1568px 2352px #dc5e38, 1318px 1714px #dc5e38, 761px 2274px #dc5e38, 464px 1388px #dc5e38, 2131px 494px #dc5e38, 1187px 733px #dc5e38, 1353px 1732px #dc5e38, 1131px 1265px #dc5e38, 2065px 2379px #dc5e38, 587px 330px #dc5e38, 2150px 666px #dc5e38, 2412px 2290px #dc5e38, 236px 2426px #dc5e38, 1283px 2466px #dc5e38, 1494px 668px #dc5e38, 1673px 2133px #dc5e38, 1074px 977px #dc5e38, 31px 105px #dc5e38, 927px 1860px #dc5e38, 2164px 1604px #dc5e38, 626px 1157px #dc5e38, 2285px 436px #dc5e38, 250px 615px #dc5e38, 1672px 1819px #dc5e38, 294px 2200px #dc5e38, 424px 1767px #dc5e38, 817px 631px #dc5e38, 308px 1123px #dc5e38, 332px 1555px #dc5e38, 391px 2309px #dc5e38, 1473px 2438px #dc5e38, 2559px 424px #dc5e38, 1495px 1420px #dc5e38, 645px 596px #dc5e38, 2386px 1601px #dc5e38, 2556px 1132px #dc5e38, 1891px 1435px #dc5e38, 530px 1729px #dc5e38, 703px 785px #dc5e38, 2314px 1346px #dc5e38, 1282px 1515px #dc5e38, 747px 1864px #dc5e38, 1338px 1111px #dc5e38, 728px 2532px #dc5e38, 485px 1040px #dc5e38, 1703px 580px #dc5e38, 90px 2555px #dc5e38, 630px 29px #dc5e38, 860px 891px #dc5e38, 1676px 1886px #dc5e38, 1508px 389px #dc5e38, 607px 1686px #dc5e38, 1067px 1113px #dc5e38, 1864px 1236px #dc5e38, 60px 404px #dc5e38, 553px 2017px #dc5e38, 2118px 2191px #dc5e38, 272px 2415px #dc5e38, 2530px 495px #dc5e38, 2151px 1400px #dc5e38, 2389px 2519px #dc5e38, 536px 394px #dc5e38, 48px 863px #dc5e38, 1991px 1885px #dc5e38, 90px 252px #dc5e38, 535px 2191px #dc5e38, 1615px 281px #dc5e38, 1957px 2027px #dc5e38, 343px 1574px #dc5e38, 1459px 1312px #dc5e38, 2012px 488px #dc5e38, 2230px 530px #dc5e38, 902px 167px #dc5e38, 2085px 1975px #dc5e38, 119px 22px #dc5e38, 349px 236px #dc5e38;
    height: 1px;
    width: 1px;
    border-radius: 50%;
}

.particle-4:after {
    box-shadow: 0px 0px #dc5e38, 1926px 1933px #dc5e38, 1555px 2540px #dc5e38, 1571px 375px #dc5e38, 1346px 1427px #dc5e38, 468px 1769px #dc5e38, 2518px 1269px #dc5e38, 2185px 1533px #dc5e38, 444px 1937px #dc5e38, 1167px 60px #dc5e38, 2069px 782px #dc5e38, 1682px 855px #dc5e38, 1814px 2070px #dc5e38, 1786px 1698px #dc5e38, 2505px 1671px #dc5e38, 2017px 754px #dc5e38, 646px 1943px #dc5e38, 1018px 661px #dc5e38, 1973px 493px #dc5e38, 1732px 1460px #dc5e38, 1546px 534px #dc5e38, 283px 80px #dc5e38, 2337px 1482px #dc5e38, 796px 1148px #dc5e38, 163px 256px #dc5e38, 795px 877px #dc5e38, 2356px 2299px #dc5e38, 1797px 691px #dc5e38, 364px 1415px #dc5e38, 1031px 1558px #dc5e38, 897px 2497px #dc5e38, 790px 545px #dc5e38, 1229px 1003px #dc5e38, 157px 863px #dc5e38, 383px 445px #dc5e38, 734px 1235px #dc5e38, 1692px 2448px #dc5e38, 2050px 1392px #dc5e38, 1518px 411px #dc5e38, 1520px 2059px #dc5e38, 1935px 1004px #dc5e38, 488px 974px #dc5e38, 1974px 998px #dc5e38, 341px 406px #dc5e38, 960px 2486px #dc5e38, 283px 962px #dc5e38, 1210px 1699px #dc5e38, 99px 473px #dc5e38, 413px 1148px #dc5e38, 2111px 1546px #dc5e38, 1957px 222px #dc5e38, 1061px 1330px #dc5e38, 2116px 608px #dc5e38, 2360px 1833px #dc5e38, 2346px 559px #dc5e38, 1287px 677px #dc5e38, 883px 1241px #dc5e38, 1187px 523px #dc5e38, 2356px 2077px #dc5e38, 2098px 955px #dc5e38, 962px 84px #dc5e38, 1597px 2197px #dc5e38, 586px 2240px #dc5e38, 2286px 856px #dc5e38, 1832px 2040px #dc5e38, 594px 2427px #dc5e38, 1671px 1986px #dc5e38, 1990px 781px #dc5e38, 1348px 1890px #dc5e38, 785px 1657px #dc5e38, 2490px 1406px #dc5e38, 461px 641px #dc5e38, 2415px 981px #dc5e38, 2419px 785px #dc5e38, 2001px 1715px #dc5e38, 1328px 1081px #dc5e38, 2210px 1831px #dc5e38, 2553px 199px #dc5e38, 47px 1715px #dc5e38, 1789px 2390px #dc5e38, 1365px 955px #dc5e38, 184px 1981px #dc5e38, 359px 1337px #dc5e38, 1392px 1715px #dc5e38, 678px 998px #dc5e38, 2007px 376px #dc5e38, 2076px 2353px #dc5e38, 2104px 1975px #dc5e38, 89px 1262px #dc5e38, 712px 798px #dc5e38, 771px 196px #dc5e38, 432px 1952px #dc5e38, 52px 925px #dc5e38, 4px 303px #dc5e38, 2352px 644px #dc5e38, 706px 1297px #dc5e38, 1348px 1429px #dc5e38, 1461px 1312px #dc5e38, 847px 161px #dc5e38, 1653px 1274px #dc5e38, 2285px 718px #dc5e38, 687px 1165px #dc5e38, 1285px 1803px #dc5e38, 1474px 1874px #dc5e38, 1501px 430px #dc5e38, 2380px 998px #dc5e38, 1824px 2271px #dc5e38, 1963px 962px #dc5e38, 2065px 2328px #dc5e38, 931px 1655px #dc5e38, 2095px 563px #dc5e38, 729px 736px #dc5e38, 2512px 979px #dc5e38, 200px 907px #dc5e38, 1141px 1083px #dc5e38, 1940px 2310px #dc5e38, 1935px 345px #dc5e38, 1838px 821px #dc5e38, 1970px 2337px #dc5e38, 133px 1971px #dc5e38, 1303px 1117px #dc5e38, 1367px 2029px #dc5e38, 41px 2272px #dc5e38, 1042px 2474px #dc5e38, 1398px 1412px #dc5e38, 941px 1306px #dc5e38, 1043px 14px #dc5e38, 247px 266px #dc5e38, 1759px 2469px #dc5e38, 1212px 2257px #dc5e38, 1577px 586px #dc5e38, 657px 1041px #dc5e38, 2214px 235px #dc5e38, 1860px 1794px #dc5e38, 1055px 2388px #dc5e38, 577px 2187px #dc5e38, 1894px 1785px #dc5e38, 1206px 646px #dc5e38, 919px 1470px #dc5e38, 1596px 2043px #dc5e38, 1042px 1949px #dc5e38, 1015px 1428px #dc5e38, 2328px 95px #dc5e38, 40px 2195px #dc5e38, 1505px 2427px #dc5e38, 331px 976px #dc5e38, 171px 1173px #dc5e38, 893px 1490px #dc5e38, 602px 1442px #dc5e38, 553px 2094px #dc5e38, 1074px 1632px #dc5e38, 1366px 1068px #dc5e38, 2444px 36px #dc5e38, 729px 1867px #dc5e38, 1118px 1849px #dc5e38, 812px 1813px #dc5e38, 62px 2500px #dc5e38, 2358px 504px #dc5e38, 1540px 2392px #dc5e38, 1387px 1263px #dc5e38, 1897px 525px #dc5e38, 2461px 2187px #dc5e38, 1781px 1539px #dc5e38, 1453px 1156px #dc5e38, 2547px 836px #dc5e38, 413px 108px #dc5e38, 1963px 8px #dc5e38, 890px 262px #dc5e38, 2494px 1372px #dc5e38, 351px 1901px #dc5e38, 798px 1623px #dc5e38, 2338px 1292px #dc5e38, 157px 2532px #dc5e38, 438px 903px #dc5e38, 230px 2319px #dc5e38, 63px 2305px #dc5e38, 2112px 1926px #dc5e38, 631px 1307px #dc5e38, 386px 609px #dc5e38, 5px 49px #dc5e38, 1216px 1851px #dc5e38, 1808px 1695px #dc5e38, 2187px 1363px #dc5e38, 2191px 789px #dc5e38, 369px 705px #dc5e38, 1309px 687px #dc5e38, 77px 838px #dc5e38, 607px 1929px #dc5e38, 1964px 2004px #dc5e38, 2541px 1672px #dc5e38, 2252px 616px #dc5e38, 496px 2108px #dc5e38, 1173px 1261px #dc5e38, 2494px 158px #dc5e38, 2066px 817px #dc5e38, 197px 965px #dc5e38, 2457px 518px #dc5e38, 1070px 1434px #dc5e38, 186px 2348px #dc5e38, 1375px 1238px #dc5e38, 1868px 2289px #dc5e38;
    height: 1px;
    width: 1px;
}


@keyframes animParticle {
    from {
        transform: translateY(0px);
    }

    to {
        transform: translateY(-2560px);
    }
}

.season-separator {
    background-image: url("../img/seasons/season_separator.png");
    width: 100%;
    height: 100px;
    position: relative;
    left: 0px;
    top: -5px;
    background-size: 512px 26px;
    flex: 1 1 auto;
    background-repeat: repeat-x;
    z-index: 7;
}


.timeline{
    position:relative;
    margin:50px auto;
    padding:40px 0;
    width:1000px;
    box-sizing:border-box;
}
.timeline:before{
    content:'';
    position:absolute;
    left:50%;
    width:2px;
    height:100%;
    background:#c5c5c5;
}
.timeline ul{
    padding:0;
    margin:0;
}
.timeline ul li{
    list-style:none;
    position:relative;
    width:50%;
    padding:20px 40px;
    box-sizing:border-box;
}
.timeline ul li:nth-child(odd){
    float:left;
    text-align:right;
    clear:both;
}
.timeline ul li:nth-child(even){
    float:right;
    text-align:left;
    clear:both;
}
.content{
    padding-bottom:20px;
}
.timeline ul li:nth-child(odd):before
{
    content:'';
    position:absolute;
    width:10px;
    height:10px;
    top:24px;
    right:-6px;
    background: #ffa216;
    border-radius:50%;
    box-shadow:0 0 0 3px rgba(233,33,99,0.2);
}
.timeline ul li:nth-child(even):before
{
    content:'';
    position:absolute;
    width:10px;
    height:10px;
    top:24px;
    left:-4px;
    background: #ffa216;
    border-radius:50%;
    box-shadow:0 0 0 3px rgba(233,33,99,0.2);
}
.timeline ul li h3{
    padding:0;
    margin:0;
    color: #ffa216;
    font-weight:600;
}
.timeline ul li p{
    margin:10px 0 0;
    padding:0;
}
.timeline ul li .time h4{
    margin:0;
    padding:0;
    font-size:14px;
}
.timeline ul li:nth-child(odd) .time
{
    position:absolute;
    top:12px;
    right:-165px;
    margin:0;
    padding:8px 16px;
    background: #ffa216;
    color:#222;
    border-radius:18px;
    box-shadow:0 0 0 3px rgba(233,33,99,0.3);
}
.timeline ul li:nth-child(even) .time
{
    position:absolute;
    top:12px;
    left:-165px;
    margin:0;
    padding:8px 16px;
    background: #ffa216;
    color:#222;
    border-radius:18px;
    box-shadow:0 0 0 3px rgba(233,33,99,0.3);
}
@media(max-width:1000px)
{
    .timeline{
        width:100%;
    }
}
@media(max-width:767px){
    .timeline{
        width:100%;
        padding-bottom:0;
    }
    h1{
        font-size:40px;
        text-align:center;
    }
    .timeline:before{
        left:20px;
        height:100%;
    }
    .timeline ul li:nth-child(odd),
    .timeline ul li:nth-child(even)
    {
        width:100%;
        text-align:left;
        padding-left:50px;
        padding-bottom:50px;
    }
    .timeline ul li:nth-child(odd):before,
    .timeline ul li:nth-child(even):before
    {
        top:-18px;
        left:16px;
    }
    .timeline ul li:nth-child(odd) .time,
    .timeline ul li:nth-child(even) .time{
        top:-30px;
        left:50px;
        right:inherit;
    }
}

.time h4 {
    color: #222;
}

.slide-show-wrapper {
    width: 100%;
    max-width: 1200px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%);
}

.tempskrons-block {
    overflow: paged-x;
    width: 100%;
    margin: 10px auto;
}

.morions-block {
    overflow: paged-x;
    width: 1200px;
    margin: 10px auto;
}

.animation {
    width: auto;
    height: 100px;
    font-size: 0px;
}
.animation div {
    display: inline-block;
    width: auto;
    float: none;
    padding: 0 10px;
}

.character-image-wrapper {
    transition: 0.22s ease-out;
    cursor: pointer;
    position: relative;
    width: 200px;
    height: 130px;
    overflow: hidden;
}

.character-image-text {
    position: absolute;
    color: white;
    font-size: 30px;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40px;
    line-height: 40px;
    width: 100%;
    text-align: center;
    background-image: linear-gradient(transparent, black);
    opacity: 0;
    transform: translateY(50px);
    transition: 0.22s ease-out;
    font-family: 'MedievalSharp', cursive;
}

.character-image-wrapper:hover {
    transform: scale(1.12);
}

.character-image-wrapper:hover .character-image-text {
    opacity: 1;
    transform: translateY(0px);
}

.slider-wrapper {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.textcontainer {
    padding: 40px 0 0 0;
    text-align: center;
    position: relative;
    cursor: pointer;
    margin: 30px;

}

.textcontainer:hover > .particletext {
}


.sourse-icon {
    position: absolute;
    left: 50%;
    margin-left: -32px;
    top: -9px;
    filter: drop-shadow(0 0 0.75rem rgba(0, 0, 0, 0.7));
}

.particletext {
    text-align: center;
    font-size: 20px;
    width: 220px;
    padding: 15px 0;
    position: relative;
    background: rgba(0, 0, 0, 0.61);
    border: 2px solid transparent;
    border-image: url(../img/user/login_border.png) 30 stretch;
    transition: 0.2s;
}

.particletext.bubbles > .particle {
    opacity: 0;
    position: absolute;
    visibility: hidden;
    background-color: rgba(33, 150, 243, 0.5);
    animation: bubbles 3s ease-in infinite;
    border-radius: 100%;
}

.particletext.lines > .particle {
    position: absolute;
    display: none;
    background-color: rgb(244, 108, 54);
    animation: lines 3s linear infinite;
    transition: 0.3s;
}

.download-links-wrapper a:hover {
    text-decoration: none !important;
}

.textcontainer:hover > .particletext.lines > .particle {
    display: block;
}

.textcontainer:hover > .particletext.bubbles > .particle {
    visibility: visible;
}

@keyframes bubbles {
    0% {
        opacity: 0.4;
    }

    20% {
        opacity: 1;
        transform: translate(0, -20%);
    }

    100% {
        opacity: 0.4;
        transform: translate(0, -1000%);
    }
}

@keyframes lines {
    0%, 50%, 100% {
        opacity: 0.3;
        transform: translateY(0%);
    }

    25% {
        opacity: 0.3;
        transform: translateY(100%);
    }

    75% {
        opacity: 0.3;
        transform: translateY(-100%);
    }
}

.view-chars-link:hover {
    text-decoration: none;
}

.skills-video-container-wrapper {
    filter: drop-shadow(0 0 0.75rem rgba(177, 130, 118, 0.7));
    z-index: 2;
    max-width: 100%;
    position: relative;
}

.lines-circle {
    position: relative;
    height: 457px;
    width: 457px;
    clip-path: circle(50% at 50% 50%);
    background: #805736;
}

.skills-video-container {
    height: 450px;
    width: 450px;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    clip-path: circle(50% at 50% 50%);
}

.skills-video-container video {
    min-width: 100%;
    min-height: 100%;
    position: absolute;
    top: 40%;
    left: 53%;
    transform: translateX(-50%) translateY(-50%);
}

.atalanta-image {
    width: 450px;
    height: 435px;
    position: absolute;
    bottom: 80px;
    right: -265px;
    transform: scale(0.75);
}

@media only screen and (max-width: 700px) {
    .atalanta-image {
        display: none;
    }
}

.decoy {
    width: 300px;
    height: 455px;
    position: absolute;
    bottom: 100px;
    right: -135px;
    transform: scale(0.75);
    filter: drop-shadow(2px 4px 6px #00000050);
}

@media only screen and (max-width: 700px) {
    .decoy {
        display: none;
    }
}

.floating {
    animation-name: floating;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 30px;
    margin-top: 5px;
}

@keyframes floating {
    0% { transform: translate(0,  0px) scale(0.75); }
    50%  { transform: translate(0, 10px) scale(0.75); }
    100%   { transform: translate(0, -0px) scale(0.75); }
}


@keyframes move-twink-back {
    from {background-position:0 0;}
    to {background-position:-10000px 5000px;}
}
@-webkit-keyframes move-twink-back {
    from {background-position:0 0;}
    to {background-position:-10000px 5000px;}
}
@-moz-keyframes move-twink-back {
    from {background-position:0 0;}
    to {background-position:-10000px 5000px;}
}
@-ms-keyframes move-twink-back {
    from {background-position:0 0;}
    to {background-position:-10000px 5000px;}
}

@keyframes move-clouds-back {
    from {background-position:0 0;}
    to {background-position:10000px 0;}
}
@-webkit-keyframes move-clouds-back {
    from {background-position:0 0;}
    to {background-position:10000px 0;}
}
@-moz-keyframes move-clouds-back {
    from {background-position:0 0;}
    to {background-position:10000px 0;}
}
@-ms-keyframes move-clouds-back {
    from {background-position: 0;}
    to {background-position:10000px 0;}
}

.stars, .twinkling, .clouds {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%;
    display:block;
    z-index: -3;
}

.stars {
    background:#000 url(../img/stars.png) repeat top center;

    z-index: -3;
}

.twinkling{
    background:transparent url(../img/twinkling.png) repeat top center;
    z-index: -2;

    -moz-animation:move-twink-back 200s linear infinite;
    -ms-animation:move-twink-back 200s linear infinite;
    -o-animation:move-twink-back 200s linear infinite;
    -webkit-animation:move-twink-back 200s linear infinite;
    animation:move-twink-back 200s linear infinite;
}

.clouds{
    background:transparent url(../img/clouds.png) repeat top center;
    z-index: -1;
    opacity: 0.0;
    -moz-animation:move-clouds-back 200s linear infinite;
    -ms-animation:move-clouds-back 200s linear infinite;
    -o-animation:move-clouds-back 200s linear infinite;
    -webkit-animation:move-clouds-back 200s linear infinite;
    animation:move-clouds-back 200s linear infinite;
    pointer-events: none;
}

.new-clouds{
    position:relative;
    top:0;
    left:0;
    height:100%;
    width:100%;
    pointer-events:none;
}
.new-clouds img{
    position:absolute;
    bottom:0;
    max-width:100%;
    animation:cloud-animate calc(2s * var(--i)) linear infinite;
}

@keyframes cloud-animate{
    0%{
        opacity:0;
        transform:scale(1);
    }
    25%, 75%{
        opacity:1;
    }
    100%{
        opacity:0;
        transform:scale(3);
    }
}

.tabs {
    position: relative;
    margin: 3rem 0;
    background: #303030;
    height: 14.75rem;
    width: 1100px;
    max-width: 95%;
}
.tabs::before,
.tabs::after {
    content: "";
    display: table;
}
.tabs::after {
    clear: both;
}
.tab {
    float: left;
    width: 20%;
}
.tab-switch {
    display: none;
}
.tab-label {
    position: relative;
    display: block;
    line-height: 2.75em;
    height: 3em;
    padding: 0 1.618em;
    background: #121212;
    border-right: 0.125rem solid #303030;
    color: #fff;
    cursor: pointer;
    top: 0;
    transition: all 0.25s;
}
.tab-label:hover {
    top: -0.25rem;
    transition: top 0.25s;
}
.tab-content {
    height: 280px;
    width: 100%;
    position: absolute;
    z-index: 1;
    top: 2.75em;
    left: 0;
    padding: 1.618rem;
    opacity: 0;
    transition: all 0.35s;
    overflow: auto;
    background-image: url(../img/background-chars.jpg);
    border-bottom: 2px solid #303030;
}
.tab-switch:checked + .tab-label {
    background: #fff;
    color: #222;
    border-bottom: 0;
    border-right: 0.125rem solid #fff;
    transition: all 0.35s;
    z-index: 1;
    top: -0.0625rem;
}
.tab-switch:checked + label + .tab-content {
    z-index: 2;
    opacity: 1;
    transition: all 0.35s;
}

.tab-image {
    position: absolute;
    z-index: 3;
    width: 120px;
    left: -55px;
    top: 120px;
}

.m-tabs {
    position: relative;
    margin: 3rem 0;
    background: #303030;
    height: 14.75rem;
    width: 1100px;
    max-width: 95%;
}
.m-tabs::before,
.m-tabs::after {
    content: "";
    display: table;
}
.m-tabs::after {
    clear: both;
}
.m-tab {
    float: left;
    width: 20%;
}
.m-tab-switch {
    display: none;
}
.m-tab-label {
    position: relative;
    display: block;
    line-height: 2.75em;
    height: 3em;
    padding: 0 1.618em;
    background: #121212;
    border-right: 0.125rem solid #303030;
    color: #fff;
    cursor: pointer;
    top: 0;
    transition: all 0.25s;
}
.m-tab-label:hover {
    top: -0.25rem;
    transition: top 0.25s;
}
.m-tab-content {
    height: 280px;
    width: 100%;
    position: absolute;
    z-index: 1;
    top: 2.75em;
    left: 0;
    padding: 1.618rem;
    opacity: 0;
    transition: all 0.35s;
    overflow: auto;
    background-image: url(../img/background-chars.jpg);
    border-bottom: 2px solid #303030;
}
.m-tab-switch:checked + .m-tab-label {
    background: #fff;
    color: #222;
    border-bottom: 0;
    border-right: 0.125rem solid #fff;
    transition: all 0.35s;
    z-index: 1;
    top: -0.0625rem;
}
.m-tab-switch:checked + label + .m-tab-content {
    z-index: 2;
    opacity: 1;
    transition: all 0.35s;
}

.m-tab-image {
    position: absolute;
    z-index: 3;
    width: 120px;
    left: -55px;
    top: 120px;
}

/* astral boat locations */


.gallery {
    --anim-time--hi: 266ms;
    --anim-time--med: 400ms;
    --anim-time--lo: 600ms;

    display: flex;
    place-content: center;
    max-width: clamp(30rem, 95%, 50rem);
    width: max(22.5rem, 100%);
    margin-top: 100px;
    margin-inline: auto;
    padding: clamp(0px, (30rem  - 100vw) * 9999, 1rem);

}

.gallery__content--flow {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.gallery__content--flow > *  {
    flex-grow: 1;
    flex-basis: calc((30rem - 100%) * 999);
}

figure {
    display: flex;
    min-width: 14rem;
    max-height: 16rem;
    position: relative;
    border-radius: .35rem;
    box-shadow:
            rgb(40, 40, 40, 0.1) 0px 2px 3px,
            rgb(20, 20, 20, 0.2) 0px 5px 8px,
            rgb(0, 0, 0, 0.25) 0px 10px 12px;
    overflow: hidden;
    transition: transform var(--anim-time--med) ease;
}

figure::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
            to top,
            hsla(0, 0%, 0%, 0.8) 0%,
            hsla(0, 0%, 0%, 0.7) 12%,
            hsla(0, 0%, 0%, 0.2) 41.6%,
            hsla(0, 0%, 0%, 0.125) 50%,
            hsla(0, 0%, 0%, 0.01) 59.9%,
            hsla(0, 0%, 0%, 0) 100%
    );
    opacity: 0;
    transition-property: opacity, transform;
    transition-duration: var(--anim-time--med), var(--anim-time--med);
    transition-timing-function: ease, ease;
    z-index: 4;
}

.header__caption {
    z-index: 10;
    position: absolute;
    display: inline-flex;
    flex-direction: column;
    align-self: flex-end;
    width: 100%;
    gap: 0.5rem;
    padding: 1rem;
    justify-content: center;
    text-align: center;
    transform: translateY(100%);
    transition: transform var(--anim-time--hi) linear,
    opacity var(--anim-time--hi) linear;
}

figure:hover::before {
    opacity: 0.8;
}

figure:hover .header__caption {
    transform: translateY(-70%);
    opacity: 1;
}
figure:hover img{
    transform: scale(1);
}
.title {
    color: #fff;

}

.title--primary {
    font-size: 1.25rem;
    color: white;
    font-family: 'MedievalSharp', cursive;
}

.gallery-image {
    display: block;
    width: 100%;
    object-fit: cover;
    object-position: center;
    height: 100%;
    transform: scale(1.15);
    aspect-ratio: 16 / 13;
    transition: 400ms ease-in-out;
}
