body{
    min-height: 100vh;
    font-family: 'GameOverRegular'; 
}
section.wrapper{
    text-align: center;
}
#LT_CANV {
    display: inline;
    border: 5px, solid, black;
    max-height: 70vh;
    max-width: 100vw;
}

#main-header {

    font-family: 'Courier New', Courier, monospace;
    color: rgb(255, 81, 0);
}

#secondHead {
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: blueviolet;
}

#progressYeah {
    font-family: Arial, Helvetica, sans-serif;
    color: red;
}

div#modal{
    display: none;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}


#TABLE01 {
    border: solid rgba(101, 5, 5, 0.76);
    font-size: 15px;
    text-align: center;
    font-family: 'Courier New', Courier, monospace;
}

#title {
    font-size: 30px;
    text-align: center;
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: crimson;
}

#gameHead {
    font-size: 50px;
    text-align: center;
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: crimson;
}

.button {
    background-color: #3eddc5;
    border: 1px solid black;
    box-shadow: 0 9px#505050;
    padding: 30px;
    text-align: center;
    font-size: 28px;
    }
    
    .button:hover {
    background-color: #3d1ab0;
    }
    
    .button:active {
    box-shadow: 0 5px #3D3D3D;
    transform: translateY(5px);
    }
    
    .pressed{
    box-shadow: 0 5px #3D3D3D;
    transform: translateY(5px);    
    }
    
    .red {
    color: #110b0b6d;
    }
    
    .green {
    color: #4a4f4a28;
    }

    .blue {
    color: #110b0b6d;
    }
        
    .yellow {
    color: #4a4f4a28;
    }
    .round {
    border-radius: 50%;
    }

    #formCanvas {
        display: inline;
        border: 5px, solid, black;
        max-height: 70vh;
        max-width: 100vw;
    }

    div#POEM {
        color: rgba(26, 0, 99, 0.797);
        font-size: 10px;
        font-family: 'Courier New', Courier, monospace;
        text-align: justify;
    }

    div#BADPOEM {
        color: rgb(255, 0, 0);
        font-size: 10px;
        font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        text-align: justify;
    }

    #QUOTE {
        color: rgba(26, 0, 99, 0.797);
        font-size: 25px;
        font-family: 'Courier New', Courier, monospace;
        text-align: justify;
    }

    #BAD_QUOTE{
        color: rgb(255, 0, 0);
        font-size: 25px;
        font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        text-align: justify;
    }

    #body4 {
        background-color: black;
    }

    #body3 {
        background-color: aqua;
    }

    #body2{
        background-color: whitesmoke;
        overflow: hidden;
    }

    #body1 {
        background-color: pink;
    }

    #gameHappyEnding {
        font-size: 50px;
        text-align: center;
        font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        color: rgba(26, 0, 99, 0.797);
    }

    #MOODBOARD {
        display: inline;
        border: 5px, solid, black;
        max-height: 70vh;
        max-width: 100vw;
    }
    
    #finale {
    color: rgb(255, 102, 0);
    font-family: 'Times New Roman', Times, serif;
    font-size: 34px;
    }