html {
    box-sizing: border-box;
    }
    *, *:before, *:after {
    box-sizing: inherit;
    }

    @font-face {
        font-family: "farmFont";
        src: url(fonts/farm-to-market-font/FarmToMarketBold-lmY5.ttf);
    }

    @font-face {
        font-family: "spookyFont";
        src: url(fonts/spooky-pumpkin-font/SpookyPumpkin-51lGL.ttf);
    }

    body {
        background-color: lightseagreen;
    }

    header {
        text-align: center;
        margin: 3% 0;
    }

    .title {
        font-family: "spookyFont";
        color: orange;
        font-size: 3rem;
        text-shadow: 3px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000;
    }

    .instructions {
        font-family: "georgia";
        font-size: 1.3rem;
        color: black;
    }
    
    .dashboard {
        width: 100%;
        margin: 0 auto;
        text-align: center;
        
        /* width: 1000px;  */
        /* display: flex;
        justify-content: center; */   
    }

    .dashboard-item {
        /* flex-grow: 0; */
        border: 1px solid black;
        width: 200px;
        font-size: 3rem;
        font-family: "farmFont";
        background-color: orange;
        border-radius: 25px; 
        padding: 10px 15px;
        margin: 0 5px;
        display: inline-block;
    }

    .gameContainer {             
        display: flex;
        justify-content: center;            
    }
    
    .gameBoards {
        position: relative;
        width: 500px;
        height: 500px;
        background-image: url(images/backgrounds/soilLayers.jpg);
        background-repeat: no-repeat;
        background-size: cover;
    }

    img {
        position:absolute;
        width: 70px;
    }
    
    #rightSide {
        /* left: 500px; */
        border-left: 1px solid;
    }
    
    #resetButton {
        visibility: hidden;
    }

    #speaker {
        position: relative;
        width: 40px;
    }