.body{overflow:hidden}.container{position:relative;width:100%;height:800px;padding:0}#slider{width:max-content;margin-top:50px}@media screen and (max-width:678px){.container{margin-top:0;margin-bottom:0;padding-top:0}.item{width:100px;height:150px}}.overlay{top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;opacity:10%;transition:opacity .5s ease-in-out;z-index:3333}.item,.overlay{position:absolute}.item{width:150px;height:180px;background-position:50% 50%;display:inline-block;transition:1.5s;background-size:cover;z-index:1;top:75%;transform:translateY(-50%);border-radius:20px;box-shadow:0 10px 10px #97979779}.item:first-child{left:0;top:0;transform:translate(0);border-radius:0;width:100%;height:70%}.item:nth-child(2){left:2%;filter:grayscale(1)}.item:nth-child(3){left:calc(2% + 160px);filter:grayscale(1)}.item:nth-child(4){left:calc(2% + 320px);filter:grayscale(1)}.item:nth-child(5){left:calc(2% + 480px);filter:grayscale(1)}.item:nth-child(6){left:calc(2% + 640px);filter:grayscale(1)}.item:nth-child(2):hover,.item:nth-child(3):hover,.item:nth-child(4):hover,.item:nth-child(5):hover,.item:nth-child(6):hover{filter:grayscale(1%)}@keyframes showcontent{0%{opacity:0;transform:translateY(100px);filter:blur(33px)}to{opacity:1;transform:translate(0);filter:blur(0)}}.buttons{position:absolute;z-index:222222;display:flex;gap:.75rem;top:55%;transform:translate(-50%,-50%);padding:50px}.buttons button{width:50px;height:50px;border-radius:50%;border:1px solid #c4c4c4;transition:.5s;display:flex;flex-direction:row;align-items:center;justify-content:center;color:#f4f4f4}.buttons button:hover{background-color:#0c0c0c}