﻿@keyframes shine-skeleton-lines {
    0 {
        background-position: -100px
    }

    40%,100% {
        background-position: 600px
    }
}

.mod__max-w-xl {
    max-width: 1436px;
    margin: auto
}

@keyframes spin {
    0 {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes rotateImageLoading {
    from {
        transform: translate(-50%,-50%) rotateY(0) scale(1.01)
    }

    to {
        transform: translate(-50%,-50%) rotateY(360deg) scale(1.01)
    }
}

.cmp-secondary-navigation {
    --secondary-navigation--background: var(--color-bg-03);
    --secondary-navigation--background-after: var(--color-bg-01);
    --secondary-navigation--background-wrapper: var(--color-bg-01);
    --secondary-navigation--background-info: var(--color-bg-03);
    --secondary-navigation--color-cta: var(--color-font-04);
    --secondary-navigation--color-cta-hover: var(--color-font-04);
    --secondary-navigation--color-cta-active: var(--color-font-03);
    --secondary-navigation--color-info-title: var(--color-font-01);
    --secondary-navigation--color-info-subtitle: var(--color-font-01);
    --secondary-navigation--font-cta: 'CupraLight',sans-serif;
    --secondary-navigation--font-cta-hover: 'CupraRegular',sans-serif;
    --secondary-navigation--font-cta-active: 'CupraMedium',sans-serif;
    --secondary-navigation--font-info-title: 'CupraMedium',sans-serif;
    --secondary-navigation--font-info-subtitle: 'CupraLight',sans-serif
}

@media(min-width:764px) {
    .cmp-secondary-navigation {
        --secondary-navigation--background: var(--color-bg-01);
        --secondary-navigation--background-separator: var(--color-bg-03);
        --secondary-navigation--color-info-title: var(--color-font-03);
        --secondary-navigation--color-info-subtitle: var(--color-font-03)
    }

    .cmp-secondary-navigation__center {
        border-left: 1px solid var(--secondary-navigation--background-separator);
        padding-left: 42px;
        height: 30px
    }
}

@media(min-width:1016px) {
    .cmp-secondary-navigation__center {
        padding-left: 50px
    }
}
