.sliderf {
  max-width: 300px;
  height: 200px;
  margin: 1px auto;
  position: relative;
}
.slides1,.slides2,.slides3,.slides4,.slides5 {
  position: absolute;
  width: 100%;
  height: 100%;
}
.slides1 {
  background: url('fittings/1.png')no-repeat center;
      background-size: cover;
    animation:fade 9s infinite;
-webkit-animation:fade 9s infinite;

} 
.slides2 {
  background: url('fittings/2.png')no-repeat center;
      background-size: cover;
    animation:fade2 9s infinite;
-webkit-animation:fade2 9s infinite;
}
.slides3 {
    background: url('fittings/3.png')no-repeat center;
      background-size: cover;
    animation:fade3 9s infinite;
-webkit-animation:fade3 9s infinite;
}
.slides4 {
    background: url('fittings/4.png')no-repeat center;
      background-size: cover;
    animation:fade4 9s infinite;
-webkit-animation:fade4 9s infinite;
}
.slides5 {
    background: url('fittings/5.png')no-repeat center;
      background-size: cover;
    animation:fade5 9s infinite;
-webkit-animation:fade5 9s infinite;
}
@keyframes fade
{
  0%   {opacity:1}
  33.333% { opacity: 0}
  66.666% { opacity: 0}
  133.332% { opacity: 0}
  100% { opacity: 1}
}
@keyframes fade2
{
  0%   {opacity:0}
  33.333% { opacity: 1}
  66.666% { opacity: 0 }
  133.332% { opacity: 0}
  100% { opacity: 0}
}
@keyframes fade3
{
  0%   {opacity:0}
  33.333% { opacity: 0}
  66.666% { opacity: 1}
  133.332% { opacity: 0}
  100% { opacity: 0}
}
@keyframes fade4
{
  0%   {opacity:0}
  33.333% { opacity: 0}
  66.666% { opacity: 0}
  60.111% { opacity: 1}
  100% { opacity: 0}
}
@keyframes fade5
{
  0%   {opacity:0}
  33.333% { opacity: 0}
  66.666% { opacity: 0}
  133.332% { opacity: 0}
  100% { opacity: 1}
}




body {
  font-family: sans-serif;
  font-size: .9rem;
}
h1 {
  text-align: center;
}

/* 1 column: 320px */
.autowide {
  margin: 0 auto;
	width: 100%;
}
.autowide img {
  float: left;
  margin: 0 .75rem 0 0;
  padding: .50rem .150rem;
}
.autowide .module {
  background-color: ;
  border-radius: .25rem;
  margin-bottom: 1rem;

}
.autowide .module p {
  padding: .25rem .75rem;
}

/* 2 columns: 600px */
@media only screen and (min-width: 600px) {
  .autowide .module {
		float: left;
		margin-right: 2.564102564102564%;
		width: 48.717948717948715%;
	}
	.autowide .module:nth-child(2n+0) {
		margin-right: 0;
	}
}

/* 3 columns: 768px */
@media only screen and (min-width: 768px) {
  .autowide .module {
		width: 31.623931623931625%;
	}
	.autowide .module:nth-child(2n+0) {
		margin-right: 2.564102564102564%;
	}
	.autowide .module:nth-child(3n+0) {
		margin-right: 0;
	}
}

/* 4 columns: 992px and up */
@media only screen and (min-width: 992px) {
  .autowide .module {
		width: 23.076923076923077%;
	}
	.autowide .module:nth-child(3n+0) {
		margin-right: 2.564102564102564%;
	}
	.autowide .module:nth-child(4n+0) {
		margin-right: 0;
	}
}