/* HEADER */

/* Navigation */

.main-navigation {
    clear: both;
    display: block;
    float: left;
    width: 100%;
}

.main-navigation ul {
    display: none;
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.main-navigation .sub-menu {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    float: left;
    position: absolute;
    left: -999em;
    z-index: 99999;
}

.main-navigation .sub-menu ul {
    left: -999em;
    top: 0;
}

.main-navigation .sub-menu li:hover>ul,
.main-navigation .sub-menu li.focus>ul {
    left: 100%;
}

.main-navigation .sub-menu a {
    width: 200px;
}

.main-navigation li:hover > ul,
.main-navigation li.focus > ul {
    left: auto;
}

.main-navigation li {
    float: left;
    position: relative;
}

.main-navigation a {
    display: block;
    text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
    display: block;
}

/*distance hover hack for menu */

#primary-menu > li > a{
    margin-bottom: -24px;
    padding-bottom: 24px;
}

#primary-menu .sub-menu{
    margin-top: 24px;
}

.small-header #primary-menu .sub-menu{
    margin-top: 16px;
}

/* :::::::::::hack end::::::::::::*/

@media screen and (min-width: 37.5em) {
    .menu-toggle {
        display: none;
    }

    .main-navigation ul {
        display: block;
    }
}

/*.main-navigation li {*/
/*    padding: 0 0 30px;*/
/*}*/

.main-navigation li a {
    font-style: normal;
    color: #FFFFFF;
    padding: 0 1.5em;
    font-size: 1.2em;
    font-weight: 300;
    cursor: pointer;
}

.main-navigation .sub-menu {
    background: #fff;
    padding: 20px 30px;
    display: block;
    box-shadow: none;
}

.main-navigation .sub-menu li {
    padding: 0;
}

.main-navigation .sub-menu a {
    border-bottom: 1px solid #0A314C;
    color: #0A314C;
    padding: 10px 0;
}

.main-navigation .sub-menu li:last-child a {
    border-bottom: 0 none;
}

.bg-blue-dark.site-header{
    background: rgba(10, 49, 76, 0.95);
}

.site-header{
    transition: all .5s;
    padding: 1.5rem 0;
}

.site-branding{
    transition: max-width .3s;
    padding-bottom: 8px;
}


.small-header .site-branding{
    /*max-width: 20%;*/
    padding-bottom: 8px;
}

.small-header .language-chooser{
    bottom: 0;
    right: 180px;
}

.site-branding img{
    max-width: 75%;
    transition: max-width .3s;
}

.small-header .site-branding img{
    max-width: 45%;
}

.small-header a.contact{
    right: 95px;
    bottom: 0;
}

.small-header{
    padding: 1rem 0;
}

.small-logo{
    position: absolute;
    opacity: 0;
    transition: all .3s;
    width: 105px;
    top: 15px;
    max-width: 165px;
}

.small-header .small-logo{
    left: 0;
    opacity: 1;
}

.btn-toggle{
    position: absolute;
    z-index: 10;
    top: auto;
    bottom: 0;
    right: 15px;
    display: block;
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 0.2);
    padding: 5px 10px;
}

.btn-toggle:not(.collapsed) .btn-bar{
    background: rgb(98, 187, 255);
}

.btn-bar{
    display: block;
    width: 23px;
    height: 2px;
    background: rgba(255,255,255,0.8);
    margin: 5px 0;
}

#masthead > .nav-container{
    position: relative;
}

.additionals-navigation{
    position: absolute;
    background: #FFFFFF;
    color: rgb(10, 49, 76);
    margin-top: 5px;
    right: 0;
    top: 91px;
    width: 250px;
    padding: 15px 10px;
}

.small-header .additionals-navigation{
    top: 57px;
}

.additionals-navigation li{
    float: none;
    padding: 10px 0;
    text-align: left;
    margin: 0 20px;
    border-bottom: 1px solid rgb(10, 49, 76);
}

.additionals-navigation li:last-child{
    border-bottom: none;
}

.additionals-navigation li a{
    color: rgb(10, 49, 76);
    padding: 0;
}

