﻿.kg-navigation {
    height: 100%;
    background: rgba(5,14,26,0.7);
    float: left; 
    animation: fade-in 0.4s ease;
    width: 247px;
    transition: width 0.4s ease;
}

.kg-navigation-sub-menu{
    background: rgba(5,14,26,0.7);
    animation: fade-in 0.4s ease;
    width: 247px;
    transition: width 0.4s ease;
    position: absolute;
    z-index: 100;
}

/*.kg-sub-menu-item:after{*/
    /*content: "";*/
    /*border: 7px solid transparent;*/
    /*border-left: 5px solid #C0C3C4;*/
/*}*/

.kg-navigation-sub-menu__list{
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    width: 247px;
}

.kg-navigation-sub-menu__image{
    background-image: url("/components/navigation/icons/arrow-right.svg");
    float:left;
    width: 15px;
    height: 15px;
    background-repeat: no-repeat;
    background-size: 15px
}


.kg-navigation__text-hide .kg-owner,
.kg-navigation__text-hide .kg-navigation__list-item_text{
    animation: fade-out 0.4s ease;
    opacity: 0;
    margin-left: 10px;
}
.kg-navigation__text-show .kg-owner,
.kg-navigation__text-show .kg-navigation__list-item_text{
    animation: fade-in 0.4s ease;
    opacity: 1;
    margin-left: 10px;
}

.kg-sub-menu-item .kg-navigation__list-item_text{
    width: calc(100% - 80px);
}

#main.widescreen .kg-navigation {
    width: 68px;
}

.kg-navigation__items-list{
    height: calc(100% - 311px);
    overflow: hidden;
    width: 100%;
}

.kg-navigation__block{
    height: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
    width: 100%;
    padding-right: 67px;
}

.kg-navigation__list {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    width: calc(100% + 67px);
}

.kg-navigation__item {
    width: 100%;
    height:70px;
    text-align: left;
    padding: 26px;
    color: #C0C3C4;
    cursor:pointer !important;
    font-size: 14px;
    border-bottom: 1px solid #364957;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    overflow: hidden;
}

.kg-navigation__item:hover {
    background-color: #2C4259;
}

.kg-navigation__item:first-child{
    border-top: 1px solid #364957;
}

.kg-navigation__list-item_active {
    background-color: #F54047;
    color: #fff
}
.kg-navigation__list-item_active:hover {
    background-color: #F54047;
}
.kg-navigation__list-item_text{
    animation: fade-in 0.4s ease;
}

.kg-navigation__list-item_busy {
    color: black;
}

.kg-navigation__list li:hover {
    color:#fff;
    /*background-color: #429ED1;
    border-color: #429ED1;*/
    cursor: default;
}

.kg-navigation__main:before,
.kg-navigation__user-profile:before,
.kg-navigation__proactive-search:before,
.kg-navigation__active-search:before,
.kg-navigation__recommendations:before,
.kg-navigation__space-infrastructure:before,
.kg-navigation__mpk:before,
.kg-navigation__bookmarks:before,
.kg-navigation__upload-resources:before,
.kg-navigation__experts-net:before,
.kg-navigation__my-circle:before,
.kg-navigation__ontology-constructor:before,
.kg-navigation__references:before{
    width: 16px;
    height: 16px;
    content: '';
    align-self: center;
}
    
