﻿/*************************************************
******  Från StatisticonShared projektet        ******
******  Kopieras automatiskt in i projekten ******
******  Ändringar görs i StatisticonShared      ******
**************************************************/

:root {
    --studios-blue: #344a9a;
    --studios-lightblue: #00b4eb;
    --studios-red: #b94a48;
    --studios-grey: #A9A9A9;
    --studios-darkgrey: #505050;
    --stat-font-family: 'Helvetica Neue LT W1G', Helvetica, Arial, sans-serif;
}

body {
    font-size: 16px;
    color: var(--darkgrey);
    font-family: var(--stat-font-family);
    line-height: 1.42857143;
    font-weight: 100;
}

.wrapper {
    position: relative;
    min-height: 100vh;
}

/***************** HEADER **************/
header {
    position: sticky;
    top: 0;
    z-index: 1020;
}

.header, .subheader, .slimheader {
    -webkit-box-shadow: 0 1px 1px 0 #dfdfdf;
    box-shadow: 0 1px 1px 0 #dfdfdf;
    border-bottom: 1px solid #dfdfdf;
}

    .header a {
        font-size: 18px;
    }

    .subheader a, .slimheader a, #footer a, #footer p {
        font-size: 14px;
    }

.navbar-brand img {
    height: auto;
    width: 150px;
}

.navbar-first {
    width: 100%;
    color: var(--darkgrey);
}

.navbar-second {
    width: 100%;
    color: white;
}

.navbar-toggler {
    border: none;
}

.navbar-toggler-lg {
    padding: 5px;
    line-height: 0;
}

.navbar-toggler-sm {
    padding: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    line-height: 0;
}

    .navbar-toggler-sm .navbar-toggler-icon {
        width: 20px;
        height: 20px;
    }

.dropdown-menu {
    background-color: white;
    border-radius: 0;
    border-top: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
    border-bottom: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
    border-left: 0;
    border-right: 0;
}

.dropdown-item {
    width: unset;
}

#navbarMainLinks li:last-of-type, #bottomHeaderLinks li:last-of-type {
    padding-right: 0 !important;
}

.nav-link, .nav-link-sm {
    text-decoration: none;
    display: inline-block;
    position: relative;
    color: var(--darkgrey);
}

    .nav-link:hover {
        background-color: transparent;
    }

    .nav-link::before {
        -webkit-transition: 300ms;
        -o-transition: 300ms;
        transition: 300ms;
        height: 1px;
        content: "";
        position: absolute;
        background-color: var(--darkgrey);
    }

.nav-link-locked {
    cursor: default;
}

    .nav-link-locked i {
        position: relative;
        bottom: 5px;
    }

.nav-link-sm {
    padding: 10px 0px;
    margin: 0;
}

    .nav-link-sm:hover {
        color: unset !important;
    }

    .nav-link-sm::before {
        -webkit-transition: 300ms;
        -o-transition: 300ms;
        transition: 300ms;
        height: 1px;
        content: "";
        position: absolute;
        background-color: var(--darkgrey);
    }

.nav-link-ltr::before {
    width: 0%;
    bottom: 10px;
}

.nav-link-ltr:hover::before {
    width: 100%;
}

.nav-link-ltr.active::before {
    width: 100%;
}

#navbarCollapseContent {
    overflow-y: auto;
    max-height: 100vh;
}

.stat-chevron-down {
    background: url(../images/chevron-down.svg);
    background-repeat: repeat;
    background-repeat: no-repeat;
    height: 10px;
    width: 17px;
    display: inline-block;
}

/***************** FOOTER **************/
footer {
    position: relative;
    z-index: 0;
}

    footer .copyright {
        height: 2em;
    }

    footer #twitter, footer #linkedin {
        font-size: 1.9rem;
    }

    footer li {
        opacity: .8;
        margin: 1rem 0 1rem 0
    }

    footer .footer-seperator {
        opacity: .5;
        width: 2px
    }

.footer-brand img {
    max-height: 200px;
    width: auto;
}

.footer-background {
    position: relative;
    background-color: var(--lightgrey);
    z-index: 0;
}

.footer-background-grey {
    background-color: var(--grey);
}

.list-style-none {
    list-style-type: none
}
