@import "mixin";
@font-face {
??? font-family: 'icomoon';
??? src:??? url('fonts/icomoon.eot?yjahb8');
??? src:??? url('fonts/icomoon.eot?yjahb8#iefix') format('embedded-opentype'),
??????? url('fonts/icomoon.ttf?yjahb8') format('truetype'),
??????? url('fonts/icomoon.woff?yjahb8') format('woff'),
??????? url('fonts/icomoon.svg?yjahb8#icomoon') format('svg');
??? font-weight: normal;
??? font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
??? /* use !important to prevent issues with browser extensions that change fonts */
??? font-family: 'icomoon' !important;
??? speak: none;
??? font-style: normal;
??? font-weight: normal;
??? font-variant: normal;
??? text-transform: none;
??? line-height: 1;

??? /* Better Font Rendering =========== */
??? -webkit-font-smoothing: antialiased;
??? -moz-osx-font-smoothing: grayscale;
}

.icon-message-typing:before {
??? content: "\e900";
}
.icon-align-top:before {
??? content: "\e901";
}
.icon-wechat:before {
??? content: "\e902";
}
.icon-mobile2:before {
??? content: "\e959";
}
$toolbar-size:52px;
.toolbar{
??? position:fixed;
??? left:50%;
??? bottom:5px;
??? margin-left:-$toolbar-size / 2;
}
.toolbar-item{
??? position:relative;
??? display:block;
??? width:$toolbar-size;
??? height:$toolbar-size;
??? margin-top:1px;
??? &:hover{
??????? .toolbar-icon{
?????????? top:-$toolbar-size;
??????? }
??????? .toolbar-text{
?????????? top:0;
??????? }
??????? .toolbar-layer{
????????? @include opacity(1);
????????? @include scale(1);
??????? }
??? }
}
.toolbar-btn{
??? position:absolute;
??? left:0;
??? top:0;
??? width:$toolbar-size;
??? height:$toolbar-size;
??? overflow:hidden;
}
.toolbar-icon{
??? position:absolute;
??? left:0;
??? top:0;
??? width:$toolbar-size;
??? height:$toolbar-size;
??? background-color:#d0d6d9;
??? font-size:30px;
??? color:#fff;
??? text-align:center;
??? line-height:$toolbar-size;
??? @include transition(top 1s);
}
.toolbar-text{
???? position:absolute;
??? left:0;
??? top:$toolbar-size;
??? width:$toolbar-size;
??? height:$toolbar-size;
??? background-color:#98a1a6;
??? font-size:12px;
??? color:#fff;
??? text-align:center;
??? line-height:1.2;
??? padding-top:12px;
??? @include transition(top 1s);
}
.toolbar-layer{
?? position:absolute;
??? right:$toolbar-size - 6;
??? bottom:-10px;
??? width:172px;
? @include opacity(0);
? @include transform-origin(95% 95%);
? @include scale(0.01);
? @include transition(all 1s);
??? background-image:url(../img/toolbar_img.png);
??? background-repeat:no-repeat;
}
.toolbar-layer-weixin{
??? height:212px;
??????? background-position:0 0;
}
.toolbar-layer-app{
??? height:194px;
??????? background-position:0 -222px;
}