@font-face {
	font-family: 'Until';
	src: url("../police/main/UntilIDie.otf") /*domaine publique*/
}
@font-face {
	font-family: 'HelpMe';
	src: url("../police/HelpMe.ttf") /*This font are licensed under the SIL Open Font License, Version 1.1. Free fro all*/
}
*,
*:before,
*:after{
    padding: 0;
    margin: 0;
    /*overflow: hidden;*/
}
a {
    text-decoration: none;
}
.background {
    height: 100%;
    width: 500%;
    position: fixed;
    transition: all 2s ease;
    transform: translate(0%);
    background: -webkit-linear-gradient(145deg, rgb(191, 84, 253) 40%, rgb(221, 181, 49) 100%);
    animation: rest 7s linear infinite;
    z-index: -1;
}
@keyframes rest {
    0%{transform: translate(0%);}
    50%{transform: translate(-50%);}
    100%{transform: translate(0%);}
}
body {
    height: 100%;
    width: 100%;  
}
.reseau {
    height: 25px;
    padding-top: 20px;
    position: fixed;
    right: 40px; 
}
img {
    height: 25px;
    padding-top: 20px;
    position: fixed;
    right: 10px;
}
.halw {
    font-size: 200%;
    margin-top: -0.5vw;
    position: fixed;
}
.choose {
    font-family: 'Until', sans-serif;
    height: 30%;
    width: 100%;
    margin-top: 5%;
    position: absolute;
    text-align: center;
    font-size: 340%;
    background: -webkit-linear-gradient(180deg, rgb(255, 174, 0) 30%, rgb(255,235,0,1) 50%, rgb(255, 174, 0) 70%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    z-index: 0;
}
.centers {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    z-index: -1;
}
.s {
    text-align: center;
    font-size: 20000%;
    background: -webkit-linear-gradient(195deg, rgb(255, 255, 255) 40%, rgb(115, 115, 115) 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transform: rotate(289deg);
    font-family: monospace;
    z-index: -2;
}
.allsite {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    background: -webkit-linear-gradient(180deg, rgb(255, 174, 0) 30%, rgb(255,235,0,1) 50%, rgb(255, 174, 0) 70%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    z-index: 2;
}
.allsite ul {
    margin-top: 40vh;
}
.allsite li {
    display: inline;
    font-size: 2.5vw;
    font-style: bold;
    border: 5px white solid;
    margin: 0;
    font-family: fantasy;
    padding: 10px 35px;
}
.allsite li:hover {
    background-color: rgb(255, 255, 255, 0.5);
}
.phantom {
    border: 8px rgb(238, 167, 34) solid;
    position: absolute;
    padding: 10px 10px;
    border-radius: 29px;
    border-left: none;
    border-right: none;
}
.phantombis {
    border: 8px rgb(243, 167, 34) solid;
    position: absolute;
    padding: 10px 20px;
    border-radius: 34px;
    border-left: none;
    border-right: none;
}
.phantombisbis {
    border: 8px rgb(241, 167, 34) solid;
    position: absolute;
    padding: 10px 30px;
    border-radius: 39px;
    border-left: none;
    border-right: none;
    z-index: -1;
}
.phantombisbisbis {
    border: 8px rgb(241, 167, 34) solid;
    position: absolute;
    padding: 10px 40px;
    border-radius: 44px;
    border-left: none;
    border-right: none;
    z-index: -1;
}
#liright {
    border-radius: 0 20px 20px 0;
    border-right: none;
    margin-left: -5px;
}
#lileft {
    border-radius: 20px 0 0 20px;
    border-left: none;
    margin-right: -5px;
}
.allsite ul :nth-child(2) {
    margin-right: -2.5px;
}
.allsite ul :nth-child(3) {
    margin-left: -2.5px;
}
#b {
    text-decoration: none;
    color: rgb(255, 255, 255);
}
#b:hover {
    text-decoration: underline;
    background-color: rgba(255, 222, 173, 0);
}
.newcenter {
    width: 100%;
    margin-top: 10%;
    text-align: center;
    color:rgb(255, 255, 255);
    animation: newcenter 0.5s linear infinite;
}
b {
    font-size: 150%;
}
@keyframes newcenter {
    from { color:rgb(255, 255, 255);}
    to { color:rgb(255, 0, 0);}
}
.new {
    width: 100%;
    /* margin-left: 41%; */
    display: flex;
    align-items: center;
    justify-content: center;
    height: 10vh;
    margin-top: 1%;
}
.newul li {
    margin-top: 5%;
}
.innew {
    background-color: rgb(49,49,49);
    width: auto;
    padding: 0.2%;
    border: 3px solid red;
    box-shadow: 0 0em 0.7em 0.5em rgb(49,49,49);
    animation: new1 0.7s ease infinite;
}
.wargames {
    height: 5.5vh; 
    border: 3px solid rgb(255, 255, 255);
    box-shadow: 0 0 5rem rgb(49,49,49);
    text-align: center;
    font-size: 5vh;
    background: -webkit-linear-gradient(90deg, rgb(170, 170, 170) 0%, rgb(49, 49, 49) 60%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: new2 0.7s linear infinite;
}
@keyframes new1 {
    from {border: 3px solid rgb(255, 0, 0);}
    to {border: 3px solid rgb(255, 255, 255);}
}
@keyframes new2 {
    from {border: 3px solid rgb(255, 0, 0);}
    to {border: 3px solid rgb(255, 255, 255);}
}
.static {
    height: 5.5vh; 
    border: 1px solid rgb(255, 255, 255);
    border-radius: 10px;
    box-shadow: 0 0 5rem rgb(255, 255, 255);
    text-align: center;
    font-size: 5vh;
    font-style: italic;
    background: -webkit-linear-gradient(90deg, rgb(170, 170, 170) 20%, rgba(49, 49, 49,0) 60%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.innewstatic {
    background-color: rgba(115, 115, 115,0);
}
.credit {
    position: absolute;
    bottom: 0;
    width: 100%;
    color: white;
    text-align: center;
}
@media (max-width: 900px) {
    li {
        text-align: center;
        display: block;
    }
    ul {
        margin-top: 22vh;
    }
    #liright {
        border-radius: 0 0px 20px 20px;
        border-bottom: none;
        border-right: 5px solid white;
    }
    #lileft {
        border-radius: 20px 20px 0 0;
        border-top: none;
        border-left: 5px solid white;
    }
    ul :nth-child(2) {
        margin-right: 0px;
    }
    ul :nth-child(3) {
        margin-left: 0px;
    }
    .reseau {
        /*height: 55px;
        right: 70px; */
    }
    img {
       /* height: 55px;
        right: 10px;*/
    }
    .s {
        transform: rotate(210deg);
        background: -webkit-linear-gradient(146deg, rgb(255, 255, 255) 40%, rgb(115, 115, 115) 80%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
}