@font-face {
    font-family: tapestry ;
    src: url(fontit/Tapestry-Regular.ttf);
}

@font-face {
    font-family: kodemono ;
    src: url(fontit/KodeMono-VariableFont_wght.ttf);
}

@font-face {
    font-family: plaster ;
    src: url(fontit/Plaster-Regular.ttf);
}

@font-face {
    font-family: tiltprism ;
    src: url(fontit/TiltPrism-Regular-VariableFont_XROT\,YROT.ttf);
}

body {
    text-align: center;
    background-color: beige;
    font-size: 110px;
    background-image: url(osoittaa.jpg);
    background-size: cover;
    min-height: 100vh;
    margin: 0;
    padding: 1px;
    box-sizing: border-box;
}

p {
    margin: 0;
    position: relative;
}

.eka {
    font-family: kodemono ;
    margin-top: 100px;
    color: #a53030;
    text-shadow: 5px 6px 0px  rgb(0, 0, 0);
    vertical-align: -30px;
    font-size: 120px;

}

.toka {
    font-family: tiltprism ;
    font-size: 200px;
    color: #ffa600;
    text-shadow: 0px 0px 10px #f5bb4f;
    margin-bottom: -80px;
}

.kolmas {
    font-family: tapestry ;
    z-index: 10;
    font-size: 140px;
    margin-bottom: -120px;
    color: #000000;
    
}

.neljäs {
    font-family: plaster ;
    font-size: 250px;
    color: rgb(0, 0, 0);
  transform: translate(-3%);
  text-shadow: 
    .5vw .5vw 0px #205f4a, 
    1vw 1vw 0px #36862c, 
    1.5vw 1.5vw 0px #a1cc29, 
    2vw 2vw 0px #ddda34, 
    2.5vw 2.5vw 0px #cf9e17,
    3vw 3vw 0px #a35905, 
    3.5vw 3.5vw 0px #a34405, 
    4vw 4vw 0px #a33205, 
    4.5vw 4.5vw 0px #a32505;
    right: -43px;
}