
.nav_bar{
    width: 100%;
    box-sizing: border-box;
    background-color: rgba(255, 205, 40);
    padding: 0 var(--padding-left-global) 0 var(--padding-left-global);
    height: 6vh;
    min-height: 35px;
}

.nav_bar a.nav_bar_item{
    display: inline-block;
    color:  #000000;
    text-decoration: none;
    padding-right:  30px;
}

.nav_bar a.selected{
    text-decoration: underline;
}

/* .nav_bar a.nav_bar_item:hover {
    text-shadow: 4px 4px rgba(255, 177, 182, 0.7); 
}*/

.nav_bar a:nth-child(6){
    padding-right:  0;
}

@media only screen and (max-width: 800px) {
    .nav_bar a:nth-child(8){
        padding: 10px var(--padding-left-global) 10px 10px;
    }
}

.nav_bar a.selected{
    text-decoration: underline;
}

.nav_bar a.icon{
    display: none;
}

.nav_bar a#lang_button, .nav_bar a#about_projects_button{
    float: right;
}

@media only screen and (max-width: 800px) {
    .nav_bar a.nav_bar_item{
        display: none;
    }
    
    #open_menu_button{
        display: inline-block;
        width: auto;
        top: 0px;
        left: 0px;
        padding-left: var(--padding-left-global);
        padding-top: 1px;
    }
}


/* - - - - - - - hamburger menu sign - - - - - - - */
.bar1, .bar2, .bar3 {
    width: 25px;
    height: 3px;
    background-color: #333;
    margin: 6px 0;
    transition: 0.4s;
  }

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 4px);
    transform: rotate(-45deg) translate(-9px, 4px);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -4px);
    transform: rotate(45deg) translate(-8px, -4px);
}


/* css pro otevrene menu */
.nav_bar.opened{
    z-index: 100;
    margin-bottom: 15px;
    height: auto;
}

@media only screen and (max-width: 800px) {
    .nav_bar.opened a{
        display: inline-block;
        width: 100%;
        text-align: center;
        font-size: 15pt;
        margin: 5px 0 0 0;
        padding: 0;
    }

    .nav_bar.opened a#lang_button {
        display: none;
    }
} 