:root {
    --r6yellow: #fad505;
    --r6gold: #faac05;
    --r6black: #0D0D0D;
    --r6grey: #262626;
    --lightGrey: #696969;
    --r6white: #F2F2F2;
    --darkRed: #810000;
    --smallText: 1.25vw;
    --mediumText: 1.5vw;
    --largeText: 1.75vw;
    --xLargeText: 2vw;
}

@font-face {
    font-family: "Rainbow";
    src: url('../fonts/Rainbow.ttf') format('truetype');
}


* {
    padding: 0px;
    margin: 0px;
    font-family: 'Rainbow';
    font-weight: normal;
    letter-spacing: 2px;
}

a {
    text-decoration: none;
}

/* Scrollbar Styles */

/* width */
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    background: var(--r6black);
    width: 5px;
    height: 5px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--r6gold);
    width: 5px;
    height: 5px;
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: var(--r6yellow);
    width: 5px;
    height: 5px;
}

.wrapper {
    background-color: var(--r6black);
    height: 100vh;
    width: 100vw;
    overflow-x: hidden;
    /* border: 2px solid red; */
}

.wrapper2 {
    position: absolute;
    height: 100vh;
    width: 100vw;
    background: #0D0D0D;
    background-color: rgb(13, 13, 13, .80) !important;
    /* border: 2px solid red; */
}

.video-background {
    position: fixed;
    height: fit-content;
    width: 100vw;
    /* border: 2px solid red; */
}

.navbar {
    position: relative;
    height: 10%;
    width: 100%;
    background: rgb(13, 13, 13, .75);
    /* border: 2px solid red; */
}


.logo {
    position: relative;
    height: 90%;
    left: 1%;
    top: 5%;
    /* border: 2px solid blue; */
}

.center-vert-align {
    position: relative;
    height: 90%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    /* border: 2px solid red; */
}

.center-horz-align {
    position: relative;
    height: 30%;
    margin-top: -15vh;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    /* border: 2px solid blue; */
}

.centered-container {
    position: relative;
    height: 100%;
    width: 50%;
    /* border: 2px solid green; */
}

.header {
    position: relative;
    font-size: calc(((100vh + 100vw)/2)/20);
    width: 100%;
    color: var(--r6gold);
    text-align: center;
    cursor: default;
}

.paragraph {
    position: relative;
    font-size: x-large;
    max-height: 75%;
    width: 50%;
    left: 25%;
    color: var(--r6white);
    text-align: center;
    cursor: default;
    overflow-x: hidden;
    overflow-y: auto;
    /* border: 2px solid green; */
}