.ct-meta-box-container {

	.ct-attachment,
	.ct-option-input,
	.ct-option-slider,
	.ct-buttons-group,
	.ct-option-checkbox,
	.ct-option-textarea,
	.ct-responsive-container {
		max-width: 400px;
	}

	// controls group
	.ct-controls-group {
		border-bottom: 1px solid rgba(226, 228, 231, 0.5);

		> * {
			border-bottom: none !important;
		}

		&[data-type="small-space"] > * {
			&:nth-child(2) {
				padding-top: 10px !important;
			}
		}
	}

	// image uploader
	.ct-attachment .thumbnail img {
		max-width: 100%;
	}

	// slider
	.ct-option-slider input[type="number"] {
		font-size: var(--fontSize);
		padding: var(--padding);
		height: var(--height);
		border-radius: 3px;

		&:hover, &:focus {
			border-color: #0e8ecc;
		}
	}

	// typography
	.ct-typography {
		max-width: 267px;

		.ct-control {
			header {
				display: flex;
				justify-content: space-between;

				&:not(:empty) {
					margin-bottom: 10px;
				}
			}
		}
	}

	.ct-responsive-container {
		display: flex;
		align-items: center;

		.ct-option-slider {
			flex: 1 0 auto;
		}

		.ct-control-options {
			flex: 0 1 auto;
			margin-right: 20px;
		}
	}

	// unit changer
	.ct-unit-changer {
		background: #f3f4f5;

		&:not(.no-unit-list) {
			&:hover {
				background: #e9ebec;
			}
		}
	}

	// color picker
	.ct-color-modal-wrapper {
		margin-left: 250px;

		.ct-arrow {
			z-index: 1;
		}
	}

	.ct-color-picker-modal {
		left: -17px;
		box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
	}


	// image picker
	.ct-image-picker {
		grid-template-columns: repeat(auto-fill, 110px);
		margin: 0;

		li {
			min-height: 77px;
		}
	}

	// attachment
	.ct-attachment .thumbnail {
		border-color: #d7dade;
	}
}