.work_package_tree li span[contenteditable="true"], .work_package_tree li span[contenteditable="false"]{
    border: 1px solid #eee;
    padding: 5px 10px;
    text-decoration: none;
    color: #000000;
    font-family: arial, verdana, tahoma;
    display: inline-block;
    background-color: #ccc;
    border-radius: 5px;

    transition: all 0.5s;
}

/*We will apply the hover effect the the lineage of the element also*/
.work_package_tree li div:hover span[contenteditable="true"], .work_package_tree li div:hover+ul li div span[contenteditable="true"], .work_package_tree li div:hover span[contenteditable="false"], .work_package_tree li div:hover+ul li div span[contenteditable="false"]{
    background: #c8e4f8;
    color: #000000;
}