/* .slides *******************************/

.slides {
	margin-bottom: 40px;
	overflow: hidden;
	padding: 0 20px;
	position: relative;
	width: 100%;

	.scroll {
		align-items: center;
		background: linear-gradient(270deg, rgba(255,255,2550,1) 10%, rgba(255,255,255,0) 100%);
		display: none;
		height: 100%;
		justify-content: flex-end;
		position: absolute;
		right: 0;
		top: 0;
		width: 100px;

		button {
			align-items: center;
			background-color: #fff;			
			border: 0;
			border-radius: 50px;
			box-shadow: 0 5px 5px rgba(0,0,0,0.1);
			display: flex;
			height: 60px;
			justify-content: center;
			margin-right: 10px;
			transition: all ease 0.2s;
			width: 60px;

			&:hover {
				background-color: #eee;		
			}

			img {
				height: 40px;
				width: auto;
			}
		}
	}

	.wrapper {
		display: flex;
		flex-direction: column;
		gap: 20px;
	}
}

@media (min-width: 1000px) {

	.slides {
		padding: 0;

		.scroll {
			display: flex;

			button {

				&:hover {
				}

				img {
				}
			}
		}

		.wrapper {
			flex-direction: row;
			width: 100svh;
		}
	}
}

/* .slide *******************************/

.slide {
	border: 0;
	padding: 0;

	img {
		height: auto;
		width: 100%;
	}
}

@media (min-width: 1000px) {

	.slide {

		img {
			height: 200px;
			width: 200px;
		}
	}
}

/* .modal-slide *******************************/

.modal-slide {
}