/* reset */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input,hr {margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th {font-size:1em; font-weight:normal; font-style:normal;}
ul,ol {list-style:none;}
fieldset,img,hr {border:none;}
caption,th {text-align:left;}
table {border-collapse:collapse; border-spacing:0;}
td {vertical-align:top;}
/* reset ends */

body {
    font-family: Verdana, Helvetica, sans-serif;
}

h1 {
    font-size: 24px;
    font-weight: bold;

}
ul { margin-top: 10px; }
li { margin-top: 5px;}

#wrapper {
    margin: 60px auto;
    width: 1200px;
}

.container {
    margin: 10px auto;
    width: 1020px;
    overflow: auto;
}

#topbar {
    overflow: auto;
}

#player-field {
    float: left;
    width: 640px;
    margin-left: 2px;
}

#score-text {
    display: block;
    float: right;
    width: 80px;
    margin-right: 15px;
}

#score-field {
    display: block;
    position: relative;
    margin-right: 2px;
    float: right;
    width: 80px;
    text-align: right;
}

#scoreboard {
    margin-right: 2px;
    float: right;
    width: 400px;
}
#scoreboard h1 { text-align: right; }

#message {
    float: left;
    width: 350px;
    margin-left: 2px;
}

#game {
    position: relative; /* for 'shake' effect */
    display: block;
    margin: 0 auto;
    border: 10px solid black;
    border-radius: 5px;
}

#name-container {
    position: absolute;
    top: 260px;
    width: 1200px;
    z-index: 10; /* ontop */
    visibility: hidden;
}


#player {
    width: 300px;
    margin: 0 auto;
    overflow: auto;
    background: #fff;
    padding: 20px;
    border-radius: 5px;
    border: 2px solid #eee;
    text-align: center;
}

#player h1 {
    font-size: 26px;
    font-weight: normal;
    margin-bottom: 16px;
}
#player label {
    font-size: 26px;
}
#player label input[type="text"] {
    padding: 8px;
    letter-spacing: 0.1em;
    height: 30px;
    width: 200px;
    font-size: 20px;
}
#player h2 {
    font-size: 22px;
    margin-top: 16px;
}

.date { float: right; }
.name { margin-left: 10px; }

.warning { border: 2px solid red }
.valid { border: 2px solid green;}