@font-face {
    font-family: 'Hello Kitty';
    src: url(fonts/boldins.otf);
}
@font-face {
    font-family: 'Hello Kitty Bold';
    src: url(fonts/Cecil34-6L7M.ttf);
}
   
* {
    text-decoration: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    cursor: url("hello-kitty/cursor/HelloKitty.cur"), auto;
}


#greeting {
    text-align: center;
    font-size: 5vw;           
    font-family: 'Hello Kitty';
    font-weight: 50;
    margin-top: 4vw;          
    height: auto;             
}

#dear {
    text-align:start;
    margin-left: 10.5vw;
    font-size: 2.5vw;           
    font-family: 'Hello Kitty';
    font-weight: 50;
    margin-top: 2.5vw;          
}

#message {
    text-align:inherit;
    margin-left: 10.5vw;
    margin-right: 10vw;
    font-size: 2vw;           
    font-family: 'Hello Kitty';
    font-weight: 50;
    margin-top: 1vw;
              
}

#gif1 {
    position: absolute;
    top: 0.5vw;
    right: 2vw;
    display: block;
    margin: 0;
    z-index: 1;
    rotate: 8deg;
}
#gif2 {
    position: absolute;
    bottom: 3vw;
    left: 2vw;
    display: block;
    margin: 0;
    z-index: 1;
    rotate: -12deg;
    width: 9vw;
    height: auto;
}


#returnhome {
    position: absolute;
    top: 2vw;
    left: 2vw;
    background-color: #d95785;
    color: #ffffff;
    border-color: white;
    border: solid 2px;
    border-radius: 100px;
    padding: .8vw 2.2vw;         
    font-size: 1.4vw;           
    font-family: 'Hello Kitty';
}

#welcome {
    text-align: center;
    font-size: 7vw;   
    font-family: 'Hello Kitty Bold';
    color: #ffffff;
    border-radius: 1000000px;
    border-color: #d9578500;
    padding-right: 1vw;   
    font-weight: 500;
    letter-spacing: 3.5px;
    margin-top: 25px;
}

.letters span {
    display: inline-block;
    animation: wave-enlarge 2s ease-in-out infinite;
}

.letters span:nth-of-type(even) {
    color: #E50020;
}
.letters span:nth-of-type(odd) {
    color: #0075C1;
}

.letters span:nth-of-type(1) {
    animation-delay: 0s;
}

.letters span:nth-of-type(2) {
    animation-delay: 0.15s;
}

.letters span:nth-of-type(3) {
    animation-delay: 0.3s;
}

.letters span:nth-of-type(4) {
    animation-delay: 0.45s;
}

.letters span:nth-of-type(5) {
    animation-delay: 0.6s;
}

.letters span:nth-of-type(6) {
    animation-delay: 0.75s;
}

.letters span:nth-of-type(7) {
    animation-delay: 0.9s;
}

.letters span:nth-of-type(8) {
    animation-delay: 1.05s;
}

.letters span:nth-of-type(9) {
    animation-delay: 1.2s;
}

.letters span:nth-of-type(10) {
    animation-delay: 1.35s;
}

.letters span:nth-of-type(11) {
    animation-delay: 1.5s;
}

.letters span:nth-of-type(12) {
    animation-delay: 1.65s;
}

@keyframes wave-enlarge {
    0%, 100% {
        transform: translateY(0) scale(1);
    }
    50% {
        transform: translateY(-5px) scale(1.09);
    }
}

#welcomegif {
    display: flex;
    flex-direction: column;
    align-items: center;
}


.custom-cursor {
    cursor: url("hello-kitty/cursor/HelloKitty.cur"), auto;
}
.interactive-element:hover {
    cursor: url("hello-kitty/cursor/alt-select.cur"), pointer;
}
a, button {
    cursor: url("hello-kitty/cursor/alt-select.cur"), auto;
}
html,
body {
    cursor: url("hello-kitty/cursor/HelloKitty.cur"), auto;
}