.b-settins-left {

	.b-toolbar {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		height: 34px;
		padding: 8px 0 0 @rlLowMargin;
	}

	.b-footer {
		position: absolute;
		bottom: 20px;
		right: 0;
		left: 0;
		height: 20px;
		padding: 0 10px 0 5px;
		z-index: 101;
	}

	.b-content {
		position: absolute;
		top: 50px + @rlLowMargin + 10px;
		bottom: @rlLowMargin;
		left: 0;
		right: 0;
		overflow: hidden;

		.content {
			-webkit-overflow-scrolling: touch;
		}
	}
}

.b-settings-menu {

	.e-item {
		overflow: hidden;
		text-decoration: none;
		outline: 0;
	}

	.e-link {
		position: relative;
		display: block;
		height: 30px;
		line-height: 29px;
		font-size: 18px;
		z-index: 1;
		cursor: default;

		background-color: transparent;
		color: #888;

		padding: 4px 10px;

		outline: 0;
		text-decoration: none;
	}

	.e-item.selectable .e-link {
		cursor: pointer;
	}

	.e-item.selectable {
		&:hover .e-link, &.selected .e-link {
			background-color: #555;
			color: #fff;
		}
	}
}

.b-settins-right {

	.b-toolbar {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		height: 34px;
		padding: 8px 5px;
		color: #fff;
	}

	.b-content {
		position: absolute;
		top: 50px;
		bottom: @rlLowMargin;
		left: 0;
		right: @rlLowMargin;
		overflow-y: auto;
		z-index: 2;

		background-color: #fff;
		border: @rlMainBorderSize solid @rlMainDarkColor;
		box-shadow: @rlMainShadow;
		border-radius: @rlMainBorderRadius;

		.content {
			-webkit-overflow-scrolling: touch;
		}
	}

	.b-settings-content {
		padding: 20px;
		padding-left: 30px;

		.legend {
			width: 600px;
		}
	}
}

html.rl-mobile .b-settings-content .legend {
	width: auto;
}