ul.nav--menu-list li
{
    display: flex;
}

ul.nav--menu-list
{
    list-style : none;
    margin     : 0;
    padding    : 0;
    display    : flex;
    width      : 100%;
    justify-content: space-between;
}

a.link
{
    font-family : 'Roboto', sans-serif;
    font-size   : 14px;
    font-weight : 400;
    color       : #174a7d;
}

header
{
    background      : #174a7d url( /assets/img/bg/header-city-montreal.jpg) no-repeat bottom center;
    max-height      : 612px;
    min-height      : 322px;
    height          : calc( ( ( 100vw - 322px ) / ( 1170 - 320 ) ) * 622 );
    background-size : cover;
    width           : 100%;
    position        : relative;
}

nav.nav--top
{
    background-color : #071230;
    height           : 86px;
}

nav.nav--topbar
{
    height : 179px;
}

.nav--container
{
    background      : #1b4278 url( /assets/img/bg/montreal-night.png) no-repeat bottom center;
    height          : 200px;
    background-size : cover;
}

.nav--container h1
{
    font-family : 'Bungee', cursive;
    font-size   : 36px;
    color       : #fff;
}

.nav--container h2
{
    font-family : 'Quicksand', sans-serif;
    font-size   : 22px;
    color       : #fff;
}

.mobile--menu-panel
{
    margin     : 0;
    padding    : 0;
    overflow-y : auto;
}

.mobile--menu-panel ul
{
    margin  : 0;
    padding : 0;
}

.mobile--menu-panel.active
{
    /*transform: translateX(0px);*/
}

.mobile--menu-panel li a
{
    color           : #f0f0f0;
    text-decoration : none;
    padding         : 16px 16px 16px 32px;
    display         : block;
}

.mobile--close
{
    font-size : 26px;
    cursor    : pointer;
    outline   : none;    
}