Sass/Compass mixins partial template

_mixins.scss

 
 
// =================== @mixins ================================/
 
 
@mixin breakpoint($point) {
//-------------------------- Mobile --------------|
  @if $point == mobile {
    @media (max-width: 500px) { @content; }
  }
//-------------------------- Tablet --------------|
  @else if $point == tablet {
    @media (min-width:501px) and (max-width:1000px) { @content; }
  }
//-------------------------- Desktop -------------|
  @else if $point == desktop {
    @media (min-width:1001px) and (max-width:1500px)  { @content; }
  }
//-------------------------- Large ---------------|
  @else if $point == large {
    @media (min-width:1501px) { @content; }
  }
//-------------------------- Landscape -----------|
  @else if $point == landscape {
    @media only screen and (orientation: landscape) { @content; }
  }
}
 
 
 
//-------------------------- @Borders --------------|
@mixin borderer {
	border: 1px solid $color1;
}
@mixin button-hover {
	@include single-transition(all, .5s, ease-out); 
	&:hover {
	  background: rgba($color1, .5);
	}  
	a {
		color: white;
		&:hover {
		  color: $color1;
		}
	} 
}
//-------------------------- @Other useful susyettes --------------|
 
   @include single-transition(all, .5s, ease-out);