/*
    (c) www.matsson.com
    First published 2019-11-28
    Last updated 2025-01-22
*/
@font-face {
    font-family: 'EBGaramond';
    src: url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Regular.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Regular.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'EBGaramond';
    src: url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Medium.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Medium.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Medium.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'EBGaramond';
    src: url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Italic.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Italic.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'EBGaramond';
    src: url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-MediumItalic.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-MediumItalic.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/ebgaramond/EBGaramond-MediumItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'RobotoCondensed';
    src: url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Light.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Light.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Light.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'RobotoCondensed';
    src: url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Regular.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Regular.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Regular.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'RobotoCondensed';
    src: url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-LightItalic.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-LightItalic.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-LightItalic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'RobotoCondensed';
    src: url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Italic.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Italic.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/roboto-condensed/RobotoCondensed-Italic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'RobotoMono';
    src: url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Light.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Light.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Light.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'RobotoMono';
    src: url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Regular.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Regular.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Regular.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'RobotoMono';
    src: url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-LightItalic.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-LightItalic.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-LightItalic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'RobotoMono';
    src: url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Italic.woff2') format('woff2'),
         url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Italic.woff') format('woff'),
         url('https://www.matsson.com/lib/fonts/roboto-mono/RobotoMono-Italic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}
/*
    Copy and pasted from
    http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126
    modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize
    normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
*/
/* Remove all defaults */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    border: 0;
    border-image-width: 0;
    font-size: 100%;
    vertical-align: baseline;
    box-sizing: border-box;
}
/* Normalize displays, fix old browser defaults */
article, aside, pre, code, details, figcaption, figure, footer, header, hgroup, img, main, menu, nav, picture, section {
    display: block;
}
summary {
  display: list-item;
}
template, [hidden] {
    display: none;
}
legend {
    display: table;
    color: inherit;
    max-width: 100%;
    white-space: normal;
}
ol, ul {
    list-style: none;
}
table {
    border-color: currentcolor;
    border-collapse: collapse;
    border-spacing: 0;
}
/* modern-normalize stuff */
::-webkit-search-decoration {
    -webkit-appearance: none;
}
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    tab-size: 4;
    scroll-behavior: auto;
}
/* End of reset, start of actual CSS */
body {
    line-height: 1.3;
    font-size: 1.25rem;
    font-family: 'EBGaramond', serif;
    -webkit-font-smoothing: antialiased;
    -webkit-hyphens: auto;
    hyphens: auto;
    word-break: break-word;
    text-align: justify;
    color: #001824;
    background-color: #001824;
}
p, h1, h2, h3, h4, h5, h6, header, a {
    text-wrap: pretty;
}
#content-ctr {
    margin: 0 auto;
    background-color: #fafafa;
    max-width: 960px;
}

main, footer {
    margin: 0 auto;
    padding: 0 32px;
    max-width: 768px;
    color: #001824;
    background-color: #fafafa;
}
main {
    margin-top: 52px;
    padding-top: 42px;
}
footer {
    margin-top: -20px;
    padding-bottom: 20px;
    font-size: 1rem;
    line-height: 1.1;
    text-align: center;
}

hr {
    margin: 1px -4px 10px;
    height: 1px;
    background-color: #001824;
}
footer hr {
    margin-top: 2px;
}

section { padding-bottom: 60px; }
article { padding-bottom: 80px; }
article > section:last-child { padding-bottom: 0; }

#siteheader {
    padding: 5px 0;
    width: 100%;
    height: 52px;
    text-align: center;
    background-color: #003047;
    position: fixed;
    top: 0;
    z-index: 1000;
}

#navbar {
    margin: 0 auto;
    height: 100%;
    max-width: 960px;
    line-height: 22px;
    font-size: 1rem;
    font-family: 'RobotoCondensed', sans-serif;
}

