* {
    box-sizing: border-box;
}

html, body {
    width: 100%;
    height: 100%;
}

body
{
    margin: 0;
    padding: 0;
    background: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
}

@keyframes change{
        0%{background-color: rgb(26, 85, 211)}
        33.49%{background-color: rgb(26, 85, 211)}
        33.5%{background-color: rgb(223, 172, 77)}
        68.99%{background-color: rgb(223, 172, 77)}
        69%{background-color: rgb(209, 86, 70)}
        100%{background-color: rgb(209, 86, 70)}
  }

::selection {
    background-color: rgb(186, 190, 199);
    color: rgb(186, 190, 199);
}

::-moz-selection {
    background-color: rgb(186, 190, 199);
    color: rgb(186, 190, 199);
}

h1 {
    font-family: ChicagoFLF, sans-serif;
    position: left;
    margin-left: 1.5vw;
    margin-right: 1.5vw;
    line-height: 1.2;
    font-size: 5vw;
    color: rgb(0, 0, 0);
    animation: changelegendes 12s infinite;
    animation-delay: 6s;
}

@font-face {
    font-family: "ChicagoFLF";
    src: url("../fonts/ChicagoFLF.ttf") format('truetype');
    }

@keyframes changetexte {
    0%{
    opacity: 100%;
    }

    22%{
    opacity: 100%;
    }

    23%{
    opacity: 0%;
    }

    99%{
    opacity: 0%;
    }

    100%{
    opacity: 100%;
    }
    }

    p{
        font-family: ChicagoFLF, sans-serif;
        position: left;
        margin-left: 1.5vw;
        margin-right: 1.5vw;
        line-height: 1.2;
        font-size: 1.8vw;
        color: rgb(0, 0, 0);
        animation: changelegendes 12s infinite;
        animation-delay: 6s;
    }

    @keyframes changelegendes {
        0%{color: rgb(209, 86, 70)}
        33.49%{color: rgb(209, 86, 70)}
        33.5%{color: rgb(26, 85, 211)}
        68.99%{color: rgb(26, 85, 211)}
        69%{color: rgb(223, 172, 77)}
        100%{color: rgb(223, 172, 77)}
        }

        @keyframes changelegendes {
            0%{color: rgb(209, 86, 70)}
            33.49%{color: rgb(209, 86, 70)}
            33.5%{color: rgb(26, 85, 211)}
            68.99%{color: rgb(26, 85, 211)}
            69%{color: rgb(223, 172, 77)}
            100%{color: rgb(223, 172, 77)}
            }

            .rectgrand {
                fill: rgb(0, 0, 0);
                animation: change2 6s forwards;
                z-index: 100;
            }
            
            .rectgrand:hover {
                cursor: pointer;
                opacity: 0;
            }
        
            @keyframes change2 {
                0%{opacity: 100}
                99.99%{opacity: 100}
                100%{opacity: 0}
            }

.Icone1rect {

    position: -webkit-sticky; /* Safari */
    position: relative;
    box-sizing: border-box;
    width: calc(300%/5 - 20px);
    width: calc(300%/5 - 20px);
    margin-left: auto;
    margin-right: auto;
    top:20px;
    z-index:100;
    /*animation: change5 6s ease-out;
    animation-iteration-count: 1;
    animation-delay: 0s;*/
}

.Icone1grille {

    position: -webkit-sticky; /* Safari */
    position: fixed;
    box-sizing: border-box;
    width: calc(300%/5 - 2.5vw);
    width: calc(300%/5 - 2.5vw);
    left: 50%;
    right: 50%;
    transform: translate(-50%, 0);
    top:20px;
    z-index:200;
    /*animation: change5 6s ease-out;
    animation-iteration-count: 1;
    animation-delay: 0s;*/
}

@keyframes change5 {
    0% {
    transform: scale(0.75);
    }

    75% {
    transform: scale(0.75);
    }

    100% {
    transform: scale(1);
    }
    }

.a{
    width: 1vw;
    height: 1vw;
}


.Icone7 {
    position: fixed;
    width: 50px;
    height: 50px;
    margin-left: 1300px;
    margin-right: 800px;
    top: 450px;
    z-index:300;
}

.rect11 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    position: fixed;
    animation: change11 6s infinite;
    animation-delay: 2s;
}

@keyframes change11 {
    0%{
    fill: rgb(26, 85, 211);
    opacity: 0%;
    }

    20%{
    opacity: 0%;
    }

    21%{
    opacity: 100%;
    }

    33.33%{
    fill: rgb(223, 172, 77);
    opacity: 100%;
    }

    66.66%{
    fill: rgb(209, 86, 70);
    opacity: 100%;
    }

    99%{
    opacity: 100%;
    }

    100%{
    fill: rgb(26, 85, 211);
    opacity: 0%;
    }
    }

.rect12 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    position: fixed;
    animation: change12 6s infinite;
    animation-delay: 2s;
}