#menu-mobile{
    padding: 25px 0;
    margin-left: 0;
    margin-top: 20px;
    padding-left: 0;
    background-color: #FFFFFF;
}

#menu-mobile li{
    padding: 2px;
    font-size: 18px;
    display: block;
    /*border-bottom: 1px solid #000000;*/
    /*margin: 0px 25px;*/
    padding: 5px;
}

#menu-mobile .sub-menu{
    margin-left: 0;
}

#menu-mobile li a{
    padding-left: 15px;
}

#menu-mobile li:last-child{
    border-bottom: none;
}

#menu-mobile, #menu-mobile li, #menu-mobile a{
    list-style: none;
    margin-left: 0;
    padding-left: 0;
    color: #FFFFFF;
    font-style: normal;
    cursor: pointer;
    color: #0A314C;
    font-weight: 400;
    text-decoration: none;
    cursor: pointer;
}

a.contact{
    cursor: pointer;
    font-weight: 300;
    font-size: 1em;
    position: absolute;
    right: 15px;
    bottom: 60px;
    transition: all .3s;
    text-decoration: none;
    color: #FFFFFF;
    font-family: "Fira Sans", Arial, sans-serif;
    font-style: normal;
}


.language-chooser{
    position: absolute;
    right: 105px;
    bottom: 60px;
    opacity: 1;
    transition: all .3s;
}

@media (max-width: 1199px) {
    a.contact{
        bottom: 50px;
    }
    .language-chooser{
        bottom: 50px;
    }
}

.language-chooser li {
    display: inline;
}

.language-chooser a{
    text-decoration: none;
    color: #FFFFFF;
    font-style: normal;
}

.language-chooser a:hover{
    color: #FFFFFF;
}

.language-chooser ul li:first-child:after{
    content: "|";
    padding-left: 2px;
    color: #FFFFFF;
}

.language-chooser a:visited{
    color: #FFFFFF;
}

#lang-switch, #lang-switch ul{
    margin: 0;
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 19px;
}

/* Hide default HTML checkbox */
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* Language chooser */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .2s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 19px;
    width: 19px;
    left: 0px;
    bottom: 0px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider {
    background-color: #CCCCCC;
}

input:focus + .slider {
    box-shadow: 0 0 1px #CCCCCC;
}

input:checked + .slider:before {
    -webkit-transform: translateX(12px);
    -ms-transform: translateX(12px);
    transform: translateX(12px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

a.contact:hover, a.contact:visited{
    color: #FFFFFF;
    font-style: normal;
}

.logo-mobile{
    display: none;
}

.logo-desktop{
    display: block;
}

@media (max-width: 1199px) {
    .additionals-navigation{
        top: 80px;
    }
    .small-header .additionals-navigation {
        top: 51px;
    }
}

@media (max-width: 991px) {
    .site-header > .nav-container{
        margin: 0;
        max-width: 100%;
    }

    .locked{
        overflow: hidden;
    }

    .scrollable{
      bottom: 0;
        overflow: scroll;
    }

    .language-chooser{
        right: 180px;
        top: 20px;
        opacity: 1;
        transition: opacity .5s;
    }

    .small-header .site-branding img{
        max-width: 100%;
    }

    .small-header .language-chooser{
        opacity: 1;
    }

    .site-branding img{
        max-width: 100%;
    }

    .logo-mobile{
        display: block;
    }

    a.contact{
        cursor: pointer;
        font-size: 1em;
        position: absolute;
        z-index: 10;
    }

    .btn-toggle{
        right: 0;
    }

    .site-branding{
        max-width: 165px;
        padding-bottom: 0;
    }

    .small-header{
        padding: 1.5rem 0;
    }

    .small-header .site-branding{
        padding-bottom: 0;
        max-width: 165px;
    }

    .small-logo{
        position: relative;
        transition: all .3s;
        opacity: 1;
        top: 0;
    }

    .small-header .small-logo{
        opacity: 1;
    }


    .small-header a.contact{
        opacity: 1;
        right: 95px;
    }

    a.contact{
        opacity: 1;
        right: 95px;
        top: 20px;
    }
}

@media (max-width: 576px) {
    .language-chooser{
        display: none;
    }
}
