.container{
    margin: auto;
    
    
}




ul,li {
    padding: 0;
    margin: 0;
    list-style: none;
}

ul.slider {
    position: relative;
    max-width: 800px;
    width: 100%;
    height: 300px;
}


ul.slider li {
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0;
    width: inherit;
    height: inherit;
    transition: opacity .5s;
    background: #fff;
}


ul.slider li img {
    width: 100%;
    
    object-fit: cover;
}

ul.slider li:first-child {
    opacity: 1;
    /*Mostramos el primer <li>*/
}

ul.slider li:target {
    opacity: 1;
    /*Mostramos el <li> del enlace que pulsemos*/
}