.elementor-844 .elementor-element.elementor-element-b653420{--display:flex;--min-height:870px;--background-transition:0.3s;--padding-top:200px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-844 .elementor-element.elementor-element-b653420, .elementor-844 .elementor-element.elementor-element-b653420::before{--border-transition:0.3s;}.elementor-844 .elementor-element.elementor-element-67e1652{text-align:center;}.elementor-844 .elementor-element.elementor-element-67e1652 .elementor-heading-title{color:#FFFFFF;font-family:"Oswald", Sans-serif;font-size:200px;font-weight:700;text-transform:uppercase;}.elementor-844 .elementor-element.elementor-element-32548ec > .elementor-widget-container{margin:-400px 0px 0px 0px;}.elementor-844 .elementor-element.elementor-element-e58b229{--display:flex;--min-height:500px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-844 .elementor-element.elementor-element-e4a0ddf{--display:flex;--background-transition:0.3s;}/* Start custom CSS for container, class: .elementor-element-b653420 */.typewriter h1 {
  overflow: hidden; /* Ensures the content is not revealed until the animation */

  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
  letter-spacing: .1em; /* Adjust as needed */
  animation: 
    typing 3.5s steps(40, end),
    blink-caret .75s step-end infinite;
}

/* The typing effect */
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}









.elementor-element.typewriter{


    background: linear-gradient(315deg, rgba(101,0,94,1) 3%, rgba(60,132,206,1) 38%, rgba(48,238,226,1) 68%, rgba(255,25,25,1) 98%);
    animation: gradient 15s ease infinite;
    background-size: 400% 400%;
    background-attachment: fixed;

}










@keyframes gradient {
    0% {
        background-position: 0% 0%;
    }
    50% {
        background-position: 100% 100%;
    }
    100% {
        background-position: 0% 0%;
    }
}

.wave {
    background: rgb(255 255 255 / 25%);
    border-radius: 1000% 1000% 0 0;
    position: fixed;
    width: 200%;
    height: 12em;
    animation: wave 10s -3s linear infinite;
    transform: translate3d(0, 0, 0);
    opacity: 0.8;
    bottom: 0;
    left: 0;
    z-index: -1;
}

.wave:nth-of-type(2) {
    bottom: -1.25em;
    animation: wave 18s linear reverse infinite;
    opacity: 0.8;
}

.wave:nth-of-type(3) {
    bottom: -2.5em;
    animation: wave 20s -1s reverse infinite;
    opacity: 0.9;
}

@keyframes wave {
    2% {
        transform: translateX(1);
    }

    25% {
        transform: translateX(-25%);
    }

    50% {
        transform: translateX(-50%);
    }

    75% {
        transform: translateX(-25%);
    }

    100% {
        transform: translateX(1);
    }
}/* End custom CSS */