html { 
    margin:0;
    padding:0;
    background: url(image3.png) no-repeat center fixed; 
    -webkit-background-size: cover; /* pour anciens Chrome et Safari */
    background-size: cover; /* version standardisée */
  






}
.BlocFond{
    height: 50px;
    border:0px solid rgb(22, 22, 22);
    text-align: justify;
    padding:0px;
    padding-block-start:0px;
    border-radius:0px;
    background: linear-gradient(to right, rgba(20,20,20,0.9), rgba(40,40,40,1));
    margin:0;
    margin-right: -8px;
    margin-left: -8px;
    margin-bottom: 0px;
    margin-top: 0px;
    }

.catégorie1{



}

    .BlocFond8{
        height: 200px;
        border:0px solid rgb(22, 22, 22);
        text-align: justify;
        padding:0px;
        padding-block-start:0px;
        border-radius:0px;
        background: linear-gradient(to left, rgba(20,20,20,1), rgba(30,30,30,1));
        margin:0;
        margin-right: -8px;
        margin-left: -8px;
        margin-bottom: 0px;
        margin-top: -16px;
        }
    

    .BlocFond4{
        height: 200px;
        border:0px solid rgb(22, 22, 22);
        text-align: justify;
        padding:0px;
        padding-block-start:0px;
        border-radius:0px;
        background: linear-gradient(to right, rgba(10,30,30,1), rgba(70,50,50,1));
        margin:0;
        margin-right: -8px;
        margin-left: -8px;
        margin-bottom: -12px;
        margin-top: 0px;

        }

        .BlocFond5{
            height: 1px;
            border:0px solid rgb(22, 22, 22);
            text-align: justify;
            padding:0px;
            padding-block-start:0px;
            border-radius:0px;
            background: linear-gradient(to right, rgba(10,30,30,1), red ,white, red, rgba(70,50,50,1));
            margin:0;
            margin-right: -8px;
            margin-left: -8px;
            margin-bottom: 0px;
            margin-top: 0px;
    
            }
    
            .BlocFond6{
                height: 1px;
                border:0px solid rgb(22, 22, 22);
                text-align: justify;
                padding:0px;
                padding-block-start:0px;
                border-radius:0px;
                background: linear-gradient(to right, rgba(10,30,30,1), rgb(132, 0, 194) ,rgb(250, 105, 255), rgb(132, 0, 194), rgba(70,50,50,1));
                margin:0;
                margin-right: -8px;
                margin-left: -8px;
                margin-bottom: 0px;
                margin-top: 0px;
        
                }

    
    
    
    .pictogramme2:hover {
        opacity: 0.5;
        -webkit-filter: blur(1px);
        filter: blur(1px);
        -webkit-transition: .1s ease-in-out;
        transition: .1s ease-in-out;
        

    }   
    .ghost:hover {
        opacity: 0.5;
        -webkit-filter: blur(1px);
        filter: blur(1px);
        -webkit-transition: .1s ease-in-out;
        transition: .1s ease-in-out;

    }   


.Titre01{
    color: white;
    font-size: 100px;
    text-align: center;
    font-family: 'Rubik', sans-serif;
    font-weight: bold;
    font-style: italic;
    background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0), rgba(0,0,0,0), rgba(0,0,0,0), rgba(0,0,0,0.5));
    margin-right: -8px;
    margin-left: -8px;
    margin-top: -8px;
    margin-bottom: -0px;
    background-position-y: start;
    height: 200px;

    }
.Titre02{
    border:0px solid rgb(22, 22, 22);
    text-align: justify;
    background: linear-gradient(to right, rgba(20,20,20,0.9), rgba(40,40,40,1));
    margin:0;
    margin-right: -8px;
    margin-left: -8px;
    margin-bottom: 0px;
    margin-top: 0px;

    color: white;
    font-size: 30px;
    text-align: center;
    font-family: 'Rubik', sans-serif;
    font-weight: bold;
    font-style: italic;
    float: inherit;

    }



.center{
margin-right: auto;
margin-left: auto;
width: 130px;
    }
    .center2{
        margin-right: auto;
        margin-left: auto;
        width: 310px;
            }
        

@media(min-width:701px){
    .pictogramme{
        height: 230px;
        align-items: baseline;
        background-size: cover;
        }
        .pictogramme2{
            height: 230px;
            align-items: baseline;
            background-size: cover;
            }
    
            .ghost{
                height: 230px;
                align-items: baseline;
                background-size: cover;
                }
                
    .center{
        margin-right: afuto;
        margin-left: auto;
        width: 700px;
            }
            .center2{
                margin-right: auto;
                margin-left: auto;
                width: 932px;
                    }

        
        
    .BlocFond2{
        height: 280px;
        border:0px solid rgb(22, 22, 22);
        text-align: justify;
        padding:0px;
        padding-block-start:0px;
        border-radius:0px;
        background: linear-gradient(to right, rgba(20,20,20,0.9), rgba(40,40,40,1));
        margin:0;
        margin-right: -8px;
        margin-left: -8px;
        margin-bottom: 0px;
        margin-top: 0px;
        }
        .BlocFond3{
            height: 1500px;
            border:0px solid rgb(22, 22, 22);
            text-align: justify;
            padding:0px;
            padding-block-start:0px;
            border-radius:0px;
            background: linear-gradient(to right, rgba(20,20,20,0.9), rgba(40,40,40,1));
            margin:0;
            margin-right: -8px;
            margin-left: -8px;
            margin-bottom: 0px;
            margin-top: 0px;
            }
    .titre_de_sections{
            font-size: 35px;
            font-family: 'Rubik', sans-serif;
            color: rgb(255, 175, 4);
            font-variant: small-caps;
            font-weight: 500;
            background: linear-gradient(to right, rgba(20,20,20,0.9), rgba(40,40,40,1));
            margin-bottom: 0px;
            margin-top: 0px;
            margin-left: -8px;
            margin-right: -8px;
            text-align: center;
            
    }

    
            
            
}

@media(max-width:700px){
    .pictogramme{
        height: 130px;
        align-items: baseline;
        background-size: cover;
        }
        .pictogramme2{
            height: 100px;
            align-items: baseline;
            background-size: cover;
            }
    
        .BlocFond2{
            height: 450px;
            border:0px solid rgb(22, 22, 22);
            text-align: justify;
            padding:0px;
            padding-block-start:0px;
            border-radius:0px;
            background: linear-gradient(to right, rgba(20,20,20,0.9), rgba(40,40,40,1));
            margin:0;
            margin-right: -8px;
            margin-left: -8px;
            margin-bottom: 0px;
            margin-top: 0px;
            }
            .BlocFond3{
                height: 810px;
                border:0px solid rgb(22, 22, 22);
                text-align: justify;
                padding:0px;
                padding-block-start:0px;
                border-radius:0px;
                background: linear-gradient(to right, rgba(20,20,20,0.9), rgba(40,40,40,1));
                margin:0;
                margin-right: -8px;
                margin-left: -8px;
                margin-bottom: 0px;
                margin-top: 0px;
                }
            
                .ghost{
                    display: none;
        
            
                }
                .titre_de_sections{
                    font-size: 20px;
                    font-family: 'Rubik', sans-serif;
                    color: rgb(255, 178, 11);
                    font-variant: small-caps;
                    font-weight: 500;
                    background: linear-gradient(to right, rgba(20,20,20,0.9), rgba(40,40,40,1));
                    margin-bottom: 0px;
                    margin-top: 0px;
                    margin-left: -8px;
                    margin-right: -8px;
                    text-align: center;
                 }
        
            
    
}