:root {
    --color-header: var(--color-main);
}

.header {
    background:  var(--color-header);
}

    .header {
        height: 48px;
        display: flex;
        justify-content: space-between;
        position: relative;
    }
    .logo-text {
        margin-top: 10px;
        margin-left: 25px;
        font-size: 28px;
    }
    .logo {
        display: flex;
    }
    .icon-image-small {
        margin-right: 15px;
        margin-top: 8px;
    }
    .logo-image-small {
        margin-left: 15px;
        margin-top: 8px;
    }

@media (min-width: 1024px){
    .header {
        width: 100%;
        padding-top: 6px;
        height: 68px;
        display: flex;
        justify-content: space-between;
        position: relative;
        margin: 0 auto 0 auto;
    }
    .logo {
        max-width: 1280px;
        display: flex;
    }
    .icon-image-big {
        margin-right: 15px;
    }
    .icon-image-small {
        display: none;
    }
    .logo-image-small {
        display: none;
    }
    .logo-image-big {
        margin-left: 35px;
    }
    .logo-text {
        margin-top: 16px;
        margin-left: 25px;
        font-size: 3.3em;
    }
}

@media (max-width: 1024px){
    .logo-image-big {
        display: none;
    }
    .icon-image-big {
        display: none;
    }
}

@media (min-width: 1280px){
    .logo {
        margin-left: calc(50vw - 640px);
    }
}

@media (max-width: 540px){

    .icon-image-big {
        display: none;
    }
}