@keyframes change12 {
    0%{
    fill: rgb(26, 85, 211);
    opacity: 0%;
    }

    22%{
    opacity: 0%;
    }

    23%{
    opacity: 100%;
    }

    33.33%{
    fill: rgb(223, 172, 77);
    opacity: 100%;
    }

    66.66%{
    fill: rgb(209, 86, 70);
    opacity: 100%;
    }

    99%{
    opacity: 100%;
    }

    100%{
    fill: rgb(26, 85, 211);
    opacity: 0%;
    }
    }

    .rect13 {
        fill: rgb(0, 0, 0);
        background-color: rgb(0, 0, 0);
        position: fixed;
        animation: change13 6s infinite;
        animation-delay: 2s;
    }

    @keyframes change13 {
        0%{
        fill: rgb(26, 85, 211);
        opacity: 0%;
        }

        24%{
        opacity: 0%;
        }

        25%{
        opacity: 100%;
        }

        33.33%{
        fill: rgb(223, 172, 77);
        opacity: 100%;
        }

        66.66%{
        fill: rgb(209, 86, 70);
        opacity: 100%;
        }

        99%{
        opacity: 100%;
        }

        100%{
        fill: rgb(26, 85, 211);
        opacity: 0%;
        }
        }

        .rect14 {
            fill: rgb(0, 0, 0);
            background-color: rgb(0, 0, 0);
            position: fixed;
            animation: change14 6s infinite;
            animation-delay: 2s;
        }

        @keyframes change14 {
            0%{
            fill: rgb(26, 85, 211);
            opacity: 0%;
            }

            26%{
            opacity: 0%;
            }

            27%{
            opacity: 100%;
            }

            33.33%{
            fill: rgb(223, 172, 77);
            opacity: 100%;
            }

            66.66%{
            fill: rgb(209, 86, 70);
            opacity: 100%;
            }

            99%{
            opacity: 100%;
            }

            100%{
            fill: rgb(26, 85, 211);
            opacity: 0%;
            }
            }

            .rect15 {
                fill: rgb(0, 0, 0);
                background-color: rgb(0, 0, 0);
                position: fixed;
                animation: change15 6s infinite;
                animation-delay: 2s;
            }

            @keyframes change15 {
                0%{
                fill: rgb(26, 85, 211);
                opacity: 0%;
                }

                28%{
                opacity: 0%;
                }

                29%{
                opacity: 100%;
                }

                33.33%{
                fill: rgb(223, 172, 77);
                opacity: 100%;
                }

                66.66%{
                fill: rgb(209, 86, 70);
                opacity: 100%;
                }

                99%{
                opacity: 100%;
                }

                100%{
                fill: rgb(26, 85, 211);
                opacity: 0%;
                }
                }

                .rect16 {
                    fill: rgb(0, 0, 0);
                    background-color: rgb(0, 0, 0);
                    position: fixed;
                    animation: change16 6s infinite;
                    animation-delay: 2s;
                }

                @keyframes change16 {
                    0%{
                    fill: rgb(26, 85, 211);
                    opacity: 0%;
                    }

                    30%{
                    opacity: 0%;
                    }

                    31%{
                    opacity: 100%;
                    }

                    33.33%{
                    fill: rgb(223, 172, 77);
                    opacity: 100%;
                    }

                    66.66%{
                    fill: rgb(209, 86, 70);
                    opacity: 100%;
                    }

                    99%{
                    opacity: 100%;
                    }

                    100%{
                    fill: rgb(26, 85, 211);
                    opacity: 0%;
                    }
                    }

                    .rect17 {
                        fill: rgb(0, 0, 0);
                        background-color: rgb(0, 0, 0);
                        position: fixed;
                        animation: change17 6s infinite;
                        animation-delay: 2s;
                    }

                    @keyframes change17 {
                        0%{
                        fill: rgb(26, 85, 211);
                        opacity: 0%;
                        }

                        33.33%{
                        fill: rgb(223, 172, 77);
                        opacity: 0%;
                        }

                        34%{
                        opacity: 0%;
                        }

                        35%{
                        opacity: 100%;
                        }

                        66.66%{
                        fill: rgb(209, 86, 70);
                        opacity: 100%;
                        }

                        99%{
                        opacity: 100%;
                        }

                        100%{
                        fill: rgb(26, 85, 211);
                        opacity: 0%;
                        }
                        }

                        .rect18 {
                            fill: rgb(0, 0, 0);
                            background-color: rgb(0, 0, 0);
                            position: fixed;
                            animation: change18 6s infinite;
                            animation-delay: 2s;
                        }

                        @keyframes change18 {
                            0%{
                            fill: rgb(26, 85, 211);
                            opacity: 0%;
                            }

                            33.33%{
                            fill: rgb(223, 172, 77);
                            opacity: 0%;
                            }

                            35%{
                            opacity: 0%;
                            }

                            36%{
                            opacity: 100%;
                            }

                            66.66%{
                            fill: rgb(209, 86, 70);
                            opacity: 100%;
                            }

                            99%{
                            opacity: 100%;
                            }

                            100%{
                            fill: rgb(26, 85, 211);
                            opacity: 0%;
                            }
                            }

                            .rect19 {
                                fill: rgb(0, 0, 0);
                                background-color: rgb(0, 0, 0);
                                position: fixed;
                                animation: change19 6s infinite;
                                animation-delay: 2s;
                            }

                            @keyframes change19 {
                                0%{
                                fill: rgb(26, 85, 211);
                                opacity: 0%;
                                }

                                33.33%{
                                fill: rgb(223, 172, 77);
                                opacity: 0%;
                                }

                                36%{
                                opacity: 0%;
                                }

                                37%{
                                opacity: 100%;
                                }

                                66.66%{
                                fill: rgb(209, 86, 70);
                                opacity: 100%;
                                }

                                99%{
                                opacity: 100%;
                                }

                                100%{
                                fill: rgb(26, 85, 211);
                                opacity: 0%;
                                }
                                }

                                .rect110 {
                                    fill: rgb(0, 0, 0);
                                    background-color: rgb(0, 0, 0);
                                    position: fixed;
                                    animation: change110 6s infinite;
                                    animation-delay: 2s;
                                }

                                @keyframes change110 {
                                    0%{
                                    fill: rgb(26, 85, 211);
                                    opacity: 0%;
                                    }

                                    33.33%{
                                    fill: rgb(223, 172, 77);
                                    opacity: 0%;
                                    }

                                    38%{
                                    opacity: 0%;
                                    }

                                    39%{
                                    opacity: 100%;
                                    }

                                    66.66%{
                                    fill: rgb(209, 86, 70);
                                    opacity: 100%;
                                    }

                                    99%{
                                    opacity: 100%;
                                    }

                                    100%{
                                    fill: rgb(26, 85, 211);
                                    opacity: 0%;
                                    }
                                    }

                                    .rect111 {
                                        fill: rgb(0, 0, 0);
                                        background-color: rgb(0, 0, 0);
                                        position: fixed;
                                        animation: change111 6s infinite;
                                        animation-delay: 2s;
                                    }

                                    @keyframes change111 {
                                        0%{
                                        fill: rgb(26, 85, 211);
                                        opacity: 0%;
                                        }

                                        33.33%{
                                        fill: rgb(223, 172, 77);
                                        opacity: 0%;
                                        }

                                        41%{
                                        opacity: 0%;
                                        }

                                        42%{
                                        opacity: 100%;
                                        }

                                        66.66%{
                                        fill: rgb(209, 86, 70);
                                        opacity: 100%;
                                        }

                                        99%{
                                        opacity: 100%;
                                        }

                                        100%{
                                        fill: rgb(26, 85, 211);
                                        opacity: 0%;
                                        }
                                        }

                                        .rect112 {
                                            fill: rgb(0, 0, 0);
                                            background-color: rgb(0, 0, 0);
                                            position: fixed;
                                            animation: change112 6s infinite;
                                            animation-delay: 2s;
                                        }

                                        @keyframes change112 {
                                            0%{
                                            fill: rgb(26, 85, 211);
                                            opacity: 0%;
                                            }

                                            33.33%{
                                            fill: rgb(223, 172, 77);
                                            opacity: 0%;
                                            }

                                            43%{
                                            opacity: 0%;
                                            }

                                            44%{
                                            opacity: 100%;
                                            }

                                            66.66%{
                                            fill: rgb(209, 86, 70);
                                            opacity: 100%;
                                            }

                                            99%{
                                            opacity: 100%;
                                            }

                                            100%{
                                            fill: rgb(26, 85, 211);
                                            opacity: 0%;
                                            }
                                            }

                                            .rect113 {
                                                fill: rgb(0, 0, 0);
                                                background-color: rgb(0, 0, 0);
                                                position: fixed;
                                                animation: change113 6s infinite;
                                                animation-delay: 2s;
                                            }

                                            @keyframes change113 {
                                                0%{
                                                fill: rgb(26, 85, 211);
                                                opacity: 0%;
                                                }

                                                33.33%{
                                                fill: rgb(223, 172, 77);
                                                opacity: 0%;
                                                }

                                                48%{
                                                opacity: 0%;
                                                }

                                                49%{
                                                opacity: 100%;
                                                }

                                                66.66%{
                                                fill: rgb(209, 86, 70);
                                                opacity: 100%;
                                                }

                                                99%{
                                                opacity: 100%;
                                                }

                                                100%{
                                                fill: rgb(26, 85, 211);
                                                opacity: 0%;
                                                }
                                                }

                                                .rect114 {
                                                    fill: rgb(0, 0, 0);
                                                    background-color: rgb(0, 0, 0);
                                                    position: fixed;
                                                    animation: change114 6s infinite;
                                                    animation-delay: 2s;
                                                }

                                                @keyframes change114 {
                                                    0%{
                                                    fill: rgb(26, 85, 211);
                                                    opacity: 0%;
                                                    }

                                                    33.33%{
                                                    fill: rgb(223, 172, 77);
                                                    opacity: 0%;
                                                    }

                                                    49%{
                                                    opacity: 0%;
                                                    }

                                                    50%{
                                                    opacity: 100%;
                                                    }

                                                    66.66%{
                                                    fill: rgb(209, 86, 70);
                                                    opacity: 100%;
                                                    }

                                                    99%{
                                                    opacity: 100%;
                                                    }

                                                    100%{
                                                    fill: rgb(26, 85, 211);
                                                    opacity: 0%;
                                                    }
                                                    }

                                                    .rect115 {
                                                        fill: rgb(0, 0, 0);
                                                        background-color: rgb(0, 0, 0);
                                                        position: fixed;
                                                        animation: change115 6s infinite;
                                                        animation-delay: 2s;
                                                    }

                                                    @keyframes change115 {
                                                        0%{
                                                        fill: rgb(26, 85, 211);
                                                        opacity: 0%;
                                                        }

                                                        33.33%{
                                                        fill: rgb(223, 172, 77);
                                                        opacity: 0%;
                                                        }

                                                        52%{
                                                        opacity: 0%;
                                                        }

                                                        53%{
                                                        opacity: 100%;
                                                        }

                                                        66.66%{
                                                        fill: rgb(209, 86, 70);
                                                        opacity: 100%;
                                                        }

                                                        99%{
                                                        opacity: 100%;
                                                        }

                                                        100%{
                                                        fill: rgb(26, 85, 211);
                                                        opacity: 0%;
                                                        }
                                                        }

                                                        .rect116 {
                                                            fill: rgb(0, 0, 0);
                                                            background-color: rgb(0, 0, 0);
                                                            position: fixed;
                                                            animation: change116 6s infinite;
                                                            animation-delay: 2s;
                                                        }

                                                        @keyframes change116 {
                                                            0%{
                                                            fill: rgb(26, 85, 211);
                                                            opacity: 0%;
                                                            }

                                                            33.33%{
                                                            fill: rgb(223, 172, 77);
                                                            opacity: 0%;
                                                            }

                                                            53%{
                                                            opacity: 0%;
                                                            }

                                                            54%{
                                                            opacity: 100%;
                                                            }

                                                            66.66%{
                                                            fill: rgb(209, 86, 70);
                                                            opacity: 100%;
                                                            }

                                                            99%{
                                                            opacity: 100%;
                                                            }

                                                            100%{
                                                            fill: rgb(26, 85, 211);
                                                            opacity: 0%;
                                                            }
                                                            }

                                                            .rect117 {
                                                                fill: rgb(0, 0, 0);
                                                                background-color: rgb(0, 0, 0);
                                                                position: fixed;
                                                                animation: change117 6s infinite;
                                                                animation-delay: 2s;
                                                            }

                                                            @keyframes change117 {
                                                                0%{
                                                                fill: rgb(26, 85, 211);
                                                                opacity: 0%;
                                                                }

                                                                33.33%{
                                                                fill: rgb(223, 172, 77);
                                                                opacity: 0%;
                                                                }

                                                                55%{
                                                                opacity: 0%;
                                                                }

                                                                56%{
                                                                opacity: 100%;
                                                                }

                                                                66.66%{
                                                                fill: rgb(209, 86, 70);
                                                                opacity: 100%;
                                                                }

                                                                99%{
                                                                opacity: 100%;
                                                                }

                                                                100%{
                                                                fill: rgb(26, 85, 211);
                                                                opacity: 0%;
                                                                }
                                                                }

