.toggle .line1 {
	transform: rotate(-45deg) translate(-8px, 5px);
}

.toggle .line2 {
	opacity: 0;
}

.toggle .line3 {
	transform: rotate(45deg) translate(-8px, -5px);
}

.mySlides {
	display: none
}

.mySlides img {
	vertical-align: middle;
}

.slideshow-container {
	position: relative;
	margin: auto;
}

.dot {
	cursor: pointer;
	height: 5px;
	width: 30px;
	margin: 0 2px;
	background-color: #bbb;
	border-radius: 3px;
	display: inline-block;
	transition: background-color 0.6s ease;
}

.dot-slide .active,
.dot:hover {
	background-color: #f2cb54;
}

.fade {
	animation-name: fade;
	animation-duration: 1.5s;
}

@keyframes fade {
	from {
		opacity: .4
	}

	to {
		opacity: 1
	}
}