/* lxgpanel.css */

@import url("common.css");

header {
    background-color: hsl(0, 0%, 96%);
    padding: 10px 20px;
    border-bottom: 1px solid hsl(0, 0%, 90%);
    color: hsl(0, 0%, 0%);
}


body {
    background-color: hsl(0, 0%, 98%);
    font-family: "Trebuchet MS", sans-serif;
    overflow-x: hidden;
    color: hsl(0, 0%, 0%);
}



#wordlist {
    padding: 50px 10px 10px 10px;
}

#wordlist .paragraph {
    background-color: hsla(0, 0%, 90%, 1);
    padding: 10px;
    border-radius: 2px;
    margin: 10px 5px;
}

#wordlist p {
    margin: 8px;
}
#wordlist p.separator {
    margin: 20px 0;
    padding: 5px 50px;
    background-color: hsla(0, 0%, 75%, 1);
    color: hsla(0, 0%, 96%, 1);
    border-radius: 5px;
    text-align: center;
    font-size: 20px;
}
#wordlist .token {
    margin: 8px;
}
#wordlist ul {
    margin: 0 0 5px 40px;
}
#wordlist b {
    background-color: hsla(150, 10%, 50%, 1);
    color: hsla(0, 0%, 96%, 1);
    padding: 2px 5px;
    border-radius: 2px;
    text-decoration: none;
}
#wordlist b.WORD {
    background-color: hsla(150, 50%, 50%, 1);
}
#wordlist b.ELPFX {
    background-color: hsla(150, 30%, 50%, 1);
}
#wordlist b.UNKNOWN {
    background-color: hsla(0, 50%, 50%, 1);
}
#wordlist b.NUM {
    background-color: hsla(180, 50%, 50%, 1);
}
#wordlist b.COMPLEX {
    background-color: hsla(60, 50%, 50%, 1);
}
#wordlist b.SEPARATOR {
    background-color: hsla(210, 50%, 50%, 1);
}
#wordlist b.LINK {
    background-color: hsla(270, 50%, 50%, 1);
}
#wordlist s {
    color: hsla(0, 0%, 60%, 1);
    text-decoration: none;
}
#wordlist .textline {
    text-decoration: bold;
}

#wordlist p.message {
    margin-top: 20px;
    padding: 10px 10px;
    background-color: hsla(240, 10%, 50%, 1);
    font-size: 18px;
    color: hsla(240, 0%, 96%, 1);
    border-radius: 3px;
    text-align: center;
}