.kg-navigation__main:before {
    background: url('/images/icons/home.png') no-repeat;
}
.kg-navigation__main:hover:before{
    background: url('/images/icons/home-wight.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__main:before{
    background: url('/images/icons/home-wight.png') no-repeat;
}
.kg-navigation__user-profile:before {
    background: url('/images/icons/profile-2.png') no-repeat;
}
.kg-navigation__user-profile:hover:before {
    background: url('/images/icons/profile-2-wight.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__user-profile:before {
    background: url('/images/icons/profile-2-wight.png') no-repeat;
}
.kg-navigation__references:before {
    background: url('/images/icons/RKP.png') no-repeat;
}
.kg-navigation__proactive-search:before {
    background: url('/images/icons/magnifier.png') no-repeat;
}
.kg-navigation__proactive-search:hover:before {
    background: url('/images/icons/magnifier-wight.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__proactive-search:before {
    background: url('/images/icons/magnifier-wight.png') no-repeat;
}



.kg-navigation__active-search:before {
    background: url('/images/icons/magnifier.png') no-repeat;
}
.kg-navigation__active-search:hover:before {
    background: url('/images/icons/magnifier-wight.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__active-search:before {
    background: url('/images/icons/magnifier-wight.png') no-repeat;
}


.kg-navigation__recommendations:before{
    background: url('/images/icons/book.png') no-repeat;
}
.kg-navigation__recommendations:hover:before{
    background: url('/images/icons/book-wight.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__recommendations:before{
    background: url('/images/icons/book-wight.png') no-repeat;
}

/*.kg-navigation__space-infrastructure:before{*/
    /*background: url('/images/icons/book.png') no-repeat;*/
/*}*/
/*.kg-navigation__space-infrastructure:hover:before{*/
    /*background: url('/images/icons/book-wight.png') no-repeat;*/
/*}*/
/*.kg-navigation__list-item_active.kg-navigation__space-infrastructure:before{*/
    /*background: url('/images/icons/book-wight.png') no-repeat;*/
/*}*/

.kg-navigation__space-infrastructure:before {
    background: url('/images/icons/expertsNet.png') no-repeat;
}
.kg-navigation__space-infrastructure:hover:before {
    background: url('/images/icons/expertsNet.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__space-infrastructure:before {
    background: url('/images/icons/expertsNet.png') no-repeat;
}

.kg-navigation__mpk:before {
    background: url('/images/icons/MPK.png') no-repeat;
}
.kg-navigation__mpk:hover:before {
    background: url('/images/icons/MPK.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__mpk:before {
    background: url('/images/icons/MPK.png') no-repeat;
}

.kg-navigation__bookmarks:before{
    background: url('/images/icons/star.png') no-repeat;
}
.kg-navigation__bookmarks:hover:before{ 
    background: url('/images/icons/star-wight.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__bookmarks:before{
    background: url('/images/icons/star-wight.png') no-repeat;
}


.kg-navigation__upload-resources:before {
    background: url('/images/icons/journal.png') no-repeat;
}
.kg-navigation__upload-resources:hover:before {
    background: url('/images/icons/journal-wight.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__upload-resources:before {
    background: url('/images/icons/journal-wight.png') no-repeat;
}

.kg-navigation__experts-net:before {
    background: url('/images/icons/expertsNet.png') no-repeat;
}
.kg-navigation__experts-net:hover:before {
    background: url('/images/icons/expertsNet.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__experts-net:before {
    background: url('/images/icons/expertsNet.png') no-repeat;
}

.kg-navigation__my-circle:before {
    background: url('/images/icons/mycircle.png') no-repeat;
}
.kg-navigation__my-circle:hover:before {
    background: url('/images/icons/mycircle.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__my-circle:before {
    background: url('/images/icons/mycircle.png') no-repeat;
}
.kg-navigation__ontology-constructor:before {
    background: url('/images/icons/tree.png') no-repeat;
}
.kg-navigation__ontology-constructor:hover:before {
    background: url('/images/icons/tree-wight.png') no-repeat;
}
.kg-navigation__list-item_active.kg-navigation__ontology-constructor:before {
    background: url('/images/icons/tree-wight.png') no-repeat;
}

.kg-navigation__interests {
    
}

.kg-navigation__similar-interests {
    
}

.kg-navigation__settings {
    
}

.kg-navigation__refresh {
    display: none;
}

.kg-additional-information__logo-block{
    width: 100%;
    display: table;
    height: 88px;
    min-height: 54px;
    box-sizing: border-box;
}

.kg-owner{
    vertical-align: middle;
    display: table-cell;
    padding: 20px;
}

.kg-owner__logo {
    float: left;
    width: 75px;
    margin-right: 10px;
}

.kg-widescreen {
    width: 100%;
    text-align: left;
    padding: 26px 0;
    cursor: pointer !important;
    border-top: 1px solid #364957;
    box-sizing: border-box;
    
}

.kg-widescreen-icon {
    background: url("/images/icons/arrow.svg") no-repeat;
    background-size: 16px;
    height: 16px;
    width: 18px;
    margin: 0 auto;
    transform: rotate(0deg);
    transition: transform 0.4s ease, width 0.4s ease;
}

.kg-widescreen:hover .kg-widescreen-icon {
    background: url("/images/icons/arrow-wight.svg") no-repeat;
    background-size: 16px;
}


.kg-widescreen:hover {
    color: #fff;
    background-color: #2C4259;
}

#main.widescreen .kg-widescreen-icon {
    width: 16px;
    transform: rotate(-180deg);
}

/*.kg-widescreen:before {
    background:  url("/images/icons/arrow-left.svg") no-repeat;
    width: 16px;
    height: 16px;
    margin-right: 6px;
    display: inline-block;
    content: ''

}

.kg-widescreen:hover:before {
    background: url("/images/icons/arrow-left-wight.svg") no-repeat;
}

#main.widescreen .kg-widescreen:before {
    background: url("/images/icons/arrow-right-wight.svg") no-repeat;
    width: 16px;
    height: 16px;
    margin-right: 10px;
    display: inline-block;
    content: '';
}
#main.widescreen .kg-widescreen:hover:before {
    background: url("/images/icons/arrow-right-wight.svg") no-repeat;
}*/

.kg-owner__text{
    color: #aaa;
    font-size: 12px;
    animation: fade-in 1s ease-out;

}
.kg-section_title{
    display: inline-block; 
    margin-top: 28px; 
    margin-left: 32px; 
    font-size: 1.5em;
}
.kg-current-user{
    float:right;
    position: relative; 
    text-decoration: underline; 
    cursor: pointer; 
    margin-top: 32px;
    margin-right: 51px
}
.kg-current-user:after{
    float: right;
    content: '';
    display: block;
    border: 4px solid transparent;
    border-top: 5px solid #f2f2f2;
    width: 0;
    height: 0;
    margin-left: 10px;
    margin-top: 8px;
}

.kg-user-menu{
    top: 68px;
    padding: 10px 0;
    width: 185px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 5px;
    position: absolute;
    right: 32px;
    background: #fff;
    z-index: 999;  
    box-shadow: 0 5px 10px #333;
}

.kg-user-menu:before{
    content: '';
    position: absolute;
    right: 45px;
    top: -20px;
    border: 10px solid transparent;
    border-bottom: 10px solid #ccc;
    display: block;
    width: 0;
    height: 0;
}
.kg-user-menu:after{
    content: '';
    position: absolute;
    right: 45px;
    top: -19px;
    border: 10px solid transparent;
    border-bottom: 10px solid #fff;
    display: block;
    width: 0;
    height: 0;
}

.kg-user-menu .kg-logout,
.kg-user-menu .kg-profile,
.kg-user-menu .kg-help-mode-on,
.kg-user-menu .kg-help-mode-off,
.kg-user-menu .kg-change-user-password{
    color: #000;
    font-size: 0.8em;
    cursor: pointer;
    float:left;
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
}
.kg-user-menu .kg-profile:hover,
.kg-user-menu .kg-help-mode-on:hover,
.kg-user-menu .kg-help-mode-off:hover,
.kg-user-menu .kg-change-user-password:hover,
.kg-user-menu .kg-logout:hover{
    background-color: #429ED1;
    color: #fff;
}

.kg-user-menu > *:before {
    float:left;
    width: 26px;
    height: 26px; 
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 20px
}
.kg-user-menu .kg-profile:before{
    content: '';
    background-image: url('/images/icons/profile-3.png');
}
.kg-user-menu .kg-change-user-password:before{
    content: '';
     background-image: url('/images/icons/profile-3.png');
}
.kg-user-menu .kg-logout:before{
    content: '';
    background-image:url('/images/icons/logout-2.svg');
}
.kg-user-menu .kg-help-mode-on:before{
    content: '';
    background-image:url('/images/icons/profile-3.png');
}
.kg-user-menu .kg-help-mode-off:before{
    content: '';
    background-image:url('/images/icons/profile-3.png');
}

.kg-profile-text,
.kg-change-user-password-text,
.kg-help-mode-text,
.kg-logout-text-text{
    display: inline-block;
    margin-top:4px;
}

.kg-top-search {
    float: right;
    margin-right: 16px;
    margin-top: 25px;
}

.kg-top-search__serch-line {
    border-radius: 5px;
    box-sizing: border-box;
    height: 34px;
    max-height: 34px;
    max-width: 715px;
    min-width: 300px;
    width: 300px;
    font-size: 100%;
    font: 16px Arial, Helvetica, sans-serif;
    padding: 8px;
    color: #333;
    background-color: rgba(255,255,255,1);
    border: none;
    float: left;
    overflow: hidden;
}

.kg-navigation__scroll-bottom,
.kg-navigation__scroll-top{
    display: block;
    width: 100%;
    height: 20px;
    background-repeat: no-repeat;
    background-position: 50% 30%;
    background-size: 40px;
    background-color: rgba(0,0,0,0);
    cursor: pointer;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid #364957;
    border-top: 1px solid #364957;
}

.kg-navigation__scroll-bottom:hover,
.kg-navigation__scroll-top:hover{
    background-color: #2C4259;
}

.kg-navigation__scroll-top.kg-navigation__scroll-hidden,
.kg-navigation__scroll-bottom.kg-navigation__scroll-hidden{
    display: none;
}

.kg-navigation__scroll-top{
    background-image:url('/components/navigation/icons/arrow-up.svg');
}

.kg-navigation__scroll-bottom{
    border-top:none;
    background-image:url('/components/navigation/icons/arrow_down.svg');
}

.kg-navigation_hide {
    display: none;
}