.rect9a {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9a 20s infinite;
}

@keyframes change9a {
    /* 9a à 9e */
    0%{opacity: 0%}
    1.99%{opacity: 0%}
    2%{opacity: 0%}
    5.99%{opacity: 0%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 100%}
    29.49%{opacity: 100%}

    29.5%{opacity: 100%}
    33.49%{opacity: 100%}

    33.5%{opacity: 100%}
    35.99%{opacity: 100%}
    36%{opacity: 100%}
    50%{opacity: 100%}
    /* 9f à 9j */
    51.99%{opacity: 100%}
    52%{opacity: 100%}
    55.99%{opacity: 100%}
    56%{opacity: 0%}
    61.49%{opacity: 0%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 0%}
    79.49%{opacity: 0%}
    79.5%{opacity: 0%}
    83.49%{opacity: 0%}
    83.5%{opacity: 0%}
    85.99%{opacity: 0%}
    86%{opacity: 0%}
    100%{opacity: 0%}
}

.rect9b {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9b 20s infinite;
}

@keyframes change9b {
    /* 9a à 9e */
    0%{opacity: 100%}
    1.99%{opacity: 100%}
    2%{opacity: 0%}
    5.99%{opacity: 0%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 100%}
    29.49%{opacity: 100%}

    29.5%{opacity: 100%}
    33.49%{opacity: 100%}

    33.5%{opacity: 100%}
    35.99%{opacity: 100%}
    36%{opacity: 100%}
    50%{opacity: 100%}
    /* 9f à 9j */
    51.99%{opacity: 100%}
    52%{opacity: 100%}
    55.99%{opacity: 100%}
    56%{opacity: 100%}
    61.49%{opacity: 100%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 0%}
    79.49%{opacity: 0%}
    79.5%{opacity: 0%}
    83.49%{opacity: 0%}
    83.5%{opacity: 0%}
    85.99%{opacity: 0%}
    86%{opacity: 0%}
    100%{opacity: 0%}
}

.rect9c {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9c 20s infinite;
}

@keyframes change9c {
    /* 9a à 9e */
    0%{opacity: 0%}
    1.99%{opacity: 0%}
    2%{opacity: 0%}
    5.99%{opacity: 0%}
    6%{opacity: 100%}
    11.49%{opacity: 100%}
    11.5%{opacity: 100%}
    18.99%{opacity: 100%}
    19%{opacity: 100%}
    29.49%{opacity: 100%}

    29.5%{opacity: 100%}
    33.49%{opacity: 100%}

    33.5%{opacity: 100%}
    35.99%{opacity: 100%}
    36%{opacity: 0%}
    50%{opacity: 0%}
    /* 9f à 9j */
    51.99%{opacity: 0%}
    52%{opacity: 0%}
    55.99%{opacity: 0%}
    56%{opacity: 0%}
    61.49%{opacity: 0%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 0%}
    79.49%{opacity: 0%}
    79.5%{opacity: 0%}
    83.49%{opacity: 0%}
    83.5%{opacity: 0%}
    85.99%{opacity: 0%}
    86%{opacity: 0%}
    100%{opacity: 0%}
}

