@media only screen and (min-width: 320px) and (max-width: 2800px) {
    .breadcrumbs {
        display:flex;
        font-size: 90%;
        margin: 0 auto;
        padding: 16px 10px 0 10px;
    }

    .breadcrumbs>span>a,.breadcrumbs>span>span {
        display: block;
        padding: 10px 0 10px 8px
    }

    .breadcrumbs>span>a {
        min-height: 38px;
        position: relative
    }

    .breadcrumbs>span>a:after {
        color: #666;
        content: "\e90c";
        font-size: 12px;
        padding: 10px 0 10px 8px
    }

    .breadcrumbs>span>a:hover {
        text-decoration: underline
    }
    
    .breadcrumbs>span:last-child {
        color: #adadad;
        overflow: hidden;
        margin-right: 4px;
    }

     .breadcrumbs>span>span {
        text-overflow: ellipsis;
         overflow: hidden;
    }
    
    .breadcrumbs>span{
        text-wrap: nowrap;
    }
     
}

@media only screen and (max-width: 479px) {
    
#header .container {
    min-height: 48px;
}
.navigation-buttons a {
    height: 48px;
    width: 48px;}
.container.navigation-wrapper .site-name {
    flex: 0 1 120px;}
}