@charset "utf-8";

@font-face {
  font-family: 'Source Sans';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/SourceSans3-Regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Source Sans';
  font-style: italic;
  font-weight: 400;
  src: url('/fonts/SourceSans3-It.woff2') format('woff2');
}

@font-face {
  font-family: 'Source Sans';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/SourceSans3-Semibold.woff2') format('woff2');
}

@font-face {
  font-family: 'Source Sans';
  font-style: normal;
  font-weight: bold;
  src: url('/fonts/SourceSans3-Bold.woff2') format('woff2');
}

@media screen,projection {

:root {
--fill: 1em;
--lh: 1.4;
--mrgn: calc(var(--lh) * 1em);
--blue: #0075bf;
--blue_alt: #0064a3;
--blue_grad: linear-gradient(to bottom, #0075bf, #005286);
--white: #fff;
--grey_grad: linear-gradient(to bottom, #d1d7da, #b6bdc2);
--color_txt: var(--blue_alt);
--color_txt_alt: var(--white);
--color_bg: var(--white);
--color_bg_alt: var(--blue);
--color_bg_grad: var(--blue_grad);
--color_bg_nav: var(--grey_grad);
}

html {
height: 100%;
box-sizing: border-box;
-ms-text-size-adjust: 100%;
-moz-text-size-adjust: none;
-webkit-text-size-adjust: none;
text-size-adjust: none;
line-height: 1.15;
scroll-behavior: smooth;
}
*, *::before, *::after {
box-sizing: inherit;
}

body {
min-height: 100%;
margin: 0 auto;
padding: 0 var(--fill);
color: var(--color_txt);
font-family: 'Source Sans', sans-serif;
font-size: 100%;
line-height: var(--lh);
background: var(--color_bg);
}
h1, h2, h3, h4, h5, h6 {
overflow-wrap: break-word;
}
h1 {
margin: 1.333em 0 .67em 0;
font-size: 150%;
}
h2 {
margin: 2em 0 1.4em;
font-size: 125%;
text-transform: uppercase;
letter-spacing: .05em;
text-decoration: underline;
text-underline-offset: .25em;
text-decoration-thickness: 2px;
}
h3, h4, h5, h6 {
margin: 1em 0 0;
font-size: 100%;
}
h3 {
	& + * {
	margin-top: .5rem;
	}
}
h4, h5 {
	& + * {
	margin-top: 0;
	}
}

a {
color: inherit;
background-color: transparent;
}
b, strong {
font-weight: bolder;
}
img {
max-width: 100%;
height: auto;
border: 0;
-ms-interpolation-mode: bicubic;
}

svg:not(:root) {
overflow: hidden;
}
video, picture, canvas, iframe, object {
display: block;
max-width: 100%;
height: auto;
}

figure {
margin-left: auto;
margin-right: auto;
	img {
	vertical-align: top;
	}
}

hr {
height: 0;
margin : 1em auto;
color: inherit;
border : none;
border-top : 1px solid;
	& + * {
	margin-top: 0;
	}
}
sub, sup {
position: relative;
vertical-align: baseline;
font-size: 75%;
line-height: 0;
font-weight: 600;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}

[hidden] {
display: none;
}
.visually_hidden, .vh {
position: absolute;
clip: rect(0 0 0 0);
overflow: hidden;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
border: 0;
}

/* */

body > * {
}
header, nav {
margin-left: calc(var(--fill) * -1);
margin-right: calc(var(--fill) * -1);
}
.e2e {
margin-left: calc(var(--fill) * -1);
margin-right: calc(var(--fill) * -1);
}
.e2e {
padding-left: var(--fill);
padding-right: var(--fill);
}
.invers {
margin-top: var(--mrgn);
margin-bottom: var(--mrgn);
padding-top: var(--mrgn);
padding-bottom: var(--mrgn);
color: var(--color_txt_alt);
background: var(--color_bg_alt);
background-image: var(--color_bg_grad);
-webkit-font-smoothing: antialiased;
}

.invers > *:first-child {
margin-top: 0;
}
.invers > *:last-child {
margin-bottom: 0;
}

/* */

header {
text-align: center;
}
header h1 {
min-height: 60vh;
margin: 0;
padding: 1em var(--fill) 28vw;
background: no-repeat left bottom var(--color_bg_alt);
background-image: url("/img/stelljes-transporte-header.jpg");
background-size: cover;
}
header h1 img {
width: 75vw;
max-width: 10em;
filter: drop-shadow(0 0 10px  var(--color_bg));
}
header p {
margin: 0;
text-transform: uppercase;
letter-spacing: .15em;
}
header .invers {
margin-top: 0;
margin-bottom: 0;
padding-top: 1em;
padding-bottom: 1em;
}
header span {
font-size: 250%;
font-size: 112.5%;
}
header em {
font-style: normal;
font-weight: bold;
}

/* */

nav {
position: sticky;
top: 0;
padding: 1em var(--fill);
text-align: center;
background: var(--color_bg_nav);
}
nav a {
display: inline-block;
padding: .25em 1em;
text-transform: uppercase;
letter-spacing: .15em;
text-decoration: underline;
text-underline-offset: .375em;
text-underline-offset: .25em;
text-decoration-thickness: 1px;
text-decoration-color: transparent;
transition: text-decoration-color .2s;
}
nav a:hover {
text-decoration-color: inherit;
}
nav a.current {
font-weight: 700;
text-decoration-color: inherit;
}

/* */

main {}

[id] {
/* calc((var(--lh) * 1em) + 2em + .5em + var(--mrgn)) */
scroll-margin-top: calc(var(--nh) + var(--mrgn));
}

main p {
_max-width: 44em;
}

main a {
text-decoration: underline;
text-underline-offset: .2em;
text-decoration-thickness: 1px;
}

section {
margin-top: var(--mrgn);
margin-bottom: var(--mrgn);
}
section > *:first-child {
margin-top: 0;
}
section > *:last-child {
margin-bottom: 0;
}

.images {
margin-top: var(--mrgn);
margin-bottom: var(--mrgn);
padding: 0;
display: flex;
gap: 1em;
list-style: none;
}
.images li {
flex: 3 1 33.333%;
}

dl {
display: grid;
grid-template-columns: max-content 1fr;
gap: .25em 1em;
}
dt {
grid-column: 1;
font-weight: 700;
}
dd{
grid-column: 2;
margin: 0;
}

/* */

footer {
margin-top: var(--mrgn);
}
footer > * {
_font-size: calc(100% * 14 / 16);
}
footer > .invers {
_font-size: 100%;
}
footer .invers > * {
_font-size: calc(100% * 14 / 16);
}
footer > *:first-child {
margin-top: 0;
}
footer > *:last-child {
margin-bottom: 0;
}

/* */

.dev body:before {
content: var(--mq);
position: fixed;
z-index: 1000;
bottom: 10px;
left: 10px;
padding: .5em 2em;
color: #fff;
background: rgba(0,0,0,.7);
-webkit-font-smoothing: antialiased;
}

}

@media only screen {

}

@media (prefers-reduced-motion: reduce) {
* {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}

}

@media only screen and (max-width:24em) {

:root {
--mq: '< 24';
--fill: .5em;
}

body {
font-size: calc(100% * 15 / 16);
}

}

@media only screen and (min-width: 24em) {

:root {
--mq: '24';
}

header span {
font-size: 150%;
}

}

@media only screen and (min-width: 35em) {

:root {
--mq: '35';
--fill: 2em;
--mrgn: 2em;
}

body {
font-size: calc(100% * 17 / 16);
}

}

@media only screen and (min-width: 44em) {

:root {
--mq: '44';
--fill: calc(var(--lh) * 3em);
--mrgn: 3em;
}

body {
}

header .invers {
padding-top: calc(var(--lh) * 1em);
padding-bottom: calc(var(--lh) * 1em);
}
header span {
font-size: 200%;
}

}

@media only screen and (min-width: 64em) {

:root {
--mq: '64';
--fill: 5em;
}

body {
font-size: 112.5%;
}

header span {
font-size: 250%;
}

}

@media only screen and (min-width: 72em) {

:root {
--mq: '72';
--fill: 6em;
}

}

@media only screen and (min-width: 80em) {

:root {
--mq: '80+';
--fill: 10vw;
}

html {
font-size: 1.25vw;
}

}

@media print {

* {
color: #000 !important;
text-shadow: none !important;
background-color: transparent !important;
}

body {
margin: 1cm;
font : 12pt/1.2 'Helvetica Neue',sans-serif;
}
h1 {
font-size : 125%;
}
h2 {
font-size : 112.5%;
}
h3, h4, h5, h6 {
font-size : 100%;
margin : 0;
}
h2, h3 {
page-break-after: avoid;
}
p, h2, h3 {
orphans: 3; widows: 3;
}
ul, ol {
page-break-inside: avoid;
}
li {
margin : 0 0 0 1em;
padding : 0;
}
a, a:visited {
text-decoration: underline;
}
img {
max-width: 100% !important;
height: auto;
page-break-inside: avoid;
}
pre, blockquote {
padding: 1em;
border: 1px solid #999;
page-break-inside: avoid;
}
hr {
margin : 2em 0;
border : 0;
border-bottom : 1px solid #000;
}

table {
page-break-inside: auto;
}
tr {
page-break-inside: avoid;
page-break-after: auto;
}
thead {
display: table-header-group;
}
tfoot {
display: table-footer-group;
}

/*
#divs {
display : none;
}
*/

}