.rect9d {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9d 20s infinite;
}

@keyframes change9d {
    /* 9a à 9e */
    0%{opacity: 0%}
    1.99%{opacity: 0%}
    2%{opacity: 100%}
    5.99%{opacity: 100%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 0%}
    29.49%{opacity: 0%}

    29.5%{opacity: 100%}
    33.49%{opacity: 100%}

    33.5%{opacity: 100%}
    35.99%{opacity: 100%}
    36%{opacity: 100%}
    50%{opacity: 100%}
    /* 9f à 9j */
    51.99%{opacity: 100%}
    52%{opacity: 100%}
    55.99%{opacity: 100%}
    56%{opacity: 0%}
    61.49%{opacity: 0%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 0%}
    79.49%{opacity: 0%}
    79.5%{opacity: 0%}
    83.49%{opacity: 0%}
    83.5%{opacity: 0%}
    85.99%{opacity: 0%}
    86%{opacity: 0%}
    100%{opacity: 0%}
}

.rect9e {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9e 20s infinite;
}

@keyframes change9e {
    /* 9a à 9e */
    0%{opacity: 0%}
    1.99%{opacity: 0%}
    2%{opacity: 100%}
    5.99%{opacity: 100%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 0%}
    29.49%{opacity: 0%}

    29.5%{opacity: 100%}
    33.49%{opacity: 100%}

    33.5%{opacity: 100%}
    35.99%{opacity: 100%}
    36%{opacity: 0%}
    50%{opacity: 0%}
    /* 9f à 9j */
    51.99%{opacity: 0%}
    52%{opacity: 0%}
    55.99%{opacity: 0%}
    56%{opacity: 0%}
    61.49%{opacity: 0%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 0%}
    79.49%{opacity: 0%}
    79.5%{opacity: 0%}
    83.49%{opacity: 0%}
    83.5%{opacity: 0%}
    85.99%{opacity: 0%}
    86%{opacity: 0%}
    100%{opacity: 0%}
}

.rect9f {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9f 20s infinite;
}

@keyframes change9f {
    /* 9a à 9e */
    0%{opacity: 100%}
    1.99%{opacity: 100%}
    2%{opacity: 0%}
    5.99%{opacity: 0%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 0%}
    29.49%{opacity: 0%}
    29.5%{opacity: 0%}
    33.49%{opacity: 0%}
    33.5%{opacity: 0%}
    35.99%{opacity: 0%}
    36%{opacity: 0%}
    50%{opacity: 0%}
    /* 9f à 9j */
    51.99%{opacity: 0%}
    52%{opacity: 0%}
    55.99%{opacity: 0%}
    56%{opacity: 0%}
    61.49%{opacity: 0%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 100%}
    79.49%{opacity: 100%}

    79.5%{opacity: 100%}
    83.49%{opacity: 100%}

    83.5%{opacity: 100%}
    85.99%{opacity: 100%}
    86%{opacity: 100%}
    100%{opacity: 100%}
}

.rect9g {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9g 20s infinite;
}

@keyframes change9g {
    /* 9a à 9e */
    0%{opacity: 100%}
    1.99%{opacity: 100%}
    2%{opacity: 100%}
    5.99%{opacity: 100%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 0%}
    29.49%{opacity: 0%}
    29.5%{opacity: 0%}
    33.49%{opacity: 0%}
    33.5%{opacity: 0%}
    35.99%{opacity: 0%}
    36%{opacity: 0%}
    50%{opacity: 0%}
    /* 9f à 9j */
    51.99%{opacity: 0%}
    52%{opacity: 0%}
    55.99%{opacity: 0%}
    56%{opacity: 0%}
    61.49%{opacity: 0%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 100%}
    79.49%{opacity: 100%}

    79.5%{opacity: 100%}
    83.49%{opacity: 100%}

    83.5%{opacity: 100%}
    85.99%{opacity: 100%}
    86%{opacity: 100%}
    100%{opacity: 100%}
}

.rect9h {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9h 20s infinite;
}

@keyframes change9h {
    /* 9a à 9e */
    0%{opacity: 0%}
    1.99%{opacity: 0%}
    2%{opacity: 0%}
    5.99%{opacity: 0%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 0%}
    29.49%{opacity: 0%}
    29.5%{opacity: 0%}
    33.49%{opacity: 0%}
    33.5%{opacity: 0%}
    35.99%{opacity: 0%}
    36%{opacity: 0%}
    50%{opacity: 0%}
    /* 9f à 9j */
    51.99%{opacity: 0%}
    52%{opacity: 0%}
    55.99%{opacity: 0%}
    56%{opacity: 100%}
    61.49%{opacity: 100%}
    61.5%{opacity: 100%}
    68.99%{opacity: 100%}
    69%{opacity: 100%}
    79.49%{opacity: 100%}

    79.5%{opacity: 100%}
    83.49%{opacity: 100%}

    83.5%{opacity: 100%}
    85.99%{opacity: 100%}
    86%{opacity: 0%}
    100%{opacity: 0%}
}

.rect9i {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9i 20s infinite;
}

@keyframes change9i {
    /* 9a à 9e */
    0%{opacity: 100%}
    1.99%{opacity: 100%}
    2%{opacity: 100%}
    5.99%{opacity: 100%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 0%}
    29.49%{opacity: 0%}
    29.5%{opacity: 0%}
    33.49%{opacity: 0%}
    33.5%{opacity: 0%}
    35.99%{opacity: 0%}
    36%{opacity: 0%}
    50%{opacity: 0%}
    /* 9f à 9j */
    51.99%{opacity: 0%}
    52%{opacity: 100%}
    55.99%{opacity: 100%}
    56%{opacity: 0%}
    61.49%{opacity: 0%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 0%}
    79.49%{opacity: 0%}

    79.5%{opacity: 100%}
    83.49%{opacity: 100%}

    83.5%{opacity: 100%}
    85.99%{opacity: 100%}
    86%{opacity: 100%}
    100%{opacity: 100%}
}

.rect9j {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9j 20s infinite;
}

@keyframes change9j {
    /* 9a à 9e */
    0%{opacity: 0%}
    1.99%{opacity: 0%}
    2%{opacity: 0%}
    5.99%{opacity: 0%}
    6%{opacity: 0%}
    11.49%{opacity: 0%}
    11.5%{opacity: 0%}
    18.99%{opacity: 0%}
    19%{opacity: 0%}
    29.49%{opacity: 0%}
    29.5%{opacity: 0%}
    33.49%{opacity: 0%}
    33.5%{opacity: 0%}
    35.99%{opacity: 0%}
    36%{opacity: 0%}
    50%{opacity: 0%}
    /* 9f à 9j */
    51.99%{opacity: 0%}
    52%{opacity: 100%}
    55.99%{opacity: 100%}
    56%{opacity: 0%}
    61.49%{opacity: 0%}
    61.5%{opacity: 0%}
    68.99%{opacity: 0%}
    69%{opacity: 0%}
    79.49%{opacity: 0%}

    79.5%{opacity: 100%}
    83.49%{opacity: 100%}

    83.5%{opacity: 100%}
    85.99%{opacity: 100%}
    86%{opacity: 0%}
    100%{opacity: 0%}
}

