body,html {
    padding: 0;
    margin: 0;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
    overflow: hidden
}

#__next,body,html {
    height: 100%;
    max-height: 100%
}

a {
    color: inherit;
    text-decoration: none
}

* {
    box-sizing: border-box
}

.hide-scrollbar {
    scrollbar-width: none;
    -ms-overflow-style: none
}

.hide-scrollbar::-webkit-scrollbar {
    display: none
}

::-webkit-scrollbar {
    width: 6px;
    height: 0
}

::-webkit-scrollbar-thumb:hover {
    background-color: #747691
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: rgba(116,118,145,.5);
    border: 1px solid transparent
}

::-webkit-scrollbar-track {
    background: rgba(116,118,145,.1)
}

.pointer-events-auto * {
    pointer-events: auto!important
}

.grecaptcha-badge {
    visibility: hidden!important
}

@keyframes green-flash-light {
    0% {
        background-color: var(--chakra-colors-green-500);
        backround-image: none
    }

    to {
        background-color: transparent
    }
}

@keyframes purple-flash-light {
    0% {
        background-color: var(--chakra-colors-purple-500);
        backround-image: none
    }

    to {
        background-color: transparent
    }
}

@keyframes red-flash-light {
    0% {
        background-color: var(--chakra-colors-red-500)
    }

    to {
        background-color: transparent
    }
}

@keyframes orange-flash-light {
    0% {
        background-color: var(--chakra-colors-orange-500)
    }

    to {
        background-color: transparent
    }
}

.green-flash-light {
    animation: green-flash-light .5s ease 0s 1 alternate
}

.red-flash-light {
    animation: red-flash-light .5s ease 0s 1 alternate
}

.orange-flash-light {
    animation: orange-flash-light .5s ease 0s 1 alternate
}

.purple-flash-light {
    animation: purple-flash-light .5s ease 0s 1 alternate
}

@keyframes green-flash-dark {
    0% {
        background-color: var(--chakra-colors-green-200);
        backround-image: none
    }

    to {
        background-color: transparent
    }
}

@keyframes purple-flash-dark {
    0% {
        background-color: var(--chakra-colors-purple-200);
        backround-image: none
    }

    to {
        background-color: transparent
    }
}

@keyframes red-flash-dark {
    0% {
        background-color: var(--chakra-colors-red-200)
    }

    to {
        background-color: transparent
    }
}

@keyframes orange-flash-dark {
    0% {
        background-color: var(--chakra-colors-orange-200)
    }

    to {
        background-color: transparent
    }
}

.green-flash-dark {
    animation: green-flash-dark .5s ease 0s 1 alternate
}

.red-flash-dark {
    animation: red-flash-dark .5s ease 0s 1 alternate
}

.orange-flash-dark {
    animation: orange-flash-dark .5s ease 0s 1 alternate
}

.purple-flash-dark {
    animation: purple-flash-dark .5s ease 0s 1 alternate
}

.rotate_icon {
    animation: spin 1.5s linear infinite
}

dialog:modal {
    max-width: 100%;
    max-height: 100%;
    background: rgba(0,0,0,.75);
    color: var(--chakra-colors-gray-800)
}

.wallet-button-override {
    font-family: cpmono,monospace!important;
    height: 32px!important;
    font-size: var(--chakra-fontSizes-sm)!important;
    font-weight: 700;
    border-radius: 5px!important;
    padding: 0 12px!important
}

.wallet-button-override-dark {
    background-color: var(--chakra-colors-blue-200)!important;
    color: #000!important
}

.wallet-button-override-dark:not([disabled]):hover {
    background-color: var(--chakra-colors-blue-300)!important;
    color: #000!important
}

.wallet-button-override-light {
    background-color: var(--chakra-colors-blue-500)!important;
    color: #fff!important
}

.wallet-button-override-light:not([disabled]):hover {
    background-color: var(--chakra-colors-blue-600)!important;
    color: #fff!important
}

.wallet-button-small {
    font-size: 12px!important
}

.wallet-button-small>.wallet-adapter-button-start-icon {
    margin: 0!important
}

.pulse-green-class {
    box-shadow: 0 0 0 0 #45f1a6;
    transform: scale(1);
    animation: pulse-green 2s infinite
}

@keyframes pulse-green {
    0% {
        transform: scale(.95);
        box-shadow: 0 0 0 0 rgba(69,241,166,.7)
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(69,241,166,0)
    }

    to {
        transform: scale(.95);
        box-shadow: 0 0 0 0 rgba(69,241,166,0)
    }
}

