.tabs-selector-wrapper{
	border-bottom: 1px solid $membrain-orange;
}

.ui-tabs{
	padding: 0;
	.ui-tabs-nav{
		@extend %inner;
		margin: 0 auto;
		padding: 0;

		a.ui-tabs-anchor{
			display: block;
			color: #FFF;
			padding: 2px 15px;
		}

		li{
			position: relative;
			top: 1px;
			padding: 0;

			&:before{
				content: normal;
			}

			&.ui-state-default{
				@extend %button;
				margin: 0 15px 0 0;
				padding: 0;
				@include box-shadow(inset 0 -2px 2px rgba(0,0,0,0.4));

				&:after{
					content: normal;
				}
			}

			&.ui-state-active{
				background: #FFF;
				border: 1px solid $membrain-orange;
				border-color: $membrain-orange $membrain-orange #FFF $membrain-orange;
				@include box-shadow(none);

				a{
					color: $membrain-orange;
				}
			}
		}
	}
}

.ui-accordion{
	@extend %inner;

	.ui-accordion-header{
		position: relative;
		max-width: none;
		margin-top: 2px !important;
		color: #FFF;
		font-weight: bold;
		background: $membrain-blue;
		padding: 2px 15px;
		@include transition(all 0.2s ease-in-out);

		&:after{
			position: absolute;
			top: 2px;
			right: -25px;
			content: '\f002';
			font-family: "flexslider-icon";
			color: #FFF;
			opacity: 0;

			@include transition(all 0.2s ease-in-out);

			.touchevents &{
				opacity: 1;
				right: 15px
			}
		}
		.no-touchevents &:hover{
			&:after{
				opacity: 1;
				right: 15px;
			}
		}

		&.ui-accordion-header-active{
			color: $membrain-orange;
			background: transparent;
			border-bottom: 1px solid $membrain-orange;
			&:after{
				opacity: 1;
				right: 15px;
				color: $membrain-blue;
				@include transform(rotate(-90deg));
			}
		}

		.ui-accordion-header-icon{
			position: absolute;

		}
	}

	.ui-accordion-content{
		padding: $content-padding;
	}
}