.banner1 {
    width: 80%;
    height: 225px;
    border: 0px solid white;
    margin: auto;
 
    background-size: 100% 100%;
    
    animation: banner 10s infinite;    
}

@media screen and (max-width:500px){
	.banner1 {
    width: 100%;
    height: 190px;
    border: 0px solid white;
    margin: auto;
 
    background-size: 100% 100%;
    
    animation: banner 10s infinite;    
}

}
	
@keyframes banner {
	
		
    0%, 30% {
        background-image: url(../Img/banner1.png);
        opacity: 1;
        
    }
    31%, 34% {
        opacity: 0.1;
        
    }
    
    35%, 65% {
        background-image: url(../Img/banner3.png);
        opacity: 1;
    }
    66%, 69% {
        opacity: 0.1;
    }
    70%, 100% {
        background-image: url(../Img/probal21.png);
        opacity: 1;
    }
}