*{
    font-family: "MedievalSharp", cursive;
    color: aliceblue;
}
html, body {
    background-color: black;
  margin: 0;
  height: 100%;
   align-items: center;
   background-image: url("../img/fire.gif");
   background-size: auto 100%;
   background-repeat: repeat-x;
  background-position: bottom;
}
.container-fluid{
        display: flex;
    flex-flow: wrap;
    justify-content: center;
    align-content: center;
    height: 100%;
    padding: 0px;
    margin: 0px;
}   
.middle{
    width:20%;
    height: 15%;
    display: flex;
    justify-self: center;
    text-align: center;
    background-image: url("../img/introBack.webp");
    border: 1px white solid;
    cursor: pointer;
    background-size: auto 100%;
   background-repeat: repeat-x;
  background-position: bottom;
    align-items: center;
    justify-content: center;
    overflow-wrap: break-word;
    word-break: break-word;
}   
h1{
    width: 100%;
    align-self: center;
    margin: 0px;
    pad: 0px;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: clamp(1rem, 5vw, 2rem);
}