@import '../../css/constants';

.resize-result-example {
	&__cropper {
		width: 100%;
		max-height: 450px;
		border: solid 1px #eee;
		background: #354146;
	}
}

.resize-result-example-panel {
	border: solid 1px #ddd;
	color: black;
	display: flex;
	padding: 20px;
	background: rgb(250, 250, 250);
	&__left {
		width: 100%;
		padding-right: 30px;
	}
	&__right {
		display: flex;
		align-items: stretch;
		flex-direction: column;
	}
	&__button {
		width: 120px;
		margin-top: 15px;
		color: white;
		font-size: 16px;
		padding: 17px 20px;
		text-align: center;
		background: $black-button-color;
		cursor: pointer;
		transition: background 0.5s;
		font-weight: normal;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		&:hover {
			background: $black-button-color-hover;
			text-decoration: none !important;
		}
		input {
			display: none;
		}
	}
	&__input {
		margin-bottom: 8px;
	}
	&__input-control {
		padding: 4px;
		width: 100%;
		color: black;
		font: inherit;
		font-size: 15px;
		border: solid 1px #aaa;
	}
	&__input-label {
		display: block;
		font-size: 11px;
		margin-bottom: 3px;
	}
}
