@font-face {
    font-family: Birthstone_Bounce ;
    src: url(fonttiplajays/fontit/fontteja/Birthstone_Bounce/BirthstoneBounce-Regular.ttf);
}

@font-face {
    font-family: Asset;
    src: url(fonttiplajays/fontit/fontteja/Asset/Asset-Regular.ttf);
}

    @font-face {
        font-family: Molle;
        src: url(fonttiplajays/fontit/fontteja/Molle/Molle-Italic.ttf);
    }

    @font-face {
        font-family: DynaPuff;
        src: url(fonttiplajays/fontit/fontteja/DynaPuff/static/DynaPuff-Regular.ttf);
    }




body {
text-align: center;
background-color:  rgb(172, 253, 234);
font-size: 60px;
background-image: url(fonttiplajays/tausta.jpg);
background-size: cover;
min-height: 100vh;
margin: 0;
padding: 1px;
box-sizing: border-box;
}

p {

    margin: 0;
    position: relative;
}

.eka {
font-family:Birthstone_Bounce;
font-size: 200px;
margin-top: 100px;
color: rgb(104, 113, 187);
}

.toka {
font-family: Asset;
font-size: 180px;

color: rgb(14, 65, 122);
letter-spacing:13px;
}

.kolmas {
font-family: Molle;
font-size: -100px;
color: rgb(150, 128, 226);
text-shadow: 30px  30px  40px ;
margin-top: -20px;
margin-bottom: 20px;
z-index: 7;

}

.neljas {
font-family:DynaPuff;
font-size: 169px;
margin: -95px;
color:rgb(10, 157, 177);
z-index: 6;
text-shadow: 40px 30px 40px;
}

.erilainen {
    transform: rotate(-10deg);
    text-shadow: 40px;
}