/* latin */
@font-face {
    font-family: 'Sora';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(Sora.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(Raleway.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --sormegleren-bg: #eeecf0; /* Dark Blue */
    --sormegleren-color-one: #1e003c; /* Dark Blue */
    --sormegleren-color-two: #783cbe; /* Purple */
    --sormegleren-color-three: #e14605; /* Orange */
    --sormegleren-color-four: #f5aa00; /* Yellow */
    --sormegleren-header-main-bar-height: 80px;
    --sormegleren-header-mobile-main-bar-height: 60px;
}

body {
    font-family: 'Raleway', Arial, sans-serif;
    background-color: var(--sormegleren-bg);
}

h1, h2, h3, h4, h5, h6, h7 {
    font-family: 'Sora', sans-serif;
    font-weight: 700;
}

nav.navbar {
    background-color: white;
    height: var(--sormegleren-header-main-bar-height);
    box-shadow: 0 1px 0 0 rgb(10 10 10 / 11%);
}

nav .navbar-brand {
    padding: 0;
}

a, a:hover, a:focus {
    color: var(--sormegleren-color-one);
}

.btn-primary {
    background-color: var(--sormegleren-color-one);
    border-color: var(--sormegleren-color-one);
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background-color: var(--sormegleren-color-two);
        border-color: var(--sormegleren-color-two);
    }

.carousel-control-prev-icon, .carousel-control-next-icon {
    background-color: var(--sormegleren-color-one) !important;
}

    .carousel-control-prev-icon:hover, .carousel-control-prev-icon:focus, .carousel-control-prev-icon:active,
    .carousel-control-next-icon:hover, .carousel-control-next-icon:focus, .carousel-control-next-icon:active {
        background-color: var(--sormegleren-color-two) !important;
    }

.btn-outline-primary, .btn-secondary {
    border-color: var(--sormegleren-color-one);
    color: var(--sormegleren-color-one);
    background-color: transparent;
}

    .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active,
    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background-color: var(--sormegleren-color-two);
        border-color: var(--sormegleren-color-two);
        color: white;
    }

.btn-warning, .btn.user-announcements {
    background-color: var(--sormegleren-color-four);
    border-color: var(--sormegleren-color-four);
}

    .btn.user-announcements:after {
        border-left-color: var(--sormegleren-color-four);
    }

    .btn-warning:hover, .btn-warning:focus, .btn-warning:active,
    .btn.user-announcements:hover, .btn.user-announcements:focus, .btn.user-announcements:active {
        background-color: var(--sormegleren-color-three);
        border-color: var(--sormegleren-color-three);
        color: white;
    }



        .btn.user-announcements:hover:after, .btn.user-announcements:focus:after, .btn.user-announcements:active:after {
            border-left-color: var(--sormegleren-color-three);
        }

main .container.primary.first {
    margin-top: -5rem;
}


/* svg-ikon i Widget Infoboks */
.widgets .card-body svg .st0 {
    fill: var(--bs-primary)
}

.widgets .card-text img {
    max-width: 100%;
}

.card-footer {
    background-color: transparent;
    border-top: none;
}

main article.info {
    background-color: var(--sormegleren-bg);
}

footer {
    background-color: var(--sormegleren-color-one);
    color: white;
}

    footer a, footer a:hover, footer a:focus {
        color: white;
    }

.login-logo {
    margin: 1rem;
}

.vipps-login-wrapper img {
    max-width: 100%;
}

@media(max-width: 1023px) {
    nav .navbar {
        height: var(--sormegleren-header-mobile-main-bar-height);
    }
}

svg.info-icon .st0 {
    fill: var(--sormegleren-color-three) !important;
}