@charset "UTF-8";
@font-face {
  font-family: "iconfont";
  src: url("../font/iconfont.eot?t=1461030955");
  /* IE9*/
  src: url("../font/iconfont.eot?t=1461030955#iefix") format("embedded-opentype"), url("../font/iconfont.woff?t=1461030955") format("woff"), url("../font/iconfont.ttf?t=1461030955") format("truetype"), url("../font/iconfont.svg?t=1461030955#iconfont") format("svg");
  /* iOS 4.1- */
}
.iconfont {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}

.icon-weibiaoti1:before {
  content: "\e60a";
}

.icon-fanhui:before {
  content: "\e63b";
}

.icon-app:before {
  content: "\e6af";
}

.icon-wodedingdan31:before {
  content: "\e638";
}

.toolbar {
  position: fixed;
  right: 30px;
  bottom: 30px;
}

/*使用背景图片的样式*/
/*
.toolbar-item{
  position: relative;
  display: block;
  width: $toolbar-size;
  height: $toolbar-size;
  background: url("../img/toolbar.png") no-repeat;
  margin-top: 1px;
  @include transition(background-position 1s);
  &:hover{
    .toolbar-layer{
      @include opacity(1);
      @include scale(1);
    }
  }
}
.toolbar-item-weixin{
  @include backgroundPosition(-798px,-860px);

  .toolbar-layer{
    height: 212px;
    background-position: 0 0;
  }
}
.toolbar-item-feedback{
  @include backgroundPosition(-426px,-488px);
}
.toolbar-item-app{
  @include backgroundPosition(-550px,-612px);
  .toolbar-layer{
    height: 194px;
    background-position: 0 -222px;
  }
}
.toolbar-item-top{
  @include backgroundPosition(-674px,-736px);
}
.toolbar-layer{
  position: absolute;
  right: $toolbar-size - 6;
  bottom: -10px;
  width: 172px;
  background: url("../img/toolbar.png") no-repeat;
  @include opacity(0);
  @include transformOrigin(95% 95%);
  @include scale(0.01);
  @include transition(all 1s);
}*/
/*使用图标字体的样式*/
/*
.toolbar-item{
  position: relative;
  display: block;
  width: $toolbar-size;
  height: $toolbar-size;
  margin-top: 1px;

  &:hover{
    .iconfont{
      top: -$toolbar-size;
    }
    .toolbar-text{
      top: 0;
    }
    .toolbar-layer{
      @include opacity(1);
      @include scale(1);
    }
  }

}
.toolbar-btn,.iconfont,.toolbar-text{
  position: absolute;
  left: 0;
  width: $toolbar-size;
  height: $toolbar-size;
}
.toolbar-btn{
  top: 0;
  overflow: hidden;
}
.iconfont{
  top: 0;
  background-color: #d0d6d9;
  font-size: 30px;
  color: #fff;
  text-align: center;
  line-height: $toolbar-size;
  @include transition(top 1s);
}
.toolbar-text{
  top: $toolbar-size;
  background-color: #98a1a6;
  padding-top: 12px;
  font-size: 12px;
  color: #fff;
  text-align: center;
  line-height: 1.2;
  @include transition(top 1s);
}
.toolbar-layer{
  position: absolute;
  right: $toolbar-size - 6;
  bottom: -10px;
  width: 172px;
  background: url("../img/toolbar_img.png") no-repeat;
  @include opacity(0);
  @include transformOrigin(95% 95%);
  @include scale(0.01);
  @include transition(all 1s);
}
.toolbar-layer-weixin{
  height: 212px;
  background-position: 0 0;
}
.toolbar-layer-app{
  height: 194px;
  background-position: 0 -222px;
}*/
/*使用after和before伪类的样式*/
.toolbar-item {
  position: relative;
  display: block;
  width: 52px;
  height: 52px;
  margin-top: 1px;
}
.toolbar-item:hover .toolbar-btn:before {
  top: -52px;
}
.toolbar-item:hover .toolbar-btn:after {
  top: 0;
}
.toolbar-item:hover:after {
  opacity: 1;
  filter: alpha(opacity=100);
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.toolbar-item:after {
  content: "";
  position: absolute;
  right: 46px;
  bottom: -10px;
  width: 172px;
  background: url("../img/toolbar_img.png") no-repeat;
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-transform-origin: 95% 95%;
  -webkit-transform-origin: 95% 95%;
  -o-transform-origin: 95% 95%;
  -ms-transform-origin: 95% 95%;
  transform-origin: 95% 95%;
  -moz-transform: scale(0.01);
  -webkit-transform: scale(0.01);
  -o-transform: scale(0.01);
  -ms-transform: scale(0.01);
  transform: scale(0.01);
  -moz-transition: all 1s;
  -webkit-transition: all 1s;
  -o-transition: all 1s;
  -ms-transition: all 1s;
  transition: all 1s;
}

.toolbar-item-weixin:after {
  content: "";
  height: 212px;
  background-position: 0 0;
}
.toolbar-item-weixin .toolbar-btn:before {
  content: "\e60a";
}
.toolbar-item-weixin .toolbar-btn:after {
  content: "公众\A账号";
}

.toolbar-item-feedback .toolbar-btn:before {
  content: "\e638";
}
.toolbar-item-feedback .toolbar-btn:after {
  content: "意见\A反馈";
}

.toolbar-item-app:after {
  content: "";
  height: 194px;
  background-position: 0 -222px;
}
.toolbar-item-app .toolbar-btn:before {
  content: "\e6af";
}
.toolbar-item-app .toolbar-btn:after {
  content: "app\A下载";
}

.toolbar-item-top .toolbar-btn:before {
  content: "\e63b";
}
.toolbar-item-top .toolbar-btn:after {
  content: "返回\A顶部";
}

.toolbar-btn {
  position: absolute;
  top: 0;
  left: 0;
  width: 52px;
  height: 52px;
  overflow: hidden;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
.toolbar-btn:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 52px;
  height: 52px;
  background-color: #d0d6d9;
  font-size: 30px;
  color: #fff;
  text-align: center;
  line-height: 52px;
  -moz-transition: top 1s;
  -webkit-transition: top 1s;
  -o-transition: top 1s;
  -ms-transition: top 1s;
  transition: top 1s;
}
.toolbar-btn:after {
  content: "";
  position: absolute;
  top: 52px;
  left: 0;
  width: 52px;
  height: 52px;
  background-color: #98a1a6;
  padding-top: 12px;
  font-size: 12px;
  color: #fff;
  text-align: center;
  line-height: 1.2;
  white-space: pre;
  -moz-transition: top 1s;
  -webkit-transition: top 1s;
  -o-transition: top 1s;
  -ms-transition: top 1s;
  transition: top 1s;
}