@font-face {
    font-family: 'Cehua';
    src: url('font/CehuaFreeFree-K7eMl.otf') format('opentype'); /* Added missing semicolon */
}

@font-face {
    font-family: 'latoBlack';
    src: url('font/LATO-BLACK.TTF') format('truetype'); /* Added missing semicolon */
}

@font-face {
    font-family: 'latoReg';
    src: url('font/LATO-REGULAR.TTF') format('truetype'); /* Added missing semicolon */
}

@font-face {
    font-family: 'latoLight';
    src: url('font/LATO-LIGHT.TTF') format('truetype'); /* Added missing semicolon */
}

.welcometo{
font-family: 'latoLight';
position: absolute; 
color: white; 
z-index: 100;
font-size: 250%; 
text-shadow: 0px 0px 25px rgb(0, 0, 0);
transition: all linear .5s;
animation: textpulse 8s linear infinite;
}

.RSh1{
font-family: 'Cehua';
text-align: center;
padding: 5%;
font-size: 550%;
position: absolute; 
color: white; 
z-index: 100;
text-shadow: 0px 0px 25px rgb(0, 0, 0);
transition: all linear .5s;
animation: textpulse 8s linear infinite;
}

#hl-text:hover{
    text-shadow: 0px 0px 50px rgb(0, 0, 0);
}

@keyframes textpulse {
    0%{filter: invert(0);}
    50%{filter: invert(1);}
    100%{filter: invert(0);}

}

@media only screen and (max-width: 350px) {

.welcometo{
    top: 65%;
    font-size: 75%;
    color: rgb(255, 255, 255);
    transition: all linear .5s;
}

.RSh1{
    top: 50%;
    font-size: 175%;
    color: rgb(255, 255, 255);
    transition: all linear .5s;
}

    }

@media only screen and (max-width: 700px) {

    .welcometo{
        font-size: 125%;
        transition: all linear .5s;
    }

    .RSh1{
        font-size: 250%;
        transition: all linear .5s;
    } 
    
      }