@charset "UTF-8";
/* ==== stil för UK-site ==== */
/* gemensamma definitioner för alla SCSS-filer i tkit och TAS */
/* importera konfiguration definierad per site */
/* ==== stil-inställningar för UK-site ==== */
/* text */
/* navigering */
/* formulär-widgets */
/* text-widgets */
/* ==== komponenter ==== */
/* ---- formulär ---- */
/* -- widgets -- */
.standalone {
  display: inline-block;
  white-space: nowrap;
  border: 1px solid #DDD;
  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 #5e5e5e; }
  .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 ==== */
body {
  width: 100%;
  max-width: 60rem;
  margin: 0 auto 30rem auto;
  background: url(/static/images/dotter-kant.png) #000;
  background-position: bottom left;
  background-repeat: no-repeat; }
  .min-width-1024px body {
    margin-bottom: 16rem; }

#top a.bar {
  color: #FFF;
  padding: 0.4rem;
  font-family: "quattrocento sans";
  margin: 0; }

#head {
  background: url(/static/images/dimtag-2010.jpeg) #000;
  background-position: top right;
  background-repeat: no-repeat; }
  #head.overlap {
    background: transparent; }

#logo {
  font-family: quattrocento, Bookman, "URW Bookman L", "Palatino Linotype", serif;
  font-size: 100%;
  display: flex;
  flex-flow: row;
  align-items: center; }
  #logo > .logo {
    display: block;
    padding: 0.2rem 0.5rem 0.2rem 0.5rem; }
    .min-width-1024px #logo > .logo {
      padding-left: 2rem; }
    #logo > .logo > img {
      height: 3.2rem; }
      .min-width-480px #logo > .logo > img {
        height: 4rem; }
      .min-width-768px #logo > .logo > img {
        height: 5rem; }
  #logo > .title {
    display: block;
    padding: 1em 1em 0.8em 0; }
    #logo > .title > a > .main, #logo > .title > .main {
      color: #FFF;
      line-height: 100%;
      font-size: 140%; }
      .min-width-480px #logo > .title > a > .main, .min-width-480px #logo > .title > .main {
        font-size: 200%; }
      .min-width-768px #logo > .title > a > .main, .min-width-768px #logo > .title > .main {
        font-size: 300%; }
    #logo > .title > a > .byline, #logo > .title > .byline {
      color: #FFF;
      display: block;
      font-size: 90%; }
      .min-width-480px #logo > .title > a > .byline, .min-width-480px #logo > .title > .byline {
        font-size: 100%; }

.overlap #top_base {
  position: relative;
  width: 100%;
  max-width: 60rem; }

#top {
  background: rgba(238, 238, 238, 0.1);
  color: #FFF;
  font-family: "quattrocento sans";
  font-size: 100%;
  display: flex;
  flex-flow: row;
  justify-content: space-between;
  align-items: baseline;
  position: relative; }
  .overlap #top {
    position: absolute;
    top: 0;
    width: 100%;
    max-width: 60rem;
    z-index: 10; }
  .min-width-1024px #top {
    padding-left: 1.6em;
    padding-right: 1.6em; }
  #top > .short {
    display: inline; }
    .min-width-480px #top > .short {
      display: none; }
  #top > .long {
    display: none;
    position: absolute;
    top: 100%;
    z-index: 10; }
    #top > .long a {
      display: block; }
    #top > .long.active {
      display: block; }
    .max-width-480px #top > .long {
      width: 100%; }
      .max-width-480px #top > .long a {
        font-size: 120%; }
    .min-width-480px #top > .long, .min-width-480px #top > .long.active {
      display: inline;
      position: relative;
      top: 0;
      z-index: inherit; }
      .min-width-480px #top > .long a, .min-width-480px #top > .long.active a {
        display: inline-block; }
  #top > .long .extra {
    display: block; }
    #top > .long .extra > a.bar {
      font-size: 80%; }
  .min-width-1024px #top > .long .extra {
    display: none; }
  #top > .long .sub {
    display: block; }
    #top > .long .sub > a.bar {
      padding-left: 1.6em;
      font-size: 80%; }
  .min-width-1024px #top > .long .sub {
    display: none; }
  #top a.bar {
    align-self: baseline; }
    .min-width-480px #top a.bar {
      font-size: 120%; }
    #top a.bar:hover {
      color: #FFF;
      background: rgba(255, 255, 255, 0.1); }
  #top > a.bar.short > .m {
    font-size: 90%; }
  #top .langs {
    display: inline;
    text-align: right;
    flex-grow: 0;
    margin: 0;
    padding: 0 0.4em; }
    #top .langs form {
      display: inline; }
    #top .langs .flag {
      height: 0.7rem; }
      .min-width-480px #top .langs .flag {
        height: 0.9rem; }
  #top span.login {
    align-self: baseline;
    display: inline;
    text-align: right;
    padding: 0 0.4em;
    flex-grow: 10;
    margin: 0; }

