.boite a .un {
    background-size: cover;
    height: 100%;
    background-position: center;
    background-color: black;
    flex-grow: 2;
    
}

.boite a .un:hover {
cursor: pointer;
pointer-events: visible;
}

@media only screen and (max-width: 700px) {
    .boite a .un {
        pointer-events: visible;
    }
}

.video {
    border-radius: 8px;
    width: 100%;
    height: 100%;
    margin: 0;
}

.boite a .deux {
    background-image: url(./img/tyty/Brand_design_tyty.png);
    height: 100%;
    background-position: bottom;
    background-size: cover;
    pointer-events: visible;
    cursor: zoom-in;
}

.boite a .six {
    background-image: url(./img/tyty/luna.png);
    height: 100%;
    background-position: center;
    background-size: cover;
}

.boite a .quatre {
    background-image: url(./img/tyty/Template_tyty.png);
    height: 100%;
    background-position: top;
    background-size: cover;
    background-color: #fcf8f8;
}


.boite a .trois {
    background-image: url(./img/tyty/infographies.png);
    height: 100%;
    background-position: center;
    background-size: contain;
    pointer-events: visible;
    cursor: zoom-in;
    background-color : white;
}

.boite a .sept {
    background-image: url(./img/tyty/figma.png);
    height: 100%;
    background-position: center;
    background-size: contain;
    background-color : white; 
}

.boite a .cinq {
    background-image: url(./img/tyty/Couv_avant_projet_tyty.png);
    height: 100%;
    background-position: center;
    background-size: contain;
    pointer-events: visible;
    cursor: zoom-in;
    background-color : #edebe5; 
}

.boite a .huit {
    background-image: url(./img/tyty/code.png);
    height: 100%;
    background-position: center;
    background-size: contain;
    background-color : white; 
}


/*.boite a .huit {
    background-image: url();
    height: 100%;
    background-position: center;
    background-size: contain;
    background-color : #fcf8f8; 
}

.huit p {
   justify-self: center; 
}*/


/* .boite a:last-of-type {
    width: 20%;
}

.scroll {
    height: 102%;
    overflow: hidden;
    background-repeat: repeat;
    animation: slide 40s linear infinite;
    animation-play-state: running;
    animation-timing-function: steps(6, end);
}

.scroll:hover {
    animation-play-state: paused;
    cursor: zoom-in;
} 

@keyframes slide {
    0% {
      transform: translate3d(0%, 0, 0);
    }
    100% {
      transform: translate3d(-74%, 0, 0);
    }
  }

@media only screen and (max-width: 700px) {
    /* .scroll {
      background-image:url('./img/mm/Web final.png');
      animation: slide 20s linear infinite;
      width: 100%;
      background-repeat: repeat;
      animation-play-state: running;
  } 

.scroll:hover {
    animation-play-state: paused;
  }
}

*/
