a {
            color: #00C6F1;
            white-space: nowrap;
        }

        body {
            min-height: 100vh;
            height: auto;
            margin: 0;
            background: #050054;
            display: flex;
            /* kills collapsible margins */
        }

        body,
        input {
            font-family: "Whitney", Arial, Helvetica, sans-serif;
            font-size: 2rem;
        }

        .content {
            max-width: 425px;
            width: 100%;
            margin: 6rem auto 0;
            text-align: center;
            color: white;
            z-index: 99;
        }

        .arrow {
            position: fixed;
        }

        .left-arrows {
            width: 25%;
            left: -3%;
            top: 0;
        }

        .right-arrow-1 {
            width: 25%;
            top: 10%;
            right: 0;
            z-index: 2;
            transform: translate(0, -30%);
        }

        .right-arrow-2 {
            width: 25%;
            right: 0;
            bottom: 0;
        }

        .refresh-arrow {
            width: 35%;
            bottom: -30%;
            left: 10%;
        }

        .logo {
            width: 10rem;
        }

        .text {
            margin: 4rem 0;
        }

        .legal {
            text-align: justify;
            font-size: 1rem;
        }

        #accept {
            width: 0.6em;
            height: 0.6em;
            float: left;
            margin-right: 0.5em;
            margin-bottom: 3.5em;
        }

        .input {
            text-align: right;
        }

        .input input {
            width: 100%;
            box-sizing: border-box;
        }


        /* DESKTOP */
        @media only screen and (min-width: 641px) {
            p.input {
                position: relative;
            }

            .input label {
                position: absolute;
                left: -95px;
            }

            .togg-logo {
                top:15px !important;
                left: 50% !important;
                right: auto !important;
                transform: translate(-50%, 0);
                width: 10rem !important;
            }

        }

        /* MOBILE */
        @media only screen and (max-width: 640px) {

            .form {
                margin: 0 0.5em;
            }

            .input {
                text-align: center;
            }

            form#signup,
            form#signup .input * {
                font-size: 80%;
            }

            .refresh-arrow {
                width: 95%;
                bottom: 10%;
                left: -40.2%;
            }

            .legal {
                margin: 0 0.5rem
            }

        }

        .errors {
            color: #FFA531;
        }

        .btn {
            background-color: #00C6F1;
            border: none;
            color: white;
            padding: 15px 42px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            border-radius: 0.2em;
            transition: 0.2s;
            cursor: pointer;
        }

        .btn:hover {
            background-color: #5de1ff;
        }

        .btn:active {
            background-color: #0072DA;
        }

        .video {
            width: 100vw;
            height: 105vh;
            position: fixed;
            z-index: -1;
        }

        video {
            width: 100%;
            height: 100%;
            object-fit: cover;
            opacity: 0.2;
        }

        .togg-logo {
            position: absolute;
            top: 5px;
            right: 8px;
            width: 100px;
            display: block;
            z-index: 99;
        }