/* all .svg-icon elements */
i.svg-icon {
	height: .9em;
	margin-bottom: -.05em;
	display: inline-block;
	background: black;
}

.svg-icon.i-menu-bars {
	aspect-ratio: 1;
	mask: url('/graphix/svg-icons/menu.svg');
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
}

.svg-icon.i-x {
	aspect-ratio: 1;
	mask: url('/graphix/svg-icons/x.svg');
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
}

.svg-icon.i-caret-right {
	aspect-ratio: .7;
	mask: url('/graphix/svg-icons/caret_right.svg');
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
}

.svg-icon.i-caret-left {
	aspect-ratio: .7;
	mask: url('/graphix/svg-icons/caret_left.svg');
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
}

.svg-icon.i-caret-down {
	aspect-ratio: 1;
	mask: url('/graphix/svg-icons/caret_down.svg');
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
}