@mixin make-accordion($accordion-content-max-height: 10em) {

  cursor: pointer;
  position: relative;
  width: 100%;

  .make-accordion__toggle {
    position: absolute;
    opacity: 0;
    z-index: -1;
  }

  .make-accordion__toggle:checked ~ .make-accordion__head .make-accordion__data {
    max-height: $accordion-content-max-height;
  }

  .make-accordion__data {
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s;
  }
}

@mixin center-v {
  transform: translateY(-50%);
  top: 50%;
}

@function get-base-shadow() {
  @return 0 2px 4px 0 rgba(0, 0, 0, 0.1)
}

@mixin base-shadow {
  box-shadow: get-base-shadow();
}

// =========================================================
// Mixin to add vendor prefixes
// Note: gulp-autoprefixer is a much better tool for this
// =========================================================
@mixin prefix($prop, $val){
  $prefixes: '' '-webkit-' '-moz-' '-ms-' '-o-' '-khtml-';
  @each $item in $prefixes{
    #{$item}#{$prop}:#{$val};
  }
}

// ===================================================
// Mixin to quickly generate button schemas
// Takes two args => bc: background-color, c: color
// ===================================================
@mixin button-schema-basic($bc, $c){
  @include prefix('transition', 'all .2s');
  transition: all .2s;
  background-color: $bc;
  border-color: $bc;
  color: $c;
  &:hover, &:active, &:focus{
    background-color: darken($bc, 10%);
    border-color: darken($bc, 10%);
    color: $c;
  }
  &:disabled{
    border-color: darken($bc, 10%);
    background: darken($bc, 10%);
    opacity: .65;
    filter: alpha(opacity=65);
  }
}