/**
 * Non-semantic helper classes: please define your styles before this section.
 */
@import "compass/css3";
@import "compass/css3/pie";


/* For image replacement */
.ir {
	display: block;
	text-indent: -99in;
	overflow: hidden;
	background-repeat: no-repeat;
	text-align: left;
	direction: ltr;
}

/* Hide for both screenreaders and browsers:
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden {
	display: none;
	visibility: hidden;
}

/* Hide only visually, but have it available for screenreaders: by Jon Neal.
  www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

/* Hide visually and from screenreaders, but maintain layout */
.invisible {
	visibility: hidden;
}

/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements in most situations.
   nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
	content: "";
	display: table;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	zoom: 1;
}

.centred {
	text-align: center;
}

.pie-element {
	// relative is the default, so passing relative
	// is redundant, but we do it here for clarity.
	@include pie-element(relative);
}

// But sometimes this messes up your positioning
// So you can also use z-indexing. In this case
// an ancestor element before or having the first
// opaque background should be marked as a pie-container
// which gives it a z-index of 0 (actually any z-index
// can be provided to the pie-container mixin).
// And then the pie element itself should be given
// a z-index of -1.
.pie-container {
	@include pie-container;
}