.navbutton {
    padding: 10px;
    position: relative;
    float: left;
    font-weight: bold;
    overflow-x: clip;
}
ul.dropdown-menu li a {
    padding: 5px;
    width: 100%;
    font-weight: normal;
}
.navbutton, ul.dropdown-menu li a {
    height: 100%;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    color: #fafafa;
    transition: background-color 180ms ease, color 180ms ease;
}
.navbutton:hover, ul.dropdown-menu li a:hover {
    color: #003047;
    background-color: #fafafa;
}

.navicon {
    margin: 0;
    display: inline;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    border-width: 0;
}
.inverted-ico {
    filter: invert(1);
    transition: filter 180ms ease;
}
.navbutton:hover .inverted-ico {
    filter: invert(0);
}
.invert-ico {
    filter: invert(0);
    transition: filter 180ms ease;
}
.navbutton:hover .invert-ico {
    filter: invert(1);
}

ul.dropdown-menu {
    margin-top: 10px;
    padding: 0 5px;
    position: relative;
    pointer-events: none;
    opacity: 0;

    overflow-x: hidden;
    overflow-y: auto;
    transition: opacity 180ms ease;
    color: #fafafa;
    background-color: #003047;

    width: 100%;
    width: calc(100% + 10px);
    max-height: 240px;
    max-height: min(240px, 50vh);
    right: 5px;
}
.dropdown-title {
    max-height: 100%;
    overflow-x: clip;
}
.dropdown-ctr:hover > ul.dropdown-menu {
    pointer-events: auto;
    opacity: 1;
}

ul.dropdown-menu li:first-child > a { margin-top: 5px; }
ul.dropdown-menu li:last-child > a { margin-bottom: 5px; }

.tooltip-ctr {
    overflow-x: visible;
    position: relative;
}
.tooltip-text {
    pointer-events: none;
}
/* tooltip-text-left är default och centrerad */
.tooltip-ctr .tooltip-text {
    padding: 5px 7px;
    position: absolute;
    left: -6px;
    width: 100%;
    width: calc(100% + 12px);
    opacity: 0;
    color: #fafafa;
    background-color: #003047;
    font-weight: normal;
    border-radius: 6px;
    top: 130%;
    top: calc(100% + 12px);
    transform: scale(0);
    transition: opacity 180ms ease, transform 90ms ease;
}
.tooltip-ctr .tooltip-text.tooltip-text-right {
    left: -18px;
}
.tooltip-ctr .tooltip-text::after {
    position: absolute;
    bottom: 100%;
    content: '';
    border-style: solid;
    border-color: transparent transparent #003047 transparent;
    border-width: 0 4px 5px 4px;
    left: 50%;
    left: calc(50% - 4px);
}
.tooltip-ctr .tooltip-text.tooltip-text-right::after {
    border-width: 0 2px 5px 6px;
    left: 50%;
    left: calc(50% + 6px);
}
.tooltip-ctr:hover .tooltip-text {
    opacity: 1;
    transform: scale(1);
}

.nb0 { width: 0; }
.nb1 { width: 6.25%; }
.nb2 { width: 12.5%; }
.nb3 { width: 18.75%; }
.nb4 { width: 25%; }
.nb5 { width: 31.25%; }
.nb6 { width: 37.5%; }
.nb7 { width: 43.75%; }
.nb8 { width: 50%; }
.nb9 { width: 56.25%; }
.nb10 { width: 62.5%; }
.nb11 { width: 68.75%; }
.nb12 { width: 75%; }
.nb13 { width: 81.25%; }
.nb14 { width: 87.5%; }
.nb15 { width: 93.75%; }
.nb16 { width: 100%; }

