.header-social {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: 16px;
}

.header-social img {
    width: 28px;
    height: 28px;
}

.main-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
}

@media (max-width: 1100px) {
    .logo img {
        width: auto;
        max-width: 100%;
    }

    header {
        padding: 8px 0;
    }

    header .main-wrapper .row {
        display: flex;
    }

    /* .main-nav {
        align-self: center;
    } */
}

@media (max-width: 840px) {
    nav.main-nav ul {
        display: flex;
    }

    .topblue {
        margin-top: 79px;
    }

    .main-wrapper {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
    }

    .navbar-toggle {
        margin: 0;
    }
}

@media (max-width: 839px) {
    nav.main-nav ul {
        flex-direction: column;
    }

    .navbar-collapse {
        width: 100%;
        border-top: none;
        position: fixed;
        top: 78px;
        left: 0;
        right: 0;
        max-height: calc(100vh - 78px);
        overflow: auto;
        background: #fff;
        padding: 20px;
    }

    .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
        max-height: calc(100vh - 78px);
    }

    nav.main-nav ul li a {
        padding: 16px;
    }   
}

@media (max-width: 540px) {
    header .col-xs-3 {
        width: auto;
    }

    header .main-nav {
        width: auto;
        flex-grow: 1;
    }
}