ul.tree {
	list-style: none;
	padding: 0;
	max-width: 50rem;
	@extend .checkboxes--small;

	&.full-width {
		max-width: 100%;
	}

	li { 
		padding: 0;
		display: block;
		font-size: 1.6rem;
	}
	

	.close {
		.tree__leave {
			&:before { content: $fa-var-caret-right; }
		}
		.tree {
			display: none;
		}
	} 
	.final {
		.tree__leave {
			&:before { content: '';  }
		}
	} 

	.tree {
		margin: 0 0 0 2rem;
		padding: 0;
		list-style: none;
		margin-bottom: 0.5rem;

		.tree__leave {
			font-weight: 400;
			width: 100%;
			font-size: 1.4rem;
			a {
				font-weight: 400;
			}
		}
	}
}
.tree__leave {
	display: table;
	line-height: 3rem;
	margin: 0.2rem;
	padding: 0 0 0 2rem;
	font-weight: 600;
	width: 100%;
	text-align: left;
	background-color: rgba($color--seashell,0.2);
	cursor: pointer;
	&:before {
		content: $fa-var-caret-down;
		font-family: 'FontAwesome';
		display: inline-block;
		float: left;
		color: $color--mint;
		font-size: 2.4rem;
		width: 3rem;
		height: 3rem;
	}
	&:hover {
		background-color: rgba($color--seashell, 0.35);
	}

	a {
		display: inline-block;
		float: left;
		font-weight: 600;

		&:before {
			font-weight: 300;
		}
	}
	a[class*="icon--"] {
		color: $color--mint;
		margin: 0 1rem;
		font-weight: 600;
		font-size: 2rem;
		transition: all 0.2s linear;
		text-decoration: none;
		&:hover {
			text-decoration: none;
			transform: scale(1.3);
			color: darken($color--mint, 15%);
		}
	}
}
.tree__leave__functions {
	display: block;
	float: right;
} 
.tree__leave--add {
	@extend .tree__leave;
	color: $color--mint;  
	&:before {
		content: $fa-var-plus !important;
		color: $color--mint; 
		font-size: 1rem;
	}
} 

.tree__leave__caption {
	margin: -0.2rem 1rem 1rem 3rem;
	font-weight: 200;
	font-size: 1.3rem;
	line-height: 1.4rem;
}