/*

s

*/
/* 
    Created on : 1 avr. 2019, 13:56:48
    Author     : alexis
*/

/*******************************************************************************
                    Give a new family font
*******************************************************************************/
@font-face {
  font-family: Pokemon;
  src: url(../font/Pokemon_Solid.ttf);
}

/*******************************************************************************
                    hi
*******************************************************************************/
html
{
    overflow: hidden;

    
}

/*******************************************************************************
                    Give the size and position of the points
*******************************************************************************/
body{
    width:100%;
    height: 90%;
    color:black;
    top: 0;
    left: 0;
    font-family: Pokemon;
    font-size: 20px;
}

/*******************************************************************************
                    Give the size and position of the points
*******************************************************************************/
h1{
    position:relative;
    top:0%;
    left:45%;
}

/*******************************************************************************
                    Give the size and position of the points
*******************************************************************************/
#cadre{
    border-color: #000000;
    background-color: #E0E0E0;
    height: 500px;
    position: absolute;
    display: inline-block;
    width: 400px;
    top:17%;
    border: 5px solid #FFFFFF;
    visibility: hidden;
    left:39%;
}


/*******************************************************************************
                    Give the size and position of the points
*******************************************************************************/
#pseudo{
    position: relative;
    top:45%;
    left:40%;
}

/*******************************************************************************
                    Give the size and position of the points
*******************************************************************************/
#pseudoJoueur{
    position: absolute;
    font-size: 24px;
    display: inline-block;
    right:5%;
    top:33%;
}


/*******************************************************************************
                    Give the size and position of the points
*******************************************************************************/
#Points{
    position: absolute;
    right:5%;
    top:38%;
    font-size: 24px;
    display: inline-block;
    
}
/*******************************************************************************
                         put the position of the time
*******************************************************************************/
#time{
    position: relative;
    left:5%;
    font-size: 20px;
}


/*******************************************************************************
                         
*******************************************************************************/
#jeux
{
    width: 100%;
}


/*******************************************************************************
                         hide the restart option
*******************************************************************************/
#fin{
    visibility:hidden;
    position: relative;
    top : 25%;
    left:25%;
    width: 600px;
}

/*******************************************************************************
                         position the div of restart option
*******************************************************************************/
#restart{
    position: relative;
    width: 300px;
    left:150px;
}


/*******************************************************************************
                 position the text input for the pseudo
*******************************************************************************/
#pseudoTextReplay
{
    position: absolute;
    top:55px;
    left: 220px;
}


/*******************************************************************************
                 position the yes/no button for restart
*******************************************************************************/
.buttonRes {
    position: absolute;
    top : 90px;
}


/*******************************************************************************
                 posistion the image on background of the footer
*******************************************************************************/
footer{
    position: absolute;
    background-image: url("../img/fondSol.png");
    height: 10vh;
    width: 100%;
    bottom:  0vh;
    left : 0px;
}

/*******************************************************************************
                posistion the image on background of the body
*******************************************************************************/
#fond {
    height: 100%;
    position:absolute;
    top:0%;
    left:0%;
}

/*******************************************************************************
                             posistion the yes button
*******************************************************************************/
#yes{
    position: absolute;
    left: 25%;
}

/*******************************************************************************
                              posistion the no button
*******************************************************************************/
#no{
    position: absolute;
    right: 25%;
}