.rect81 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change810 10s infinite;
    animation-delay: 10s;
}

@keyframes change810 {
    0%{opacity: 100%}
    3.99%{opacity: 100%}

    4%{opacity: 100%}
    11.99%{opacity: 100%}
    12%{opacity: 100%}
    22.99%{opacity: 100%}
    23%{opacity: 0%}
    37.99%{opacity: 0%}
    38%{opacity: 0%}
    58.99%{opacity: 0%}
    59%{opacity: 0%}
    66.99%{opacity: 0%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}

    72%{opacity: 100%}
    100%{opacity: 100%}
}

.rect82 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change820 10s infinite;
    animation-delay: 10s;
}

@keyframes change820 {
    0%{opacity: 100%}
    3.99%{opacity: 100%}

    4%{opacity: 100%}
    11.99%{opacity: 100%}
    12%{opacity: 100%}
    22.99%{opacity: 100%}
    23%{opacity: 0%}
    37.99%{opacity: 0%}
    38%{opacity: 0%}
    58.99%{opacity: 0%}
    59%{opacity: 0%}
    66.99%{opacity: 0%}
    67%{opacity: 100%}
    71.99%{opacity: 100%}

    72%{opacity: 100%}
    100%{opacity: 100%}
}

.rect83 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change830 10s infinite;
    animation-delay: 10s;
}

@keyframes change830 {
    0%{opacity: 100%}
    3.99%{opacity: 100%}

    4%{opacity: 0%}
    11.99%{opacity: 0%}
    12%{opacity: 0%}
    22.99%{opacity: 0%}
    23%{opacity: 100%}
    37.99%{opacity: 100%}
    38%{opacity: 100%}
    58.99%{opacity: 100%}
    59%{opacity: 100%}
    66.99%{opacity: 100%}
    67%{opacity: 100%}
    71.99%{opacity: 100%}

    72%{opacity: 100%}
    100%{opacity: 100%}
}

.rect84 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change840 10s infinite;
    animation-delay: 10s;
}

@keyframes change840 {
    0%{opacity: 100%}
    3.99%{opacity: 100%}

    4%{opacity: 100%}
    11.99%{opacity: 100%}
    12%{opacity: 100%}
    22.99%{opacity: 100%}
    23%{opacity: 100%}
    37.99%{opacity: 100%}
    38%{opacity: 100%}
    58.99%{opacity: 100%}
    59%{opacity: 0%}
    66.99%{opacity: 0%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}

    72%{opacity: 100%}
    100%{opacity: 100%}
}

.rect86 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change860 10s infinite;
    animation-delay: 10s;
}

@keyframes change860 {
    0%{opacity: 100%}
    3.99%{opacity: 100%}

    4%{opacity: 100%}
    11.99%{opacity: 100%}
    12%{opacity: 0%}
    22.99%{opacity: 0%}
    23%{opacity: 0%}
    37.99%{opacity: 0%}
    38%{opacity: 0%}
    58.99%{opacity: 0%}
    59%{opacity: 0%}
    66.99%{opacity: 0%}
    67%{opacity: 100%}
    71.99%{opacity: 100%}

    72%{opacity: 100%}
    100%{opacity: 100%}
}

.rect5 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change8 10s infinite;
    animation-delay: 10s;
}

@keyframes change8 {
    0%{opacity: 0%}
    3.99%{opacity: 0%}
    4%{opacity: 0%}
    11.99%{opacity: 0%}

    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 0%}
    37.99%{opacity: 0%}
    38%{opacity: 0%}
    58.99%{opacity: 0%}
    59%{opacity: 0%}
    66.99%{opacity: 0%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}
    72%{opacity: 0%}
    100%{opacity: 0%}
}

.rect6a {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change6a 10s infinite;
    animation-delay: 10s;
}

@keyframes change6a {
    0%{opacity: 0%}
    3.99%{opacity: 0%}
    4%{opacity: 100%}
    11.99%{opacity: 100%}

    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 0%}
    37.99%{opacity: 0%}
    38%{opacity: 0%}
    58.99%{opacity: 0%}
    59%{opacity: 100%}
    66.99%{opacity: 100%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}
    72%{opacity: 0%}
    100%{opacity: 0%}
}

.rect6b {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change6b 10s infinite;
    animation-delay: 10s;
}

@keyframes change6b {
    0%{opacity: 100%}
    3.99%{opacity: 100%}
    4%{opacity: 100%}
    11.99%{opacity: 100%}

    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 100%}
    37.99%{opacity: 100%}
    38%{opacity: 100%}
    58.99%{opacity: 100%}
    59%{opacity: 100%}
    66.99%{opacity: 100%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}
    72%{opacity: 0%}
    100%{opacity: 0%}
}

.rect6c {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change6c 10s infinite;
    animation-delay: 10s;
}

@keyframes change6c {
    0%{opacity: 0%}
    3.99%{opacity: 0%}
    4%{opacity: 100%}
    11.99%{opacity: 100%}

    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 100%}
    37.99%{opacity: 100%}
    38%{opacity: 0%}
    58.99%{opacity: 0%}
    59%{opacity: 0%}
    66.99%{opacity: 0%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}
    72%{opacity: 0%}
    100%{opacity: 0%}
}

.rect6d {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change6d 10s infinite;
    animation-delay: 10s;
}

@keyframes change6d {
    0%{opacity: 100%}
    3.99%{opacity: 100%}
    4%{opacity: 100%}
    11.99%{opacity: 100%}

    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 100%}
    37.99%{opacity: 100%}
    38%{opacity: 100%}
    58.99%{opacity: 100%}
    59%{opacity: 0%}
    66.99%{opacity: 0%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}
    72%{opacity: 0%}
    100%{opacity: 0%}
}

.rect6e {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change6e 10s infinite;
    animation-delay: 10s;
}

@keyframes change6e {
    0%{opacity: 0%}
    3.99%{opacity: 0%}
    4%{opacity: 0%}
    11.99%{opacity: 0%}

    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 100%}
    37.99%{opacity: 100%}
    38%{opacity: 100%}
    58.99%{opacity: 100%}
    59%{opacity: 100%}
    66.99%{opacity: 100%}
    67%{opacity: 100%}
    71.99%{opacity: 100%}
    72%{opacity: 100%}
    100%{opacity: 100%}
}

