.breadcrumb-multishop select
	display: inline-block
	height: 22px
	line-height: 20px
	border: 1px solid darken($secondary-color,15%)
	margin: 0
	outline: none //remove focus ring from Webkit
	color: #666
	background: white
	position: relative
	-webkit-appearance: none //remove the strong OSX influence from Webkit
	@include padding(0, 5px, 0, 8px)
	@include border-radius(4px)

//for Webkit's CSS-only solution
@media screen and (-webkit-min-device-pixel-ratio:0)
	.custom-select select
		@include padding-right(30px)

// Since we removed the default focus styles, we have to add our own
.breadcrumb-multishop select:focus
	box-shadow: 0 0 0 1px darken($secondary-color,15%)

// Select arrow styling
.breadcrumb-multishop
	width: auto
	position: relative
	&:after
		content: "▼"
		position: absolute
		top: 0
		bottom: 0
		font-size: 60%
		line-height: 22px
		padding: 0 7px
		background-color: darken($secondary-color,15%)
		color: white
		pointer-events: none
		@include right(0)
		@include border-radius(0 4px 4px 0)

.no-pointer-events .custom-select:after
	content: none

.multishop-well
	@extend .row
	padding: 20px 20px 10px
	margin-bottom: 15px
	background-color: #FAF8F0
	border: none
	@include border-left(3px solid #FBECCB)