#karma-element-setting-panel-container{
	.grid-controller-template {
		align-items: center;
		background-color: $builder-accent-color-4;
		display: flex;
		flex-direction: column;

		.karma-add-column-view {
			@extend .center-both-flex;
			padding-top: $builder-red-space;
		}

		.karma-add-column-view-border {
			background-color: $builder-main-color-5;
			border: 1px solid $builder-accent-color;
			border-radius: 4px;
			flex-wrap: nowrap;
			padding: 0px 3px;
			width: 100px;

			.karma-add-column-view-length {
				background-color: $builder-accent-color-2;
				border-radius: 3px;
				flex-basis: 100%;
				height: 38px;
				margin: 11px 2px 10px 2px;
			}

			.karma-add-column-view-add {

				@extend .center-both-flex;
				background-color: transparent;
				border: 1px dotted $builder-accent-color;
				border-radius: 3px;
				cursor: pointer;
				height: 37.64px;

				&:before,
				&:after {
					@include box( 8px , 2px );
					background-color: $builder-accent-color;
					content: '';
					position: absolute;
				}
				&:after {

					@include box( 2px , 8px );

				}
			}
		}

		.karma-add-column-button button {

			@include oval-button-with-icon($builder-accent-color,$builder-accent-color-3,$builder-accent-color-3);
			@extend .karma-builder-title-3;
			font-family: $builder-medium-font;
			margin: $builder-orange-space 0;
			text-transform: capitalize;

		}

	}
}