/* #slider {
	width: 100%;
	height: 400px;
	position: relative;
	overflow: hidden
}

@keyframes load {
	from {
		left: -100%
	}
	to {
		left: 0
	}
} */
/* 
.slider-class {
	height: 100%;
	float: left;
	position: relative;
	z-index: 1;
	overflow: hidden
} */

/* @media only screen and (min-width:768px) { */
	#slider {
		width: 100%;
		height: 400px;
		position: relative;
		overflow: hidden
	}
	.slides {
		width: 400%;
		height: 100%;
		position: relative;
		-webkit-animation: slide 30s infinite;
		-moz-animation: slide 30s infinite;
		animation: slide 30s infinite
	}
	.slider-class {
		width: 25%;
		height: 100%;
		float: left;
		position: relative;
		z-index: 1;
		overflow: hidden
	}
	.slider-class img {
		width: 100%;
		height: 100%
	}
	.slider-class img {
		width: 100%;
		height: 100%
	}
	.image {
		width: 100%;
		height: 100%
	}
	.image img {
		width: 100%;
		height: auto max-height 640px
	}
	.legend {
		border: 500px solid transparent;
		border-left: 500px solid rgba(52, 73, 94, .7);
		border-bottom: 0;
		position: absolute;
		bottom: 0
	}
	.content-slide {
		width: 100%;
		height: 100%;
		position: absolute;
		overflow: hidden
	}
/* } */

.content-txt {
	width: 300px;
	height: 50px;
	float: left;
	position: relative;
	top: 200px;
	-webkit-animation: content-s 7.5s infinite;
	-moz-animation: content-s 7.5s infinite;
	animation: content-s 7.5s infinite
}

.content-txt h1 {
	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	text-transform: uppercase;
	font-size: 24px;
	color: #f39c12;
	text-align: left;
	margin-left: 30px;
	padding-bottom: 10px;
	text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.2)
}

.content-txt h2 {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
	font-weight: normal;
	font-size: 14px;
	font-style: italic;
	color: #fff;
	text-align: left;
	margin-left: 30px
}

.switch {
	width: 120px;
	height: 10px;
	position: absolute;
	bottom: 10px;
	z-index: 1;
	left: 30px
}

.switch>ul {
	list-style: none
}

.switch>ul>li {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #333;
	float: left;
	margin-right: 5px;
	cursor: pointer
}

.switch ul {
	overflow: hidden
}

.on {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: #ff4900;
	position: relative;
	-webkit-animation: on 30s infinite;
	-moz-animation: on 30s infinite;
	animation: on 30s infinite
}

@-webkit-keyframes slide {
	0%,
	100% {
		margin-left: 0
	}
	21% {
		margin-left: 0
	}
	25% {
		margin-left: -100%
	}
	46% {
		margin-left: -100%
	}
	50% {
		margin-left: -200%
	}
	71% {
		margin-left: -200%
	}
	75% {
		margin-left: -300%
	}
	96% {
		margin-left: -300%
	}
}

@-moz-keyframes slide {
	0%,
	100% {
		margin-left: 0
	}
	21% {
		margin-left: 0
	}
	25% {
		margin-left: -100%
	}
	46% {
		margin-left: -100%
	}
	50% {
		margin-left: -200%
	}
	71% {
		margin-left: -200%
	}
	75% {
		margin-left: -300%
	}
	96% {
		margin-left: -300%
	}
}

@keyframes slide {
	0%,
	100% {
		margin-left: 0
	}
	21% {
		margin-left: 0
	}
	25% {
		margin-left: -100%
	}
	46% {
		margin-left: -100%
	}
	50% {
		margin-left: -200%
	}
	71% {
		margin-left: -200%
	}
	75% {
		margin-left: -300%
	}
	96% {
		margin-left: -300%
	}
}

@-webkit-keyframes content-s {
	0% {
		left: -420px
	}
	10% {
		left: 0
	}
	30% {
		left: 0
	}
	40% {
		left: 0
	}
	50% {
		left: 0
	}
	60% {
		left: 0
	}
	70% {
		left: 0
	}
	80% {
		left: -420px
	}
	90% {
		left: -420px
	}
	100% {
		left: -420px
	}
}

@-moz-keyframes content-s {
	0% {
		left: -420px
	}
	10% {
		left: 0
	}
	30% {
		left: 0
	}
	40% {
		left: 0
	}
	50% {
		left: 0
	}
	60% {
		left: 0
	}
	70% {
		left: 0
	}
	80% {
		left: -420px
	}
	90% {
		left: -420px
	}
	100% {
		left: -420px
	}
}

@keyframes content-s {
	0% {
		left: -420px
	}
	10% {
		left: 20px
	}
	15% {
		left: 0
	}
	30% {
		left: 0
	}
	40% {
		left: 0
	}
	50% {
		left: 0
	}
	60% {
		left: 0
	}
	70% {
		left: 0
	}
	80% {
		left: -420px
	}
	90% {
		left: -420px
	}
	100% {
		left: -420px
	}
}

@-webkit-keyframes on {
	0%,
	100% {
		margin-left: 0
	}
	21% {
		margin-left: 0
	}
	25% {
		margin-left: 15px
	}
	46% {
		margin-left: 15px
	}
	50% {
		margin-left: 30px
	}
	71% {
		margin-left: 30px
	}
	75% {
		margin-left: 45px
	}
	96% {
		margin-left: 45px
	}
}

@-moz-keyframes on {
	0%,
	100% {
		margin-left: 0
	}
	21% {
		margin-left: 0
	}
	25% {
		margin-left: 15px
	}
	46% {
		margin-left: 15px
	}
	50% {
		margin-left: 30px
	}
	71% {
		margin-left: 30px
	}
	75% {
		margin-left: 45px
	}
	96% {
		margin-left: 45px
	}
}

@keyframes on {
	0%,
	100% {
		margin-left: 0
	}
	21% {
		margin-left: 0
	}
	25% {
		margin-left: 15px
	}
	46% {
		margin-left: 15px
	}
	50% {
		margin-left: 30px
	}
	71% {
		margin-left: 30px
	}
	75% {
		margin-left: 45px
	}
	96% {
		margin-left: 45px
	}
}

.dk-line {
	color: #fff;
	background: #ff4900;
	position: relative;
	padding: 2px 10px
}