@include animation-delay(20s);
.slider {
  max-width: 100%;
  height:100%;
  position: relative;
}
.slide1,.slide2,.slide3,.slide4,.slide5 {
  position: absolute;
  width: 100%;
  height: 100%;

}


.slide1 {
background:url(https://chris-keenan.com/ict-itad.com/recycling_laws/for_e-waste/laws_computer_disposal.jpg) no-repeat center;
background-size: cover;
animation:fade 25s infinite;
-webkit-animation:fade 25s infinite;
-moz-animation:fade 25s infinite;
-ms-animation:fade 25s infinite;
-o-animation:fade 25s infinite;
    transition         : 20.5s;


} 
.slide2 {
background:url(https://chris-keenan.com/ict-itad.com/recycling_laws/for_e-waste/laws_computer_disposal.jpg) no-repeat center;
background-size: cover;
animation:fade2 25s infinite;
-webkit-animation:fade2 25s infinite;
-moz-animation:fade2 25s infinite;
-ms-animation:fade2 25s infinite;
-o-animation:fade2 25s infinite;

}
.slide3 {
background:url(https://chris-keenan.com/ict-itad.com/recycling_laws/for_e-waste/leagl_advice.jpg) no-repeat center;
background-size: cover;
animation:fade3 25s infinite;
-webkit-animation:fade3 25s infinite;
-moz-animation:fade3 25s infinite;
-ms-animation:fade3 25s infinite;
-o-animation:fade3 25s infinite;
}
.slide4 {
background:url(https://chris-keenan.com/ict-itad.com/recycling_laws/for_e-waste/leagl_advice.jpg) no-repeat center;
background-size: cover;
animation:fade4 25s infinite;
-webkit-animation:fade4 25s infinite;
-moz-animation:fade4 25s infinite;
-ms-animation:fade4 25s infinite;
-o-animation:fade4 25s infinite;
}
@keyframes fade
{
  0%   {opacity:1; -webkit-opacity: 1; -moz-opacity: 1;}
  30% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  60% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0; }
  80% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  100% { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1;}
}

@-webkit-keyframes fade {
  0%   {opacity:1; -webkit-opacity: 1; -moz-opacity: 1;}
  30% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  60% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0; }
  80% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  100% { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1;}	
}

@keyframes fade2
{
  0%   {opacity:0; -webkit-opacity: 0; -moz-opacity: 0;}
  30% { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1;}
  60% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0; }
  80% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  100% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
}

@-webkit-keyframes fade2 {
  0%   {opacity:0; -webkit-opacity: 0; -moz-opacity: 0;}
  30% { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1;}
  60% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0; }
  80% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  100% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}	
}

@keyframes fade3
{
  0%   {opacity:0; -webkit-opacity: 0; -moz-opacity: 0;}
  30% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  60% { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1; }
  80% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  100% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
}

@-webkit-keyframes fade3 {
  0%   {opacity:0; -webkit-opacity: 0; -moz-opacity: 0;}
  30% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  60% { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1; }
  80% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  100% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}		
}

@keyframes fade4
{
   0%   {opacity:0; -webkit-opacity: 0; -moz-opacity: 0;}
  30% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  60% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0; }
  80% { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1;}
  100% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
}

@-webkit-keyframes fade4 {
  0%   {opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  30% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}
  60% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0; }
  80% { opacity: 1; -webkit-opacity: 1; -moz-opacity: 1;}
  100% { opacity: 0; -webkit-opacity: 0; -moz-opacity: 0;}	
}


.titles {

	font-family: 'Oswald', sans-serif;
	color: #FFF;
	font-size: 38px;
	text-decoration:none;
	text-align:center;
	line-height:38px;

}

.vanish {display: block; overflow:hidden;}

@media screen and (max-width: 1300px) {
	
.titles {

	font-size: 30px;
	text-decoration:none;
	text-align:center;
	line-height:30px;


}	


	
}

@media screen and (max-width: 490px){ 

.titles {

	font-size: 26px;
	text-decoration:none;
	text-align:center;
	line-height:26px;


}
.vanish {display: none; height:0px; width:0px;}

}