@font-face {
    font-family: alagard;
    src: url(alagard.ttf);
}

body {
    height: 100vh;
    width: 100vw;
    background-color: black;
    color: white;
    font-family: alagard;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-size:  contain;
    background-position: center;
    background-repeat: no-repeat;
    align-items: center;
    margin: 0px;
    overflow: hidden;
}

ul {
    font-family: alagard;
}


.gamebody {
    height: 90%;
    width:  100%;
    margin-top:  80px;
    margin-left: 20px;
    margin-left: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    overflow: none;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.dialog, .dialog3 { 
    height: 30%;
    font-size: 4.5vw;
    width: 70%;
}

/* CHARACTER SPEAKING TAGS 1/2 */
/* add any new character tags into the below */

.text1, .text2, .text3, .nancy, .sophie, .narration {
    display: block;
    text-shadow: 8px 8px 8px #000000;
}

.text1 {
    color: #6A6A6A;
    text-align:  center;
}

.text2 {
    color: #BBBBBB;
}

.text3 {
    color: #FEFEFE;
}

.blank {
    color:  #FAF9F6;
}

/* CHARACTER SPEAKING TAGS 2/2 */
/* replace the below with whatever characters you have set up in code.js */

.nancy {
    color: #cfeef9;
    float: left;
}

.sophie {
    color: #eccedf;
   float: right;
   }

.narration {
    color: #FAF9F6;
    text-align:  center;
}