/* Grid */
.ple-grid {
	background: #fff;
	margin: 0 auto;
	box-shadow: 0 2px 4px rgba(0,0,0,.2);
	min-height: 40px;
	&__wrap {
		padding: 30px 30px;
		@extend %transparent-background;
	}
	&__body {
		position: relative;
		margin: 0 auto;
	}
	.react-grid-item {
		cursor: pointer; overflow: hidden;
		&.ple-grid__item-active {
			position: relative;
			&:after {
				content: ''; position: absolute;
				left: 0; right: 0; top: 0; bottom: 0;
				border: 4px solid $col-active;
				pointer-events: none;
			}
		}
		&.ple-grid__item-hover {
			position: relative;
			&:after {
				content: ''; position: absolute;
				left: 0; right: 0; top: 0; bottom: 0;
				background: $col-active;
				opacity: .3;
				pointer-events: none;
				border: 5px solid red;
			}
		}
		figure {
			margin: 0;
			width: 100%; height: 100%;
			background-repeat: no-repeat;
		}
		&.react-grid-placeholder {
			background: $col-active;
		}
		& .react-resizable-handle {
			&:after {
				right: 5px;
				bottom: 5px;
				width: 8px;
				height: 8px;
				border-right: 2px solid rgba(0, 0, 0, 0.4);
				border-bottom: 2px solid rgba(0, 0, 0, 0.4);
			}
		}
	}
}