* {
	box-sizing: border-box;
}

body {
	font-family: 'Roboto', sans-serif;
	margin: 0;
    font-weight: 100
}
img{
    max-width: 100%;
    margin: auto;
    padding: auto;
}
.slide img{
    text-align: center; 
    margin: auto;
    max-width: 100%;
}
.slider-container {
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	position: relative;
	/*height: 100vh;*/
	/*height: 650px;*/
	width: 100%;
}

.slider-container h1 {
	color: #fff;
	font-size: 100px;
	letter-spacing: 5px;
	position: relative;
	z-index: 100;
	text-align: center;
}

.slider-container::after {
	/*background-color: #000;*/
	content: '';
	position: absolute;
	opacity: 0.3;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
}

.slide {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	height: 100%;
	width: 100%;
	/*transform: scale(1.05);
	transition: opacity .6s ease;*/
}

.slide.active {
	animation: grow 4s linear forwards;
	opacity: 1;
}
.controls-container {
	position: relative;
	margin-top: 30%;
	/*right: 10px;*/
	display: inherit;
	/*transform: translateY(-50%);*/
	z-index: 2;
	background-color: rgba(0,0,0,0.5);
    height: 75px;
    width: 100%;
    justify-content: center;
    padding: 15px;
/*    background-color: rgba(0,0,0,0.5);width: 100%;*/
}
/*@keyframes grow {
	0%, 20% {
		transform: scale(1);
	}
	
	75%, 100% {
		transform: scale(1.05);
	}
}*/



.control {
	background-color: #fff;
	cursor: pointer;
	opacity: 0.5;
	/*margin: 25px;*/
	height: 2px;
	width: 150px;
	transition: opacity 0.3s, background-color 0.3s, transform 0.3s;
    text-align: center;
    font-size: 14px;
    color: #ffffff;
    font-weight: normal;
    background-color: rgba(0,0,0,0.5);
    margin:0 25px;
    /*position: absolute;*/
    
}
.control span{
    padding-top: 10px;
    position: relative;
    font-weight: normal;
    display: block;
    text-align: center;
}
.control.active, .control:hover {
	background-color: #fff;
	opacity: 1;
	transform: scale(1.05);

}
@media (max-width:1768px) {
.controls-container {
	margin-top: 27%;
}
}