.rect6 {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: change9 12s infinite;
    animation-delay: 6s;
}

    @keyframes change9 {
        0%{fill: rgb(209, 86, 70)}
        33.49%{fill: rgb(209, 86, 70)}
        33.5%{fill: rgb(26, 85, 211)}
        68.99%{fill: rgb(26, 85, 211)}
        69%{fill: rgb(223, 172, 77)}
        100%{fill: rgb(223, 172, 77)}
        }

  .recta {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: changea 10s infinite;
    animation-delay: 10s;
}

@keyframes changea {
    0%{opacity: 100%}
    3.99%{opacity: 100%}
    4%{opacity: 100%}
    11.99%{opacity: 100%}
    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 100%}
    58.99%{opacity: 100%}

    59%{opacity: 0%}
    66.99%{opacity: 0%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}
    72%{opacity: 0%}
    88.99%{opacity: 0%}
    89%{opacity: 100%}
    100%{opacity: 100%}
}

.rectb {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: changeb 10s infinite;
    animation-delay: 10s;
}

@keyframes changeb {
    0%{opacity: 100%}
    3.99%{opacity: 100%}
    4%{opacity: 100%}
    11.99%{opacity: 100%}
    12%{opacity: 0%}
    22.99%{opacity: 0%}

    23%{opacity: 100%}
    58.99%{opacity: 100%}

    59%{opacity: 100%}
    66.99%{opacity: 100%}
    67%{opacity: 0%}
    71.99%{opacity: 0%}
    72%{opacity: 0%}
    88.99%{opacity: 0%}
    89%{opacity: 0%}
    100%{opacity: 0%}
}

.rectc {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: changec 10s infinite;
    animation-delay: 10s;
}

@keyframes changec {
    0%{opacity: 0%}
    3.99%{opacity: 0%}
    4%{opacity: 0%}
    11.99%{opacity: 0%}
    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 100%}
    58.99%{opacity: 100%}

    59%{opacity: 100%}
    66.99%{opacity: 100%}
    67%{opacity: 100%}
    71.99%{opacity: 100%}
    72%{opacity: 100%}
    88.99%{opacity: 100%}
    89%{opacity: 0%}
    100%{opacity: 0%}
}

.rectd {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: changed 10s infinite;
    animation-delay: 10s;
}

@keyframes changed {
    0%{opacity: 0%}
    3.99%{opacity: 0%}
    4%{opacity: 0%}
    11.99%{opacity: 0%}
    12%{opacity: 0%}
    22.99%{opacity: 0%}

    23%{opacity: 100%}
    58.99%{opacity: 100%}

    59%{opacity: 100%}
    66.99%{opacity: 100%}
    67%{opacity: 100%}
    71.99%{opacity: 100%}
    72%{opacity: 0%}
    88.99%{opacity: 0%}
    89%{opacity: 0%}
    100%{opacity: 0%}
}

.recte {
    fill: rgb(0, 0, 0);
    background-color: rgb(0, 0, 0);
    animation: changee 10s infinite;
    animation-delay: 10s;
}

@keyframes changee {
    0%{opacity: 0%}
    3.99%{opacity: 0%}
    4%{opacity: 100%}
    11.99%{opacity: 100%}
    12%{opacity: 100%}
    22.99%{opacity: 100%}

    23%{opacity: 100%}
    58.99%{opacity: 100%}

    59%{opacity: 100%}
    66.99%{opacity: 100%}
    67%{opacity: 100%}
    71.99%{opacity: 100%}
    72%{opacity: 0%}
    88.99%{opacity: 0%}
    89%{opacity: 100%}
    100%{opacity: 100%}
}

.Icone3 {
    position: fixed;
    width: 50px;
    height: 50px;
    margin-left: 1300px;
    margin-right: 800px;
    top: 175px;
    z-index:400;
}

.Icone31 {
    position: fixed;
    width: 50px;
    height: 50px;
    margin-left: 1400px;
    margin-right: 800px;
    top: 175px;
    z-index:400;
}

.Icone32 {
    position: fixed;
    width: 50px;
    height: 50px;
    margin-left: 1500px;
    margin-right: 800px;
    top: 175px;
    z-index:400;
}

.Icone5 {
    position: fixed;
    width: 50px;
    height: 50px;
    margin-left: 1300px;
    margin-right: 800px;
    top: 275px;
    z-index:400;
}

.Icone51 {
    position: fixed;
    width: 50px;
    height: 50px;
    margin-left: 1400px;
    margin-right: 800px;
    top: 275px;
    z-index:400;
}

.Icone52 {
    position: fixed;
    width: 50px;
    height: 50px;
    margin-left: 1500px;
    margin-right: 800px;
    top: 275px;
    z-index:400;
}

