Responsive Foundation 6.0.0

A base z-index to use for interactive content in the content area that isn't an overlay. Some examples are callouts that scale up on hover, or tooltip definitions. Use this variable for your default state.

Use + or - with this variable to set z-index relative to the default state - plus for above, minus for below. Change this variable to change the stacking order for all states in the site.

Examples

Ensure callouts that expand on hover show over others.

		.callout:hover {
				transform: scale(1.25);
				z-index: $z-index-content;
			}