@import "../../helps/settings";
@import "../../helps/mixins";

.av-container{
    position: relative;
    height: 100%;
}
/*head start*/
.av-header{
    width: 100%;
    background-image:linear-gradient(-179deg, #404040 0%, #2b2b2b 100%);
    box-shadow:inset 0px -1px 0px 0px #1f1f1f;
    height:75px;
    position:absolute;
    z-index: 9999;
    padding: 15px 12px;
}
.av-header .btn-menu{
    font-size: 22px;
    color: #b8b8b8;
    padding: 7px 12px 4px 0;
    display: inline-block;
    float: left;
}

.av-header--model{
    border-left: 1px solid #757575;
    display: inline-block;
    color: #fff;
    height: 40px;
    line-height: 40px;
    float: left;
    padding:0 15px;
}

.av-header--caller:before{
    font-size:32px;
    color:#43c682;
    float: left;
    margin-right: 15px;
}
.av-header--caller-name span{
    float: left;
    width: 100%;

}
.av-header--caller:after{
    /*@extend %icon-base-styles;
    @include icon-arrow-down;*/
    font-size: 13px;
    color: #b8b8b8;
}
.av-header--caller-name{
    float: left;
    max-width: 230px;
}
.av-header--caller-time{
    font-family: "telenorlight", sans-serif;
    float: left;
    font-size: 24px;
}
.av-header--model .icon{
    margin:0 10px;
    float: left;
    font-size: 24px;
}
.av-header--caller-shop{
    max-width: 154px;
}
.av-header--caller-shop span,
.av-header--caller-shop .status-dot{
    line-height: 16px;
    float: left;
}
.av-header--model .icon-open-right-panel{
    font-size: 22px;
    position: relative;
}
.av-header--model .icon-open-right-panel:after{
    position: absolute;
    background:#ffb900;
    border-radius:20px;
    width:19px;
    height:15px;
    color: #fff;
    content: '12';
    font-size: 12px;
    line-height: 15px;
    text-align: center;
    right: -5px;
    top: 5px;
}


/*sidebar start*/
.av-sidebar{
    background:#474747;
    box-shadow:1px 0px 0px 0px #1f1f1f;
    width:50px;
    height: 100%;
    padding-top: 75px;
    color: #fff;
    position: relative;
    z-index: 9998;
    overflow: hidden;
}
.av-sidebar.is-hide{
    width:0;
    transition: all 0.2s;
}
.av-sidebar ul li{
    height: 75px;
    width: 100%;
    line-height: 75px;
    color: #999;
    text-align: center;
    font-size: 24px;
    float: left;
}
.av-sidebar ul li a{
    color: #999;
    float: left;
    padding: 0 24px 0 12px;
    font-size: 20px;
}
.av-sidebar ul li a:before{
    float: left;
    margin-right: 10px;
    font-size: 24px;
}
.av-sidebar ul li:hover{
    background-color: #666;
}
.av-sidebar ul li:hover a{
    color: #fff;
}

.av-content{
    width: 100%;
    height: 100%;
    position: absolute;
    padding-top: 75px;
    padding-left: 50px;
    color: #000;
    top: 0px;
    z-index: 9997;
    overflow: hidden;
}