body{
	margin: 0;
	padding: 0;


	justify-content: center;
	align-items: center;
}


.slider{
	margin: 0 auto;
	width: 100%;
	height: 800px;
	overflow: hidden;
}

.slides{
	width: 400%;
	height: 810px;
	display: flex;
}

.slides input{
	display: none;
}

.slide{
	width: 25%;
	position: relative;
	transition: 2s;
}

.slide img{
	width: 100%;
}



.manual-navigation{
	position: absolute;
	width:100%;
	margin-top:	-40px;
	display: flex;
	justify-content: center;
}

.manual-btn{
	border: 1px solid green;
	padding: 5px;
	border-radius: 10px;
	cursor: pointer;
	transition: 0.5s;
}

.manual-btn:not(:last-child){
	margin-right: 40px;
}

.manual-btn:hover{
	background-color: green;
}


#radio1:checked ~ .first{
	margin-left: 0;
}

#radio2:checked ~ .first{
	margin-left: -25%;
}

#radio3:checked ~ .first{
	margin-left: -50%;
}
#radio4:checked ~ .first{
	margin-left: -75%;
}


.navigation-auto div{
	border: 1px solid green;
	padding: 5px;
	border-radius: 10px;
	cursor: pointer;
	transition: 0.5s;
}

.navigation-auto{
	position: absolute;
	width:100%;
	margin-top: 770px;
	display: flex;
	justify-content: center
}

.navigation-auto div:not(:last-child){
	margin-right: 40px;
}


#radio1:checked ~ .navigation-auto .auto-btn1{
	background-color: green;
}

#radio2:checked ~ .navigation-auto .auto-btn2{
	background-color: green;
}

#radio3:checked ~ .navigation-auto .auto-btn3{
	background-color: green;
}

#radio4:checked ~ .navigation-auto .auto-btn4{
	background-color: green;
}