@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,700&display=swap');
@media (max-width: 743px) {
    html {
        position: relative;
        min-height: 100%;
        max-width: 100vw;
        color: #cdcdcd;
        background-color: black;
        width: 100%;
        height: 100%;
        margin: 0px;
        padding: 0px;
        /*overflow:hidden;*/
        overflow-y: scroll;
        overflow-x: hidden;
    }

    @media (min-width: 768px) {
        html {
            background-color: black;
        }
    }

    body {
        background-color: black;
        font-family: 'Raleway' !important;
    }








    .logo {
        background-image: url('/Images/Color logo - no background (50pc).png');
        background-size: 100%;
        background-repeat: no-repeat;
        width: 41vw;
        height: 11vw;
        position: absolute;
        /* left: 0; */
        right: 2%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        top: 1%;
    }




    /*scroll bar*/
    ::-webkit-scrollbar {
        width: 10px;
        background-color: #f5f5f5;
    }

    ::-webkit-scrollbar-track {
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.1);
        border: 1px solid #ccc;
    }

    ::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background: #a19f9f;
        border: 1px solid #575656;
    }

        ::-webkit-scrollbar-thumb:hover {
            background: black;
            cursor: pointer !important;
        }

        ::-webkit-scrollbar-thumb:active {
            background: linear-gradient(left, #22add4, #1e98ba);
        }




    /*start of menu CSS*/

    #menuToggle {
        display: block;
        position: fixed;
        top: 16px;
        left: 16px;
        z-index: 1;
        -webkit-user-select: none;
        user-select: none;
    }

        #menuToggle a {
            text-decoration: none;
            color: #232323;
            transition: color 0.3s ease;
        }

            #menuToggle a:hover {
                color: tomato;
            }


        #menuToggle input {
            display: block;
            width: 40px;
            height: 32px;
            position: absolute;
            top: -7px;
            left: -5px;
            cursor: pointer;
            opacity: 0;
            z-index: 2;
            -webkit-touch-callout: none;
        }

        #menuToggle span {
            display: block;
            width: 7vw;
            height: 4px;
            margin-bottom: 5px;
            position: relative;
            background: #cdcdcd;
            border-radius: 3px;
            z-index: 1;
            transform-origin: 4px 0px;
            transition: all 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }

            #menuToggle span:first-child {
                transform-origin: 0% 0%;
            }

            #menuToggle span:nth-last-child(2) {
                transform-origin: 0% 100%;
            }
        /*      //checked// */
        #menuToggle input:checked ~ span {
            transform: rotate(45deg) translate(0.5vw, -0.3vw);
        }

            #menuToggle input:checked ~ span:nth-last-child(2) {
                visibility: hidden;
                opacity: 0;
                transition: all 0ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
            }

            #menuToggle input:checked ~ span:nth-last-child(3) {
                transform: rotate(-45deg) translate(-1vw, 1vw);
            }


    /*//end//*/
    #menu {
        position: absolute;
        left: -17px;
        top: -17px;
        height: 100vh;
        width: 230px;
        /*margin: 0px -100px 0 0px;*/
        padding: 50px;
        /*padding-top: 125px;*/
        background: rgba(0,0,0,0.4);
        backdrop-filter: blur(1px);
        list-style-type: none;
        -webkit-font-smoothing: antialiased;
        /* to stop flickering of text in safari */
        transform-origin: 0% 0%;
        transform: translate( -100%, 0%);
        transition: transform 0s cubic-bezier(0.77,0.2,0.05,1.0);
        /*    transform: translate( -100%, 0%);
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);*/
        transition-delay: 0s;
    }

        #menu li {
            padding: 0px 0;
            display: block;
            height: 50px;
            margin-left: -35px;
        }

            #menu li span {
                background: -webkit-linear-gradient(white, whitesmoke);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                font-weight: 600;
                font-size: 15px;
                height: 40px;
                width: 200px;
                text-align: left;
                margin-bottom: 0;
                margin-top: 17px;
                cursor: pointer;
                margin-left: 0px;
            }

                #menu li span:hover {
                    text-shadow: 0px 0px 1px #fff, 0px 0px 1px #0aa3be;
                }

    #menuToggle input:checked ~ ul {
        /*transform: none;*/
        transform: translate( 0%, 0%);
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    }
    /*#menuToggle input:hover ~ ul {
    transform: none;
}*/
    /*#menu:hover {
    transform: none;
}
*/
    #menuToggle input:not(:hover) ~ ul {
        /*transform: none;*/
        /*transition-delay: 2s;*/
    }

    /*end of menu CSS*/






    /*Pages CSS*/

    .PageFiller {
        width: 100vw;
        height: 20vw;
    }

    .lazy-background {
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        min-height: 300px; /* or whatever is appropriate */
        width: 100%;
    }

    .Page1 {
        background-image: url(/Images/page1-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 180vw;
    }

    .Page2 {
        background-image: url(/Images/page2-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 140vw;
        background-position: center;
    }

        .Page2 .text {
            position: relative;
            width: 47vw;
            left: 7vw;
            top: 43vw;
            font-size: 3vw;
            color: white;
            text-align: left;
        }

        .Page2 .text2 {
            position: relative;
            width: 57vw;
            left: 11vw;
            top: 65vw;
            font-size: 3vw;
            color: white;
            text-align: right;
        }

    .Page3 {
        background-image: url(/Images/page3-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 210vw;
        background-position: center;
    }

        .Page3 .text {
            position: relative;
            width: 43vw;
            left: 45vw;
            top: 21vw;
            font-size: 2.7vw;
            color: white;
            text-align: right;
            font-weight: 500;
            letter-spacing: 0.3px;
        }

        .Page3 .text2 {
            position: relative;
            width: 43vw;
            left: 25vw;
            top: 68vw;
            font-size: 2.7vw;
            color: white;
            text-align: left;
            letter-spacing: 0.3px;
            font-weight: 500;
        }

    .Page4 {
        background-image: url(/Images/page4-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        /*min-height: 180vw;*/
        min-height: 215vw;
        background-position: center;
    }

        .Page4 .text {
            position: relative;
            width: 53vw;
            left: 43vw;
            top: 30vw;
            font-size: 3vw;
            color: white;
            text-align: right;
            font-weight: 700;
        }

        .Page4 .text2 {
            position: relative;
            width: 48vw;
            left: 48vw;
            top: 35vw;
            font-size: 3vw;
            color: white;
            text-align: right;
        }

        .Page4 .text3 {
            position: relative;
            width: 53vw;
            left: 43vw;
            top: 40vw;
            font-size: 3vw;
            color: white;
            text-align: right;
        }


    .Page5 {
        background-image: url(/Images/page5-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 175vw;
        margin-bottom: 6vw;
        background-position: center;
    }

        .Page5 .text {
            position: relative;
            width: 46vw;
            left: 3vw;
            top: 3vw;
            font-size: 3vw;
            color: white;
            text-align: left;
        }

    .Page5-1 {
        background-image: url(/Images/page5-1-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 160vw;
        margin-top: 9vw;
        background-position: center;
    }

        .Page5-1 .text {
            position: relative;
            width: 48vw;
            left: 48vw;
            top: -11vw;
            font-size: 3vw;
            color: white;
            text-align: right;
        }

    .Page5-2 {
        background-image: url(/Images/page5-2-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 167vw;
        background-position: center;
    }

        .Page5-2 .text {
            position: relative;
            width: 40vw;
            left: 2.8vw;
            top: -15vw;
            font-size: 3vw;
            color: white;
            text-align: left;
        }

    .Page5-3 {
        background-image: url(/Images/Chat-GPT-page-mobile.jpeg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 160vw;
        background-position: center;
    }

        .Page5-3 .text {
            position: relative;
            width: 41vw;
            left: 55.5vw;
            top: 4vw;
            font-size: 3vw;
            color: white;
            text-align: right;
        }

    .Page6 {
        background-image: url(/Images/page6-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 170vw;
        background-position: center;
    }

    .Page7 {
        background-image: url(/Images/page7-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 280vw;
        background-position: center;
    }

    .Page8 {
        background-image: url(/Images/page8-mobile.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        min-height: 135vw;
        background-position: center;
    }


    /*.Page4 .text {
    position: relative;
    width:35vw;
    left: 60vw;
    top: 13vw;
    font-size: 1.3vw;
    color: white;
    text-align: right;
}*/



    /*//title CSS//*/


    .type {
        font-size: 6.9vw;
        /* letter-spacing: 4px; */
        /* font-weight: 800; */
        color: white;
        position: absolute;
        left: 28vw;
        top: 43vw;
        font-weight: 800;
    }

    .type2 {
        font-size: 9.5vw;
        /* letter-spacing: 4px; */
        /* font-weight: 800; */
        color: white;
        position: absolute;
        left: 23vw;
        top: 55vw;
        font-weight: 800;
    }


    .type3 {
        font-size: 9vw;
        letter-spacing: 4px;
        /* font-weight: 900; */
        color: white;
        position: absolute;
        left: 36vw;
        font-weight: 900;
        top: 55vw;
        text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white, -1px -1px white, 1px 1px white, -1px 1px white, 1px -1px white;
    }

    .type4 {
        font-size: 4.5vw;
        letter-spacing: 1px;
        color: white;
        position: absolute;
        left: 24vw;
        top: 96.5vw;
    }


        .type > span, .type2 > span, .type3 > span, .type4 > span {
            border-right: .05em solid;
            animation: caret 1s steps(1) infinite;
        }

    @keyframes caret {
        50% {
            border-color: transparent;
        }
    }



    /*//title CSS mobile//*/


    .type21 {
        font-size: 8vw;
        /* letter-spacing: 4px; */
        /* font-weight: 800; */
        color: white;
        position: absolute;
        left: 24vw;
        top: 41vw;
        font-weight: 800;
    }

    .type22 {
        font-size: 8vw;
        /* letter-spacing: 4px; */
        /* font-weight: 800; */
        color: white;
        position: absolute;
        left: 24vw;
        top: 51vw;
        font-weight: 800;
    }

    .type32 {
        font-size: 8vw;
        color: white;
        position: absolute;
        left: 24vw;
        font-weight: 800;
        top: 61vw;
        /* text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white, -1px -1px white, 1px 1px white, -1px 1px white, 1px -1px white;*/
    }


    .type322 {
        font-size: 9vw;
        letter-spacing: 4px;
        /* font-weight: 900; */
        color: white;
        position: absolute;
        left: 23vw;
        font-weight: 900;
        top: 73vw;
        /*text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white, -1px -1px white, 1px 1px white, -1px 1px white, 1px -1px white;*/
    }

    .type42 {
        font-size: 4.3vw;
        letter-spacing: 1px;
        color: white;
        position: absolute;
        left: 24vw;
        top: 79.5vw;
        padding-right: 30px;
    }


        .type > span21, .type22 > span, .type32 > span, .type322 > span, .type42 > span {
            border-right: .05em solid;
            animation: caret 1s steps(1) infinite;
        }

    @keyframes caret {
        50% {
            border-color: transparent;
        }
    }







    /*////////////////////////text animation////////////////////////////////*/


    h1 {
        color: #484848;
        font-size: 6vw;
        font-weight: 900;
        letter-spacing: 1px;
    }

        h1 span {
            transition: 2s linear
        }

    h2 {
        color: #484848;
        font-size: 6vw;
        font-weight: 900;
        letter-spacing: 1px;
    }

        h2 span {
            transition: 2s linear
        }

    h3 {
        color: #484848;
        font-size: 11.5vw;
        font-weight: 900;
        letter-spacing: 1px;
    }

        h3 span {
            transition: 2s linear
        }

    h4 {
        color: #484848;
        font-size: 11.5vw;
        font-weight: 900;
        letter-spacing: 1px;
    }

        h4 span {
            transition: 2s linear
        }

    h5 {
        color: #484848;
        font-size: 4.5vw;
        font-weight: 900;
        letter-spacing: 1px;
    }

        h5 span {
            transition: 2s linear
        }

    .spaneffect {
        color: #fff;
        text-shadow: 0 0 0.5px white, 0 0 0.5px white, 0 0 0.5px white;
    }

    .pos1 {
        position: relative;
        left: 6vw;
        top: 1vw;
        width: 40vw;
    }

    .pos3 {
        position: relative;
        left: 42vw;
        top: -4vw;
        width: 46vw;
    }

    .pos4 {
        position: relative;
        left: 13vw;
        top: -5.5vw;
        width: 64vw;
    }

    .pos5 {
        position: relative;
        left: 43vw;
        top: 4vw;
        width: 20vw;
    }

    .pos6 {
        position: relative;
        left: 66vw;
        top: -11.5vw;
        font-size: 8.5vw;
        font-weight: 900;
        width: 20vw;
    }

    .pos7 {
        position: relative;
        left: 20vw;
        top: -18vw;
        width: 72vw;
    }


    .pos8 {
        position: relative;
        left: 4vw;
        top: 36vw;
        width: 36vw;
    }

    .pos8-1 {
        position: relative;
        left: 13.8vw;
        top: 24vw;
        width: 51vw;
    }


    .pos9 {
        position: relative;
        left: 0.5vw;
        top: 0vw;
        width: 75vw;
    }

    .pos9-1 {
        position: relative;
        left: 18vw;
        top: 0vw;
        width: 75vw;
    }

    .pos9-2 {
        position: relative;
        left: 40vw;
        top: -9vw;
        width: 40vw;
    }

    .pos9-3 {
        position: relative;
        left: 13vw;
        top: -13vw;
        width: 75vw;
    }

    .pos9-4 {
        position: relative;
        left: 33vw;
        top: -21vw;
        width: 35vw;
    }

    .pos9-5 {
        position: relative;
        left: 0.4vw;
        top: -3vw;
        width: 75vw;
        font-size: 11vw !important;
    }

    .pos9-6 {
        position: relative;
        left: -6.1vw;
        top: -11vw;
        width: 75vw;
        font-size: 11vw !important;
    }

    .pos9-7 {
        position: relative;
        left: -5.3vw;
        top: -19vw;
        width: 75vw;
        font-size: 11vw !important;
    }

    .pos9-8 {
        position: relative;
        left: 34.8vw;
        top: 12.7vw;
        width: 63vw;
    }

    .pos9-9 {
        position: relative;
        left: 57vw;
        top: 5vw;
        width: 40vw;
    }

    .pos9-10 {
        position: relative;
        left: 18.5vw;
        top: -3vw;
        width: 75vw;
    }

    .pos10 {
        position: relative;
        left: 2.5vw;
        top: -8vw;
        width: 40vw;
    }

    .pos11 {
        position: relative;
        left: 63vw;
        top: 2vw;
        width: 36vw;
    }

    .pos12 {
        position: relative;
        left: 18.5vw;
        top: 5.5vw;
        font-size: 3vw;
        width: 40vw;
    }


    .pos13 {
        position: relative;
        right: 7vw;
        top: 1vw;
        font-size: 1.3vw;
        text-decoration: none;
        color: white;
        text-align: right;
        width: 40vw;
    }


    .poslinkedin {
        background-image: url(/Images/LN.png);
        background-size: contain;
        position: relative;
        left: 90.8vw;
        top: 3vw;
        width: 25px;
        height: 25px;
        -webkit-transition: all 0.2s ease;
        -moz-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        -ms-transition: all 0.2s ease;
        transition: all 0.2s ease;
        cursor: pointer;
    }

        .poslinkedin:hover {
            background-image: url(/Images/LN-white.png);
            width: 26px;
            height: 26px;
        }

    /*  FLICKER TEXT*/


    .sign {
        position: relative;
        left: 19vw;
        top: -3vw;
        text-transform: uppercase;
        font-size: 7.5vw;
        font-weight: 900;
        color: #ffe6ff;
        /*text-shadow: 0 0 0.6rem #ff1a02, 0 0 1.5rem #fff68e, -0.2rem 0.1rem 1rem #fff68e, 0.2rem 0.1rem 1rem #fff68e, 0 -0.5rem 2rem #ff1a02, 0 0.5rem 3rem #ff1a02;*/
        text-shadow: 0 0 0.6rem #ff1a02, 0 0 1rem #fff68e, -0.2rem 0.1rem 1rem #fff68e, 0.2rem 0.1rem 1rem #fff68e, 0 -0.5rem 2rem #ff1a02, 0 0.5rem 3rem #ff1a02;
        animation: shine 2s forwards, flicker 3s infinite;
        width: 40vw;
    }

    @keyframes blink {
        0%, 22%, 36%, 75% {
            color: white;
            text-shadow: 0 0 0.6rem #ff1a02, 0 0 1.5rem #fff68e, -0.2rem 0.1rem 1rem #fff68e, 0.2rem 0.1rem 1rem #fff68e, 0 -0.5rem 2rem #ff1a02, 0 0.5rem 3rem #ff1a02;
        }

        28%, 33% {
            color: #ffe6ff;
            text-shadow: none;
        }

        82%, 97% {
            color: #141414;
            /*color: #ff1a02;*/
            text-shadow: none;
        }
    }

    .flicker {
        animation: shine 4s forwards, blink 5s 4s infinite;
    }

    .fast-flicker {
        animation: shine 2s forwards, blink 10s 1s infinite;
    }

    @keyframes shine {
        0% {
            color: #ff1a02;
            text-shadow: none;
        }

        100% {
            color: #ffe6ff;
            text-shadow: 0 0 0.6rem #ff1a02, 0 0 1.5rem #fff68e, -0.2rem 0.1rem 1rem #fff68e, 0.2rem 0.1rem 1rem #fff68e, 0 -0.5rem 2rem #ff1a02, 0 0.5rem 3rem #ff1a02;
        }
    }

    @keyframes flicker {
        from {
            opacity: 1;
        }

        4% {
            opacity: 0.9;
        }

        6% {
            opacity: 0.85;
        }

        8% {
            opacity: 0.95;
        }

        10% {
            opacity: 0.9;
        }

        11% {
            opacity: 0.922;
        }

        12% {
            opacity: 0.9;
        }

        14% {
            opacity: 0.95;
        }

        16% {
            opacity: 0.98;
        }

        17% {
            opacity: 0.9;
        }

        19% {
            opacity: 0.93;
        }

        20% {
            opacity: 0.99;
        }

        24% {
            opacity: 1;
        }

        26% {
            opacity: 0.94;
        }

        28% {
            opacity: 0.98;
        }

        37% {
            opacity: 0.93;
        }

        38% {
            opacity: 0.5;
        }

        39% {
            opacity: 0.96;
        }

        42% {
            opacity: 1;
        }

        44% {
            opacity: 0.97;
        }

        46% {
            opacity: 0.94;
        }

        56% {
            opacity: 0.9;
        }

        58% {
            opacity: 0.9;
        }

        60% {
            opacity: 0.99;
        }

        68% {
            opacity: 1;
        }

        70% {
            opacity: 0.9;
        }

        72% {
            opacity: 0.95;
        }

        93% {
            opacity: 0.93;
        }

        95% {
            opacity: 0.95;
        }

        97% {
            opacity: 0.93;
        }

        to {
            opacity: 1;
        }
    }







    /*input FORM*/

    .containForm {
        width: 50.5vw;
        height: 66vw;
        position: relative;
        /*    left: 16.5vw;
    top: -3vw;*/
        left: 15vw;
        top: 33vw;
        background: rgba(0,0,0,0.4);
        backdrop-filter: blur(1px);
        list-style-type: none;
        -webkit-font-smoothing: antialiased;
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
        padding: 20px;
        color: white;
        font-size: 0.6em;
        border-radius: 3px;
        padding-bottom: 10px;
    }

    .form-check {
        display: block;
        min-height: 4.5vw;
        padding-left: 1.5em;
        margin-bottom: 0;
    }

    .form-check-input {
        width: 1em;
        height: 1em;
        margin-top: 1vw;
        vertical-align: sub;
        background-color: #fff;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        border: 1px solid rgba(0,0,0,.25);
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        -webkit-print-color-adjust: exact;
        display: inline-block;
        color-adjust: exact;
        /* line-height: 4.5vw; */
    }

    label {
        display: inline-block;
        min-height: 4.5vw;
        /* vertical-align: sub; */
        line-height: 4.5vw;
    }

    .containForm input#name, #email {
        /*width: 300px;*/
        height: 25px;
        background: rgba(0,0,0,0.4);
        backdrop-filter: blur(1px);
        list-style-type: none;
        -webkit-font-smoothing: antialiased;
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
        border: none;
        font-size: 10pt;
        float: left;
        color: #262626;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        -webkit-transition: all .55s ease;
        -moz-transition: all .55s ease;
        -ms-transition: all .55s ease;
        -o-transition: all .55s ease;
        transition: all .55s ease;
    }

        .containForm input#name:not(:focus), #email:not(:focus) {
            color: white;
        }

        .containForm input#name::-webkit-input-placeholder, #email::-webkit-input-placeholder {
            color: #65737e;
        }

        .containForm input#name:-moz-placeholder, #email:-moz-placeholder { /* Firefox 18- */
            color: #65737e;
        }

        .containForm input#name::-moz-placeholder, #email::-moz-placeholder { /* Firefox 19+ */
            color: #65737e;
        }

        .containForm input#name:-ms-input-placeholder, #email:-ms-input-placeholder {
            color: #65737e;
        }

        .containForm input#name:focus, #email:focus, .containForm input#name:active, #email:active {
            outline: none;
            background: #ffffff;
        }


    .inputfontsize {
        /*font-size: 1vw;*/
        font-size: 1em;
    }

    input[type="checkbox"]:checked {
        background-color: green;
    }


    .buttonStyle {
        width: 100%;
        background: rgba(0,0,0,0.2);
        backdrop-filter: blur(1px);
        list-style-type: none;
        -webkit-font-smoothing: antialiased;
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
        border: none;
        font-size: 10pt;
        color: white;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        -webkit-transition: all .55s ease;
        -moz-transition: all .55s ease;
        -ms-transition: all .55s ease;
        -o-transition: all .55s ease;
        transition: all .55s ease;
        /* margin: auto; */
        margin-top: 1vw;
    }


        .buttonStyle:hover {
            background: rgba(0,0,0,1);
            box-shadow: -1px 0 rgba(255,255,255,0.2), 0 1px rgba(255,255,255,0.2), 1px 0 rgba(255,255,255,0.2), 0 -1px rgba(255,255,255,0.2), -1px -1px rgba(255,255,255,0.2), 1px 1px rgba(255,255,255,0.2), -1px 1px rgba(255,255,255,0.2), 1px -1px rgba(255,255,255,0.2);
        }



    /*DOWN ARROWS*/


    .arrows {
        width: 40px;
        height: 72px;
        position: absolute;
        left: 50%;
        margin-left: -14px;
        bottom: 15vh;
        cursor: pointer;
    }

    .arrowsHide {
        display: none;
        visibility: hidden;
    }

    .arrows path {
        stroke: WHITE;
        fill: transparent;
        stroke-width: 1px;
        animation: arrow 2s infinite;
        -webkit-animation: arrow 2s infinite;
    }

    @keyframes arrow {
        0% {
            opacity: 0;
        }

        40% {
            opacity: 1;
        }

        80% {
            opacity: 0;
        }

        100% {
            opacity: 0;
        }
    }

    @-webkit-keyframes arrow /*Safari and Chrome*/ {
        0% {
            opacity: 0;
        }

        40% {
            opacity: 1;
        }

        80% {
            opacity: 0;
        }

        100% {
            opacity: 0;
        }
    }

    .arrows path.a1 {
        animation-delay: -1s;
        -webkit-animation-delay: -1s; /* Safari Chrome */
    }

    .arrows path.a2 {
        animation-delay: -0.5s;
        -webkit-animation-delay: -0.5s; /* Safari Chrome */
    }

    .arrows path.a3 {
        animation-delay: 0s;
        -webkit-animation-delay: 0s; /* Safari Chrome */
    }







    /*//FIXED TEXT//*/


    .svgText {
        letter-spacing: 2px;
        stroke: cyan;
        font-size: 10vw;
        font-weight: 900;
        stroke-width: 1;
        animation: textAnimate 7s infinite alternate;
    }

    @keyframes textAnimate {
        0% {
            stroke-dasharray: 0 50%;
            stroke-dashoffset: 20%;
            fill: white;
        }

        100% {
            stroke-dasharray: 50% 0;
            stroke-dashoffstet: -20%;
            fill: black;
        }
    }



    .svgTextOnce {
        letter-spacing: 2px;
        stroke: cyan;
        /*font-size: 5vw;*/
        font-weight: 900;
        stroke-width: 1;
        animation: textAnimate 7s forwards;
    }

    @keyframes textAnimate {
        0% {
            stroke-dasharray: 0 50%;
            stroke-dashoffset: 20%;
            fill: black;
        }

        100% {
            stroke-dasharray: 50% 0;
            stroke-dashoffstet: -20%;
            fill: white;
            stroke: white;
        }
    }




    .Address {
        position: relative;
        width: 40vw;
        right: -51vw;
        top: 14vw;
        font-size: 2.6vw;
        color: white;
        text-align: right;
    }

    .Successmessage {
        color: black;
        margin-top: 5px;
        text-shadow: 0 0 5px #fff;
        font-weight: 600;
    }
}