.header-top{
    width:100%;
    height:25px;
    background: $brand-primary;
}
header{
    background: $light;
}
// .logo-block{
//     margin:8px 0;
// }
.right-links{
    ul{
        position:absolute;
    }
    >.user-section{
        padding: 22px 15px;
        height: 63px;
        display: inline-block;
        vertical-align: middle;
        border-left: 1px solid #f1f1f1;
        border-right: 1px solid #f1f1f1;
        >a{
            padding-right: 37px;
            color: #757575;
            background: url(../images/arrow-down.png) no-repeat;
            background-position: 87% 7px;
        }
    }
}
.header-main{
    position: relative;
}


.menu-block, .navbar-default{
   >ul{ 
       display:table;
       width:100%;
       >li{
            display: table-cell;
            padding: 22px 0;
            text-align: center;
            >a{
                display:block;
                border-right: 1px solid #f1f1f1;
                color: lighten($gray-base, 20%);
                font-weight: $font-weight-semibold;
            }
           &:last-child{
                a{border-right: 0;; }
           }
       }
   } 
    
}
@media screen and(max-width: $screen-sm-max ){
    .header-main{
        padding: 0 !important;
    }
}
@media screen and(min-width: $screen-md ){
    .menu-block, .navbar-default{
       >ul{
            >li{
                &:hover{
                    .menudropdiv{
                        opacity: 1;
                        top:100%;
                        visibility: visible;
                        height: auto !important;
                    }
               }
            }
       }
    }
}
.navbar-default{
    background: none !important;
}
.menudropdiv{ 
    position:absolute;
    background: #fff;
    -webkit-box-shadow: 0 6px 10px rgba(0,0,0,0.2);
    box-shadow: 0 6px 10px rgba(0,0,0,0.2);
    z-index: 100;
    top: 140%;
    opacity: 0;
    visibility: hidden;
    padding:0;
    width: 190px;
    overflow: hidden;
    @include transition(all .4s ease);
    border-top:3px solid $brand-secondary;
    .first-block {
        margin: 10px 0;
        a{
            width: 100%;
            display: block;
            padding: 6px 15px;
            color: lighten($gray-base, 20%);
            text-align: left;
            font-weight: $font-weight-semibold;
        }
    }
}
.user-icon {
    background: url(../images/user.png);
    height: 18px;
    width: 18px;
    display: inline-block;
    margin-left: 15px;
    vertical-align: middle;
}
.collapse{
    display:block;
}
@media screen and(max-width: $screen-md ){
    .menu-block, .navbar-default{
       >ul{ 
           >li{
               display:block;
               padding:0;
                border-bottom: 1px solid #f1f1f1;
               a{
                   border-right: 0;
                   padding: 10px;
                   text-align: left;
               }
           }
       }
    }
    .right-links{
        >.user-section{
            border-right: 0;
            padding-right: 0;
            >a{
                display:none;
            }
        }
    }
    .collapse,.collapsing{
        position: absolute;
        left: -15px;
        z-index: 100;
        padding: 10px;
        border-top: 1px solid rgb(241, 241, 241);
        transform: translateX(-100%);
        background: rgb(255, 255, 255);
        overflow: hidden;
        top: 63px;
        width: 200px;
        opacity:0;
        -webkit-box-shadow: 0 6px 10px rgba(0,0,0,0.2);
        box-shadow: 0 6px 10px rgba(0,0,0,0.2);
    }
    .collapse.in{
        transform: translateX(0);
        opacity:1;
        transition: all 0.3s ease;
    }
    .menudropdiv{
        left: 0;
        top: 100%;
        width: 100%;
        position:relative;
        box-shadow: none;
        padding: 0;
        display:none;
        -webkit-box-shadow:none;
        opacity: 1;
        visibility: visible;
        border-top:3px solid $brand-primary;
    }
    .user-icon{margin-left:0;}
    .main-menu{
        position:absolute;
        left:0;
        border-right: 1px solid $border-color;
        top:0;
    }
    .logo-block{
        margin-left: 75px;
    }
}
@media screen and(max-width: $screen-sm-max ){
    .menu-block{
        .menu_a{
            &:after{
                content:'\e902';
                font-family: 'icomoon';
                float:right;
                font-size: 10px;
                padding: 5px 0;
                color:lighten($gray-base, 75%);
            }
            &.collapsed:after{
                content:'\e900';
                font-family: 'icomoon';
                float:right;
            }
        }
    }
}