html{
    height: 100%;
}

/*Header*/

header {
    height : 100px;
    text-align: center;
}
#logo {
    height : 100px;
    top:20px;
    left:20px;
    position : absolute;
}
.helpBtn{
    clear: both;
    /* float: left;*/
}

h1, h2, h3 {
    text-align: center;
    height : 10px;
    font-family : Georgia;
}

.start {
    font-size : 30px;
}
h2 {
    font-size : 22px;
}

h1#othello {
    font-size : 40px;
}

header #form {
    position:absolute;
    top:75px;
    right:25px;

}

p#players {
    text-align:center;
    margin-top:30px;
    font-family:georgia;
}

/*aside left: affichage scores */

#winners{
    border-collapse: collapse;
    text-align: center;
    position : absolute;
    width : 200px;
    margin-left : 20px;
    top:200px;
    left:30px;
    font-family : Georgia;

}
caption{
    height: 40px;
    font-weight: bold;
}
/*Body*/

body {
    background-image: url("../images/fond_vert.jpeg");
}

#corps{
    width: 100%;
    min-height: 370px;
}

/*Aside*/

aside {
    position : absolute;
    width : 350px;
    margin-right : 20px;
    top:200px;
    right:30px;
    font-family : Georgia;
    text-align: justify;
}

#rules {
    text-decoration:none;
    font-family : Georgia;
    margin-left : 90px;
}

aside p span {
    font-size: 12px;
}

h3 {
    margin-bottom: 30px;
}

a, span {
    margin-top:20px;
}

#resetBtn, #play {
    float : left;
    margin-top: 16px;
    margin-left : 8px;
}

#play {
    margin-left: 42px;
}

/*Board*/
#board {
    top : 30px;
    position:relative;
    width: 380px;
    margin: auto;
}
table{
    border-collapse: collapse;
    vertical-align: middle;
    margin: auto;
}
th {
    width: 20px;
}
td {
    border: 1px solid black;
    width: 40px;
    height: 40px;
}
td img {
    width: 40px;
    height: 40px;
}

/*CSS ViewEndGame :*/
button.button {
    padding: 0.5em 1em;
    text-decoration: none;
    height : auto;
    margin : 2px;
    border-radius: 5px 5px 5px 5px;
}
#popup {
    position : absolute;
    top:410px;
    left: calc(50% - 150px);
    text-align: center;
    width : 300px;
    margin:auto;
    height : 135px;
    padding : 0.4em;
    background:rgba(255, 255, 255, 0.92);
    border-radius: 5px 5px 5px 5px;


}
#popup h3 {
    margin: 0;
    padding: 0.4em;
    text-align: center;
}

/*Footer*/

footer {
    height:40px;
    text-align : right;
    margin-right : 8px;
    font-family : Georgia;
}

p#team{
    margin-bottom : 40px;
}

/*Form Symfony : New Play (register) + login */

label.required {
    margin: 10px;
    margin-left : 520px;
    font-family: Georgia;
}

input#form_login{
    margin-top: 100px;
    margin-bottom:10px;
    margin-left : 27px;
    width : 200px;
    height : auto;
}

input#form_password {
    width : 200px;
    height : auto
}

input.envoyer {
    margin-left: 737px;
    margin-top : 10px;
}

#popup {display:none;}

/*Tableau liste des parties*/

table#liste {
    width : 60%;
    text-align: center;
    font-family : Georgia;
    margin-top : 30px;
}

table#liste th, td {
    border: 1px solid #15641D;
}

table#liste th {
    height: 40px;;
    width : 200px;
}

table#liste td:hover {
    background-color: #76F383;
}

button#creation {
    position: absolute;
    margin-top : 00px;
    margin-left : 80px;
    width : 130px;
    height:40px;
    font-size: 14px;
}