.navigation {
        padding: 5px 10px;
        width: inherit;
    }

    .navigation > div {
        padding: 8px 15px 1px 15px;
        height: 40px;
        display: inline-block;
        cursor: pointer;
    }

    .navigation > div:hover {
        background-color: #0094ff;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    .navigation .selected {
        background-color: #0094ff;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    .navigation div > img {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .navigation > div:last-child {
        float: right;
    }

    .navigation > div:last-child {
        margin-top: 15px;
        margin-right: 15px;
        height: 20px;
        padding: 0px;
    }

    .navigation > div:last-child:hover {
        background: none 
    }

    .navigation > div:last-child > div > img {
        margin-left: 5px;
        display: inline-block;
    }

    .navigation .username .username-settings {
        right: 10px;
        padding: 10px;
        text-align: center;
        background: #99CCFF;
        border: 2px solid #0066FF;
        position: absolute;
        cursor: default;
        display: none;
        z-index: 999;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    .navigation .username:hover .username-settings {
        display: block;
    }


    .username-settings:after, .username-settings:before {
        bottom: 100%;
        left: 81%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
    }

    .username-settings:after {
        border-color: transparent;
        border-bottom-color: #99CCFF;
        border-width: 5px;
        margin-left: -5px;
    }

    .username-settings:before {
        border-color: transparent;
        border-bottom-color: #99CCFF;
        border-width: 8px;
        margin-left: -8px;
    }

    .navigation .username:hover .username-settings .profile {
        padding: 8px 5px 5px 5px;
        cursor: pointer;
    }

    .navigation .username:hover .username-settings .profile div:first-child + div {
        margin-top: 0px;
    }

    .navigation .username:hover .username-settings .profile:hover {
        background-color: #0066FF;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    .navigation .username .username-settings img {
        height: 18px;
        width: 18px;
    }

    .navigation .username:hover .username-settings div:first-child + div {
        margin-top:10px;
    }

    .navigation .username .username-settings button {
        width: 100px;
    }

    .navigation .hide {
        visibility: hidden;
    }


    .main {
        height: 100%;
        width: 100%;
    }

    .main .main-header {
        background-color: #000066;
    }

    .main .main-header img {
        height: 100px;
    }

    .main .main-navigation {
        background-color: #0066FF;
    }

    .main .main-content {
        height: 100%;
    }

    .main .side-navigation {
        padding-top: 10px;
        padding-left: 5px;
        padding-right: 10px;
        width: 150px;
        min-width: 150px;
        background-color: #99CCFF;
    }

    .main .content {
        padding: 20px;
        background-color: #FFFFFF;
    }


 /****************************************************************************************************
 padding 
****************************************************************************************************/
.nopadding-left {
    padding-left:0px!important;
}