.Icone6 {
    position: fixed;
    width: 800px;
    height: 800px;
    margin-left: 800px;
    margin-right: auto;
    top: 300px;
    z-index:50;
    animation: change4 10s forwards ease-out;
    animation-iteration-count:inherit;
    transform: scaleZ (50);
}

    @keyframes change4 {
    0% {
    transform: rotateZ(-360deg);
    width: 50px;
    height: 50px;
    margin-left: 800px;
    margin-right: auto;
    top: 300px;
    opacity: 100%;
    }

    40% {
    transform: rotateZ(-360deg);
    width: 50px;
    height: 50px;
    margin-left: 800px;
    margin-right: auto;
    top: 300px;
    opacity: 100%;
    }

    99.99% {
    transform: rotateZ(290deg);
    width: 800px;
    height: 800px;
    margin-left: 0;
    margin-right: auto;
    top: 60px;
    opacity: 100%;
    }

    100% {
    opacity: 0%;
    }
    }

    .Icone61 {
        position: -webkit-sticky; /* Safari */
        position: sticky;
        width: 800px;
        height: 800px;
        margin-left: 0px;
        margin-right: auto;
        top: 60px;
        z-index:50;
        animation: change61initial 10s forwards ease-out;
        animation-iteration-count:inherit;
        transform: scaleZ (50);
        transform: rotateZ(290deg);
    }

    @keyframes change61initial {
        0% {
        opacity: 0%;
        }

        99.99% {
        opacity: 0%;
        }

        100% {
        opacity: 100%;
        }
        }

    .Icone8 {
        position: fixed;
        width: 800px;
        height: 800px;
        margin-left: 850px;
        margin-right: auto;
        top: 300px;
        z-index:50;
        animation: change6 10s forwards ease-out;
        animation-iteration-count:inherit;
        transform: scaleZ (50);
    }

        @keyframes change6 {
        0% {
        transform: rotateZ(-90deg);
        width: 50px;
        height: 50px;
        margin-left: 850px;
        margin-right: auto;
        top: 300px;
        opacity: 100%;
        }

        40% {
            transform: rotateZ(-90deg);
            width: 50px;
            height: 50px;
            margin-left: 850px;
            margin-right: auto;
            top: 300px;
            opacity: 100%;
            }

        99.99% {
        transform: rotateZ(390deg);
        width: 800px;
        height: 800px;
        margin-left: 800px;
        margin-right: auto;
        top: 1px;
        opacity: 100%;
        }

        100% {
        opacity: 0%;
        }
        }

        .Icone81 {
            position: -webkit-sticky; /* Safari */
            position: sticky;
            width: 800px;
            height: 800px;
            margin-left: 800px;
            margin-right: auto;
            top: 1px;
            z-index:50;
            animation: change81initial 10s forwards ease-out;
            animation-iteration-count:inherit;
            transform: scaleZ (50);
            transform: rotateZ(390deg);
        }

        @keyframes change81initial {
            0% {
            opacity: 0%;
            }

            99.99% {
            opacity: 0%;
            }

            100% {
            opacity: 100%;
            }
            }

            .Icone9 {
                position: -webkit-sticky; /* Safari */
                position: sticky;
                width: 800px;
                height: 800px;
                margin-left: 300px;
                margin-right: auto;
                bottom: 0px;
                z-index:50;
                animation: change7initial 10s forwards ease-out;
                animation-iteration-count:inherit;
                transform: scaleZ (50);
                transform: rotateZ(310deg);
            }

            @keyframes change7initial {
                0% {
                opacity: 0%;
                }

                99.99% {
                opacity: 0%;
                }

                100% {
                opacity: 100%;
                }
                }

        .Icone91 {
            position: fixed;
            width: 800px;
            height: 800px;
            margin-left: 850px;
            margin-right: auto;
            top: 300px;
            z-index:50;
            animation: change7 10s forwards ease-out;
            animation-iteration-count:inherit;
            transform: scaleZ (50);
        }

            @keyframes change7 {
            0% {
            transform: rotateZ(-360deg);
            width: 50px;
            height: 50px;
            margin-left: 850px;
            margin-right: auto;
            top: 300px;
            opacity: 100%;
            }

            40% {
                transform: rotateZ(-360deg);
                width: 50px;
                height: 50px;
                margin-left: 850px;
                margin-right: auto;
                top: 300px;
                opacity: 100%;
                }

            99.99% {
            transform: rotateZ(310deg);
            width: 800px;
            height: 800px;
            margin-left: 300px;
            margin-right: auto;
            top: 450px;
            opacity: 100%;
            }

            100% {
            opacity: 0%;
            }
            }

            .container1 {
                display: fixed;
                flex-direction: row;
                flex-wrap: wrap;
                align-items: center;
                top:1000px;
                margin-left: 20px;
                margin-right: 20px;
                z-index:1;
            }

    .footer1 {
        box-sizing: border-box;
        position: fixed;
        display: flex;
        flex-direction: row;
        /*
        flex-wrap: wrap;
        flex-shrink: 1;
        flex-grow: 2;
        */
        left: 0;
        height: 7vh;
        width: calc(100vw - 40px);
        margin-left: 20px;
        margin-right: 20px;
        background-color: rgb(186, 190, 199);
        border:1px dashed black;
        margin-top: -2vw;
        z-index:800;
        animation: change 12s infinite;
        animation-delay: 6s;
        bottom: 0;
        }

        .footerTexte1 {
            line-height: 0;
        }

        .footerTexte11 {
            line-height: 0;
            color: transparent;
            animation: none;
        }

        .changetoblack{
            color: rgb(0, 0, 0) !important;
            }

        .footerTexte12 {
            line-height: 0;
            color: transparent;
            animation: none;
        }

        .changetoblack{
            color: rgb(0, 0, 0) !important;
            }

        .footerTexte13 {
            line-height: 0;
            color: transparent;
            animation: none;
        }

        .changetoblack{
            color: rgb(0, 0, 0) !important;
            }

        .footerTexte14 {
            line-height: 0;
            color: transparent;
            animation: none;
        }

        .changetoblack{
            color: rgb(0, 0, 0) !important;
            }

        .footerTexte15 {
            line-height: 0;
            color: transparent;
            animation: none;
        }

        .changetoblack{
            color: rgb(0, 0, 0) !important;
            }

          .container2 {
            display: fixed;
            flex-direction: row;
            flex-wrap: wrap;
            align-items: center;
            margin-left: 0px;
            margin-right: 0px;
            top:1000px;
            z-index:1;
        }

    .entry1 {
        box-sizing: border-box;
        position: relative;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        flex-shrink: 1;
        flex-grow: 2;
        width: calc(100%);
        height: 59.7vw;
        z-index:800;
        background-color: rgb(186, 190, 199);
        animation: change 12s infinite;
        animation-delay: 6s;
        z-index: 800;
    }

    .entry {
        box-sizing: border-box;
        position: relative;
        flex-direction: row;
        width: calc(200%/5);
        height: 59.7vw;
        border:1px dashed black;
        z-index: 200;
    }

    .entrydates {
        box-sizing: border-box;
        position: relative;
        flex-direction: row;
        width: calc(300%/5);
        height: 59.7vw;
        border:1px dashed black;
        z-index: 200;
    }

    .container3 {
        box-sizing: border-box;
        position: fixed;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        flex-shrink: 1;
        flex-grow: 2;
        width: calc(100%);
        height: 1000px;
        z-index:800;
        background-color: rgb(186, 190, 199);
        animation: change 12s infinite;
        animation-delay: 6s;
        z-index: 200;
    }

    .entryBoutons {
        box-sizing: border-box;
        position: fixed;
        left: 0;
        height: 1000px;
        width: calc(100vw - 40px);
        top:20px;
        margin-left: 20px;
        margin-right: 20px;
        z-index:1;
        border:1px dashed black;
        z-index: 200;
    }

    .containerGauche {
        box-sizing: border-box;
        position: fixed;
        flex-direction:row;
        width: calc(100%/5);
        height: 1000px;
        align-items: baseline;
        top:20px;
        z-index:1;
        border:1px dashed black;
        z-index: 200;
    }

    .entry2 {
        box-sizing: border-box;
        position: relative;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        flex-shrink: 1;
        flex-grow: 2;
        width: calc(100%);
        height: 23vw;
        z-index:200;
    }

    .entryIllu {
        box-sizing: border-box;
        position: relative;
        flex-direction: row;
        width: calc(100%/5);
        height: calc(20vw - 8px);
        border:1px dashed black;
        background-color: rgb(186, 190, 199);
        animation: change 12s infinite;
        animation-delay: 6s;
        z-index: 200;
    }

    .Icone1Bas {
        box-sizing: border-box;
        position: relative;
        flex-direction:unset;
        margin-left:0;
        margin-right:0;
        margin-bottom:0;
        width: calc(100%);
        height: calc(100%);
        top: 2vw;
        z-index: 200;
    }

    .lettre11 {
    animation: lettre11change 12s infinite;
    animation-delay: 6s;
}

@keyframes lettre11change{
        0%{opacity: 0}
        33.49%{opacity: 0}
        33.5%{opacity: 100;}
        100%{opacity: 100;}
  }

  .lettre12 {
    animation: lettre12change 12s infinite;
    animation-delay: 6s;
}

@keyframes lettre12change{
    0%{fill: rgb(0, 0, 0)}
    33.49%{fill: rgb(0, 0, 0)}
    33.5%{fill: rgb(26, 85, 211)}
    68.99%{fill: rgb(26, 85, 211)}
    69%{fill: rgb(223, 172, 77)}
    100%{fill: rgb(223, 172, 77)}
  }

