//================================== General Settings ======================================//

/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html,body,div,span,applet,object,iframe,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0};

.foundation-data-attribute-namespace {
  font-family: false;
}
//============================= Responsive Grid =================================//

@mixin respond-to($name) {
  $value: map-get($breakpoints, $name);
  @if map-has-key($breakpoints, $name) {
    @media #{inspect(map-get($breakpoints, $name))} {
      @content;
    }
  }
  @else {
    @warn "Unfortunately, no value could be retrieved from '#{$name}'. "
    + "Please make sure it is defined in '$breakpoints' map.";
  }
}

//================================== Typography ======================================//

@mixin declare-font-face($font-family, $font-filename, $font-weight : normal, $font-style :normal, $font-stretch : normal) {
  @font-face {
    font-family: '#{$font-family}';
    src: url('#{$font-filename}.eot'); /* IE9 Compat Modes */
    src: url('#{$font-filename}.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('#{$font-filename}.woff') format('woff'), /* Modern Browsers */
    url('#{$font-filename}.ttf')  format('truetype'), /* Safari, Android, iOS */
    url('#{$font-filename}.svg') format('svg'); /* Legacy iOS */
    font-style:   $font-style;
    font-weight:  $font-weight;
    font-stretch: $font-stretch;
  }
}

@mixin placeholder($color,$font-family,$text-transform,$size,$padding){
  @include elegantify;
  ::-webkit-input-placeholder {
    color: $color;
    font-family: $font-family;
    font-size: $size;
    text-transform: $text-transform;
    padding-top:$padding;
  }

  :-moz-placeholder { /* Firefox 18- */
    color: $color;
    font-family: $font-family;
    font-size: $size;
    text-transform: $text-transform;
    padding-top:$padding;
  }

  ::-moz-placeholder {  /* Firefox 19+ */
    color: $color;
    font-family: $font-family;
    font-size: $size;
    text-transform: $text-transform;
    padding-top:$padding;
  }

  :-ms-input-placeholder {
    color: $color;
    font-family: $font-family;
    font-size: $size;
    text-transform: $text-transform;
    padding-top:$padding;
  }

}

@mixin elegantify {
  font-weight: 100 !important;
  -webkit-font-smoothing: antialiased;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
}

@mixin letterpress($base:#222,$shadow:#555){
  color: $base;
  text-shadow: 0px 2px 3px $shadow;
}

//================================== Colors ======================================//

@mixin colorize($color:inherit,$bgcolor:inherit){
  color: $color;
  background-color: $bgcolor;
}

@mixin linear-gradient($fromColor, $toColor) {
  background-color: $toColor; /* Fallback Color */
  background-image: -webkit-gradient(linear, left top, left bottom, from($fromColor), to($toColor)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, $fromColor, $toColor); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, $fromColor, $toColor); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, $fromColor, $toColor); /* IE10 */
  background-image:      -o-linear-gradient(top, $fromColor, $toColor); /* Opera 11.10+ */
  background-image:         linear-gradient(top, $fromColor, $toColor);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#{$fromColor}', EndColorStr='#{$toColor}');
}

//================================== Extras ======================================//

@mixin roundify($radius:5px){
  -webkit-border-radius: $radius;
  -moz-border-radius: $radius;
  border-radius: $radius;
}