@mixin feedSetFont($size:14px,$height:26px,$fontFamily:$fontFamily){
  @include setFont($size,$height);
  font-family:$fontFamily;
}
@mixin bgIcos($x,$y){
  background-image: url(#{$baseImgUrl}/icos_29.png);
  background-position: $x $y;
}
// --------
// button
@mixin dropDownBaseStyle($position:'top'){
  background-color: $dropdownBackground;
  border: 1px solid $dropdownBorder;
  *border-right-width: 2px;
  *border-bottom-width: 2px;
  //@include border-radius(6px);
  @include box-shadow(0 0px 5px rgba(0,0,0,.2));
  -webkit-background-clip: padding-box;
     -moz-background-clip: padding;
          background-clip: padding-box;

  &:before {
    content: '';
    display: inline-block;
    //border-bottom-color: $dropdownBorder;
    position: absolute;
    @if $position == "top"{
      top: -7px;
      left: 9px;
      border-left:   7px solid transparent;
      border-right:  7px solid transparent;
      border-bottom: 7px solid $dropdownBorder;
    }@else if $position == "right"{
      bottom: 7px;
      left: -7px;
      border-top: 7px solid transparent;
      border-bottom: 7px solid transparent;
      border-left: 7px solid $dropdownBorder;
    }@else if $position == "topRight"{
      top: -7px;
      right: 6px;
      border-left:   7px solid transparent;
      border-right:  7px solid transparent;
      border-bottom: 7px solid $dropdownBorder;
    }
  
  }
  &:after {
    content: '';
    display: inline-block;
   
    position: absolute;
    @if $position == "top"{
      top: -6px;
      left: 10px;
      border-left:   6px solid transparent;
      border-right:  6px solid transparent;
      border-bottom: 6px solid $dropdownBackground;
    }@else if $position == "right"{
      bottom: 6px;
      left: -7px;
      border-top: 7px solid transparent;
      border-bottom: 7px solid transparent;
      border-left: 7px solid $dropdownBackground;
    }@else if $position == "topRight"{
      top: -6px;
      right:7px;
      border-left:   6px solid transparent;
      border-right:  6px solid transparent;
      border-bottom: 6px solid $dropdownBackground;
    }
   
  }
}
//
// Mixins
// --------------------------------------------------
//
@mixin text-ellipsis{
      text-overflow: ellipsis;
      word-break: break-all;
      white-space:nowrap;
      overflow: hidden;
}

// tita MIXINS


// --------
// font
@mixin setFont($size:14px,$line-height:16px){
  font-size:$size;
  line-height:$line-height;
  font-family:$baseFontFamily;
}
@mixin setFontTitle($size:24px,$line-height:26px){
  font-size:$size;
  line-height:$line-height;
  font-family:$yaheifFontFamily;
  *font-family:$ie_yaheifFontFamily;
}

// Clearfix
// --------
// For clearing floats like a boss h5bp.com/q
@mixin clearfix {
  *zoom: 1;
  &:after {
    display:block;clear:both;visibility:hidden;height:0;overflow:hidden;content:".";
  }
}

// Webkit-style focus
// ------------------
@mixin tab-focus() {
  // Default
  outline: thin dotted #333;
  // Webkit
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

// Center-align a block level element
// ----------------------------------
@mixin center-block() {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

// IE7 inline-block
// ----------------
@mixin ie7-inline-block() {
  *display: inline; /* IE7 inline-block hack */
  *zoom: 1;
}

// IE7 likes to collapse whitespace on either side of the inline-block elements.
// Ems because we're attempting to match the width of a space character. Left
// version is for form buttons, which typically come after other elements, and
// right version is for icons, which come before. Applying both is ok, but it will
// mean that space between those elements will be .6em (~2 space characters) in IE7,
// instead of the 1 space in other browsers.
@mixin ie7-restore-left-whitespace() {
  *margin-left: .3em;

  &:first-child {
    *margin-left: 0;
  }
}

@mixin ie7-restore-right-whitespace() {
  *margin-right: .3em;
}

// Sizing shortcuts
// -------------------------
@mixin size($height, $width) {
  width: $width;
  height: $height;
}
@mixin square($size) {
  @include size($size, $size);
}



// Text overflow
// -------------------------
// Requires inline-block or block for proper styling
@mixin text-overflow() {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

// CSS image replacement
// -------------------------
// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
@mixin hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}


// FONTS
// --------------------------------------------------

@mixin font-family-serif() {
  font-family: $serifFontFamily;
}
@mixin font-family-sans-serif() {
  font-family: $sansFontFamily;
}
@mixin font-family-monospace() {
  font-family: $monoFontFamily;
}
@mixin font-shorthand($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
  font-size: $size;
  font-weight: $weight;
  line-height: $lineHeight;
}
@mixin font-serif($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
  @include font-family-serif();
  @include font-shorthand($size, $weight, $lineHeight);
}
@mixin font-sans-serif($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
  @include font-family-sans-serif();
  @include font-shorthand($size, $weight, $lineHeight);
}
@mixin font-monospace($size: $baseFontSize, $weight: normal, $lineHeight: $baseLineHeight) {
  @include font-family-monospace();
  @include font-shorthand($size, $weight, $lineHeight);
}


// FORMS
// --------------------------------------------------

// Block level inputs
@mixin input-block-level {
  display: block;
  width: 100%;
  min-height: $inputHeight; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
  @include box-sizing(border-box); // Makes inputs behave like true block-level elements
}
// input[type=file]  IE BUG
@mixin input-type-file {
  cursor: pointer;
  &:focus {
    outline: none;
  }
}



// CSS3 PROPERTIES
// --------------------------------------------------

// Border Radius
@mixin border-radius($radius:$baseBorderRadius) {
  border-radius: $radius;
}

// Single Corner Border Radius
@mixin border-top-left-radius($radius) {
  border-top-left-radius: $radius;
}
@mixin border-top-right-radius($radius) {
  border-top-right-radius: $radius;
}
@mixin border-bottom-right-radius($radius) {
  border-bottom-right-radius: $radius;
}
@mixin border-bottom-left-radius($radius) {
  border-bottom-left-radius: $radius;
}

// Single Side Border Radius
@mixin border-top-radius($radius) {
  @include border-top-right-radius($radius);
  @include border-top-left-radius($radius);
}
@mixin border-right-radius($radius) {
  @include border-top-right-radius($radius);
  @include border-bottom-right-radius($radius);
}
@mixin border-bottom-radius($radius) {
  @include border-bottom-right-radius($radius);
  @include border-bottom-left-radius($radius);
}
@mixin border-left-radius($radius) {
  @include border-top-left-radius($radius);
  @include border-bottom-left-radius($radius);
}

// Drop shadows
@mixin box-shadow($shadow:0 0px 5px rgba(0,0,0,.2)) {
  box-shadow: $shadow;
}

// Transitions
@mixin transition($transition...) {
  transition: $transition;
}
@mixin transition-delay($transition-delay) {
  transition-delay: $transition-delay;
}
@mixin transition-duration($transition-duration) {
  transition-duration: $transition-duration;
}

// Transformations
@mixin rotate($degrees) {
  transform: rotate($degrees);
}
@mixin scale($ratio) {
  transform: scale($ratio);
}
@mixin translate($x, $y) {
  transform: translate($x, $y);
}

// Backface visibility
// Prevent browsers from flickering when using CSS 3D transforms.
// Default value is `visible`, but can be changed to `hidden
// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
@mixin backface-visibility($visibility){
  -webkit-backface-visibility: $visibility;
     -moz-backface-visibility: $visibility;
          backface-visibility: $visibility;
}

// Background clipping
// Heads up: FF 3.6 and under need "padding" instead of "padding-box"
@mixin background-clip($clip) {
  background-clip: $clip;
}

// Background sizing
@mixin background-size($size) {
  background-size: $size;
}


// Box sizing
@mixin box-sizing($boxmodel) {
  box-sizing: $boxmodel;
}

// Resize anything
@mixin resizable($direction) {
  resize: $direction; // Options: horizontal, vertical, both
  overflow: auto; // Safari fix
}


// Opacity
@mixin opacity($opacity) {
  opacity: $opacity / 100;
  filter: alpha(opacity=$opacity);
}

@mixin gradient-vertical($startColor: #555, $endColor: #333) {
  background-color: mix($startColor, $endColor, 60%);
  background-image: -moz-linear-gradient(top, $startColor, $endColor); // FF 3.6+
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
  background-image: -webkit-linear-gradient(top, $startColor, $endColor); // Safari 5.1+, Chrome 10+
  background-image: -o-linear-gradient(top, $startColor, $endColor); // Opera 11.10
  background-image: linear-gradient(to bottom, $startColor, $endColor); // Standard, IE10
  background-repeat: repeat-x;
}

@mixin user-select($select) {
  -webkit-user-select: $select;
     -moz-user-select: $select;
      -ms-user-select: $select;
       -o-user-select: $select;
          user-select: $select;
}