react-selectize styles in SCSS

_MultiSelect.scss

// https://github.com/furqanZafar/react-selectize/blob/develop/src/MultiSelect.styl
.react-selectize.multi-select .simple-value {
	background: #f2f9fc;
	border: 1px solid #c9e6f2;
	border-radius: 2px;
	color: #0088cc;
	display: inline-block;
	margin: 2px;
	vertical-align: middle;

	span {
		cursor: pointer;
		display: inline-block;
		padding: 2px 5px 4px;
		vertical-align: top;
	}
}

_ReactSelectize.scss

.react-selectize {
    color: black;
    background-color: white;
    border-radius: 4px;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    -webkit-user-select: none;
    position: relative;

    &.disabled {
        pointer-events: none;
    }

    .control {
		border: 1px solid;
		border-color: #d9d9d9 #cccccc #b3b3b3;
		border-radius: 4px;
		cursor: pointer;
		font-size: 1em;
		padding: 2px 52px 2px 5px;
		-webkit-transition: all 0.2s 0s ease;
		position: relative;
		z-index: 9;

		.placeholder {
			color: #aaaaaa;
			padding: 8px 0px 8px 10px;
			max-width: -webkit-calc(100% - 52px);
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			position: absolute;
			top: 0;
			left: 0px;
		}

		input {
			background: none;
			border: none;
			outline: none;
			font-size: 1em;
			margin: 2px;
			padding: 4px 0px;
			vertical-align: middle;
			width: 0px;
		}

		.reset {
			color: #999999;
			cursor: pointer;
			display: inline-block;
			font-size: 16px;
			padding: 6px 10px;
			position: absolute;
			right: 17px;
			top: 0;
			&:hover {
				color: #c0392b;
			}
		}

		.arrow {
			border-style: solid;
			content: " ";
			display: block;
			height: 0px;
			position: absolute;
			right: 10px;
			top: 14px;
			width: 0px;
		}

		.value-wrapper {
			display: inline-block;
		}
	}

    .dropdown-transition {
        overflow: hidden;
        position: absolute;
        width: 100%;

        .dropdown {
            background: white;
            border: 1px solid #ccc;
            box-sizing: border-box;
            max-height: 200px;
            overflow: auto;
            position: absolute;
            width: 100%;
            z-index: 10;
        }
            &.slide-enter-active, &.slide-leave-active {
                transition: transform 0.2s 0s ease;
            }

            .option-wrapper.highlight {
                background: #f2f9fc;
                color: #333;
            }
    }

    &.flipped {

		.arrow {
			border-color: transparent transparent #999999;
			border-width: 0 5px 5px;
		}

		.dropdown {

			&.slide-enter {
				transform: translateY(100%);
			}

			&.slide-enter-active {
				transform: translateY(0%);
			}

			&.slide-leave {
				transform: translateY(0%);
			}

			&.slide-leave-active {
				transform: translateY(100%);
			}
		}

		&.open {

			.control {
				border-bottom-left-radius: 4px;
				border-bottom-right-radius: 4px;
				border-top-left-radius: 0px;
				border-top-right-radius: 0px;

				.arrow {
					border-color: #999999 transparent transparent;
					border-width: 5px;
				}
			}

			.dropdown {
				border-bottom: none;
				border-top-left-radius: 4px;
				border-top-right-radius: 4px;
			}
		}
	}

    &:not(.flipped) {

		.arrow {
			border-color: #999999 transparent transparent;
			border-width: 5px;
		}

		.dropdown {

			&.slide-enter {
				transform: translateY(-100%);
			}

			&.slide-enter-active {
				transform: translateY(0%);
			}

			&.slide-leave {
				transform: translateY(0%);
			}

			&.slide-leave-active {
				transform: translateY(-100%);
			}
		}

		&.open {

			.control {
				border-bottom-left-radius: 0px;
				border-bottom-right-radius: 0px;
				border-top-left-radius: 4px;
				border-top-right-radius: 4px;

				.arrow {
					border-color: transparent transparent #999999;
					border-width: 0 5px 5px;
				}
			}

			.dropdown {
				border-color: #b3b3b3 #cccccc #d9d9d9;
				border-top: none;
				border-bottom-left-radius: 4px;
				border-bottom-right-radius: 4px;
			}
		}
	}

    .groups.as-columns {
        display: flex;

        > div {
            flex: 1;
        }
    }

    .no-results-found {
        color: #aaa !important;
        font-style: oblique;
        padding: 8px 10px;
        &.red {
            color: red !important;
        }
    }

    .simple-group-title {
        background-color: #fafafa;
        padding: 8px 8px;
    }

    .simple-option {
        color: #666;
        cursor: pointer;
        padding: 8px 10px;

        &.not-selectable {
            background-color: #f8f8f8;
            color: #999;
            cursor: default;
            font-style: oblique;
            text-shadow: 0px 1px 0px white;
       }
    }
}

_SimpleSelect.scss

// https://github.com/furqanZafar/react-selectize/blob/develop/src/SimpleSelect.styl
.react-selectize.simple-select {

	&:not(.open) {
		background-color: #f9f9f9;
		background-image: linear-gradient(to bottom, #fefefe, #f2f2f2);
	}

	.control {
		padding: 2px 52px 2px 8px;

		.placeholder {
			padding: 8px 0px 8px 12px;
		}
	}

	.reset {
		display: none;
	}

	.simple-value {
		display: inline-block;
		margin: 2px;
		vertical-align: middle;

		span {
			cursor: default;
			display: inline-block;
			vertical-align: top;
		}
	}
}