joke.css

@import url('https://fonts.googleapis.com/css2?family=Lily+Script+One&family=Roboto+Condensed:wght@300&family=Style+Script&display=swap');
*{
    margin:0;
    padding:0;
    box-sizing:border-box;

}
body{
    background-color: #fab22e;
}
.wrapper{
    width:80vmin;
    padding:50px 40px;
    background-color: #15161a;
    position:absolute;
    transform:translate(-50%,-50%);
    top:60%;
    left:50%;
    border-radius: 5px;
    box-shadow:20px 20px 40px rgba(97,63,0,0.4);
}

span{
    display: block;
    text-align:center;
    font-size: 100px;

}
p{
    font-size:16px;
    color:#fff;
    font-weight:400;
    text-align:center;
    word-wrap:break-word;
    line-height:35px;
    margin:30px 0;
    opacity:1;
}
button{
    
    
    background-color: #fab22e;
    padding:5px;
    font-size:18px;
    color: #171721;
    font-weight: 600;
    padding:12px 25px;
    margin: 0 auto;
    border-radius:5px;
    cursor:pointer;
}

.category-heading{
    font-size: 58px;
    font-weight:bold;
    text-align: center;
    margin-top:1.9rem;
    margin-bottom: 1.8rem;
    font-family: Lily Script One;
}

#categories{
    display: flex;
}
.quote{
    margin-top:65vh;
}
.quote p{
    color:#15161a;
    font-size:3rem;
    font-family: Lily Script One;
}