.dastra_sider_bar {
  z-index:999999;
  position:fixed;
  right:0;
  top:20%;
  width: 65px;
  overflow:hidden;
  opacity:0;
  filter:alpha(opacity=0);
  transition:all .4s;
  transform: translateX(95px);
  -webkit-transform: translateX(95px);
  -moz-transform: translateX(95px);
}
.dastra_sider_bar.show{transform:none;opacity:1;filter:alpha(opacity=100);}
.dastra_sider_bar.active {width:260px;}
.dastra_sider_bar li {position:relative;height: 65px;overflow:hidden;transition:all .4s;list-style: none;background:#e0922f;background-size: cover;margin-bottom: 1px;}
.dastra_sider_bar.active li a {opacity: 1;}
.dastra_sider_bar li a {position:relative;z-index:1000;display:block;}
.dastra_sider_bar li p {color: #fff;}
.dastra_sider_bar li i {height: 52px;z-index:1000;position:absolute;left: 10px;display:block;height: 65px;height:50px;transition:all .4s;color: #fff;font-size: 50px;text-align: cen;line-height: 62px;}

.dastra_sider_bar.active li:last-child:after {display:none;}
.dastra_sider_bar li:hover i,.dastra_sider_bar li:hover a{ color: #fff;}

.dastra_sider_bar li a {
  position:absolute;
  top:0;
  right:-135px;
  display:block;
  width:210px;
  line-height:110%;
  padding: 24px 13px 7px 85px;
  color:#fff;
  white-space:nowrap;
  transition:all .4s;
  font-size: 15px;
  text-align: left;
  font-weight: normal;
  opacity: 0;
  font-weight: 400;
}
.dastra_sider_bar.active li a {right:50px;}
.dastra_sider_bar .online_code a img{max-width:80px;}
.dastra_sider_bar.active .online_code{height:130px;}
.dastra_sider_bar.active .online_code a p{margin:0;margin-bottom:5px;}
.dastra_sider_bar li.online_code:hover a{opacity:1; right: auto;left: 0;}
@media screen and (max-width: 820px) {
.dastra_sider_bar {
  z-index:999999;
  position:fixed;
  right:0;
  top:20%;
  width: 65px;
  overflow:hidden;
  display: none;
  opacity:0;
  filter:alpha(opacity=0);
  transition:all .4s;
  transform: translateX(95px);
  -webkit-transform: translateX(95px);
  -moz-transform: translateX(95px);
}}