div#main {
    font-family: sans-serif;
    width: 1000px;
    margin-right: auto; margin-left: auto;
    border: 1px dotted #aaa;
}

div#main h1 {
    text-align: center;
}

h1, #footer {
    margin-top: 0px;
    margin-botom: 0px;
    padding: .4em;
    background: #030;
    color: white;
}

div#main h3 {
    border-top: 1px solid #aaa; tra}

h2 {
    clear: both; 
}

div#main > h2,
div#main > h3,
div#main > h4 {
    margin-left: 20px;
    margin-right: 220px;
}

div#main > pre, 
div#main > p,
div#main > ul {
    margin-left: 50px;
    margin-right: 220px;
    text-align: justify;
} 

div#main pre {
    border: 1px dotted #aaa;
    padding-left: 20px;
}

div#main ul ul {
    clear: both;
    margin-left: 20px;
} 

#menu {
    margin-left: auto;
    margin-right: auto;
}

#menu td {
    font-size: 120%;
    font-weight: bold; }

#menu td, #submenu th, #submenu td {
    width: 150px;
    border: 1px solid #aaa;
    text-align: center;
    padding: 5px;
}

#submenu td {
    border-top: none;
}

#submenu th {
    border: 3px solid #030;
}


div#main > #submenu {
    width: 180px;
    float: right;
    margin-right: 10px;
}

#social {
    text-align: right;
    margin-right: 20px;
    margin-bottom: 20px;
}


div#main > .tile-ex {
    text-align: center;
}			

.tile-ex img {
    margin: 5px;
}     

.tile-ex table {
    display: inline;
    border: 1px solid #33a; 
    border-collapse: collapse;
}

.tile-ex table td {
    text-align: center;
    padding: 0px;
    border: 0px;
}

.new_turn img { border: 4px dashed red; margin: 1px; }
.next_turn img { border: 4px dashed blue; margin: 1px; }