html{
    scroll-behavior: smooth;
}

body{
    background-color: #010101;
}

.mov-logo {
    width: 10%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    position: fixed;
    margin: 30px;
    z-index: 9;
    float: left;
}
.mov-logo img{
    width: 160upx;
    height: 60px;
}
.header{
    min-height: 25vh;
    position: relative;
}

.header .title1{
    color: #01d449;
    margin: 0px 12px;
    text-align: center;
}
.header .text{
    font-size: 1.8em;
    letter-spacing: 10px;
    font-family: monospace;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    animation:
        typing 2s steps(22),
        cursor .4s step-end infinite alternate;
}
.btn{
    display: flex;
    align-items: center;
    justify-content: center;
}
.fa-solid{
    color: #01d449;
    font-size: 50px;
}

.fa-solid{
    animation: jump .7s linear infinite;
}
@keyframes jump{
    10% {transform: translateY(2px);}
    20% {transform: translateY(4px);}
    30% {transform: translateY(6px);}
    40% {transform: translateY(8px);}
    50% {transform: translateY(10px);}
    60% {transform: translateY(8px);}
    70% {transform: translateY(6px);}
    80% {transform: translateY(4px);}
    90% {transform: translateY(2px);}
    100% {transform: translateY(0px);}
}

@keyframes typing {
    from { width: 0}
}
@media(max-width:767px) {
    /*.text{
        font-size: 15px;
        letter-spacing: 5px;
    }*/
    .mov-logo{
        margin-left: 70px;
    }
}
.paragragh1{
    color: #01d449;
    min-height: 100vh;
    width: 100%;
    text-align: center;
    background-image: linear-gradient(rgba(0,0,10,0.8),rgba(0,0,10,0.8)), url(images/back-G-flow.png);
    background-size: 50%;
    background-color: #010101;
    background-position: center;
    position: absolute;
    top: 200px;
}
.paragragh1 .text2{
    font-size: 1.8em;
    letter-spacing: 10px;
    font-family: monospace;
    width: 100%;
    animation: slide-in 2s ease-out;
}
.paragragh2{
    color: #01d449;
    min-height: 100vh;
    width: 100%;
    text-align: center;
    background-image: linear-gradient(rgba(0,0,10,0.8),rgba(0,0,10,0.8)), url(images/back-G-flow.png);
    background-size: 50%;
    background-color: #010101;
    background-position: center;
    position: relative;
    top: 600px;
}
.paragragh2 .text3{
    font-size: 1.8em;
    letter-spacing: 10px;
    font-family: monospace;
    width: 100%;
    animation: slide-in 2s ease-out;
}
.paragragh3{
    color: #01d449;
    min-height: 100vh;
    width: 100%;
    text-align: center;
    background-image: linear-gradient(rgba(0,0,10,0.8),rgba(0,0,10,0.8)), url(images/back-G-flow.png);
    background-size: 50%;
    background-color: #010101;
    background-position: center;
    position: relative;
    top: 600px;
}
.paragragh3 .text4{
    font-size: 1.8em;
    letter-spacing: 10px;
    font-family: monospace;
    width: 100%;
    animation: slide-in 2s ease-out;
}
.paragragh4{
    color: #01d449;
    min-height: 70vh;
    width: 100%;
    text-align: center;
    background-image: linear-gradient(rgba(0,0,10,0.8),rgba(0,0,10,0.8)), url(images/back-G-flow.png);
    background-size: 50%;
    background-color: #010101;
    background-position: center;
    position: relative;
    top: 580px;
}
.paragragh4 .text5{
    font-size: 1.8em;
    letter-spacing: 10px;
    font-family: monospace;
    width: 100%;
    animation: slide-in 2s ease-out;
}

@keyframes slide-in{
    from {transform: translateX(-2000px);}
    to {transform: translateX(0px);}

}

.btn2{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 40px;
    position: relative;
    top: 500px;
}
.btn2 a{
    text-decoration: none;
    border: 2px solid #01d449;
    color: #010101;
    font-size: 20px;
    font-family: monospace;
    background-color: #01d449;
    animation: jump .7s linear infinite;
}

/*---preloader---*/
#preloader{
    background:#000 url(images/loader1.gif) no-repeat center center;
    background-size: 10%;
    height: 100vh;
    width: 100%;
    position: fixed;
    z-index: 100;
}