.background {
    background: url("../Ressources/image/Background.png");
    background-size: cover;
    z-index: -10;
    position: absolute;
    top:0;
    width: 100vw;
    height: 100vh;
}

#splashScreen{
    
}

#startAnimation > img {
    background-size: cover;
    height: 100vh;
    width: 100%;
    object-fit: cover;
    position: fixed;
    z-index: -1;
    top: 0;
}

#startAnimation > h1 {
    width: 100%;
    text-align: center;
    font-size: 3em;
    background-color: #00000096;
    line-height: 4em;
}

#startAnimation > input {
    position: absolute;
    left: 50%;
    bottom: var(--bottom-bar-size);
    transform: translate(-50%);
}

#kg {
    color: red;
    font-weight: bold;
    font-size: 2.4em;
    text-align: center;
}

img {
 /*object-fit: scale-down;*/
 max-width: 100%;
}

.textInf{
    
    text-align: center;
    position: absolute;
    bottom: 50%;
    transform: translate(0, 50%);
    width: 250px;
    color: yellow;
    margin-left: 3%;
    
    /*
    text-align: center;
    position: absolute;
    bottom: 50%;
    transform: translate(0, 50%);
    width: 250px;
    background: linear-gradient(180deg, rgb(70 152 209),rgb(0 72 120));
    box-shadow: 0 0px 20px 0px white, 0 1px 25px 0px white, 12px 0 15px -4px rgb(31 73 125 / 80%), -12px 0 15px -4px rgb(31 73 125 / 80%);
    margin-left: 3%;
    */
}

.textInf > p{
    text-shadow: var(--text-shadow)
}

.textSup{
    text-align: center;
    position: absolute;
    top: 50px;
    width: 100%;
}

.textSup > p {
    font-size: 1.4em;
    font-weight: bold;
    text-shadow: var(--text-shadow);
}

/*.twosections > .textInf, .twosections > .textSup  {
    width: calc(100% - var(--lateral-panel-size));
}*/

.hover {
    position: absolute;
    max-width: 500px;
    text-align: center;
    transform: translate(-50%);
    width: 400px;
    background-color: #0000005e;
}
.hover > img {
    width: 80%;
}

.hover > p {
    text-shadow: var(--text-shadow)
}

::-moz-selection {
    background-color: transparent;
}

::selection {
    background-color: transparent;
}

.zoomin{
    animation: zoomin 5s;
}

.fadein{
    animation: fadein 2s;
}

.zoominshort{
    animation: zoomin 1s;
    font-size: 21px;
}

.panelText{
    font-size: 28px;
    margin: 30px;
}

@keyframes zoomin {
    from { 
        opacity: 0%;
        transform: scale(10);
    }
    to {
        opacity: 100%;
        transform: scale(1);
    }
}

@keyframes fadein {
    from {
        opacity: 0%;
    }

    to {
        opacity: 100%;
    }
}