.pulse-yellow-class {
    box-shadow: 0 0 0 0 #fdd38c;
    transform: scale(1);
    animation: pulse-yellow 2s infinite
}

@keyframes pulse-yellow {
    0% {
        transform: scale(.95);
        box-shadow: 0 0 0 0 hsla(38,97%,77%,.7)
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px hsla(38,97%,77%,0)
    }

    to {
        transform: scale(.95);
        box-shadow: 0 0 0 0 hsla(38,97%,77%,0)
    }
}

:focus {
    box-shadow: none!important
}

.disable-text-highlight {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none
}

@font-face {
    font-family: cpmono;
    font-weight: 400;
    src: url(/fonts/cpmono.otf)
}

@font-face {
    font-family: cpmono;
    font-weight: 700;
    src: url(/fonts/cpmono_bold.otf)
}

.animated-border-box,.animated-border-box-glow {
    max-height: 200px;
    max-width: 200px;
    height: 100%;
    width: 100%;
    position: absolute;
    overflow: hidden;
    z-index: 0;
    transform: rotateY(0deg) rotate(45deg)
}

.animated-border-box-glow {
    overflow: hidden;
    filter: blur(30px)
}

.animated-border-box-glow:before,.animated-border-box:before {
    content: "";
    z-index: -2;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) rotate(0deg);
    position: absolute;
    width: 99999px;
    height: 99999px;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-image: conic-gradient(transparent 75%,#35cdf8);
    animation: rotate 4s linear infinite
}

.animated-border-box:after {
    content: "";
    position: absolute;
    z-index: -1;
    left: 5px;
    top: 5px;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    background: #000
}

@keyframes rotate {
    to {
        transform: translate(-50%,-50%) rotate(1turn)
    }
}

.blink_me {
    animation: blinker 2s linear infinite
}

@keyframes blinker {
    50% {
        opacity: 0
    }
}

.gradual_scale {
    -webkit-transition: transform .2s ease-in-out
}

