:root {
  --main-bg-color: Black;
  --main-text-color : white;
  --main-text-color-hover : black;
}

body {
 background-color: var(--main-bg-color);
 text-align: center;
}

#logo{
    -webkit-filter: invert(1);
    filter: invert(1);
    width: 80vw;
/*    min-width: 330px;*/
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}

h1{
    color: var(--main-text-color);
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 50px;
    margin: 4px 2px;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}

.Bouton {
        background-color: var(--main-bg-color);
/*        couleur caré autour*/
        border: 2px solid white;
        border-radius: 50px;
        color: var(--main-text-color);
        padding: 20px 0px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 250%;
        margin: 10px 2px; /*Marge après bouton*/
        cursor: pointer;
        width : 80%;
        min-width: 150px;
}

.Credit {
    color: var(--main-text-color);
    font-size: 30px;
    margin: 0px 0px;
}

@media (min-width: 1200px) {
     #logo{
        -webkit-filter: invert(1);
        filter: invert(1);
        width: 10vw;
        min-width: 330px;
        -webkit-user-select: none; /* Safari */
        -ms-user-select: none; /* IE 10 and IE 11 */
        user-select: none; /* Standard syntax */
    }

    h1{
        color: var(--main-text-color);
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 30px;
        margin: 4px 2px;
        -webkit-user-select: none; /* Safari */
        -ms-user-select: none; /* IE 10 and IE 11 */
        user-select: none; /* Standard syntax */
    }

    .Bouton {
            background-color: var(--main-bg-color);
    /*        couleur caré autour*/
            border: 2px solid white;
            border-radius: 34px;
            color: var(--main-text-color);
            padding: 20px 0px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 20px;
            margin: 10px 2px; /*Marge après bouton*/
            cursor: pointer;
            width : 15%;
            min-width: 150px;
    }
    .Credit {
        color: var(--main-text-color);
        font-size: 15px;
        margin: 0px 0px;
    }
}

.Bouton:hover {
  background-color: white; /* Green */
  color: var(--main-text-color-hover);
}

.MotCle {
    color: var(--main-bg-color);
    /*-webkit-touch-callout: none;
    -khtml-user-select: none;
    -moz-user-select: none;*/
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
    font-size: 2px;
    margin: 0px 0px;
}