button{/*add general button design here*/
    border-radius: 3px;
    border-width: 1px;
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    height: 20px;}
    .actionbutton{}
    .newbutton{
    color: green;
    border-color: green;
    background-color:aquamarine;}

ul{/*add general list design here*/
    list-style-type:none;}
li, th, td{
    border: 1px dotted grey;
    min-height: 20px;}
p{/*add general text design here*/
    font-size: 17px;
    font-family: Garamond, Georgia, serif;}

    #Wrapper{
    width: 1000px;
    margin: auto;
    position: relative;
    padding: 20 px 0 0 220 px;}
    #Text{
        text-align: right;
        float:left;
        position:relative;
        margin-left:auto;
        margin-right:auto;
        width:25%;}
        #Needs{
            align-items: right;
            height: 160px;}
            .needtxts{
                width: 300px;
                height: 20px}
            .wraps{
                width: 0px;
                height: 20px;
                opacity: 50%;
                position: absolute;
                display: block;
                background-color: tomato;}
                #Hpwrap{
                    background-color:greenyellow;}
                #Warmwrap{
                    background-color: brown;}
                #Thirstwrap{
                    background-color:aqua;}
                #Hungerwrap{
                    background-color: darkgreen;}
                #Surrwrap{
                    margin: auto;
                    height: 10px;}
        #Messagelog{
            width: 250px;}
    #Content{}
        #Tasks{
            text-align:center;
            float:inline-start;
            position:relative;
            margin-left:auto;
            margin-right:auto;
            width:40%;
            padding-left: 5%;
            padding-top: 30px;
            display: flex;
            flex-direction: column;}
            #Firedesc{
                height: 40px;
                margin: 0;}
            .Fire{
                height: 20px;
                font-size: large;
                line-height: 0px;
                color: sienna;
                font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;}
            #Fireicon{
                margin-top: 10px;
                margin-bottom: 0;}
            #Actions{
                height: 44px}
        #Menu{}    
            #Buttons{
                text-align: center;}
                .compass{
                    text-align: center;
                    font-size: 16px;
                    font-family: 'Courier New', Courier, monospace;}
                #Recipes{
                    display: flex;
                    justify-content: center;}
                #Craftingmenu{
                    display: grid;
                    grid-template-columns: auto auto auto; }
            #Surrdesc{
                height: 40px;
                margin-top: 10px;}
    #Inventory{
        text-align:left;
        float:right;
        position:relative;
        margin-left:auto;
        margin-right:auto;
        width:30%;}
#Footer{
    position: fixed;
    bottom: 1%;
    text-align: right;
    font-family: 'Courier New', Courier, monospace;
}

        
        /*#Map{}
            .Map{
                position:absolute;
                margin-left:auto;
                margin-right:auto;
                width:49%;
                text-align: center;
                font-family: "Monaco", "Copperplate", monospace;
                line-height: 20px;
                font-size: 20px;
                font-weight: bold;
                color:black;
                opacity: 0;}
            #Buildings{
                color:brown;}*/