.containerChoses {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(100%);
    height: 200vw;
    border: 1px dashed black;
    background-color: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

.entryChoses1 {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(200%/5);
    height: 200vw;
    border: 1px dashed black;
    background-color: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

.entryChoses2 {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    width: calc(300%/5);
    height: 200vw;
    border: 1px dashed black;
    background-color: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

.Choses1 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0.5vw;
    flex-shrink: 1;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
    border: 1px dashed black;
    background: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
}

.Choses2 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 3.5vw;
    flex-shrink: 1;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
    border: 1px dashed black;
    background: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
}

.Choses3 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 6.5vw;
    flex-shrink: 1;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
    border: 1px dashed black;
    background: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
}

.Choses4 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 25.5vw;
    flex-shrink: 2;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
    border: 1px dashed black;
    background: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
}

.Choses5 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 12.5vw;
    flex-shrink: 2;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
    border: 1px dashed black;
    background: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
}

.Choses6 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    position: sticky;
    top: 400vw;
    flex-shrink: 2;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
}

.Choses7 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    position: sticky;
    top: 36.5vw;
    flex-shrink: 3;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
    border: 1px dashed black;
    background: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
}

.Choses8 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    position: sticky;
    top: 27.5vw;
    flex-shrink: 3;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
    border: 1px dashed black;
    background: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
}

.Choses9 {
    box-sizing: border-box;
    position: -webkit-sticky; /* Safari */
    position: sticky;
    position: sticky;
    top: 6.5vw;
    flex-shrink: 3;
    flex-grow: 1;
    width: calc(100%/3);
    height: 25.8vw;
    border: 1px dashed black;
}

.containerCarteParent {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(100%);
    height: 100vw - 0px;
    border: 1px dashed black;
    background-color: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

.containerCarte2 {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(100%/5);
    height: calc(100% - 45.5vw);
    border: 1px dashed black;
    background-color: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

.Cartecompl {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(100%);
    fill: rgb(0, 0, 0);
    z-index: 2000;
}

.containerCarte {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(400%/5);
    height: calc(100% - 45.5vw);
    border: 1px dashed black;
    background-color: rgb(82, 82, 82);
    animation: changezoneG 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

.Carte {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(100%);
    fill: rgb(0, 0, 0);
    z-index: 2000;
}

.carte1 {
    fill: rgb(0, 0, 0);
}

.hover1 .carte1 {
    /* cursor: pointer; */
    fill: transparent;
}

.carte2 {
    fill: transparent;
}

.hover2 .carte2 {
   /* cursor: pointer; */
   fill: rgb(0, 0, 0);
}

.carte3 {
    fill: rgb(0, 0, 0);
}

.hover3 .carte3 {
    /* cursor: pointer; */
    fill: transparent;
}

.carte4 {
    fill: rgb(0, 0, 0);
}

.hover4 .carte4 {
    /* cursor: pointer; */
    fill: transparent;
}

.carte5 {
    fill: rgb(0, 0, 0);
}

.hover5 .carte5 {
   /* cursor: pointer; */
    fill: transparent;
}

.zone {
    fill: rgb(82, 82, 82);
    border: 1px dashed black;
    animation: changezone 12s infinite;
    animation-delay: 6s;
}

@keyframes changezone {
    0%{fill: rgb(209, 86, 70)}
    33.49%{fill: rgb(209, 86, 70)}
    33.5%{fill: rgb(26, 85, 211)}
    68.99%{fill: rgb(26, 85, 211)}
    69%{fill: rgb(223, 172, 77)}
    100%{fill: rgb(223, 172, 77)}
  }

  .containerFossilParent {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(100%);
    height: 100vw - 0px;
    border: 1px dashed black;
    background-color: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

.containerFossil2 {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100%/5);
    height: calc(100% - 45.5vw);
    border: 1px dashed black;
    background-color: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

.Fossilcactus {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100%);
    height: calc(100%/2);
    fill: rgb(0, 0, 0);
    z-index: 1000;
}

.Fossilpoissons {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100%);
    height: calc(100%/2);
    fill: rgb(0, 0, 0);
    z-index: 2000;
}

.containerFossil {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(400%/5);
    height: calc(100% - 45.5vw);
    background-color: rgb(82, 82, 82);
    border: 1px dashed black;
    animation: changezoneG 12s infinite;
    animation-delay: 6s;
    z-index: 2000;
}

@keyframes changezoneG {
    0%{background-color: rgb(209, 86, 70)}
    33.49%{background-color: rgb(209, 86, 70)}
    33.5%{background-color: rgb(26, 85, 211)}
    68.99%{background-color: rgb(26, 85, 211)}
    69%{background-color: rgb(223, 172, 77)}
    100%{background-color: rgb(223, 172, 77)}
  }

.Fossil {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex-direction: row;
    width: calc(100%);
    fill: rgb(0, 0, 0);
    z-index: 2000;
}

.fossilCFa {
    fill: rgb(0, 0, 0);
}

.hover6 .fossilCFa {
    /* cursor: pointer; */
    fill: transparent;
}

.fossilCFb {
    fill: rgb(0, 0, 0);
}

.hover61 .fossilCFb {
    /* cursor: pointer; */
    fill: transparent;
}

.fossilCDa {
    fill: transparent;
}

.hover7 .fossilCDa {
   /* cursor: pointer; */
   fill: rgb(0, 0, 0);
}

.fossilCDb {
    fill: transparent;
}

.hover71 .fossilCDb {
   /* cursor: pointer; */
    fill: rgb(0, 0, 0);
}

.fossilPFa {
    fill: rgb(0, 0, 0);
}

.hover8 .fossilPFa {
    /* cursor: pointer; */
    fill: transparent;
}

.fossilPFb {
    fill: transparent;
}

.hover81 .fossilPFb {
    /* cursor: pointer; */
    fill: rgb(0, 0, 0);
}

.fossilPDa {
    fill: rgb(0, 0, 0);
}

.hover9 .fossilPDa {
    /* cursor: pointer; */
    fill: transparent;
}

.fossilPDb {
    fill: transparent;
}

.hover91 .fossilPDb {
    /* cursor: pointer; */
    fill: rgb(0, 0, 0);
}

/* éléments sticky */

.entryLarge {
    box-sizing: border-box;
    position: relative;
    flex-direction: row;
    width: calc(100%);
    height: 53.8vw;
    border: 1px dashed black;
    background-color: rgb(186, 190, 199);
    animation: change 12s infinite;
    animation-delay: 6s;
    z-index: 1200;
}

.Effet1 {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    padding-top: 0%;
    top: 0px;
    width: 100%; 
    height: 100%; 
    z-index: 1300;
    transition: width 2s ease;
}

.Effet2 {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    display: inline list-item;;
    margin-left: auto;
    margin-right: auto;
    top: 5px;
    width: 100%; 
    height: 100%; 
    z-index: 1200;
}