.cx-ui-media-wrap {

	.cx-upload-preview {
		display: block;
		margin: 0 0 5px 0;

		.cx-image-wrap {
			position: relative;
			display: inline-block;
			vertical-align: top;
			width: 128px;
			height: 128px;

			.inner {
				width: 110px;
				height: 110px;
				margin: 3px;
				position: relative;
				border: 1px solid #d5dadf;
				padding: 5px;
				overflow: hidden;

				.preview-holder {
					width: 100%;
					height: 100%;
					position: relative;
					background: $bg_color;
					box-sizing: border-box;

					.centered {
						position: absolute;
						width: 100%;
						height: 100%;
						top: 0;
						left: 0;
						transform: translate(50%,50%);
					}

					img {
						max-width: 100%;
						height: auto;
						transform: translate(-50%,-50%);
					}

					span {
						width: auto;
						height: auto;
						font-size: 60px;
						transform: translate(-50%,-50%);
					}
				}

				.title {
					position: absolute;
					display: none;
					width: 100px;
					padding: 5px;
					margin: 5px;
					bottom: 0;
					left: 0;
					color: #fff;
					background: #a4afb7;
					text-align: center;
					font-size: 11px;
					overflow: hidden;
				}
			}

			&:hover {
				.inner {
					border-color: #d5dadf;
				}

				.title {
					display: block;
				}

				.cx-remove-image {
					display: block;
				}
			}
		}

		.cx-media-thumb-sortable-placeholder {
			width: 120px;
			height: 120px;
			margin: 3px;
			vertical-align: top;
			border: 1px dashed $border_color;
			display: inline-block;
			background-color: $bg_color;
		}
	}

	.upload-button {
		float: left;
	}

	.cx-remove-image {
		width: 25px;
		height: 25px;
		color: $remove_color;
		display: block;
		position: absolute;
		top: 5px;
		right: 5px;
		cursor: pointer;
		text-decoration: none;
		outline: 0;
		display: none;

		i {
			width: 25px;
			height: 25px;
			font-size: 25px;
		}

		&:hover {
			color: darken( $remove_color, 10% );
		}
	}

	.cx-bgsetting {
		float: left;
		width: 32%;
		margin-right: 1%;
			&:nth-child(3n+1) {
				width: 34%;
				margin-right: 0;
			}
			select {
				margin-bottom: 10px;
			}
	}
}

.button-default_ {
	@include button_base();
	@include secondary_button();
}