@charset "UTF-8";
/* ==== stil för Sverigetempot ==== */
/* gemensamma definitioner för alla SCSS-filer i tkit och TAS */
/* importera konfiguration definierad per site */
/* ==== stil-inställningar för Sverigetempot ==== */
/* text */
/* navigering */
/* formulär-widgets */
/* text-widgets */
/* ==== komponenter ==== */
img.break {
  margin: 0.8em 0 0 0; }
  img.break:first-child {
    margin: 0; }
  h1 + img.break, h2 + img.break, h3 + img.break, h4 + img.break, h5 + img.break, h6 + img.break, .header + img.break {
    margin: 0; }

.service-icon-align {
  margin: 0.2em 0 0 0; }
  .service-icon-align:first-child {
    margin: 0; }
  h1 + .service-icon-align, h2 + .service-icon-align, h3 + .service-icon-align, h4 + .service-icon-align, h5 + .service-icon-align, h6 + .service-icon-align, .header + .service-icon-align {
    margin: 0; }

/* ---- formulär ---- */
/* -- widgets -- */
.standalone {
  display: inline-block;
  white-space: nowrap;
  border: 1px solid #CCC;
  padding: 0.1em 0.3em;
  border-radius: 5px;
  max-width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .touch .standalone {
    font-size: 120%;
    padding: 0.3em; }
  .required .standalone, [required].standalone {
    border: 1px solid #1f567d; }
  .standalone:disabled, form .required .standalone:disabled, [required].standalone:disabled {
    border: 1px solid #EEE;
    color: #888;
    background: inherit; }
  .error .standalone, .required.error .standalone, .error [required].standalone {
    border: 1px solid red; }

/* ==== huvudlayout ==== */
html, body {
  height: 100%; }

#logo {
  background: #1f567d;
  background-repeat: repeat-y;
  background-position: left top;
  color: #FFF;
  font-family: "Open Sans";
  font-size: 100%;
  display: flex;
  flex-flow: row;
  align-items: flex-end; }
  #logo > .logo {
    display: block;
    padding: 0.8rem; }
    .min-width-1024px #logo > .logo {
      padding-left: 2rem; }
    #logo > .logo > img {
      height: 2.0em; }
      .min-width-480px #logo > .logo > img {
        height: 2.6em; }
      .min-width-768px #logo > .logo > img {
        height: 3.0em; }
  #logo > .title {
    vertical-align: bottom;
    color: #FFF;
    display: block;
    padding: 1em 1em 0.8em 0; }
    #logo > .title > a > .main {
      color: #FFF;
      text-transform: uppercase;
      font-weight: bold;
      line-height: 100%;
      font-size: 110%; }
      .min-width-480px #logo > .title > a > .main {
        font-size: 160%; }
      .min-width-768px #logo > .title > a > .main {
        font-size: 200%; }
    #logo > .title > a > .byline {
      display: block;
      color: #FFF;
      font-size: 90%; }
      #logo > .title > a > .byline > .text {
        display: none; }
        .min-width-480px #logo > .title > a > .byline > .text {
          display: inline; }
      #logo > .title > a > .byline > .date {
        color: #FFF; }
        .min-width-768px #logo > .title > a > .byline > .date {
          margin-left: 0.2em; }
      .min-width-480px #logo > .title > a > .byline {
        font-size: 100%; }

#checkin {
  background: #FFFFE0;
  padding: 0 0.8rem; }
  .min-width-1024px #checkin {
    padding-left: 2rem;
    padding-right: 2rem; }

#menu_bar {
  background: #1b4b6d;
  color: #FFF;
  font-family: "Open Sans";
  font-size: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-flow: row;
  justify-content: space-between;
  align-items: baseline;
  position: relative; }
  .min-width-1024px #menu_bar {
    padding-left: 1.2rem;
    padding-right: 1.2rem; }
  #menu_bar a.bar {
    white-space: nowrap;
    margin: 0;
    padding: 0.4rem;
    color: #FFF;
    align-self: baseline; }
    .touch #menu_bar a.bar {
      font-size: 120%; }
    #menu_bar a.bar:hover {
      color: #FFF;
      background: #256796; }
    #menu_bar a.bar:first-child {
      padding-left: 0.8rem; }
    .min-width-480px #menu_bar a.bar {
      font-size: 120%; }
  #menu_bar .langs {
    display: inline;
    flex-grow: 10;
    white-space: nowrap;
    margin: 0;
    padding: 0 0.4em;
    text-align: right; }
    #menu_bar .langs form {
      display: inline; }
    #menu_bar .langs .flag {
      height: 0.7rem; }
      .min-width-480px #menu_bar .langs .flag {
        height: 0.9rem; }
  #menu_bar .login {
    display: inline;
    flex-grow: 0;
    align-self: baseline;
    white-space: nowrap;
    margin: 0;
    padding: 0 0.4em;
    text-align: right; }
  #menu_bar .login_button {
    display: none; }
    .min-width-480px #menu_bar .login_button {
      display: inline; }

