.ls-hidden {
	display: none !important;
}


.ls-sliders-grid {

	position: relative;
	margin-top: 10px;
	color: #555;
	text-align: left;

	.slider-item {
		float: left;
		position: relative;
		width: 25%;
		padding: 1%;
		box-sizing: border-box;
		transition: all 300ms;


		.no-preview {
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			text-align: center;
			color: #666;
			user-select: none;

			h5 {
				margin: 0 0 15px 0;
				font-size: 18px;
			}

			small {
				display: block;
				padding: 0 12px;
				font-size: 12px;
				line-height: 14px;
			}
		}



		&.blurred {
			filter: blur( 80px );
		}
	}

	.info {
		position: absolute;
		bottom: -7%;
		left: 0;
		right: 0;

		height: 24px;
		padding: 0 5px;

		color: #888;

		font-size: 13px;
		line-height: 24px;
		overflow: hidden;
		text-align: center;

		transition: opacity 0.2s;

		.name {
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
	}


	.group-item {
		cursor: pointer;
		transition: transform 200ms;

		&.slider-dropping {
			transform: scale( 1.1 );
		}


		.slider-item-wrapper {
			background: #fbfbfb;
		}


		.items {
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;

			.item {
				width: 49%;
				padding: 2% 0 0 2%;
				float: left;
				box-sizing: border-box;
				transition: transform 300ms ease-out;

				&:first-child {
					transition: none;
				}

				&.scale0 {
					transform: scale(0);
				}

				&.dimmed {
					opacity: 0.3;
				}
			}

			.preview {
				position: relative;
				padding-top: 59%;
				box-sizing: border-box;
				border: 1px solid #dfdfdf;
				border-radius: 3px;
				float: none;

				.no-preview {
					width: 100%;
					text-align: center;
					font-size: 13px;
					color: #999;
					user-select: none;
				}
			}
		}
	}


	.slider-item-wrapper {
		position: relative;
		padding-top: 62.5%;
		box-sizing: border-box;
		overflow: hidden;
		border-radius: 6px;
		box-shadow: rgba(0, 0, 0, 0.15) 0px 7px 15px;

		.preview {
			transition: all 200ms , transform-origin 0ms 200ms;
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			margin: 0;
			// width: 100%;
			// height: 100%;
			background-size: cover;
			background-position: top center;
			overflow: hidden;
			background-color: #f3f3f3;

			cursor: pointer;
		}

	}
}



// Slider groups modal window media queries
@media all and (max-width: 4000px) {

	.ls-slider-group-modal-window .slider-item {
		width: 25%;
		padding: 1%;
		margin-bottom: 3%;
	}
}


@media all and (max-width: 1279px) {

	.ls-slider-group-modal-window .slider-item {
		width: 33.33%;
		padding: 1.5%;
		margin-bottom: 3%;
	}
}

@media all and (max-width: 899px) {

	.ls-slider-group-modal-window .slider-item {
		width: 50%;
		padding: 2%;
		margin-bottom: 4%;
	}
}