// Clearfix
@mixin clearfix {
	&:before,
	&:after {
	    content: "";
	    display: table;
	}
	&:after {
		clear:both;
	}
	zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}
// Calc-em
@function calc-em($target-px, $context: $baseSize) {
	@return ($target-px / $context) * 1em;
}
// Print Font px and rem values
@function calc-rem($size) {
  $remSize: $size / $baseSize;
  @return #{$remSize}rem;
}
@mixin fontSize($size) {
  font-size: $size; //Fallback in px
  font-size: calculateRem($size);
}
// Centre XY
@mixin centre($xy:xy) {
  @if $xy == xy {
    left: 50%;
    top: 50%;
    bottom: auto;
    right: auto;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
  }
  @else if $xy == x {
    left: 50%;
    right: auto;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
  }
  @else if $xy == y {
    top: 50%;
    bottom: auto;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
  }
}
// Borders
@mixin border-radius($radius) {
  border-radius: $radius;
  -o-border-radius: $radius;
  -ms-border-radius: $radius;
  -moz-border-radius: $radius;
  -webkit-border-radius: $radius;
}
// Colour mapping
@function color($key) {
  @if map-has-key($colours, $key) {
    @return map-get($colours, $key);
  }
  @warn "Unknown `#{$key}` in $colours.";
  @return null;
}