#menu {
  padding: 0.4rem 0rem;
  display: none;
  position: absolute;
  top: 100%;
  background: #1b4b6d;
  z-index: 20000; }
  #menu.active {
    display: block; }
  .max-width-768px #menu {
    width: 100%; }
  #menu a {
    color: #FFF; }
    #menu a:hover {
      color: #FFF;
      background: #256796; }
  #menu .menu_intro {
    color: #bbbbbb;
    font-size: 80%; }
  #menu .menu_item_current {
    color: #bbbbbb; }
  #menu a, #menu .menu_item_current {
    display: block;
    margin: 0 -0.8rem;
    padding: 0 0.8rem; }
    .min-width-1024px #menu a, .min-width-1024px #menu .menu_item_current {
      margin: 0 -1.2rem;
      padding: 0 1.2rem; }
    .touch #menu a, .touch #menu .menu_item_current {
      font-size: 120%;
      padding-top: 0.4rem;
      padding-bottom: 0.4rem; }
  #menu .menu_section {
    padding: 0 0.8rem;
    padding-bottom: 0.4rem;
    padding-top: 0.4rem;
    border-top: 1px solid #bbbbbb; }
    .min-width-1024px #menu .menu_section {
      padding-left: 1.2rem;
      padding-right: 1.2rem; }
    #menu .menu_section:first-child {
      padding-top: 0;
      border-top: 0; }
    #menu .menu_section:last-child {
      padding-bottom: 0; }
  #menu .menu_subsection {
    padding-bottom: 0.4rem;
    padding-top: 0.4rem;
    border-top: 1px dashed #bbbbbb; }
    #menu .menu_subsection:first-child {
      padding-top: 0;
      border-top: 0; }
  .min-width-480px #menu .menu_login_button {
    display: none; }

#nav {
  margin: 0 0.8em;
  max-width: 70em; }
  .min-width-1024px #nav {
    margin: 0 2em; }

.doc {
  margin: 0.8em;
  max-width: 70em; }
  .min-width-1024px .doc {
    margin: 0.8em 2em; }

