.salescrowd-widget {
  height:34px;
  width:34px;
  position: relative;
}

.menu_button{
  position:absolute;
  bottom:0;
  left:0;
  border-radius:50%;
  height:34px;
  width:34px;
  //box-shadow:rgba(0,0,0,0.3) 0 3px 8px 0,rgba(0,0,0,0.2) 0 0 0 1px,inset rgba(0,0,0,0.3) 0 0 0 1px,inset rgba(255,255,255,0.3) 0 1px 0 1px;
  //text-indent:-99999px;
  overflow:hidden;
  background: $salescrowd-orange;
  z-index:9999;
  outline:0;
  text-align: center;
  color: $white;
  line-height: 40px;
  font-weight: 900;
  &:hover, &:focus {
    color: $white;
  }


  span{
    display:block;
    height:36px;
    width:36px;
    background:url(../cross.svg) no-repeat center center;
    @include transition(all, .4s ease);
  }
}
.menu_option{
  bottom: 32px;
  left: 2px;
  position: absolute;
  li{
    position:absolute;
    display:block;
    top: 0px;
    left: 0px;
    @include transition(all, .3s);
    a{
      position:relative;
      display:block;
      border-radius:50%;
      text-align: center;
      line-height: 30px;
      @include size(30px);
      //text-indent:-99999px;
      overflow:hidden;
      background: $salescrowd-earth;
      color: $white;
      &.facebook {
        background: $salescrowd-facebook;
      }
      &.twitter {
        background: $salescrowd-twitter;
      }
      &.linkedin {
        background: darken($salescrowd-facebook, 15%);
      }
      span {
        background-attachment: scroll;
        background-clip: border-box;
        background-color: transparent;
        background-image: url("../usr.png");
        background-origin: padding-box;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 16px 16px;
        display: block;
        @include size(26px);

        @include transition(all, .4s ease)

      }
    }
  }
}
.btn-rotate span {
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

.active .menu_option li a{
  @include animation(expand,.6s,ease,1,backwards);
}


@-webkit-keyframes expand{
  0%{top:0px}
  50%{top:-10px}
  70%{top:10px}
  100%{top:0px}
}
@-moz-keyframes expand{
  0%{top:0px}
  50%{top:-10px}
  70%{top:10px}
  100%{top:0px}
}