module.user-menu {
    height: 100%;

}

module.user-menu .button-main {
    color: #333333;
    padding: 20px;
    padding-left: 44px;
    font-weight: bold;
    padding-top: 5px;
    padding-bottom: 5px;
    height: 100%;
    line-height: 100%;
    font-weight: 300;
    vertical-align: middle;
    display: table;
    background-image: url(/images/icos/black/login.png);
    background-size: 24px 24px;
    background-position: 10px center;
    background-repeat: no-repeat;
    cursor: pointer;
    border-left: 1px solid #444;

}

module.user-menu .button-main:hover {
    opacity: 0.5;
}

module.user-menu .button-main span {
    display: table-cell;
    vertical-align: middle;
}

module.user-menu .button-main.open {
    background-image: url(/images/icos/black/user.png);
}

module.user-menu .user-menu-popup {
    background-color: #FFF;
    width: 280px;
    -webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.55);
    -moz-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.55);
    box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.55);
    display: none;
    position: absolute;
    padding: 15px;
    border: 1px solid #EEE;
}

module.user-menu.loggedin .user-menu-popup {
    width: 180px;
    padding: 0px;
}

module.user-menu.loggedin .user-menu-popup .item {
    color: #333;
    border-top: 1px solid #CCC;
    padding: 15px;
    display: block;
    background-color: #EFEFEF;
    background-size: 20px 20px;
    background-repeat: no-repeat;
    background-position: 10px center;
    padding-left: 45px;

}

module.user-menu.loggedin .user-menu-popup .item:hover {
    background-color: #F4F4F4;
}

module.user-menu.loggedin .user-menu-popup .person {
    padding: 15px;
}

module.user-menu.loggedin .user-menu-popup .person div {
    margin-bottom: 6px;
}

module.user-menu.loggedin .user-menu-popup .person .name {
    font-weight: bold;
}

module.user-menu.loggedin .user-menu-popup .logoff {
    background-image: url(/images/icos/black/signoff.png);
}