.gradient-hover-effect {
    background-image: linear-gradient(270deg,#ff2ed4 0,#842eff);
    padding: 5px 10px;
    text-align: center;
    text-transform: uppercase;
    transition: .5s;
    background-size: 200% auto;
    color: #000;
    display: block;
    color: #fff
}

.gradient-hover-effect:hover {
    background-position: 100%;
    text-decoration: none;
    color: #fff
}

.embla {
    overflow: hidden
}

.embla__container {
    display: flex
}

.embla__slide {
    flex: 0 0 100%;
    min-width: 0
}

.glitch_image {
    position: relative;
    overflow: hidden
}

.glitch_image img {
    position: relative;
    z-index: 1;
    display: block
}

.glitch_image__layers {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

.glitch_image__layer {
    background-image: url(https://public-cdn.tensor.trade/collection_splash/pepe_curious2.png)
}

.glitch_image__layer,.glitch_image_tensorians__layer {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-repeat: no-repeat;
    background-position: 0 0
}

.glitch_image_tensorians__layer {
    background-image: url(https://public-cdn.tensor.trade/collection_splash/s2_end.png)
}

.glitch_image__layer:first-child {
    transform: translateX(-5%);
    animation: glitch-anim-1 2s linear infinite alternate
}

.glitch_image__layer:nth-child(2) {
    transform: translateX(3%) translateY(3%);
    animation: glitch-anim-2 2.3s linear -.8s infinite alternate
}

.glitch_image__layer:nth-child(3) {
    transform: translateX(5%);
    animation: glitch-anim-flash 1s linear infinite
}

@keyframes glitch-anim-1 {
    0% {
        -webkit-clip-path: polygon(0 0,100% 0,100% 5%,0 5%);
        clip-path: polygon(0 0,100% 0,100% 5%,0 5%)
    }

    10% {
        -webkit-clip-path: polygon(0 15%,100% 15%,100% 15%,0 15%);
        clip-path: polygon(0 15%,100% 15%,100% 15%,0 15%)
    }

    20% {
        -webkit-clip-path: polygon(0 10%,100% 10%,100% 20%,0 20%);
        clip-path: polygon(0 10%,100% 10%,100% 20%,0 20%)
    }

    30% {
        -webkit-clip-path: polygon(0 1%,100% 1%,100% 2%,0 2%);
        clip-path: polygon(0 1%,100% 1%,100% 2%,0 2%)
    }

    40% {
        -webkit-clip-path: polygon(0 35%,100% 35%,100% 35%,0 35%);
        clip-path: polygon(0 35%,100% 35%,100% 35%,0 35%)
    }

    50% {
        -webkit-clip-path: polygon(0 45%,100% 45%,100% 46%,0 46%);
        clip-path: polygon(0 45%,100% 45%,100% 46%,0 46%)
    }

    60% {
        -webkit-clip-path: polygon(0 50%,100% 50%,100% 70%,0 70%);
        clip-path: polygon(0 50%,100% 50%,100% 70%,0 70%)
    }

    70% {
        -webkit-clip-path: polygon(0 70%,100% 70%,100% 70%,0 70%);
        clip-path: polygon(0 70%,100% 70%,100% 70%,0 70%)
    }

    80% {
        -webkit-clip-path: polygon(0 80%,100% 80%,100% 80%,0 80%);
        clip-path: polygon(0 80%,100% 80%,100% 80%,0 80%)
    }

    90% {
        -webkit-clip-path: polygon(0 50%,100% 50%,100% 55%,0 55%);
        clip-path: polygon(0 50%,100% 50%,100% 55%,0 55%)
    }

    to {
        -webkit-clip-path: polygon(0 60%,100% 60%,100% 70%,0 70%);
        clip-path: polygon(0 60%,100% 60%,100% 70%,0 70%)
    }
}

@keyframes glitch-anim-2 {
    0% {
        -webkit-clip-path: polygon(0 15%,100% 15%,100% 30%,0 30%);
        clip-path: polygon(0 15%,100% 15%,100% 30%,0 30%)
    }

    15% {
        -webkit-clip-path: polygon(0 3%,100% 3%,100% 3%,0 3%);
        clip-path: polygon(0 3%,100% 3%,100% 3%,0 3%)
    }

    25% {
        -webkit-clip-path: polygon(0 8%,100% 8%,100% 20%,0 20%);
        clip-path: polygon(0 8%,100% 8%,100% 20%,0 20%)
    }

    30% {
        -webkit-clip-path: polygon(0 20%,100% 20%,100% 20%,0 20%);
        clip-path: polygon(0 20%,100% 20%,100% 20%,0 20%)
    }

    45% {
        -webkit-clip-path: polygon(0 45%,100% 45%,100% 45%,0 45%);
        clip-path: polygon(0 45%,100% 45%,100% 45%,0 45%)
    }

    50% {
        -webkit-clip-path: polygon(0 50%,100% 50%,100% 57%,0 57%);
        clip-path: polygon(0 50%,100% 50%,100% 57%,0 57%)
    }

    65% {
        -webkit-clip-path: polygon(0 60%,100% 60%,100% 60%,0 60%);
        clip-path: polygon(0 60%,100% 60%,100% 60%,0 60%)
    }

    75% {
        -webkit-clip-path: polygon(0 80%,100% 80%,100% 80%,0 80%);
        clip-path: polygon(0 80%,100% 80%,100% 80%,0 80%)
    }

    80% {
        -webkit-clip-path: polygon(0 40%,100% 40%,100% 60%,0 60%);
        clip-path: polygon(0 40%,100% 40%,100% 60%,0 60%)
    }

    95% {
        -webkit-clip-path: polygon(0 45%,100% 45%,100% 60%,0 60%);
        clip-path: polygon(0 45%,100% 45%,100% 60%,0 60%)
    }

    to {
        -webkit-clip-path: polygon(0 11%,100% 11%,100% 15%,0 15%);
        clip-path: polygon(0 11%,100% 11%,100% 15%,0 15%)
    }
}

@keyframes glitch-anim-flash {
    0% {
        opacity: .2
    }

    30%,to {
        opacity: 0
    }
}

.dialect {
    font-family: var(--chakra-fonts-body)!important
}

.dt-bg-black {
    background: #111314!important
}

.dt-bg-accent {
    background: var(--chakra-colors-blue-200)!important;
    box-shadow: 0 0 0 var(--chakra-colors-blue-200)
}

.dialect-bell-button {
    border-width: 0;
    height: var(--chakra-sizes-8);
    min-width: var(--chakra-sizes-8)
}

.dialect-bell-button-lite {
    border-width: 0;
    height: var(--chakra-sizes-8)!important;
    min-width: var(--chakra-sizes-8)!important
}

.dialect-bell-button {
    transition-property: var(--chakra-transition-property-common);
    transition-duration: var(--chakra-transition-duration-normal)
}

.dialect-bell-button button {
    transition: none;
    opacity: 1!important
}

.dialect-bell-button svg {
    height: 1.2em;
    width: 1.2em
}

.dialect-bell-button-dark {
    color: #fff;
    background: var(--chakra-colors-gray-800)!important
}

.dialect-bell-button-dark,.dialect-bell-button-light {
    border-width: 0;
    border-radius: 5px!important;
    box-shadow: none!important
}

.dialect-bell-button-light {
    color: #000;
    background: var(--chakra-colors-gray-100)!important
}

.dialect-bell-button-active.dialect-bell-button-dark,.dialect-bell-button-dark:hover {
    color: #111314;
    background: var(--chakra-colors-blue-200)!important;
    box-shadow: none!important
}

.dialect-bell-button-active.dialect-bell-button-light,.dialect-bell-button-light:hover {
    color: #f0f2f4;
    background: var(--chakra-colors-blue-500)!important;
    box-shadow: none!important
}

.dialect-notification-modal-dark {
    border-color: var(--chakra-colors-gray-800)!important;
    border-radius: 5px!important;
    border-width: 1px;
    background: #111314!important;
    filter: drop-shadow(gray 0 0 5px);
    z-index: 999999!important
}

.dialect-notification-modal-light {
    border-color: var(--chakra-colors-gray-100)!important;
    border-radius: 5px!important;
    border-width: 1px;
    background: #f0f2f4!important;
    filter: drop-shadow(gray 0 0 5px);
    z-index: 999999!important
}

@media only screen and (min-width: 640px) {
    .dialect-notification-modal-wrapper {
        top:3rem!important
    }
}

@media only screen and (max-width: 640px) {
    .dialect-bell-button,.dialect-bell-button-active,.dialect-bell-button:hover {
        border:none;
        box-shadow: none
    }

    .dialect-bell-button svg {
        height: 1.2em;
        width: 1.2em
    }
}

.fade-list-item {
    opacity: 0;
    animation-name: fadein;
    animation-duration: 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards
}

@keyframes fadein {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.tensorian-font {
    font-family: simplipixa,cpmono,monospace!important
}

.image-container {
    position: relative;
    display: inline-block
}

.image-container:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,255,.3);
    mix-blend-mode: multiply
}

button.xmint-btn {
    border-radius: 5px;
    width: 100%;
    height: 100%;
    box-shadow: none!important
}

button.xmint-btn-dark {
    background-color: rgba(43,51,59,.5);
    border: 0 solid var(--chakra-colors-gray-800);
    box-shadow: none!important
}

button.xmint-btn-light {
    background-color: rgba(187,196,205,.5);
    border: 0 solid var(--chakra-colors-gray-200);
    box-shadow: none!important
}

button.xmint-btn img {
    width: 15px;
    height: 15px
}

button.xmint-btn.hide-logo img {
    display: none
}

button.xmint-btn span {
    font-size: .875rem!important;
    font-weight: 600!important;
    font-family: var(--chakra-fonts-body)
}

button.xmint-btn-dark span {
    color: #fff
}

button.xmint-btn-light span {
    color: #000
}

#nft-model-viewer {
    width: 100%;
    height: auto;
    aspect-ratio: 1/1
}

@keyframes glow {
    0% {
        box-shadow: 0 0 0 #ef103d;
        color: #fff
    }

    12% {
        box-shadow: 0 0 5px #ef103d,0 0 10px #ef103d,0 0 15px #ef103d,0 0 20px #ef103d;
        color: #ef103d
    }

    25% {
        box-shadow: 0 0 0 #0087ff;
        color: #fff
    }

    37% {
        box-shadow: 0 0 5px #0087ff,0 0 10px #0087ff,0 0 15px #0087ff,0 0 20px #0087ff;
        color: #0087ff
    }

    50% {
        box-shadow: 0 0 0 #3cf20e;
        color: #fff
    }

    62% {
        box-shadow: 0 0 5px #3cf20e,0 0 10px #3cf20e,0 0 15px #3cf20e,0 0 20px #3cf20e;
        color: #3cf20e
    }

    75% {
        box-shadow: 0 0 0 #9d00ff;
        color: #fff
    }

    87% {
        box-shadow: 0 0 5px #9d00ff,0 0 10px #9d00ff,0 0 15px #9d00ff,0 0 20px #9d00ff;
        color: #9d00ff
    }

    to {
        box-shadow: 0 0 0 #9d00ff;
        color: #fff
    }
}

.glow-button {
    animation: glow 8s infinite
}

@keyframes blink {
    0% {
        border-color: transparent
    }

    50% {
        border-color: #ff0
    }

    to {
        border-color: transparent
    }
}

.blinking-border {
    border: 2px solid transparent;
    animation: blink 2s infinite
}

.card {
    perspective: 150rem;
    position: relative
}

.card-side {
    transition: all .8s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    righ: 0;
    bottom: 0
}

.card-side.back {
    transform: rotateY(-180deg)
}

.card:hover .card-side.front {
    transform: rotateY(180deg)
}

.card-side.back-animated {
    animation: card-rotate-back 2s infinite
}

.card:hover .card-side.back {
    transform: rotateY(0deg)
}

.card-side.front-animated {
    animation: card-rotate-front 2s infinite
}

@keyframes card-rotate-front {
    0% {
        transform: rotateY(0deg)
    }

    to {
        transform: rotateY(1turn)
    }
}

@keyframes card-rotate-back {
    0% {
        transform: rotateY(-180deg)
    }

    to {
        transform: rotateY(180deg)
    }
}

@font-face {
    font-family: starborn;
    font-weight: 700;
    src: url(/fonts/starborn.ttf)
}

.svgWrap__text {
    position: absolute;
    top: 0;
    left: 0
}

.svgWrap__text:nth-child(2),.svgWrap__text:nth-child(3) {
    clip: rect(0,0,0,0)
}

.svgWrap__text:nth-child(2) {
    fill: snow;
    left: -2px;
    animation: svg-glitch-effect 20s linear infinite alternate-reverse
}

.svgWrap__text:nth-child(3) {
    fill: #f5f5f5;
    left: 2px;
    animation: svg-glitch-effect 22s linear infinite alternate-reverse
}

@keyframes svg-glitch-effect {
    0% {
        clip: rect(79px,1000px,4px,0)
    }

    5% {
        clip: rect(28px,1000px,34px,0)
    }

    10% {
        clip: rect(3px,1000px,31px,0)
    }

    15% {
        clip: rect(52px,1000px,37px,0)
    }

    20% {
        clip: rect(12px,1000px,248px,0)
    }

    25% {
        clip: rect(33px,1000px,99px,0)
    }

    30% {
        clip: rect(62px,1000px,200px,0)
    }

    35% {
        clip: rect(99px,1000px,10px,0)
    }

    40% {
        clip: rect(75px,1000px,191px,0)
    }

    45% {
        clip: rect(20px,1000px,180px,0)
    }

    50% {
        clip: rect(5px,1000px,75px,0)
    }

    55% {
        clip: rect(90px,1000px,134px,0)
    }

    60% {
        clip: rect(88px,1000px,66px,0)
    }

    65% {
        clip: rect(56px,1000px,163px,0)
    }

    70% {
        clip: rect(80px,1000px,1px,0)
    }

    75% {
        clip: rect(59px,1000px,87px,0)
    }

    80% {
        clip: rect(11px,1000px,102px,0)
    }

    85% {
        clip: rect(8px,1000px,48px,0)
    }

    90% {
        clip: rect(75px,1000px,27px,0)
    }

    95% {
        clip: rect(4px,1000px,213px,0)
    }

    to {
        clip: rect(84px,1000px,59px,0)
    }
}

.filterwrapper {
    position: absolute;
    z-index: -1;
    pointer-events: none;
    opacity: 0
}

.svgtext {
    display: block;
    position: relative;
    overflow: hidden;
    margin: 0 auto
}

.intro {
    margin-bottom: 3em
}

hr {
    height: 0;
    border-bottom: 1px solid #ccc
}

.glitch-filter-example {
    display: block;
    position: relative;
    text-align: center;
    margin: 0;
    padding: 4em 0 2em;
    min-width: 490px
}

.glitch-filter-example__heading {
    margin: 0 0 1em;
    padding: 0;
    display: block;
    position: relative
}

.glitch-filter-example__filtered-text {
    filter: url(#filter);
    fill: #fff;
    font-family: Share Tech Mono,sans-serif;
    font-size: 100px;
    text-align: center;
    margin: 0;
    padding: 0;
    display: block
}

.bot-g,.bot-r,.top-g,.top-r {
    stroke: #fff
}

.top-r {
    animation: topani 3.5s linear infinite
}

.bot-r,.top-r {
    stroke-width: 100px
}

.bot-r {
    animation: botani 4s linear infinite
}

.top-g {
    stroke-width: 50px;
    animation: topani 4s linear infinite reverse
}

.bot-g {
    stroke-width: 50%;
    animation: botani 3.5s linear infinite reverse
}

@keyframes topani {
    9% {
        stroke-width: 167px
    }

    14% {
        stroke-width: 106px
    }

    29% {
        stroke-width: 121px
    }

    46% {
        stroke-width: 168px
    }

    66% {
        stroke-width: 78px
    }

    73% {
        stroke-width: 143px
    }

    89% {
        stroke-width: 27px
    }
}

@keyframes botani {
    11% {
        stroke-width: 112px
    }

    25% {
        stroke-width: 9px
    }

    30% {
        stroke-width: 112px
    }

    40% {
        stroke-width: 154px
    }

    56% {
        stroke-width: 10px
    }

    72% {
        stroke-width: 168px
    }

    80% {
        stroke-width: 53px
    }

    98% {
        stroke-width: 5px
    }
}

.wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

.glitch {
    white-space: normal;
    color: #fff;
    position: relative;
    font-size: 100px;
    padding: 30px
}

.glitch:after,.glitch:before {
    padding: 30px;
    color: #fff;
    content: "Airdrop";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #111314;
    overflow: hidden;
    top: 0
}

.glitch:before {
    left: 3px;
    text-shadow: -2px 0 red;
    animation-name: glitch-animation-1;
    animation-duration: 20s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: reverse-alternate
}

.glitch:after {
    left: -3px;
    text-shadow: -2px 0 blue;
    animation-name: glitch-animation-2;
    animation-duration: 20s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: reverse-alternate
}

@keyframes glitch-animation-1 {
    0% {
        clip: rect(148px,350px,3px,30px)
    }

    5% {
        clip: rect(6px,350px,82px,30px)
    }

    10% {
        clip: rect(113px,350px,16px,30px)
    }

    15% {
        clip: rect(72px,350px,103px,30px)
    }

    20% {
        clip: rect(45px,350px,94px,30px)
    }

    25% {
        clip: rect(29px,350px,96px,30px)
    }

    30% {
        clip: rect(110px,350px,148px,30px)
    }

    35% {
        clip: rect(93px,350px,16px,30px)
    }

    40% {
        clip: rect(38px,350px,83px,30px)
    }

    45% {
        clip: rect(19px,350px,18px,30px)
    }

    50% {
        clip: rect(59px,350px,121px,30px)
    }

    55% {
        clip: rect(127px,350px,91px,30px)
    }

    60% {
        clip: rect(6px,350px,126px,30px)
    }

    65% {
        clip: rect(144px,350px,65px,30px)
    }

    70% {
        clip: rect(95px,350px,113px,30px)
    }

    75% {
        clip: rect(51px,350px,143px,30px)
    }

    80% {
        clip: rect(73px,350px,118px,30px)
    }

    85% {
        clip: rect(89px,350px,122px,30px)
    }

    90% {
        clip: rect(124px,350px,101px,30px)
    }

    95% {
        clip: rect(45px,350px,44px,30px)
    }

    to {
        clip: rect(143px,350px,119px,30px)
    }
}

@keyframes glitch-animation-2 {
    0% {
        clip: rect(5px,350px,107px,30px)
    }

    5% {
        clip: rect(52px,350px,149px,30px)
    }

    10% {
        clip: rect(71px,350px,48px,30px)
    }

    15% {
        clip: rect(13px,350px,64px,30px)
    }

    20% {
        clip: rect(104px,350px,102px,30px)
    }

    25% {
        clip: rect(93px,350px,119px,30px)
    }

    30% {
        clip: rect(66px,350px,93px,30px)
    }

    35% {
        clip: rect(83px,350px,2px,30px)
    }

    40% {
        clip: rect(18px,350px,13px,30px)
    }

    45% {
        clip: rect(127px,350px,45px,30px)
    }

    50% {
        clip: rect(136px,350px,99px,30px)
    }

    55% {
        clip: rect(30px,350px,49px,30px)
    }

    60% {
        clip: rect(61px,350px,36px,30px)
    }

    65% {
        clip: rect(129px,350px,42px,30px)
    }

    70% {
        clip: rect(97px,350px,149px,30px)
    }

    75% {
        clip: rect(82px,350px,95px,30px)
    }

    80% {
        clip: rect(92px,350px,76px,30px)
    }

    85% {
        clip: rect(22px,350px,96px,30px)
    }

    90% {
        clip: rect(79px,350px,97px,30px)
    }

    95% {
        clip: rect(16px,350px,49px,30px)
    }

    to {
        clip: rect(76px,350px,19px,30px)
    }
}