@import url(https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap);


.carousel-cell video {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.site-embed {
    aspect-ratio: 16/9
}

.site-embed iframe, .site-embed video {
    width: 100%;
    height: 100%;
    border: 0
}

.news-item .button:after, .portfolio-item .button:after {
    background-color: #000
}

.news-item .button:hover, .portfolio-item .button:hover {
    color: #fff !important
}

html {
    background-color: #000
}

body {
    opacity: 0;
    animation: fadeIn 1s ease-out forwards
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.bg-vid {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100%;
    object-fit: cover;
    z-index: 0 !important
}

@media screen and (max-width:50rem) {
    .bg-vid {
        display: none
    }
}

.page-header {
    border-bottom: 0 !important
}

.logo-container {
    position: relative
}

.glitch-wrapper, .logo-container svg {
    max-width: 600px;
    width: 100%;
    height: auto;
    transition: .3s;
    margin: 0 auto
}

@keyframes glitch-logo {
    0% {
        opacity: 1
    }

    0.25% {
        opacity: 1
    }

    0.5% {
        opacity: 0
    }

    0.75% {
        opacity: 1
    }

    1.25% {
        opacity: 1
    }

    1.5% {
        opacity: 0
    }

    1.75% {
        opacity: 1
    }

    2% {
        opacity: 1
    }

    2.5% {
        opacity: 0
    }

    3% {
        opacity: 1
    }

    3.5% {
        opacity: 1
    }

    4% {
        opacity: 0
    }

    4.5% {
        opacity: 1
    }

    5% {
        opacity: 1
    }

    5.5% {
        opacity: 0
    }

    6% {
        opacity: 1
    }

    8% {
        opacity: 1
    }

    8.5% {
        opacity: 0
    }

    9% {
        opacity: 1
    }

    13.5% {
        opacity: 1
    }

    14% {
        opacity: 0
    }

    14.5% {
        opacity: 1
    }

    17% {
        opacity: 1
    }

    17.5% {
        opacity: 0
    }

    18% {
        opacity: 1
    }

    100% {
        opacity: 1
    }
}

@keyframes glitch-01 {
    0% {
        opacity: 0
    }

    0.25% {
        opacity: 0
    }

    0.5% {
        opacity: 1
    }

    0.75% {
        opacity: 0
    }

    1.25% {
        opacity: 0
    }

    1.5% {
        opacity: 1
    }

    1.75% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@keyframes glitch-02 {
    0% {
        opacity: 0
    }

    8% {
        opacity: 0
    }

    8.5% {
        opacity: 1
    }

    9% {
        opacity: 0
    }

    13.5% {
        opacity: 0
    }

    14% {
        opacity: 1
    }

    14.5% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@keyframes glitch-03 {
    0% {
        opacity: 0
    }

    2% {
        opacity: 0
    }

    2.5% {
        opacity: 1
    }

    3% {
        opacity: 0
    }

    3.5% {
        opacity: 0
    }

    4% {
        opacity: 1
    }

    4.5% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@keyframes glitch-04 {
    0% {
        opacity: 0
    }

    5% {
        opacity: 0
    }

    5.5% {
        opacity: 1
    }

    6% {
        opacity: 0
    }

    17% {
        opacity: 0
    }

    17.5% {
        opacity: 1
    }

    18% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

.glitch-container {
    position: relative;
    animation: 6s glitch-logo .5s linear infinite both
}

.glitch-01 {
    animation: 6s glitch-01 .5s linear infinite both
}

.glitch-02 {
    animation: 6s glitch-02 .5s linear infinite both
}

.glitch-03 {
    animation: 6s glitch-03 .5s linear infinite both
}

.glitch-04 {
    animation: 6s glitch-04 .5s linear infinite both
}