Weird syntax error with sass mixin.

button.sass

@mixin button($color1, $color2, $padding, $size, $radius)
  +background(linear-gradient(#{$color1}, #{$color2}))
  color: $white
  text-shadow: -1px 0px 0px $header
  padding: #{$padding}
  text-transform: uppercase
  display: inline-block
  text-align: center
  font-size: #{$size}
  cursor: pointer
  +border-radius(#{$radius})
  border: 1px solid (#{$color2})

  &:hover
    background(linear-gradient(#{$color2}, #{$color1}))

// Color 
$cncblue: #367EC1

.button
  +button($cncblue, darken($cncblue, 10%), 8px 40px, 13px, 40px)

// This should work, but I get this error: Syntax error: Not a valid color stop: Sass::Script::String: #ffffff (or whatever hex value/color there is)

Interpolation #{} returns a string to be inserted into the output of the stylesheet. if you remove the interpolation when calling the linear-gradient function, it will work.

Thanks Chris. Will definitely try that out.