.foot {
  clear: both;
  border-top: 1px solid #CCC;
  padding: 0.8em;
  color: #888; }
  .min-width-1024px .foot {
    margin-top: 2em;
    padding: 0.8em 2em; }

/* ==== komponenter ==== */
img.break, .full, .wide, .half {
  width: 100%;
  max-width: 100%; }
  .min-width-768px img.break, .min-width-768px .full, .min-width-768px .wide, .min-width-768px .half {
    width: 41em; }

.standalone {
  box-sizing: border-box;
  font-size: 120%;
  padding: 0.3em;
  display: inline-block;
  font-family: "Open Sans";
  border: 1px solid #b0d3eb;
  margin-top: 0.4em; }
  .standalone.passive {
    border: 1px solid #EEE; }
  .standalone:hover {
    border: 1px solid #EEE; }

/* ---- bilder ---- */
img.small {
  max-width: 2em;
  max-height: 2em;
  border-radius: 1em; }

.min-width-768px .full {
  width: 70em; }

.half {
  max-width: 20em; }
  .min-width-768px .half {
    width: 20em; }

.counter {
  font-family: courier, fixed; }

/* ---- formulär ---- */
label {
  font-size: 100%;
  line-height: 100%; }

.changeable {
  position: relative;
  z-index: 5; }
  .changeable input {
    background: rgba(255, 255, 255, 0); }
  .changeable .default {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0;
    padding-top: 1px;
    padding-left: 0.3rem;
    color: #888;
    z-index: -2;
    font-size: 95%; }

/* ==== generiska widgets ==== */
/* ---- flaggor för django-countries ---- */
.flag-sprite.flag-c.flag-_t {
  background-position-x: 0;
  background-position-y: 0;
  background-image: url("/static/images/flag-ct.png"); }

/* ---- visning av detaljer vid hover ---- */
.hover_only {
  opacity: 0;
  transition: all 0.3s ease-out; }

.hover_base:hover .hover_only, .touch .hover_only {
  opacity: 1;
  transition: all 0s ease-out; }

/* ---- karta ---- */
.map {
  box-sizing: border-box;
  height: 20em;
  width: 100%;
  position: relative; }
  @media (min-width: 320px) {
    .map {
      height: 25em; } }
  @media (min-width: 1024px) {
    .map {
      height: 45em; } }
  .map.small {
    height: 20em; }
    @media (min-width: 480px) {
      .map.small {
        height: 25em; } }
    @media (min-width: 1024px) {
      .map.small {
        height: 30em; } }
  .map.wide {
    height: 15em; }
    @media (min-width: 320px) {
      .map.wide {
        height: 20em; } }
    @media (min-width: 1024px) {
      .map.wide {
        height: 25em; } }
  .map .status {
    z-index: 10002;
    position: absolute;
    display: none;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0.4em;
    background: rgba(255, 255, 255, 0.9);
    font-size: 100%; }
    .min-width-480px .map .status {
      font-size: 120%; }
    .min-width-1024px .map .status {
      padding-left: 1.6em;
      padding-right: 1.6em; }
  .map .placeholder {
    position: absolute;
    z-index: 1000;
    padding-left: 3rem;
    padding-top: 0.4rem; }
  .map .map_cover {
    position: absolute;
    z-index: 10001;
    width: 100%;
    height: 100%;
    transition: all 1s ease-out;
    opacity: 0; }
    .map .map_cover.triggered {
      background: rgba(0, 0, 0, 0.1);
      transition: all 0s ease-out;
      opacity: 1; }
  .map .ol-attribution {
    bottom: 0; }

/* ---- länk-rutor ---- */
.topics {
  display: flex;
  flex-flow: row wrap;
  align-items: start;
  margin: -0.4em -0.4em -0.4em -0.4em; }

.topic {
  flex: 1 1 12em;
  text-align: left;
  min-width: 12em;
  margin: 0.4em; }
  .topic:empty {
    margin: 0 0.4em;
    padding: 0;
    background: transparent; }
    .min-width-1600px .topic:empty {
      display: none; }
  .topic > a {
    display: block;
    border: 1px solid #b0d3eb; }
    .topic > a:hover {
      border: 1px solid #EEE; }
  .topic > a > header {
    font-family: "Open Sans";
    font-size: 120%;
    padding: 0.3em;
    display: block; }
  .max-width-480px .topic {
    max-width: 30em; }
  .min-width-768px .topic {
    max-width: 18em;
    display: inline-block; }
  .topic img {
    width: 100%;
    display: block; }

/* ---- slide ---- */
.slide_base, .slide, .fade {
  height: 20rem; }
  .min-width-768px .slide_base, .min-width-768px .slide, .min-width-768px .fade {
    height: 24rem; }
  .min-width-1024px .slide_base, .min-width-1024px .slide, .min-width-1024px .fade {
    height: 28rem; }

.slide_base {
  box-sizing: border-box;
  position: relative;
  margin: 0;
  padding: 0; }

.slide {
  box-sizing: border-box;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  width: 100%;
  text-align: center;
  padding: 0;
  color: white;
  font-family: "Open Sans";
  position: absolute;
  top: 0;
  display: none;
  justify-content: start;
  font-size: 130%; }
  .slide.first {
    display: flex; }
  .slide .label {
    position: relative;
    margin: 0 auto;
    align-self: flex-end;
    margin-bottom: 0.2em; }
  .min-width-480px .slide {
    font-size: 200%; }
  .min-width-768px .slide {
    font-size: 300%; }
  .min-width-1024px .slide {
    font-size: 400%; }

/* --- fade-bilder (till toppen) ---- */
.fade {
  box-sizing: border-box;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  width: 100%;
  text-align: center;
  padding: 0;
  color: white;
  font-family: "Open Sans";
  top: 0; }
  .fade.large {
    height: 24rem; }
    .min-width-768px .fade.large {
      height: 28rem; }
    .min-width-1024px .fade.large {
      height: 34rem; }

/* ---- betalning ---- */
img.mondido_pay {
  height: 2em; }

/* ==== visning av modeller ==== */
/* ---- rapporter ---- */
/* -- lista -- */
tr.last td {
  padding-bottom: 0.5em; }

tr.dns td {
  opacity: 0.2; }

tr.dnf td.status {
  text-decoration: line-through; }

tr.finished td.status {
  background: #DFD; }

tr.ot td.status {
  background: #FFD; }

.message {
  font-style: italic; }

.others {
  font-size: 80%; }

/* -- diagram över ankomster -- */
table.estimates td.slot {
  vertical-align: bottom;
  padding: 0;
  margin: 0; }
  table.estimates td.slot .rider {
    display: block;
    height: 0.8rem;
    width: 2rem;
    color: #FFF;
    font-size: 50%;
    text-align: center; }
    table.estimates td.slot .rider.report {
      background: #F00; }
    table.estimates td.slot .rider.estimate {
      background: #1f567d; }
table.estimates td.time {
  vertical-align: top; }
table.estimates td.day {
  border-left: 1px solid #CCC; }
  table.estimates td.day:first-child {
    border-left: 0; }
  table.estimates td.day .day {
    display: block;
    font-size: 80%; }

/* ---- kalkylblad ---- */
table.calc tr.even {
  border-bottom: 1px solid #CCC; }
table.calc td.input {
  background: #FFF;
  border: 1px solid #000; }
  table.calc td.input input, table.calc td.input input:hover, table.calc td.input input:focus {
    outline: 0;
    padding: 0;
    border: 0;
    margin: 0;
    text-align: right; }
table.calc td.derived {
  border: 1px dashed #CCC; }
table.calc td.early {
  background: #F0E0FF; }
table.calc td.ok {
  background: #E0FFE0; }
table.calc td.warning {
  background: #FFFFE0; }
table.calc td.late {
  background: #FFD0D0; }
table.calc td.bed {
  background: #E0F8FF; }
  table.calc td.bed input:hover, table.calc td.bed input:focus {
    background: #E0F8FF; }

/* ---- kontroller ---- */
table.info td.time {
  vertical-align: top; }

/* ---- bäddar ---- */
.beds.free {
  color: #006600; }
.beds.half {
  color: #CC8000; }
.beds.full {
  color: #FF0000; }

.bed.expired {
  color: #FF0000; }
.bed.expiring {
  color: #CC8000; }

/* ---- kommentarer ---- */
.comments {
  clear: both;
  max-width: 20rem; }

.comment_head {
  display: flex;
  font-size: 80%;
  border-bottom: 1px solid #CCC; }
  .comment_head > .actions {
    text-align: right;
    flex: 1; }

.comment_indent {
  padding-left: 0.8rem; }

/* ---- kontroller ---- */
.control_days {
  min-width: 10rem; }

.mandatory {
  font-weight: bold; }

/* ---- teckenförklaring bredvid tabell ---- */
.min-width-768px .legend_first {
  display: flex;
  align-items: flex-start; }
  .min-width-768px .legend_first > * {
    margin-top: 0; }
  .min-width-768px .legend_first > .legend {
    max-width: 20em;
    order: 2;
    margin: 0 0 0.8em 0.8em; }

/* ----  service ---- */
.service-icon-align {
  display: flex;
  align-items: center; }

div.service-icon {
  position: relative;
  display: inline-block;
  height: 1.5em;
  width: 1.5em;
  margin-right: 0.3em; }
  div.service-icon img {
    height: 1.5em;
    position: absolute; }
  div.service-icon + div.service-icon {
    margin-left: -0.3em; }

/* ---- förstasidan ---- */
.min-width-1024px .docs {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: start; }
  .min-width-1024px .docs .topics {
    justify-content: flex-start; }
  .min-width-1024px .docs > .doc {
    margin-right: 0; }

.doc-topics {
  margin: 0.8em;
  max-width: 70em; }
  .min-width-1024px .doc-topics {
    margin: 0.8em 0.8em; }

/* ==== typsnitt ==== */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url(/static/fonts/opensans.woff2) format("woff2"); }

/*# sourceMappingURL=stil.css.map */