section.imageChanger
{
    
    border: 0px solid red;
    
    position: relative;
    position:absolute;
    top:0px;
    z-index:-1;
      
    width: 100%;
    height: 100%;
    
    filter: grayscale(100%) sepia(100%) hue-rotate(170deg) saturate(1.5);
            
    }
    
@media (max-width: 900px)
{   
    section.imageChanger
    {    
        top:140px;
        height:calc(100% - 140px);
  border:0px dotted red; 
 }
}          
    
@media (max-width: 500px), (max-height: 700px) {      
  section.imageChanger
    {
    top:80px;
    height:calc(100% - 80px);
     border:0px dotted blue; 
    }
   
}
    
section.imageChanger div.slice
{
    
    position:absolute;
    width:100%;
    height:100%;
           
    background-repeat:no-repeat;
    background-size: cover;
    background-position:center;   
    
    opacity: 1;  
    }
    
       

section.imageChanger div.slice.faded
{
    
    opacity: 0;
    transition: opacity 2s;   
    transition-timing-function: ease-in;
    
    }