a { color: #001824; }
a:hover { color: #e87400; }
header a { text-decoration: none; }
li a { text-decoration: none; }

/* increase clickable area */
p a, .innehall-ctr li a, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    margin: -4px;
    padding: 4px;
}
h1, h2, h3, h4, h5, h6 {
    text-align: center;
    font-weight: normal;
    font-size: 1.875rem;
    font-family: 'RobotoCondensed', sans-serif;
}
h4, h5, h6, .h7, .h8, .h9 {
    font-size: 1.625rem;
}
._kapitel {
    font-size: 1.875rem;
}

img, picture {
    margin: auto;
    height: auto;
    max-width: 100%;
    border-style: solid;
    border-width: 1px;
    border-color: #001824;
}
.img-ctr {
    margin: 20px auto;
    width: fit-content;
    max-width: 85%;
}
.imgsubtext {
    font-size: 1rem;
}
.img-crop {
    clip-path: inset(9px round 24px);
    background: #001824;
}
.img-crop img {
    clip-path: inset(10px round 24px);
}

.noborder { border-width: 0; }
.align-left { float: left; }
.align-right { float: right; }

.jax-equation {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}
.collapsible {
    margin: 20px auto;
    max-width: 85%;
}
.collapsible-content {
    color: #000c12;
    background-color: #eaf3f8;
    overflow: hidden;
    max-height: 0;
    transition: max-height 360ms cubic-bezier(0, 1, 0, 1);
}
.collapsible-content-inner {
    padding: 8px 15px 12px;
    border-style: none solid solid solid;
    border-width: 1px;
    border-color: #003047;
    transition: border-color 180ms ease;
}
.collapsible-button {
    padding: 10px;
    position: relative; /* detta och nedre ser till att detta placeras över texten */
    display: block;
    user-select: none;
    font-size: 1rem;
    font-family: 'RobotoCondensed', sans-serif;
    text-align: center;
    cursor: pointer;
    border-radius: 12px;
    color: #fafafa;
    background-color: #003047;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    transition: background-color 180ms ease;
}
.collapsible-button::before {
    content: '';
    display: inline-block;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid currentColor;
    vertical-align: middle;
    margin-right: 7px;
    transform: translateY(-1.5707963267949px);
    transition: transform 180ms ease;
}
.collapsible-button:hover {
    background-color: #00476b;
}
.collapsible-button:hover + .collapsible-content .collapsible-content-inner {
    border-color: #00476b;
}
.collapsible-checkbox { display: none; }
.collapsible-checkbox:checked + .collapsible-button::before {
    transform: rotate(90deg) translateX(-1.5707963267949px) translateY(1.5707963267949px);
}
.collapsible-checkbox:checked + .collapsible-button + .collapsible-content {
    max-height: 10000px;
    transition-timing-function: cubic-bezier(0.5, 0, 1, 0);
}

code {
    margin: 20px auto;
    padding: 5px 15px;
    max-width: 95%;
    font-family: 'RobotoMono', monospace;
    font-size: 1rem;
    border-style: solid;
    border-width: 1px;
    color: #000c12;
    background-color: #eaf3f8;
    border-color: #000c12;
    text-align: start;
    -webkit-hyphens: none;
    hyphens: none;
    white-space: pre-wrap;
    word-break: break-all;
}

.thm, .exc, .def, .prop {
    font-style: italic;
}
.thm p:first-of-type::before {
    font-weight: bold;
    content:"Thm. ";
}
.def p:first-of-type::before {
    font-weight: bold;
    content:"Def. ";
}
.exc p:first-of-type::before {
    font-weight: bold;
    content:"Exc. ";
}
.prop p:first-of-type::before {
    font-weight: bold;
    content:"Prop. ";
}

.innehall-ctr {
    margin-top: 3%;
}
.innehall-ctr li {
    padding: 4px 0;
    border-bottom: 1px solid #cdcdcd;
}
.innehall-ctr li:last-child {
    border: none;
}
.innehall-ctr li a {
    display: block;
}
.innehall-ctr li a:hover {
    transform-origin: left center;
    transform: scale(1.0125);
}

/* 768 flippa allt snart */
@media (max-width: 767px) {
    /* html funkar men inte body, se över när flippen sker */
    html {
        font-size: 0.9rem;
    }
    main {
        margin-top: 46px;
        padding-top: 36px;
    }
    .innehall-ctr li {
        padding: 3px 0;
    }

    #siteheader { height: 46px; }
    #navbar { line-height: 16px; }
}