#bottom {
  font-size: 90%;
  font-family: "quattrocento sans";
  padding: 0.8em; }
  .min-width-1024px #bottom {
    padding: 0.8rem 2rem; }

/* ==== layout-widgets ==== */
.document {
  background-image: url(/static/images/paper.jpeg); }

.document, .document_dark {
  padding: 0.8em;
  max-width: 100%; }
  .min-width-1024px .document, .min-width-1024px .document_dark {
    padding: 2rem 2rem 2rem; }

/* -- bakgrundslager -- */
#corner-dl {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  z-index: -14;
  background: url(/static/images/dotter-kant.png);
  background-position: bottom left;
  background-repeat: no-repeat; }

#corner-ur {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  z-index: -15;
  background: url(/static/images/dimtag-2010.jpeg);
  background-position: top right;
  background-repeat: no-repeat; }

/* ==== komponenter ==== */
.standalone {
  box-sizing: border-box;
  font-size: 120%;
  padding: 0.3em;
  display: inline-block;
  font-family: "quattrocento sans";
  border: 1px solid #b3bbe6;
  margin-top: 0.4em; }
  .standalone.passive {
    border: 1px solid #EEE; }
  .standalone:hover {
    border: 1px solid #c6ccec; }

/* ==== generiska widgets ==== */
/* ---- slide ---- */
.slide_base, .slide_base .slide, .fade {
  height: 20rem; }
  .min-width-768px .slide_base, .min-width-768px .slide_base .slide, .slide_base .min-width-768px .slide, .min-width-768px .fade {
    height: 24rem; }
  .min-width-1024px .slide_base, .min-width-1024px .slide_base .slide, .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_base .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: quattrocento, Bookman, "URW Bookman L", "Palatino Linotype", serif;
  position: absolute;
  top: 0;
  display: none;
  justify-contents: start;
  font-size: 130%; }
  .slide_base .slide.first {
    display: flex; }
  .slide_base .slide .label {
    position: relative;
    margin: 0 auto;
    align-self: flex-end;
    margin-bottom: 0.2em; }
  .min-width-480px .slide_base .slide {
    font-size: 200%; }
  .min-width-768px .slide_base .slide {
    font-size: 300%; }
  .min-width-1024px .slide_base .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: quattrocento, Bookman, "URW Bookman L", "Palatino Linotype", serif;
  top: 0; }
  .fade.large {
    height: 24rem; }
    .min-width-768px .fade.large {
      height: 28rem; }
    .min-width-1024px .fade.large {
      height: 34rem; }

/* ==== typsnitt ==== */
@font-face {
  font-family: 'Quattrocento';
  font-style: normal;
  font-weight: 400;
  src: local("Quattrocento"), url(/static/fonts/quattrocento-400.woff) format("woff"); }
@font-face {
  font-family: 'Quattrocento';
  font-style: normal;
  font-weight: 700;
  src: local("Quattrocento Bold"), local("Quattrocento-Bold"), url(/static/fonts/quattrocento-700.woff) format("woff"); }
@font-face {
  font-family: 'Quattrocento Sans';
  font-style: normal;
  font-weight: 400;
  src: local("Quattrocento Sans"), local("QuattrocentoSans"), url(/static/fonts/quattrocento-sans-400.woff) format("woff"); }
@font-face {
  font-family: 'Quattrocento Sans';
  font-style: normal;
  font-weight: 700;
  src: local("Quattrocento Sans Bold"), local("QuattrocentoSans-Bold"), url(/static/fonts/quattrocento-sans-700.woff) format("woff"); }

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