/* General */

body {
    font-family: "Georgia", "Arial", serif;
}

form {
    text-align: right;
    width: 50em;
    max-width: 85vw;
    margin: 0 1em 1em 1em;
}

input {
    color: #232323;
    background: lightgray;
    border: none;
    padding: 0.5em;
    border-radius: 0.5em;
    margin: 0.6em 0;
    margin-bottom: 0.5em;
    text-align: right;
    transition: all 0.1s ease-in-out;
}

form select {
    border: none;
    background: lightgray;
    padding: 0.4em;
    border-radius: 0.5em;
    margin: 0.5em;
    transition: all 0.1s ease-in-out;
    text-align: right;
    /*direction: rtl;*/
}

form input:hover, form select:hover {
    background: #cccccc;
    box-shadow: #7d7d7d 0 0 0.5em 0.1em;
    transition: all 0.05s ease-in-out;
}

form .tekst {
    text-align: left;
    width: 100%;
    font-size: 1.2em;
    font-weight: 600;
    font-family: sans-serif;
}

form label .enhet {
    font-family: monospace;
}

div.output {
    /*width: 60em;*/
    max-width: 99vw;
    word-wrap: break-word;
    color: #212121;
    box-shadow: #9b9b9b 0 0 0.5em 0.1em;
    padding: 0.5em;
    font-family: "Trebuchet MS", sans-serif;
    margin-top: 1em;
    /*pointer-events: none;*/
}

.overskrift {
    font-weight: 200;
    font-size: 1.2em;
    line-height: 1.5em;
}

.hide {
    display: none!important;
    /*transition: all 1s;*/
}

h2 {
    color: #a11100;
    font-family: "Trebuchet MS", sans-serif;
}

h3 {
    color: #5c268e;
    font-family: "Chaos and Pain", sans-serif;
}

/* Table */

table {
    border-collapse: collapse;
    /*border-spacing: 0.2em;*/

}

td, th {
    min-width: 1.5em;
    padding: 0.4em;
    background: #8fadb0;
    /*white-space: nowrap;*/
}

tr:not(:first-child) td:not(:first-child) {
    text-align: center;
}

td:not(:last-child), th:not(:last-child) {
    /*border-right: solid #707070 0.2em;*/
    /*border-left: solid #707070 0.2em;*/
    border-right: solid white 0.4em;
    /*border-left: solid white 0.4em;*/
}

tr:not(:last-child) {
    /*border-bottom: solid #707070 0.2em;*/
    /*border-top: solid #707070 0.2em;*/
    border-bottom: solid white 0.4em;
    /*border-top: solid white 0.4em;*/
}

tr:first-child td, tr th {
    background: #8d8d8d;
    font-size: 1.1em;
}

td:first-child {
    font-family: "Arial Rounded MT Bold", sans-serif;
}

/* Menu */

#dirs {
    transition: background 0.75s ease-in-out;
    padding: 0.25em 0.4em 0 0.4em;
    /*height: 3.75em;*/
    border-radius: 0.4em 0;
    font-family: "Alte DIN 1451 Mittelschrift", inherit, sans-serif;
}

#links {
    transition: background-color 0.75s ease-in-out;
    border-radius: 0 0 0.4em 0.4em;
}

.filebar {
    padding: 0.1em 0.4em;
    border-radius: 0 0 0.4em 0.4em;
    margin-top: -0.25em;
    border-top: rgba(0%,0%,0%,0.3) 0.3em groove;
}

.menulink {
    display: inline-block;
    text-decoration: none;
    color: #000000;
    padding: 0.5em;
    background: #667795;
    border-radius: 0.5em;
    margin: 0.25em 0.1em 0.25em 0.1em;
    box-shadow: inset #4e5f7d 0 0 0.5em 0.2em;
    font-family: "Alte DIN 1451 Mittelschrift", inherit, sans-serif;
    font-weight: 300;
}

