.Principal_Block{
    width: 100%;
    height: 800px;
    display: flex;
    justify-content: center;
  }
  
  .ListBlock1{
    width: 50%;
    height: 100%;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .SublistBlock{
    width: 100%;
    height: 15%;
    margin: 1%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius:10px;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 4px 4px 4px 4px #e0dbdb;
  }
  span{
    color:#ffffff;
    font-weight: bold;
    text-transform: uppercase;
    font-family: arial;
    letter-spacing: 3px;
    font-size: 3vw;
    transition: 0.4s;

  }
  
  
  .a{
    background-image: 
    linear-gradient(
      rgba(0, 0, 0, 0.459), 
      rgba(0, 0, 0, 0.205)
        ),url("../image/competence.jpg");
    background-position: center;
    background-size: cover;
    
  }
  .a:hover{
    background-image:
      linear-gradient(
          rgba(0, 0, 0, 0.623), 
          rgba(0, 0, 0, 0.39)
        ), url("../image/competence.jpg");
    
  }
  
  .b{
    background-image: 
    linear-gradient(
      rgba(0, 0, 0, 0.459), 
      rgba(0, 0, 0, 0.205)
        ),url("../image/projet.png");
    background-position: center;
    background-size: cover;
  }
  .b:hover{
    background-image:
    linear-gradient(
      rgba(0, 0, 0, 0.623), 
      rgba(0, 0, 0, 0.39)
        ), url("../image/projet.png");
  }
  .c{
    background-image:linear-gradient(
      rgba(0, 0, 0, 0.459), 
      rgba(0, 0, 0, 0.205)
        ), url("../image/veille_techno.png");
    background-position: center;
    background-size: cover;
  }
  .c:hover{
    background-image:
    linear-gradient(
      rgba(0, 0, 0, 0.623), 
      rgba(0, 0, 0, 0.39)
        ), url("../image/veille_techno.png");
  
  }
  
  .d{
    background-image: linear-gradient(
      rgba(0, 0, 0, 0.459), 
      rgba(0, 0, 0, 0.205)
        ),url("../image/tirarc.jpg");
    background-position: center;
    background-size: cover;
  }
  .d:hover{
    background-image:
    linear-gradient(
      rgba(0, 0, 0, 0.623), 
      rgba(0, 0, 0, 0.39)
        ), url("../image/tirarc.jpg");
  }
  
  @media screen and (max-width: 1000px) {
    .ListBlock1{
    width: 100%;
    }
    
  }
