body {
    font: 16px/1.5em;
    color:azure;
    /* color: #333; */
    font-family: 'Encode Sans', sans-serif;
    background-color: rgb(36, 34, 34);
    width:100%;
    margin-top: 15em;
    overflow-x: hidden;
}

.centeredContainer {
    display: flex;
    justify-content: center;
    align-items: center;
    /* box-shadow: 0px 2px lightgray;
    background-color: white;
    border: none;
    float: left; */
    
}



.hidden {
    opacity:0;
}
.console-cursor {
    display:inline-block;
    position:relative;
    /* top:-0.14em; */
    left:10px;
    /* font-size: 5vh; */
 }

 .dud {
    color: #757575
 }



.material-icons { 
    user-select: none; 
    -moz-user-select: none; 
    -khtml-user-select: none; 
}

span.tagged > .material-icons {
    transform: translate(-50%, -175%);
    color: transparent;
}

/* Show lock symbol when hovered */
span.tagged:hover > .material-icons {
    color: rgb(148, 148, 145);
}
span.locked:hover > .material-icons {
    color: red;
}

/* Always show lock symbol when locked */
span.locked > .material-icons {
    color: red;
}

/*Underline tagged text on hover */
span.tagged:hover {
    color: rgb(148, 148, 145);
    text-decoration: underline;
}

span.locked {
    color: red;
}
span.locked:hover {
    color: red;
}

#resultContainer {
    display:inline-block;
    margin:0 auto;
    text-align: left;
}

#resultContainer:first-letter {
    text-transform: uppercase;
}

/* @media (orientation: portrait) { 

    p#resultContainer {
        
        width: 90%;
        font-size: 15vh;
        display: block;
        line-height: 1.5;
    }

} */
/*Default is mobile portrait*/
#resultSection {
    /* width: 90%; */
    font-size: 90pt;
    line-height: 1.2;
    text-align: left;
    margin: 1em 0em 0.5em 0.5em;
    
}
button {
    height:1.2em;
    font-size: 90pt;
    padding-left: 1em;
    padding-right: 1em;
   
}

/* Landscape CSS */
@media (orientation: landscape) { 
    #resultSection {
        width: 90%;
        font-size: 10vh;
    }

    button {
        height:8vh;
        font-size: 6vh;       
    }
    body {
        margin-top: 8vh;

    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {

    #resultSection {
        max-width: 90%;
        font-size: 8vh;
    }

    button {
        height:8vh;
        font-size: 6vh;       
    }
    body {
        margin-top: 8vh;

    }
}