.menulink:hover {
    background: #7588a8;
    box-shadow: inset #56698c 0 0 0.5em 0.2em;
    transition: background-color, box-shadow 0.1s ease-in-out;
}

#dirs .menulink {
    margin-left: 0.25em;
    margin-right: 0.25em;
    margin-bottom: 0.75em;
    transition:
            margin 0.2s ease,
            padding 0.2s ease,
            border-radius 0.4s ease;
    /*transition-delay: 0.2s;*/

}

#activePage {
    pointer-events: none;
    color: white;
    font-weight: bold;
    font-family: "Alte DIN 1451 Mittelschrift Gepreagt", inherit, serif;
}

#activeDir {
    color: white;
    font-weight: bold;
    font-family: "Alte DIN 1451 Mittelschrift Gepreagt", inherit, sans-serif;
}

#dirs .menulink.clickedDir {
    /*display: ruby;*/
    border-radius: 1em 1em 0.1em 0.1em;
    padding: 0.5em 1em 1em 1em;
    margin-bottom: 0;
    pointer-events: none;
    transition:
            margin 0.2s ease,
            padding 0.2s ease,
            border-radius 0.4s ease;
    transition-delay: 0.2s;
}

/* Tabmenu */

ul.tabmenu {
    font-family: "Alte DIN 1451 Mittelschrift", sans-serif;
    padding: 0.2em;
    /*background: lightgray;*/
    /*padding-left: 0;*/
    /*border: 0.2em lightgray solid;*/
    /*border-radius: 0.5em;*/
    /*display: inline-block;*/
    margin: 0 0 0.2em 0;
    /*margin-bottom: 0.2em;*/
}

ul.tabmenu li {
    display: inline-block;
    /*background: #576a8f;*/
    background: #822119;
    color: #ececec;
    border-radius: 0.5em;
    margin: 0.2em;
    padding: 0.1em 0.5em;
    line-height: 1.5em;
    cursor: default;
    transition: all 0.1s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-family: "Arial", sans-serif;
}

ul.tabmenu li.aktiv {
    /*background: #4a95ff;*/
    background: #bc0000;
    color: #ffffff;
    font-family: "Arial Black", sans-serif;
    box-shadow: #848484 0 0 0.4em 0.1em;
    padding: 0.1em 2em;
}

ul.tabmenu li:hover:not(.aktiv) {
    /*background: #8888ff;*/
    box-shadow: #828282 0 0 0.4em 0.1em;
    transition: all 0.1s;
    /*cursor: pointer;*/
}

div.tabContainer {
    /*border: solid 0.2em lightgray;*/
    /*border-radius: 0.5em;*/
    display: inline-block;
}

/*Spesialtilfeller*/

.gangetabellen {
    list-style: none;
    text-align: left;
    padding:0;
    margin:0;
}

.gangetabellen li {
    display: inline-block;
    margin: 1em;

}

img.terning {
    visibility: hidden;
    /*display: none;*/
    animation-name: fjern;
    animation-iteration-count: 1;
    width: 10%;
}

@keyframes fjern {
    from {visibility: visible;}
    to {visibility: hidden;}
}

#terningsist {
    animation: fjern reverse linear infinite;
    animation-duration: 5s;
}

div.branch {
    margin: 0.2em;
    padding: 0.2em 2em;
    border-left: #b4b4b4 0.2em dashed;
}

ul.diff {
    background: #d6d3e3;
    padding: 0.2em;
    list-style: none;
    border-radius: 0.8em;
}

ul.diff>li {
    background: #9c9c9c;
    padding: 0.3em;
    margin: 0.75em;
    border-radius: 0.4em;
}

ul.diff li.inserted {
    background: #88c288;
}

ul.diff li.deleted {
    background: #c28888;
}

img.merke {
    height: 12em;
    /*float:right;*/
    /*display: inline;*/
    /*margin-left: 12em;*/
    margin: 0;
}