@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Open+Sans:wght@400;700|Roboto:400,400i,500&display=swap");
.FormBuilder, .FormBuilder textarea, .FormBuilder select, .FormBuilder button, .FormBuilder #confirm .buttons .button, #confirm .buttons .FormBuilder .button, .FormBuilder #submitReciept .buttons .button, #submitReciept .buttons .FormBuilder .button, .FormBuilder #dashboard #allEmails .links a, #dashboard #allEmails .links .FormBuilder a, .FormBuilder #dashboard #undo, #dashboard .FormBuilder #undo, .FormBuilder .ui-widget {
  font-family: 'Exo', sans-serif !important; }

.FormBuilder input, svg text, .numbers {
  font-family: 'Roboto', sans-serif !important; }

.input-error {
  position: absolute;
  right: 57rem;
  padding: 1rem;
  border-radius: 5px; }

.FormBuilderErrors {
  width: 50%;
  margin: 2rem auto; }
  .FormBuilderErrors p {
    border-radius: 10px; }

main#userPrefs {
  margin-bottom: 5em; }
  main#userPrefs #pref {
    position: relative; }
    main#userPrefs #pref button, main#userPrefs #pref #confirm .buttons .button, #confirm .buttons main#userPrefs #pref .button, main#userPrefs #pref #submitReciept .buttons .button, #submitReciept .buttons main#userPrefs #pref .button, main#userPrefs #pref #dashboard #allEmails .links a, #dashboard #allEmails .links main#userPrefs #pref a, main#userPrefs #pref #dashboard #undo, #dashboard main#userPrefs #pref #undo {
      height: 35%;
      padding: 0 1rem; }
      main#userPrefs #pref button.next, main#userPrefs #pref #confirm .buttons .next.button, #confirm .buttons main#userPrefs #pref .next.button, main#userPrefs #pref #submitReciept .buttons .next.button, #submitReciept .buttons main#userPrefs #pref .next.button, main#userPrefs #pref #dashboard #allEmails .links a.next, #dashboard #allEmails .links main#userPrefs #pref a.next, main#userPrefs #pref #dashboard .next#undo, #dashboard main#userPrefs #pref .next#undo {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px; }
      main#userPrefs #pref button.prev, main#userPrefs #pref #confirm .buttons .prev.button, #confirm .buttons main#userPrefs #pref .prev.button, main#userPrefs #pref #submitReciept .buttons .prev.button, #submitReciept .buttons main#userPrefs #pref .prev.button, main#userPrefs #pref #dashboard #allEmails .links a.prev, #dashboard #allEmails .links main#userPrefs #pref a.prev, main#userPrefs #pref #dashboard .prev#undo, #dashboard main#userPrefs #pref .prev#undo {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px; }
      main#userPrefs #pref button#react, main#userPrefs #pref #confirm .buttons #react.button, #confirm .buttons main#userPrefs #pref #react.button, main#userPrefs #pref #submitReciept .buttons #react.button, #submitReciept .buttons main#userPrefs #pref #react.button, main#userPrefs #pref #dashboard #allEmails .links a#react, #dashboard #allEmails .links main#userPrefs #pref a#react {
        display: block;
        margin: 1rem auto;
        height: 5rem;
        padding: 0 3rem; }
    main#userPrefs #pref #wrap_inputradio_submit button, main#userPrefs #pref #wrap_inputradio_submit #confirm .buttons .button, #confirm .buttons main#userPrefs #pref #wrap_inputradio_submit .button, main#userPrefs #pref #wrap_inputradio_submit #submitReciept .buttons .button, #submitReciept .buttons main#userPrefs #pref #wrap_inputradio_submit .button, main#userPrefs #pref #wrap_inputradio_submit #dashboard #allEmails .links a, #dashboard #allEmails .links main#userPrefs #pref #wrap_inputradio_submit a, main#userPrefs #pref #wrap_inputradio_submit #dashboard #undo, #dashboard main#userPrefs #pref #wrap_inputradio_submit #undo {
      position: absolute;
      bottom: -7rem;
      left: calc(50% - 7.5rem);
      height: 4rem;
      width: 15rem;
      font-weight: normal; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        main#userPrefs #pref #wrap_inputradio_submit button, main#userPrefs #pref #wrap_inputradio_submit #confirm .buttons .button, #confirm .buttons main#userPrefs #pref #wrap_inputradio_submit .button, main#userPrefs #pref #wrap_inputradio_submit #submitReciept .buttons .button, #submitReciept .buttons main#userPrefs #pref #wrap_inputradio_submit .button, main#userPrefs #pref #wrap_inputradio_submit #dashboard #allEmails .links a, #dashboard #allEmails .links main#userPrefs #pref #wrap_inputradio_submit a, main#userPrefs #pref #wrap_inputradio_submit #dashboard #undo, #dashboard main#userPrefs #pref #wrap_inputradio_submit #undo {
          position: fixed;
          bottom: 3rem;
          z-index: 10; } }
      @media (min-width: 100px) and (max-width: 812px) {
        main#userPrefs #pref #wrap_inputradio_submit button, main#userPrefs #pref #wrap_inputradio_submit #confirm .buttons .button, #confirm .buttons main#userPrefs #pref #wrap_inputradio_submit .button, main#userPrefs #pref #wrap_inputradio_submit #submitReciept .buttons .button, #submitReciept .buttons main#userPrefs #pref #wrap_inputradio_submit .button, main#userPrefs #pref #wrap_inputradio_submit #dashboard #allEmails .links a, #dashboard #allEmails .links main#userPrefs #pref #wrap_inputradio_submit a, main#userPrefs #pref #wrap_inputradio_submit #dashboard #undo, #dashboard main#userPrefs #pref #wrap_inputradio_submit #undo {
          position: fixed;
          bottom: 3rem;
          z-index: 10; } }
    main#userPrefs #pref #wrap_Inputfield_optional {
      color: white; }
    main#userPrefs #pref #progress {
      position: -webkit-sticky;
      position: sticky;
      top: 0;
      z-index: 50;
      height: 10rem;
      background-color: #1C3557;
      width: 100%;
      display: flex;
      align-items: center; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        main#userPrefs #pref #progress .prev, main#userPrefs #pref #progress .next {
          display: none; } }
      @media (min-width: 100px) and (max-width: 812px) {
        main#userPrefs #pref #progress .prev, main#userPrefs #pref #progress .next {
          display: none; } }
      main#userPrefs #pref #progress #progressBar {
        height: 35%;
        width: 100%;
        margin: 2rem;
        border-radius: 15px;
        display: flex; }
        @media (min-device-width: 100px) and (max-device-width: 812px) {
          main#userPrefs #pref #progress #progressBar {
            margin: 2rem 0; } }
        @media (min-width: 100px) and (max-width: 812px) {
          main#userPrefs #pref #progress #progressBar {
            margin: 2rem 0; } }
        main#userPrefs #pref #progress #progressBar > div {
          background-color: white;
          margin-right: 2px;
          flex-basis: 25%;
          position: relative;
          opacity: 0.3;
          transition: transform 0.2s linear; }
          main#userPrefs #pref #progress #progressBar > div.error {
            background-color: #F16568; }
          main#userPrefs #pref #progress #progressBar > div::before {
            content: "";
            display: block;
            width: 0px;
            height: 0px;
            position: relative;
            top: 3rem;
            left: 50%;
            transform: translate(-50%, 100%) scale(0);
            opacity: 0;
            border-right: 10px solid transparent;
            border-left: 10px solid transparent;
            border-bottom: 20px solid #F1D8A9;
            transition: transform 0.5s 0.15s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
          main#userPrefs #pref #progress #progressBar > div span.navPopUp {
            position: absolute;
            display: block;
            top: 5rem;
            left: 0;
            width: 200%;
            text-align: center;
            transform: translate(-25%) scale(0);
            opacity: 0;
            font-size: 1.4rem;
            background-color: #F1D8A9;
            border-radius: 15px;
            padding: 1rem;
            transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
          main#userPrefs #pref #progress #progressBar > div:hover {
            cursor: pointer;
            opacity: 1;
            transform: translate(0, -3px); }
            main#userPrefs #pref #progress #progressBar > div:hover::before {
              opacity: 1;
              transform: translate(-50%, 10%) scale(1); }
            main#userPrefs #pref #progress #progressBar > div:hover span.navPopUp {
              opacity: 1;
              transform: translate(-25%) scale(1); }
          main#userPrefs #pref #progress #progressBar > div .progressBarPage {
            display: block;
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            background-color: #E89397;
            transition: all 0.2s linear; }
          main#userPrefs #pref #progress #progressBar > div.current {
            opacity: 1; }
            main#userPrefs #pref #progress #progressBar > div.current.active {
              transform: translate(0, -5px); }
        main#userPrefs #pref #progress #progressBar > div:last-of-type .progressBarPage:not(.current) {
          border: none; }
        main#userPrefs #pref #progress #progressBar #bar_6 {
          transition: all 0.2s linear; }
    main#userPrefs #pref h1 {
      cursor: pointer; }
    main#userPrefs #pref #pageWrapper {
      min-height: 50vh;
      width: 90%;
      max-width: 80rem; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        main#userPrefs #pref #pageWrapper {
          max-width: initial;
          width: 100%; } }
      @media (min-width: 100px) and (max-width: 812px) {
        main#userPrefs #pref #pageWrapper {
          max-width: initial;
          width: 100%; } }
      main#userPrefs #pref #pageWrapper span.prev, main#userPrefs #pref #pageWrapper span.next {
        cursor: pointer; }
        main#userPrefs #pref #pageWrapper span.prev i, main#userPrefs #pref #pageWrapper span.next i {
          color: white; }
      main#userPrefs #pref #pageWrapper span.prev {
        transform: rotate(180deg); }
      main#userPrefs #pref #pageWrapper span.hide {
        visibility: hidden; }
      main#userPrefs #pref #pageWrapper.na #progress #progressBar #bar_6 {
        opacity: 0.3;
        filter: saturate(0); }
        main#userPrefs #pref #pageWrapper.na #progress #progressBar #bar_6 .progressBarPage {
          width: 100% !important; }
      main#userPrefs #pref #pageWrapper.na #Inputfield_barsels fieldset {
        opacity: 0.4;
        pointer-events: none;
        filter: saturate(0); }
      main#userPrefs #pref #pageWrapper .InputfieldInteger:not([id*='wrap_Inputfield_6_']):not(.show) {
        max-height: 0; }
      main#userPrefs #pref #pageWrapper .InputfieldInteger.show {
        max-height: 5rem; }
        @media (min-device-width: 100px) and (max-device-width: 812px) {
          main#userPrefs #pref #pageWrapper .InputfieldInteger.show {
            max-height: 10rem; } }
        @media (min-width: 100px) and (max-width: 812px) {
          main#userPrefs #pref #pageWrapper .InputfieldInteger.show {
            max-height: 10rem; } }
      main#userPrefs #pref #pageWrapper .InputfieldInteger {
        overflow: hidden;
        transition: max-height 0.3s ease-in-out; }
  main#userPrefs .text {
    width: calc(90% - 6rem);
    display: block;
    margin: 1em 15px; }
  main#userPrefs button.hide, main#userPrefs #confirm .buttons .hide.button, #confirm .buttons main#userPrefs .hide.button, main#userPrefs #submitReciept .buttons .hide.button, #submitReciept .buttons main#userPrefs .hide.button, main#userPrefs #dashboard #allEmails .links a.hide, #dashboard #allEmails .links main#userPrefs a.hide, main#userPrefs #dashboard .hide#undo, #dashboard main#userPrefs .hide#undo {
    opacity: 0;
    pointer-events: none; }
  main#userPrefs button.show, main#userPrefs #confirm .buttons .show.button, #confirm .buttons main#userPrefs .show.button, main#userPrefs #submitReciept .buttons .show.button, #submitReciept .buttons main#userPrefs .show.button, main#userPrefs #dashboard #allEmails .links a.show, #dashboard #allEmails .links main#userPrefs a.show, main#userPrefs #dashboard .show#undo, #dashboard main#userPrefs .show#undo {
    opacity: 1; }
  main#userPrefs #pref #Inputfield_praeferencer {
    transform: translate(0, -2px); }
  main#userPrefs fieldset.family:first-of-type {
    display: block;
    left: 0vw; }
    main#userPrefs fieldset.family:first-of-type #Inputfield_labels .InputfieldContent {
      transform: translate(0, 20px); }
  main#userPrefs fieldset.family {
    display: none;
    left: 100vw; }
    main#userPrefs fieldset.family.prev, main#userPrefs fieldset.family.next {
      display: none; }
    main#userPrefs fieldset.family.current {
      display: block; }
    main#userPrefs fieldset.family .InputfieldContent span {
      transition: opacity 0.5s linear; }
    main#userPrefs fieldset.family > legend {
      color: white; }
      main#userPrefs fieldset.family > legend + .InputfieldContent > .description {
        color: white; }
  main#userPrefs .category, main#userPrefs fieldset[id*="Inputfield_fieldset_0"] {
    transition: left 0.5s ease-in-out;
    position: absolute;
    top: 0; }
    main#userPrefs .category.prev, main#userPrefs fieldset[id*="Inputfield_fieldset_0"].prev {
      left: -100vw; }
    main#userPrefs .category.current, main#userPrefs fieldset[id*="Inputfield_fieldset_0"].current {
      left: 0vw; }
  main#userPrefs .category {
    width: 100%; }
  main#userPrefs .category:first-of-type {
    left: 0vw; }
    main#userPrefs .category:first-of-type.prev {
      left: -100vw; }
  main#userPrefs fieldset[id*="Inputfield_fieldset_0"] {
    right: 0;
    width: 100%; }
    main#userPrefs fieldset[id*="Inputfield_fieldset_0"] #Inputfield_labels .InputfieldContent {
      text-align: right; }
      main#userPrefs fieldset[id*="Inputfield_fieldset_0"] #Inputfield_labels .InputfieldContent span {
        margin-left: 30px; }

#pref, #inputOffer {
  position: relative; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #pref, #inputOffer {
      width: 100%; }
      #pref .InputfieldHeader, #inputOffer .InputfieldHeader {
        flex-shrink: 5; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #pref, #inputOffer {
      width: 100%; }
      #pref .InputfieldHeader, #inputOffer .InputfieldHeader {
        flex-shrink: 5; } }
  #pref input:not([type=range]):focus, #pref .FormBuilder.InputfieldForm select:not([multiple]):not([type=range]):focus, #inputOffer input:not([type=range]):focus, #inputOffer .FormBuilder.InputfieldForm select:not([multiple]):not([type=range]):focus {
    background: #F1D8A9 !important;
    /* color: white; */ }
  #pref .FormBuilder.InputfieldForm input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=range]), #pref .FormBuilder.InputfieldForm select:not([multiple]), #inputOffer .FormBuilder.InputfieldForm input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=range]), #inputOffer .FormBuilder.InputfieldForm select:not([multiple]) {
    border: none;
    font-weight: 800;
    border-radius: 15px;
    /* Chrome, Safari, Edge, Opera */
    /* Firefox */
    -moz-appearance: textfield; }
    #pref .FormBuilder.InputfieldForm input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=range])::-webkit-outer-spin-button, #pref .FormBuilder.InputfieldForm input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=range])::-webkit-inner-spin-button, #pref .FormBuilder.InputfieldForm select:not([multiple])::-webkit-outer-spin-button, #pref .FormBuilder.InputfieldForm select:not([multiple])::-webkit-inner-spin-button, #inputOffer .FormBuilder.InputfieldForm input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=range])::-webkit-outer-spin-button, #inputOffer .FormBuilder.InputfieldForm input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=range])::-webkit-inner-spin-button, #inputOffer .FormBuilder.InputfieldForm select:not([multiple])::-webkit-outer-spin-button, #inputOffer .FormBuilder.InputfieldForm select:not([multiple])::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0; }
  #pref .description.info, #inputOffer .description.info {
    max-height: 0rem;
    transition: max-height 0.3s ease-in-out;
    overflow: hidden;
    margin: 0 !important; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #pref .description.info, #inputOffer .description.info {
        padding: 0 2rem;
        line-height: 1.4; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #pref .description.info, #inputOffer .description.info {
        padding: 0 2rem;
        line-height: 1.4; } }
    #pref .description.info.show, #inputOffer .description.info.show {
      max-height: 30rem; }
      #pref .description.info.show + div ul.InputfieldRadiosStacked::before, #inputOffer .description.info.show + div ul.InputfieldRadiosStacked::before {
        opacity: 1 !important; }
      #pref .description.info.show + div ul.InputfieldRadiosStacked::after, #inputOffer .description.info.show + div ul.InputfieldRadiosStacked::after {
        opacity: 1 !important; }
  #pref #FormBuilder_inputradio ul, #inputOffer #FormBuilder_inputradio ul {
    padding: 1rem;
    border-radius: 10px;
    border: 1px solid transparent;
    position: relative;
    width: 100%;
    align-items: flex-end; }
    #pref #FormBuilder_inputradio ul.InputfieldRadiosStacked::before, #inputOffer #FormBuilder_inputradio ul.InputfieldRadiosStacked::before {
      transition: opacity 0.3s linear;
      content: "Ligegyldigt";
      position: absolute;
      bottom: -1.5em;
      left: -2rem;
      font-size: 1.25rem;
      opacity: 0; }
    #pref #FormBuilder_inputradio ul.InputfieldRadiosStacked::after, #inputOffer #FormBuilder_inputradio ul.InputfieldRadiosStacked::after {
      transition: opacity 0.3s linear;
      font-size: 1.25rem;
      content: "Afgørende";
      position: absolute;
      bottom: -1.5em;
      right: -2rem;
      text-align: right;
      opacity: 0; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #pref #FormBuilder_inputradio ul.InputfieldRadiosStacked::before, #inputOffer #FormBuilder_inputradio ul.InputfieldRadiosStacked::before {
        bottom: -2.5rem;
        left: 1rem; }
      #pref #FormBuilder_inputradio ul.InputfieldRadiosStacked::after, #inputOffer #FormBuilder_inputradio ul.InputfieldRadiosStacked::after {
        bottom: -2.5rem;
        right: 1rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #pref #FormBuilder_inputradio ul.InputfieldRadiosStacked::before, #inputOffer #FormBuilder_inputradio ul.InputfieldRadiosStacked::before {
        bottom: -2.5rem;
        left: 1rem; }
      #pref #FormBuilder_inputradio ul.InputfieldRadiosStacked::after, #inputOffer #FormBuilder_inputradio ul.InputfieldRadiosStacked::after {
        bottom: -2.5rem;
        right: 1rem; } }
    #pref #FormBuilder_inputradio ul li label, #inputOffer #FormBuilder_inputradio ul li label {
      display: flex !important;
      flex-direction: column-reverse;
      align-items: center; }
  #pref #FormBuilder_inputradio .InputfieldRadios ul, #inputOffer #FormBuilder_inputradio .InputfieldRadios ul {
    display: flex;
    justify-content: space-between; }
  #pref #FormBuilder_inputradio .Inputfields .Inputfield.InputfieldInteger .InputfieldContent, #inputOffer #FormBuilder_inputradio .Inputfields .Inputfield.InputfieldInteger .InputfieldContent {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    transform: translate(2rem); }
    #pref #FormBuilder_inputradio .Inputfields .Inputfield.InputfieldInteger .InputfieldContent .description, #inputOffer #FormBuilder_inputradio .Inputfields .Inputfield.InputfieldInteger .InputfieldContent .description {
      display: inline;
      transform: translate(-5rem);
      width: 4rem;
      text-align: right; }
  #pref #FormBuilder_inputradio #Inputfield_barsels fieldset, #inputOffer #FormBuilder_inputradio #Inputfield_barsels fieldset {
    transition: all 0.4s linear; }
  #pref #pageWrapper.na #Inputfield_tilbud_barsels, #inputOffer #pageWrapper.na #Inputfield_tilbud_barsels {
    display: none; }
  #pref #FormBuilder_tilbud, #inputOffer #FormBuilder_tilbud {
    padding: 0;
    border-radius: 15px;
    padding-top: 0;
    max-width: 80rem; }
    @media (min-width: 768px) and (max-width: 1023px) {
      #pref #FormBuilder_tilbud, #inputOffer #FormBuilder_tilbud {
        max-width: none; } }
    #pref #FormBuilder_tilbud div.Inputfields > fieldset, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset {
      background-color: #C7D3D5;
      padding: 3rem;
      margin: 2rem 0;
      border-radius: 10px; }
      #pref #FormBuilder_tilbud div.Inputfields > fieldset legend, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset legend {
        transform: translate(0, 1.5em);
        background-color: none;
        margin: 1rem 0 2rem 0; }
      #pref #FormBuilder_tilbud div.Inputfields > fieldset input[type=number], #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset input[type=number] {
        width: 25%;
        max-width: 15rem; }
      #pref #FormBuilder_tilbud div.Inputfields > fieldset input[type='radio'], #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset input[type='radio'] {
        margin: 0; }
      #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger {
        display: flex;
        justify-content: flex-end;
        flex-direction: row-reverse;
        align-items: baseline;
        margin-left: -1.5rem; }
        @media (min-device-width: 100px) and (max-device-width: 812px) {
          #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger {
            flex-direction: column;
            align-items: flex-end; } }
        @media (min-width: 100px) and (max-width: 812px) {
          #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger {
            flex-direction: column;
            align-items: flex-end; } }
        @media (min-width: 768px) and (max-width: 1023px) {
          #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger {
            flex-direction: column;
            align-items: flex-start; } }
        #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger label, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger label {
          font-weight: normal;
          margin-left: 1rem; }
        #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent {
          display: flex;
          justify-content: center;
          flex-direction: row;
          align-items: baseline;
          flex-shrink: 50; }
          @media (min-device-width: 100px) and (max-device-width: 812px) {
            #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent {
              flex-direction: row-reverse;
              justify-content: flex-end; } }
          @media (min-width: 100px) and (max-width: 812px) {
            #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent {
              flex-direction: row-reverse;
              justify-content: flex-end; } }
          @media (min-width: 768px) and (max-width: 1023px) {
            #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent {
              flex-direction: row-reverse;
              justify-content: flex-end; } }
          #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent input, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent input {
            min-width: 10rem;
            max-width: 10rem;
            height: 3.5rem;
            margin: 0.5rem 0; }
            @media (min-device-width: 100px) and (max-device-width: 812px) {
              #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent input, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent input {
                margin: 0.5rem 0 0 0;
                height: 4.5rem; } }
            @media (min-width: 100px) and (max-width: 812px) {
              #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent input, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent input {
                margin: 0.5rem 0 0 0;
                height: 4.5rem; } }
          #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent p.description, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent p.description {
            transform: translate(9.2rem);
            min-width: 5rem;
            font-size: 1.2rem;
            text-align: right;
            pointer-events: none; }
            @media (min-device-width: 100px) and (max-device-width: 812px) {
              #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent p.description, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent p.description {
                transform: translate(-3.7rem, -0.4rem);
                min-width: 3rem; } }
            @media (min-width: 100px) and (max-width: 812px) {
              #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent p.description, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent p.description {
                transform: translate(-3.7rem, -0.4rem);
                min-width: 3rem; } }
            @media (min-width: 768px) and (max-width: 1023px) {
              #pref #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent p.description, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset .InputfieldInteger .InputfieldContent p.description {
                transform: translate(1rem);
                min-width: 3rem; } }
      #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov {
        padding: 0;
        margin: 4rem 0; }
        #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov legend, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov legend {
          display: none; }
        #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent {
          display: flex;
          flex-direction: row-reverse;
          justify-content: flex-end; }
          #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent > .description, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent > .description {
            -ms-grid-row-align: center;
                align-self: center;
            margin-left: 1rem; }
          @media (min-device-width: 100px) and (max-device-width: 812px) {
            #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent {
              flex-direction: column; }
              #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent > .description, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent > .description {
                align-self: flex-start; }
              #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent .Inputfields, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent .Inputfields {
                display: flex; }
                #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent .Inputfields > .Inputfield:first-of-type, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent .Inputfields > .Inputfield:first-of-type {
                  flex-shrink: 5; } }
          @media (min-width: 100px) and (max-width: 812px) {
            #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent {
              flex-direction: column; }
              #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent > .description, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent > .description {
                align-self: flex-start; }
              #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent .Inputfields, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent .Inputfields {
                display: flex; }
                #pref #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent .Inputfields > .Inputfield:first-of-type, #inputOffer #FormBuilder_tilbud div.Inputfields > fieldset #Inputfield_foraeldreorlov > .InputfieldContent .Inputfields > .Inputfield:first-of-type {
                  flex-shrink: 5; } }
    #pref #FormBuilder_tilbud .InputfieldRadios > label, #inputOffer #FormBuilder_tilbud .InputfieldRadios > label {
      display: none; }
    #pref #FormBuilder_tilbud .InputfieldRadios .InputfieldContent, #inputOffer #FormBuilder_tilbud .InputfieldRadios .InputfieldContent {
      display: flex;
      justify-content: flex-end;
      flex-direction: row-reverse;
      align-items: baseline;
      margin-left: 3rem; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        #pref #FormBuilder_tilbud .InputfieldRadios .InputfieldContent, #inputOffer #FormBuilder_tilbud .InputfieldRadios .InputfieldContent {
          margin-left: 0; } }
      @media (min-width: 100px) and (max-width: 812px) {
        #pref #FormBuilder_tilbud .InputfieldRadios .InputfieldContent, #inputOffer #FormBuilder_tilbud .InputfieldRadios .InputfieldContent {
          margin-left: 0; } }
      #pref #FormBuilder_tilbud .InputfieldRadios .InputfieldContent .description, #inputOffer #FormBuilder_tilbud .InputfieldRadios .InputfieldContent .description {
        margin-left: 1rem;
        width: 80%; }
    #pref #FormBuilder_tilbud .InputfieldRadios ul, #inputOffer #FormBuilder_tilbud .InputfieldRadios ul {
      display: flex;
      width: 15%;
      justify-content: space-evenly; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        #pref #FormBuilder_tilbud .InputfieldRadios ul, #inputOffer #FormBuilder_tilbud .InputfieldRadios ul {
          width: 25%; } }
      @media (min-width: 100px) and (max-width: 812px) {
        #pref #FormBuilder_tilbud .InputfieldRadios ul, #inputOffer #FormBuilder_tilbud .InputfieldRadios ul {
          width: 25%; } }
      #pref #FormBuilder_tilbud .InputfieldRadios ul input, #inputOffer #FormBuilder_tilbud .InputfieldRadios ul input {
        margin-right: 0; }
      #pref #FormBuilder_tilbud .InputfieldRadios ul li label, #inputOffer #FormBuilder_tilbud .InputfieldRadios ul li label {
        display: flex;
        flex-direction: column-reverse; }
        #pref #FormBuilder_tilbud .InputfieldRadios ul li label *, #inputOffer #FormBuilder_tilbud .InputfieldRadios ul li label * {
          width: 3rem; }
        #pref #FormBuilder_tilbud .InputfieldRadios ul li label span, #inputOffer #FormBuilder_tilbud .InputfieldRadios ul li label span {
          text-align: center; }
    #pref #FormBuilder_tilbud .Inputfields fieldset .InputfieldContent > .Inputfields > .InputfieldRadios, #inputOffer #FormBuilder_tilbud .Inputfields fieldset .InputfieldContent > .Inputfields > .InputfieldRadios {
      margin-top: 2rem; }
      #pref #FormBuilder_tilbud .Inputfields fieldset .InputfieldContent > .Inputfields > .InputfieldRadios ul li label span, #inputOffer #FormBuilder_tilbud .Inputfields fieldset .InputfieldContent > .Inputfields > .InputfieldRadios ul li label span {
        transform: translate(0, -2rem); }
      #pref #FormBuilder_tilbud .Inputfields fieldset .InputfieldContent > .Inputfields > .InputfieldRadios ~ .InputfieldRadios, #inputOffer #FormBuilder_tilbud .Inputfields fieldset .InputfieldContent > .Inputfields > .InputfieldRadios ~ .InputfieldRadios {
        margin-top: 0rem; }
        #pref #FormBuilder_tilbud .Inputfields fieldset .InputfieldContent > .Inputfields > .InputfieldRadios ~ .InputfieldRadios ul li label span, #inputOffer #FormBuilder_tilbud .Inputfields fieldset .InputfieldContent > .Inputfields > .InputfieldRadios ~ .InputfieldRadios ul li label span {
          display: none; }
    #pref #FormBuilder_tilbud #wrap_tilbud_submit, #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit {
      position: absolute;
      bottom: -12rem;
      margin-bottom: 4rem;
      height: 4rem;
      width: 15rem; }
      #pref #FormBuilder_tilbud #wrap_tilbud_submit button, #pref #FormBuilder_tilbud #wrap_tilbud_submit #confirm .buttons .button, #confirm .buttons #pref #FormBuilder_tilbud #wrap_tilbud_submit .button, #pref #FormBuilder_tilbud #wrap_tilbud_submit #submitReciept .buttons .button, #submitReciept .buttons #pref #FormBuilder_tilbud #wrap_tilbud_submit .button, #pref #FormBuilder_tilbud #wrap_tilbud_submit #dashboard #allEmails .links a, #dashboard #allEmails .links #pref #FormBuilder_tilbud #wrap_tilbud_submit a, #pref #FormBuilder_tilbud #wrap_tilbud_submit #dashboard #undo, #dashboard #pref #FormBuilder_tilbud #wrap_tilbud_submit #undo, #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit button, #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit #confirm .buttons .button, #confirm .buttons #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit .button, #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit #submitReciept .buttons .button, #submitReciept .buttons #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit .button, #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit #dashboard #allEmails .links a, #dashboard #allEmails .links #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit a, #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit #dashboard #undo, #dashboard #inputOffer #FormBuilder_tilbud #wrap_tilbud_submit #undo {
        transform: translate(0, -2rem); }
  #pref #FormBuilder_inputradio, #pref #FormBuilder_tilbud, #inputOffer #FormBuilder_inputradio, #inputOffer #FormBuilder_tilbud {
    position: relative;
    margin: 0; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #pref #FormBuilder_inputradio, #pref #FormBuilder_tilbud, #inputOffer #FormBuilder_inputradio, #inputOffer #FormBuilder_tilbud {
        margin-bottom: 15rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #pref #FormBuilder_inputradio, #pref #FormBuilder_tilbud, #inputOffer #FormBuilder_inputradio, #inputOffer #FormBuilder_tilbud {
        margin-bottom: 15rem; } }
    #pref #FormBuilder_inputradio fieldset, #pref #FormBuilder_tilbud fieldset, #inputOffer #FormBuilder_inputradio fieldset, #inputOffer #FormBuilder_tilbud fieldset {
      border: none;
      padding: 1em; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        #pref #FormBuilder_inputradio fieldset, #pref #FormBuilder_tilbud fieldset, #inputOffer #FormBuilder_inputradio fieldset, #inputOffer #FormBuilder_tilbud fieldset {
          padding: 0; } }
      @media (min-width: 100px) and (max-width: 812px) {
        #pref #FormBuilder_inputradio fieldset, #pref #FormBuilder_tilbud fieldset, #inputOffer #FormBuilder_inputradio fieldset, #inputOffer #FormBuilder_tilbud fieldset {
          padding: 0; } }
      #pref #FormBuilder_inputradio fieldset.family, #pref #FormBuilder_tilbud fieldset.family, #inputOffer #FormBuilder_inputradio fieldset.family, #inputOffer #FormBuilder_tilbud fieldset.family {
        width: 100%; }
      #pref #FormBuilder_inputradio fieldset .InputfieldContent, #pref #FormBuilder_tilbud fieldset .InputfieldContent, #inputOffer #FormBuilder_inputradio fieldset .InputfieldContent, #inputOffer #FormBuilder_tilbud fieldset .InputfieldContent {
        transition: margin-top 0.35s ease-in-out; }
        #pref #FormBuilder_inputradio fieldset .InputfieldContent.extraMargin, #pref #FormBuilder_tilbud fieldset .InputfieldContent.extraMargin, #inputOffer #FormBuilder_inputradio fieldset .InputfieldContent.extraMargin, #inputOffer #FormBuilder_tilbud fieldset .InputfieldContent.extraMargin {
          margin-top: 1rem; }
          @media (min-device-width: 100px) and (max-device-width: 812px) {
            #pref #FormBuilder_inputradio fieldset .InputfieldContent.extraMargin, #pref #FormBuilder_tilbud fieldset .InputfieldContent.extraMargin, #inputOffer #FormBuilder_inputradio fieldset .InputfieldContent.extraMargin, #inputOffer #FormBuilder_tilbud fieldset .InputfieldContent.extraMargin {
              margin-top: 3rem; } }
          @media (min-width: 100px) and (max-width: 812px) {
            #pref #FormBuilder_inputradio fieldset .InputfieldContent.extraMargin, #pref #FormBuilder_tilbud fieldset .InputfieldContent.extraMargin, #inputOffer #FormBuilder_inputradio fieldset .InputfieldContent.extraMargin, #inputOffer #FormBuilder_tilbud fieldset .InputfieldContent.extraMargin {
              margin-top: 3rem; } }
      #pref #FormBuilder_inputradio fieldset legend, #pref #FormBuilder_tilbud fieldset legend, #inputOffer #FormBuilder_inputradio fieldset legend, #inputOffer #FormBuilder_tilbud fieldset legend {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        width: 100%;
        flex-wrap: nowrap; }
        #pref #FormBuilder_inputradio fieldset legend.infoLegend, #pref #FormBuilder_tilbud fieldset legend.infoLegend, #inputOffer #FormBuilder_inputradio fieldset legend.infoLegend, #inputOffer #FormBuilder_tilbud fieldset legend.infoLegend {
          cursor: pointer; }
          #pref #FormBuilder_inputradio fieldset legend.infoLegend i, #pref #FormBuilder_tilbud fieldset legend.infoLegend i, #inputOffer #FormBuilder_inputradio fieldset legend.infoLegend i, #inputOffer #FormBuilder_tilbud fieldset legend.infoLegend i {
            display: block;
            height: 1em;
            color: black;
            transform: rotate(0deg) scale(1);
            font-size: 2rem;
            transition: all 0.25s linear;
            text-align: right;
            transform-origin: center center; }
          #pref #FormBuilder_inputradio fieldset legend.infoLegend.show i, #pref #FormBuilder_tilbud fieldset legend.infoLegend.show i, #inputOffer #FormBuilder_inputradio fieldset legend.infoLegend.show i, #inputOffer #FormBuilder_tilbud fieldset legend.infoLegend.show i {
            color: #F16568;
            transform: rotate(0deg) scale(1.2); }
          #pref #FormBuilder_inputradio fieldset legend.infoLegend:not(.show):hover i, #pref #FormBuilder_tilbud fieldset legend.infoLegend:not(.show):hover i, #inputOffer #FormBuilder_inputradio fieldset legend.infoLegend:not(.show):hover i, #inputOffer #FormBuilder_tilbud fieldset legend.infoLegend:not(.show):hover i {
            transform: rotate(0deg) scale(1.2);
            color: #F16568; }
          #pref #FormBuilder_inputradio fieldset legend.infoLegend.show:hover i, #pref #FormBuilder_tilbud fieldset legend.infoLegend.show:hover i, #inputOffer #FormBuilder_inputradio fieldset legend.infoLegend.show:hover i, #inputOffer #FormBuilder_tilbud fieldset legend.infoLegend.show:hover i {
            transform: rotate(0deg) scale(1.2);
            color: #F16568; }
          #pref #FormBuilder_inputradio fieldset legend.infoLegend span, #pref #FormBuilder_tilbud fieldset legend.infoLegend span, #inputOffer #FormBuilder_inputradio fieldset legend.infoLegend span, #inputOffer #FormBuilder_tilbud fieldset legend.infoLegend span {
            width: 100%;
            flex-shrink: 5;
            display: inline-flex;
            justify-content: space-between;
            transition: margin-bottom 0.35s ease-in-out;
            flex-shrink: 5; }
            @media (min-device-width: 100px) and (max-device-width: 812px) {
              #pref #FormBuilder_inputradio fieldset legend.infoLegend span, #pref #FormBuilder_tilbud fieldset legend.infoLegend span, #inputOffer #FormBuilder_inputradio fieldset legend.infoLegend span, #inputOffer #FormBuilder_tilbud fieldset legend.infoLegend span {
                font-size: 2.5rem; } }
            @media (min-width: 100px) and (max-width: 812px) {
              #pref #FormBuilder_inputradio fieldset legend.infoLegend span, #pref #FormBuilder_tilbud fieldset legend.infoLegend span, #inputOffer #FormBuilder_inputradio fieldset legend.infoLegend span, #inputOffer #FormBuilder_tilbud fieldset legend.infoLegend span {
                font-size: 2.5rem; } }
      #pref #FormBuilder_inputradio fieldset fieldset, #pref #FormBuilder_tilbud fieldset fieldset, #inputOffer #FormBuilder_inputradio fieldset fieldset, #inputOffer #FormBuilder_tilbud fieldset fieldset {
        background-color: #C7D3D5;
        border-radius: 10px;
        padding: 2rem 3rem; }
        @media (min-device-width: 100px) and (max-device-width: 812px) {
          #pref #FormBuilder_inputradio fieldset fieldset, #pref #FormBuilder_tilbud fieldset fieldset, #inputOffer #FormBuilder_inputradio fieldset fieldset, #inputOffer #FormBuilder_tilbud fieldset fieldset {
            padding: 2rem 1rem; } }
        @media (min-width: 100px) and (max-width: 812px) {
          #pref #FormBuilder_inputradio fieldset fieldset, #pref #FormBuilder_tilbud fieldset fieldset, #inputOffer #FormBuilder_inputradio fieldset fieldset, #inputOffer #FormBuilder_tilbud fieldset fieldset {
            padding: 2rem 1rem; } }
        #pref #FormBuilder_inputradio fieldset fieldset .InputfieldRadiosStacked, #pref #FormBuilder_tilbud fieldset fieldset .InputfieldRadiosStacked, #inputOffer #FormBuilder_inputradio fieldset fieldset .InputfieldRadiosStacked, #inputOffer #FormBuilder_tilbud fieldset fieldset .InputfieldRadiosStacked {
          max-width: 60rem;
          margin: 0 auto; }
        #pref #FormBuilder_inputradio fieldset fieldset legend, #pref #FormBuilder_tilbud fieldset fieldset legend, #inputOffer #FormBuilder_inputradio fieldset fieldset legend, #inputOffer #FormBuilder_tilbud fieldset fieldset legend {
          transform: translate(0, 1.5em);
          font-weight: 500;
          background-color: none;
          margin-bottom: 0.5em; }
          @media (min-device-width: 100px) and (max-device-width: 812px) {
            #pref #FormBuilder_inputradio fieldset fieldset legend, #pref #FormBuilder_tilbud fieldset fieldset legend, #inputOffer #FormBuilder_inputradio fieldset fieldset legend, #inputOffer #FormBuilder_tilbud fieldset fieldset legend {
              transform: translate(0.5em, 70%);
              font-size: 2.5rem;
              width: calc(100% - 1.5rem); } }
          @media (min-width: 100px) and (max-width: 812px) {
            #pref #FormBuilder_inputradio fieldset fieldset legend, #pref #FormBuilder_tilbud fieldset fieldset legend, #inputOffer #FormBuilder_inputradio fieldset fieldset legend, #inputOffer #FormBuilder_tilbud fieldset fieldset legend {
              transform: translate(0.5em, 70%);
              font-size: 2.5rem;
              width: calc(100% - 1.5rem); } }
        #pref #FormBuilder_inputradio fieldset fieldset label, #pref #FormBuilder_tilbud fieldset fieldset label, #inputOffer #FormBuilder_inputradio fieldset fieldset label, #inputOffer #FormBuilder_tilbud fieldset fieldset label {
          font-weight: normal;
          display: none;
          visibility: hidden; }
        #pref #FormBuilder_inputradio fieldset fieldset .InputfieldRadios ul li label, #pref #FormBuilder_tilbud fieldset fieldset .InputfieldRadios ul li label, #inputOffer #FormBuilder_inputradio fieldset fieldset .InputfieldRadios ul li label, #inputOffer #FormBuilder_tilbud fieldset fieldset .InputfieldRadios ul li label {
          visibility: visible; }
          #pref #FormBuilder_inputradio fieldset fieldset .InputfieldRadios ul li label span, #pref #FormBuilder_tilbud fieldset fieldset .InputfieldRadios ul li label span, #inputOffer #FormBuilder_inputradio fieldset fieldset .InputfieldRadios ul li label span, #inputOffer #FormBuilder_tilbud fieldset fieldset .InputfieldRadios ul li label span {
            margin-bottom: 1rem; }
        #pref #FormBuilder_inputradio fieldset fieldset div.error input, #pref #FormBuilder_inputradio fieldset fieldset div.error ul, #pref #FormBuilder_tilbud fieldset fieldset div.error input, #pref #FormBuilder_tilbud fieldset fieldset div.error ul, #inputOffer #FormBuilder_inputradio fieldset fieldset div.error input, #inputOffer #FormBuilder_inputradio fieldset fieldset div.error ul, #inputOffer #FormBuilder_tilbud fieldset fieldset div.error input, #inputOffer #FormBuilder_tilbud fieldset fieldset div.error ul {
          border: 1px solid red; }
        #pref #FormBuilder_inputradio fieldset fieldset div.error input.changed, #pref #FormBuilder_tilbud fieldset fieldset div.error input.changed, #inputOffer #FormBuilder_inputradio fieldset fieldset div.error input.changed, #inputOffer #FormBuilder_tilbud fieldset fieldset div.error input.changed {
          border: 1px solid black; }
    #pref #FormBuilder_inputradio .error, #pref #FormBuilder_tilbud .error, #inputOffer #FormBuilder_inputradio .error, #inputOffer #FormBuilder_tilbud .error {
      border: 1px solid red; }
    #pref #FormBuilder_inputradio input[type=text], #pref #FormBuilder_inputradio input[type=number], #pref #FormBuilder_tilbud input[type=text], #pref #FormBuilder_tilbud input[type=number], #inputOffer #FormBuilder_inputradio input[type=text], #inputOffer #FormBuilder_inputradio input[type=number], #inputOffer #FormBuilder_tilbud input[type=text], #inputOffer #FormBuilder_tilbud input[type=number] {
      width: 25%;
      max-width: 15rem; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        #pref #FormBuilder_inputradio input[type=text], #pref #FormBuilder_inputradio input[type=number], #pref #FormBuilder_tilbud input[type=text], #pref #FormBuilder_tilbud input[type=number], #inputOffer #FormBuilder_inputradio input[type=text], #inputOffer #FormBuilder_inputradio input[type=number], #inputOffer #FormBuilder_tilbud input[type=text], #inputOffer #FormBuilder_tilbud input[type=number] {
          width: 100%;
          max-width: 20rem;
          height: 6rem; } }
      @media (min-width: 100px) and (max-width: 812px) {
        #pref #FormBuilder_inputradio input[type=text], #pref #FormBuilder_inputradio input[type=number], #pref #FormBuilder_tilbud input[type=text], #pref #FormBuilder_tilbud input[type=number], #inputOffer #FormBuilder_inputradio input[type=text], #inputOffer #FormBuilder_inputradio input[type=number], #inputOffer #FormBuilder_tilbud input[type=text], #inputOffer #FormBuilder_tilbud input[type=number] {
          width: 100%;
          max-width: 20rem;
          height: 6rem; } }
    #pref #FormBuilder_inputradio input[type='radio'], #pref #FormBuilder_tilbud input[type='radio'], #inputOffer #FormBuilder_inputradio input[type='radio'], #inputOffer #FormBuilder_tilbud input[type='radio'] {
      margin: 0; }
      #pref #FormBuilder_inputradio input[type='radio'].error:after, #pref #FormBuilder_tilbud input[type='radio'].error:after, #inputOffer #FormBuilder_inputradio input[type='radio'].error:after, #inputOffer #FormBuilder_tilbud input[type='radio'].error:after {
        width: 15px;
        height: 15px;
        border-radius: 15px;
        top: -3px;
        left: 8px;
        position: relative;
        background-color: #e9e9e9;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px ridge rgba(255, 0, 0, 0.5); }
      #pref #FormBuilder_inputradio input[type='radio'].error:checked:after, #pref #FormBuilder_inputradio input[type='radio'].error:checked:after, #pref #FormBuilder_tilbud input[type='radio'].error:checked:after, #pref #FormBuilder_tilbud input[type='radio'].error:checked:after, #inputOffer #FormBuilder_inputradio input[type='radio'].error:checked:after, #inputOffer #FormBuilder_inputradio input[type='radio'].error:checked:after, #inputOffer #FormBuilder_tilbud input[type='radio'].error:checked:after, #inputOffer #FormBuilder_tilbud input[type='radio'].error:checked:after {
        visibility: hidden; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #pref #buttons, #inputOffer #buttons {
      position: fixed;
      width: 100%;
      background-color: #1C3557;
      bottom: 0;
      left: 0; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #pref #buttons, #inputOffer #buttons {
      position: fixed;
      width: 100%;
      background-color: #1C3557;
      bottom: 0;
      left: 0; } }
  #pref #buttons > div, #inputOffer #buttons > div {
    height: 10rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
    width: 25rem; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #pref #buttons > div, #inputOffer #buttons > div {
        width: 95%;
        margin: 0 auto;
        justify-content: space-between; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #pref #buttons > div, #inputOffer #buttons > div {
        width: 95%;
        margin: 0 auto;
        justify-content: space-between; } }

html, body {
  font-size: 62.5%;
  color: white; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    html, body {
      font-size: 40.5%; } }
  @media (min-width: 100px) and (max-width: 812px) {
    html, body {
      font-size: 40.5%; } }
  @media (min-width: 768px) and (max-width: 1023px) {
    html, body {
      font-size: 62.5%; } }

body {
  background-color: #1C3557;
  color: black;
  font-family: 'Exo', sans-serif;
  letter-spacing: 0.06rem;
  line-height: 1.3; }

#boxShadow, button, #confirm .buttons .button, #submitReciept .buttons .button, #dashboard #allEmails .links a, #dashboard #undo, #home ul.shortcuts li {
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.3); }

#dialogBox {
  border: solid #1C3557 1px;
  width: 50%;
  padding: 2em;
  border-radius: 15px; }

#reactContainer {
  width: 90%;
  max-width: 80rem;
  display: none; }
  @media (min-width: 1880px) {
    #reactContainer {
      position: absolute;
      top: -16rem;
      right: 0; }
      #reactContainer #root {
        height: 80vh; } }
  #reactContainer #appContainer {
    width: 80%;
    box-sizing: border-box; }
  #reactContainer #appContainer {
    width: 100%;
    border: 2px solid #767A7A;
    border-radius: 10px;
    height: 100%; }
    #reactContainer #appContainer div#header {
      height: initial;
      min-height: initial; }
  #reactContainer.active {
    display: block; }

h1 {
  font-size: 3rem;
  text-transform: uppercase; }

h2 {
  font-weight: 600;
  font-size: 1.8rem; }

h3 {
  font-size: 1.5rem; }

h4 {
  font-size: 1.2rem; }

p, li, label {
  font-size: 1.5rem; }

select, option, input {
  font-size: 1.7rem; }

@media (min-device-width: 100px) and (max-device-width: 812px) {
  h1 {
    font-size: 3.5rem;
    text-transform: uppercase; }
  h2 {
    font-size: 2.3rem; }
  h3 {
    font-size: 2rem; }
  h4 {
    font-size: 1.7rem; }
  p, li, label {
    font-size: 2rem;
    line-height: 1.4; }
  select, option, input {
    font-size: 2.2rem; } }

@media (min-width: 100px) and (max-width: 812px) {
  h1 {
    font-size: 3.5rem;
    text-transform: uppercase; }
  h2 {
    font-size: 2.3rem; }
  h3 {
    font-size: 2rem; }
  h4 {
    font-size: 1.7rem; }
  p, li, label {
    font-size: 2rem;
    line-height: 1.4; }
  select, option, input {
    font-size: 2.2rem; } }

strong {
  font-weight: 700; }

.container {
  padding: 1rem; }

.kommentar {
  font-size: 1.1rem; }

legend {
  font-weight: 500 !important; }

#progressWipe {
  width: 100vw;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  background-color: #767A7A;
  opacity: 1;
  transition: opacity 0.2s; }
  #progressWipe.done {
    opacity: 0; }
  #progressWipe #progress {
    width: 20%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%); }
    #progressWipe #progress > div {
      position: relative; }
    #progressWipe #progress img {
      width: 50%;
      height: auto;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      -webkit-animation-name: fade;
              animation-name: fade;
      -webkit-animation-duration: 1s;
              animation-duration: 1s;
      -webkit-animation-iteration-count: infinite;
              animation-iteration-count: infinite; }
    #progressWipe #progress svg rect {
      transform-origin: center;
      -webkit-animation-name: rotate;
              animation-name: rotate;
      -webkit-animation-duration: 1.5s;
              animation-duration: 1.5s;
      -webkit-animation-iteration-count: infinite;
              animation-iteration-count: infinite;
      -webkit-animation-timing-function: cubic-bezier(0.31, -0.2, 0.3, 1.28);
              animation-timing-function: cubic-bezier(0.31, -0.2, 0.3, 1.28); }
    #progressWipe #progress h2 {
      text-align: center; }
    #progressWipe #progress h2 span {
      -webkit-animation-name: blink;
              animation-name: blink;
      -webkit-animation-duration: 1.4s;
              animation-duration: 1.4s;
      -webkit-animation-iteration-count: infinite;
              animation-iteration-count: infinite;
      -webkit-animation-fill-mode: both;
              animation-fill-mode: both; }
    #progressWipe #progress h2 span:nth-child(2) {
      -webkit-animation-delay: .2s;
              animation-delay: .2s; }
    #progressWipe #progress h2 span:nth-child(3) {
      -webkit-animation-delay: .4s;
              animation-delay: .4s; }

@-webkit-keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotate(0deg); }
  80% {
    transform: translate(-50%, -50%) rotate(360deg); }
  100% {
    transform: translate(-50%, -50%) rotate(360deg); } }

@keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotate(0deg); }
  80% {
    transform: translate(-50%, -50%) rotate(360deg); }
  100% {
    transform: translate(-50%, -50%) rotate(360deg); } }

@-webkit-keyframes fade {
  0% {
    opacity: 0; }
  45% {
    opacity: 1; }
  55% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes fade {
  0% {
    opacity: 0; }
  45% {
    opacity: 1; }
  55% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@-webkit-keyframes blink {
  0% {
    opacity: .0; }
  20% {
    opacity: 1; }
  100% {
    opacity: .0; } }

@keyframes blink {
  0% {
    opacity: .0; }
  20% {
    opacity: 1; }
  100% {
    opacity: .0; } }

#navOverlay {
  display: none; }
  #navOverlay.open {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 99;
    -webkit-animation: blur 0.3s linear 1 forwards;
            animation: blur 0.3s linear 1 forwards; }

@-webkit-keyframes blur {
  0% {
    -webkit-backdrop-filter: blur(0px);
            backdrop-filter: blur(0px); }
  100% {
    -webkit-backdrop-filter: blur(7px);
            backdrop-filter: blur(7px); } }

@keyframes blur {
  0% {
    -webkit-backdrop-filter: blur(0px);
            backdrop-filter: blur(0px); }
  100% {
    -webkit-backdrop-filter: blur(7px);
            backdrop-filter: blur(7px); } }

#navbar {
  height: 100%;
  position: fixed;
  top: 0;
  width: 21rem;
  display: flex;
  flex-direction: column; }
  #navbar.guest {
    box-shadow: none;
    background-color: none; }
  #navbar #menuBurger {
    display: none; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #navbar {
      box-shadow: 3px 10px 8px #0000002e;
      background-color: #1C3557;
      width: 0rem;
      z-index: 100;
      overflow: hidden;
      transition: width 0.2s ease-in-out; }
      #navbar #menuBurger {
        display: block;
        position: fixed;
        top: 1rem;
        right: 1rem;
        color: white;
        font-size: 6rem;
        transition: all 0.5s cubic-bezier(0.32, -0.33, 0.68, 1.35); }
      #navbar.open {
        width: 30rem; }
        #navbar.open #menuBurger {
          transform: rotate(270deg); }
      #navbar .nav-icons li {
        margin-bottom: 2em; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #navbar {
      box-shadow: 3px 10px 8px #0000002e;
      background-color: #1C3557;
      width: 0rem;
      z-index: 100;
      overflow: hidden;
      transition: width 0.2s ease-in-out; }
      #navbar #menuBurger {
        display: block;
        position: fixed;
        top: 1rem;
        right: 1rem;
        color: white;
        font-size: 6rem;
        transition: all 0.5s cubic-bezier(0.32, -0.33, 0.68, 1.35); }
      #navbar.open {
        width: 30rem; }
        #navbar.open #menuBurger {
          transform: rotate(270deg); }
      #navbar .nav-icons li {
        margin-bottom: 2em; } }
  #navbar #logo {
    width: 100%;
    height: 10rem; }
    #navbar #logo img {
      height: auto;
      width: 80%;
      display: block;
      margin: 2rem auto; }
  #navbar ul {
    display: flex;
    flex-direction: column;
    margin: 1rem 0 1rem 2rem;
    align-items: center; }
    #navbar ul.nav-icons {
      flex-grow: 10;
      color: black; }
    #navbar ul li {
      margin-bottom: 1em;
      width: 100%;
      color: #C7D3D5; }
      #navbar ul li a {
        display: flex;
        align-items: center; }
        @media (min-device-width: 100px) and (max-device-width: 812px) {
          #navbar ul li a {
            white-space: nowrap; } }
        @media (min-width: 100px) and (max-width: 812px) {
          #navbar ul li a {
            white-space: nowrap; } }
      #navbar ul li.active i, #navbar ul li.active a p {
        color: #F16568; }
      #navbar ul li.active ol {
        text-align: center;
        width: calc(100% + 2rem);
        transform: translate(-2rem, 1rem); }
        #navbar ul li.active ol li {
          margin-bottom: 0.5em; }
          #navbar ul li.active ol li a {
            display: block; }
            #navbar ul li.active ol li a p {
              font-size: 2rem;
              margin-bottom: 1em; }
        #navbar ul li.active ol i {
          font-size: 2.1rem; }
    #navbar ul.footer {
      padding-top: 2rem;
      margin-right: 1rem;
      flex-grow: 0;
      color: black; }
      #navbar ul.footer li {
        margin-bottom: 0.5em; }
        #navbar ul.footer li a p {
          font-size: 1.5rem; }
          @media (min-device-width: 100px) and (max-device-width: 812px) {
            #navbar ul.footer li a p {
              font-size: 2rem; } }
          @media (min-width: 100px) and (max-width: 812px) {
            #navbar ul.footer li a p {
              font-size: 2rem; } }
    #navbar ul .align-right {
      flex-grow: 10; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #navbar ul {
        margin: 2rem 0 1rem 3rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #navbar ul {
        margin: 2rem 0 1rem 3rem; } }
  #navbar p {
    padding: 0 1.5rem;
    font-size: 2.1rem;
    color: white; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #navbar p {
        font-size: 2.5rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #navbar p {
        font-size: 2.5rem; } }
  #navbar .user {
    align-items: flex-end; }
    #navbar .user span {
      font-size: 1.5rem;
      padding: 0; }
  #navbar a:hover {
    text-decoration: none; }
    #navbar a:hover p, #navbar a:hover i {
      color: #F16568; }
    #navbar a:hover i {
      transform: scale(1.3) translateY(-1px); }
  #navbar a i {
    transform: scale(1) translateY(-1px); }

button, #confirm .buttons .button, #submitReciept .buttons .button, #dashboard #allEmails .links a, #dashboard #undo {
  background-color: #E89397;
  /* Green */
  border: none;
  padding: 1.5rem 3.2rem;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.6rem;
  transition: all 0.1s ease-in-out;
  transform: scale(1);
  font-family: inherit; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    button, #confirm .buttons .button, #submitReciept .buttons .button, #dashboard #allEmails .links a, #dashboard #undo {
      font-size: 2.2rem; } }
  @media (min-width: 100px) and (max-width: 812px) {
    button, #confirm .buttons .button, #submitReciept .buttons .button, #dashboard #allEmails .links a, #dashboard #undo {
      font-size: 2.2rem; } }
  button span, #confirm .buttons .button span, #submitReciept .buttons .button span, #dashboard #allEmails .links a span, #dashboard #undo span {
    display: inline-block; }
  button:hover, #confirm .buttons .button:hover, #submitReciept .buttons .button:hover, #dashboard #allEmails .links a:hover, #dashboard #undo:hover {
    background-color: #F1D8A9; }
  button:active, #confirm .buttons .button:active, #submitReciept .buttons .button:active, #dashboard #allEmails .links a:active, #dashboard #undo:active {
    box-shadow: inset 0px 5px 10px rgba(0, 0, 0, 0.36); }

#popUp {
  width: 100%;
  height: 100%;
  -webkit-backdrop-filter: blur(0.7rem);
          backdrop-filter: blur(0.7rem);
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  z-index: 200;
  justify-content: center;
  align-items: center;
  transition: opacity 0.3s linear; }
  #popUp:not(.active) {
    opacity: 0; }
  #popUp.active {
    opacity: 1; }
  #popUp.mobileOnly {
    display: none; }
    #popUp.mobileOnly > div {
      transform: translate(0, 0) scale(1); }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #popUp.mobileOnly {
        display: flex;
        opacity: 1; }
        #popUp.mobileOnly h2 {
          font-size: 3rem; }
        #popUp.mobileOnly p {
          font-size: 2.5rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #popUp.mobileOnly {
        display: flex;
        opacity: 1; }
        #popUp.mobileOnly h2 {
          font-size: 3rem; }
        #popUp.mobileOnly p {
          font-size: 2.5rem; } }
  #popUp > div {
    transition: all 0.3s ease-in-out;
    transform: translate(0, 5rem) scale(0.8);
    background-color: white;
    border-radius: 15px;
    max-width: 80%;
    padding: 5rem;
    position: relative; }
    #popUp > div p {
      margin: 1em 0; }
    #popUp > div ol {
      list-style: decimal;
      margin-left: 5em; }
  #popUp.welcome > div {
    background-color: #E3CCA4; }
  #popUp #welcome {
    font-size: 3rem;
    width: 80%;
    margin: 0 auto; }
    #popUp #welcome h2 {
      text-align: center;
      font-weight: 500;
      font-size: 4rem; }
      #popUp #welcome h2 + p {
        text-align: center; }
    #popUp #welcome ul, #popUp #welcome h4 {
      text-align: left;
      margin: 0 auto; }
    #popUp #welcome ul {
      line-height: 2; }
      #popUp #welcome ul li {
        list-style: disc;
        margin-left: 1em; }
    #popUp #welcome h4 {
      margin-bottom: 1rem; }
    #popUp #welcome h4, #popUp #welcome p, #popUp #welcome ul li {
      font-size: 2rem; }
  #popUp #onComplete {
    position: relative; }
    #popUp #onComplete #text {
      position: absolute;
      left: 0;
      top: 0;
      padding: 3rem;
      width: calc(100% - 6rem);
      height: calc(100% - 6rem);
      display: flex;
      justify-content: center;
      align-items: center; }
      #popUp #onComplete #text > div {
        text-align: center; }
      #popUp #onComplete #text h3 {
        font-size: 2rem; }
      #popUp #onComplete #text h1 {
        font-size: 5rem; }

.guide {
  display: flex; }
  .guide > div {
    width: 30%;
    padding: calc(10% / 6); }
    .guide > div div {
      position: relative; }
      .guide > div div:hover span {
        opacity: 0; }
      .guide > div div span {
        display: none;
        position: absolute;
        transition: all 0.4s ease-in-out;
        width: 100%;
        height: 100%;
        bottom: 0;
        left: 0;
        background-color: rgba(255, 255, 255, 0.7);
        opacity: 1;
        justify-content: center;
        align-items: center; }
        .guide > div div span h1 {
          width: 10rem;
          height: 10rem;
          background-color: #1C3557;
          border-radius: 100%;
          display: flex;
          justify-content: center;
          align-items: center;
          /* border: 2px solid #f1f1f1; */
          font-size: 5rem;
          color: white;
          font-family: 'Roboto';
          box-shadow: 1px 3px 5px 0px #00000057; }
      .guide > div div video {
        border-radius: 15px;
        box-sizing: border-box;
        display: none; }
    .guide > div h2 {
      min-height: 3em;
      display: block; }

main {
  /* display: block; */
  padding-left: 30rem; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    main {
      width: calc(100% - 5rem);
      margin: 0 auto;
      padding-left: 0; } }
  @media (min-width: 100px) and (max-width: 812px) {
    main {
      width: calc(100% - 5rem);
      margin: 0 auto;
      padding-left: 0; } }
  main article {
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: white;
    margin-top: 3rem;
    height: auto;
    width: 70%;
    min-width: 80rem; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      main article {
        width: initial;
        min-width: initial; } }
    @media (min-width: 100px) and (max-width: 812px) {
      main article {
        width: initial;
        min-width: initial; } }
    main article h1 {
      margin-right: 2em; }
    main article p {
      width: 90%;
      margin-bottom: 1em; }
  main#userPrefs article, main#offer article {
    max-height: 40rem;
    transition: max-height 0.2s ease-in-out;
    overflow: hidden;
    max-width: 90rem; }
    main#userPrefs article.hide, main#offer article.hide {
      max-height: 4rem;
      justify-content: unset; }
  main #logo {
    display: none; }

.content {
  max-width: 80%; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    .content {
      max-width: calc(100% - 5rem); } }
  @media (min-width: 100px) and (max-width: 812px) {
    .content {
      max-width: calc(100% - 5rem); } }

#home article {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row; }
  #home article p {
    width: 85%; }
  #home article h1 {
    width: auto;
    margin-right: 1rem; }
  #home article h2 {
    font-weight: 500; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #home article h2 {
        font-size: 1.7rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #home article h2 {
        font-size: 1.7rem; } }

#home ul.shortcuts {
  width: 90%;
  max-width: 90rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #home ul.shortcuts {
      width: 100%; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #home ul.shortcuts {
      width: 100%; } }
  #home ul.shortcuts li {
    margin: 1rem 0;
    background-color: white;
    position: relative;
    padding: 2rem 1rem;
    width: calc(33.333% - 3.5rem);
    border-radius: 10px; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #home ul.shortcuts li {
        margin: 2rem 0;
        height: auto; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #home ul.shortcuts li {
        margin: 2rem 0;
        height: auto; } }
    #home ul.shortcuts li img {
      margin: 2rem auto;
      max-height: 10rem;
      display: block;
      transition: transform 0.2s linear;
      transform: scale(1); }
    #home ul.shortcuts li:hover.not, #home ul.shortcuts li:hover.must {
      background-color: #E89397;
      color: #1C3557; }
      #home ul.shortcuts li:hover.not a, #home ul.shortcuts li:hover.must a {
        text-decoration: none; }
      #home ul.shortcuts li:hover.not img, #home ul.shortcuts li:hover.must img {
        transition: transform 20s linear;
        transform: scale(1.3); }
    #home ul.shortcuts li p {
      font-size: 1.5rem; }
    #home ul.shortcuts li.must {
      margin-bottom: 5rem;
      width: 100%; }
      #home ul.shortcuts li.must:first-of-type {
        margin-bottom: 1rem; }
      #home ul.shortcuts li.must img {
        width: 100%;
        height: auto;
        -o-object-fit: scale-down;
           object-fit: scale-down;
        transform-origin: 50% 50%; }
      #home ul.shortcuts li.must a {
        display: flex;
        flex-direction: reverse;
        justify-content: space-around; }
        #home ul.shortcuts li.must a > div {
          width: 55%; }
        #home ul.shortcuts li.must a > div:first-of-type {
          width: 25%;
          flex-shrink: 5; }
          #home ul.shortcuts li.must a > div:first-of-type + div {
            display: flex;
            flex-direction: column;
            padding-left: 2rem; }
            #home ul.shortcuts li.must a > div:first-of-type + div p {
              margin-top: 2em; }
        #home ul.shortcuts li.must a > div:last-of-type {
          opacity: 0;
          width: 20%;
          transform: scale(1);
          transform-origin: 50% 15%;
          display: flex;
          flex-direction: column;
          justify-content: space-around; }
          @media (min-device-width: 100px) and (max-device-width: 812px) {
            #home ul.shortcuts li.must a > div:last-of-type {
              display: none; } }
          @media (min-width: 100px) and (max-width: 812px) {
            #home ul.shortcuts li.must a > div:last-of-type {
              display: none; } }
          #home ul.shortcuts li.must a > div:last-of-type .circle {
            transition: transform 10s linear, opacity 0.5s linear;
            width: 5rem;
            height: 5rem;
            margin: 1rem auto;
            background-image: conic-gradient(#A8DADD 0deg, #C7D3D5 0);
            border-radius: 50%; }
          #home ul.shortcuts li.must a > div:last-of-type p {
            text-align: center; }
      #home ul.shortcuts li.must:hover a > div:last-of-type {
        opacity: 1; }
        #home ul.shortcuts li.must:hover a > div:last-of-type div.circle {
          transform: scale(1.3);
          -webkit-animation: time 30s linear infinite;
                  animation: time 30s linear infinite; }
        #home ul.shortcuts li.must:hover a > div:last-of-type p {
          color: white; }

@-webkit-keyframes time {
  0% {
    background-image: conic-gradient(#A8DADD 0deg, #1C3557 0); }
  1% {
    background-image: conic-gradient(#A8DADD 3.6deg, #1C3557 0); }
  2% {
    background-image: conic-gradient(#A8DADD 7.2deg, #1C3557 0); }
  3% {
    background-image: conic-gradient(#A8DADD 10.8deg, #1C3557 0); }
  4% {
    background-image: conic-gradient(#A8DADD 14.4deg, #1C3557 0); }
  5% {
    background-image: conic-gradient(#A8DADD 18deg, #1C3557 0); }
  6% {
    background-image: conic-gradient(#A8DADD 21.6deg, #1C3557 0); }
  7% {
    background-image: conic-gradient(#A8DADD 25.2deg, #1C3557 0); }
  8% {
    background-image: conic-gradient(#A8DADD 28.8deg, #1C3557 0); }
  9% {
    background-image: conic-gradient(#A8DADD 32.4deg, #1C3557 0); }
  10% {
    background-image: conic-gradient(#A8DADD 36deg, #1C3557 0); }
  11% {
    background-image: conic-gradient(#A8DADD 39.6deg, #1C3557 0); }
  12% {
    background-image: conic-gradient(#A8DADD 43.2deg, #1C3557 0); }
  13% {
    background-image: conic-gradient(#A8DADD 46.8deg, #1C3557 0); }
  14% {
    background-image: conic-gradient(#A8DADD 50.4deg, #1C3557 0); }
  15% {
    background-image: conic-gradient(#A8DADD 54deg, #1C3557 0); }
  16% {
    background-image: conic-gradient(#A8DADD 57.6deg, #1C3557 0); }
  17% {
    background-image: conic-gradient(#A8DADD 61.2deg, #1C3557 0); }
  18% {
    background-image: conic-gradient(#A8DADD 64.8deg, #1C3557 0); }
  19% {
    background-image: conic-gradient(#A8DADD 68.4deg, #1C3557 0); }
  20% {
    background-image: conic-gradient(#A8DADD 72deg, #1C3557 0); }
  21% {
    background-image: conic-gradient(#A8DADD 75.6deg, #1C3557 0); }
  22% {
    background-image: conic-gradient(#A8DADD 79.2deg, #1C3557 0); }
  23% {
    background-image: conic-gradient(#A8DADD 82.8deg, #1C3557 0); }
  24% {
    background-image: conic-gradient(#A8DADD 86.4deg, #1C3557 0); }
  25% {
    background-image: conic-gradient(#A8DADD 90deg, #1C3557 0); }
  26% {
    background-image: conic-gradient(#A8DADD 93.6deg, #1C3557 0); }
  27% {
    background-image: conic-gradient(#A8DADD 97.2deg, #1C3557 0); }
  28% {
    background-image: conic-gradient(#A8DADD 100.8deg, #1C3557 0); }
  29% {
    background-image: conic-gradient(#A8DADD 104.4deg, #1C3557 0); }
  30% {
    background-image: conic-gradient(#A8DADD 108deg, #1C3557 0); }
  31% {
    background-image: conic-gradient(#A8DADD 111.6deg, #1C3557 0); }
  32% {
    background-image: conic-gradient(#A8DADD 115.2deg, #1C3557 0); }
  33% {
    background-image: conic-gradient(#A8DADD 118.8deg, #1C3557 0); }
  34% {
    background-image: conic-gradient(#A8DADD 122.4deg, #1C3557 0); }
  35% {
    background-image: conic-gradient(#A8DADD 126deg, #1C3557 0); }
  36% {
    background-image: conic-gradient(#A8DADD 129.6deg, #1C3557 0); }
  37% {
    background-image: conic-gradient(#A8DADD 133.2deg, #1C3557 0); }
  38% {
    background-image: conic-gradient(#A8DADD 136.8deg, #1C3557 0); }
  39% {
    background-image: conic-gradient(#A8DADD 140.4deg, #1C3557 0); }
  40% {
    background-image: conic-gradient(#A8DADD 144deg, #1C3557 0); }
  41% {
    background-image: conic-gradient(#A8DADD 147.6deg, #1C3557 0); }
  42% {
    background-image: conic-gradient(#A8DADD 151.2deg, #1C3557 0); }
  43% {
    background-image: conic-gradient(#A8DADD 154.8deg, #1C3557 0); }
  44% {
    background-image: conic-gradient(#A8DADD 158.4deg, #1C3557 0); }
  45% {
    background-image: conic-gradient(#A8DADD 162deg, #1C3557 0); }
  46% {
    background-image: conic-gradient(#A8DADD 165.6deg, #1C3557 0); }
  47% {
    background-image: conic-gradient(#A8DADD 169.2deg, #1C3557 0); }
  48% {
    background-image: conic-gradient(#A8DADD 172.8deg, #1C3557 0); }
  49% {
    background-image: conic-gradient(#A8DADD 176.4deg, #1C3557 0); }
  50% {
    background-image: conic-gradient(#A8DADD 180deg, #1C3557 0); }
  51% {
    background-image: conic-gradient(#A8DADD 183.6deg, #1C3557 0); }
  52% {
    background-image: conic-gradient(#A8DADD 187.2deg, #1C3557 0); }
  53% {
    background-image: conic-gradient(#A8DADD 190.8deg, #1C3557 0); }
  54% {
    background-image: conic-gradient(#A8DADD 194.4deg, #1C3557 0); }
  55% {
    background-image: conic-gradient(#A8DADD 198deg, #1C3557 0); }
  56% {
    background-image: conic-gradient(#A8DADD 201.6deg, #1C3557 0); }
  57% {
    background-image: conic-gradient(#A8DADD 205.2deg, #1C3557 0); }
  58% {
    background-image: conic-gradient(#A8DADD 208.8deg, #1C3557 0); }
  59% {
    background-image: conic-gradient(#A8DADD 212.4deg, #1C3557 0); }
  60% {
    background-image: conic-gradient(#A8DADD 216deg, #1C3557 0); }
  61% {
    background-image: conic-gradient(#A8DADD 219.6deg, #1C3557 0); }
  62% {
    background-image: conic-gradient(#A8DADD 223.2deg, #1C3557 0); }
  63% {
    background-image: conic-gradient(#A8DADD 226.8deg, #1C3557 0); }
  64% {
    background-image: conic-gradient(#A8DADD 230.4deg, #1C3557 0); }
  65% {
    background-image: conic-gradient(#A8DADD 234deg, #1C3557 0); }
  66% {
    background-image: conic-gradient(#A8DADD 237.6deg, #1C3557 0); }
  67% {
    background-image: conic-gradient(#A8DADD 241.2deg, #1C3557 0); }
  68% {
    background-image: conic-gradient(#A8DADD 244.8deg, #1C3557 0); }
  69% {
    background-image: conic-gradient(#A8DADD 248.4deg, #1C3557 0); }
  70% {
    background-image: conic-gradient(#A8DADD 252deg, #1C3557 0); }
  71% {
    background-image: conic-gradient(#A8DADD 255.6deg, #1C3557 0); }
  72% {
    background-image: conic-gradient(#A8DADD 259.2deg, #1C3557 0); }
  73% {
    background-image: conic-gradient(#A8DADD 262.8deg, #1C3557 0); }
  74% {
    background-image: conic-gradient(#A8DADD 266.4deg, #1C3557 0); }
  75% {
    background-image: conic-gradient(#A8DADD 270deg, #1C3557 0); }
  76% {
    background-image: conic-gradient(#A8DADD 273.6deg, #1C3557 0); }
  77% {
    background-image: conic-gradient(#A8DADD 277.2deg, #1C3557 0); }
  78% {
    background-image: conic-gradient(#A8DADD 280.8deg, #1C3557 0); }
  79% {
    background-image: conic-gradient(#A8DADD 284.4deg, #1C3557 0); }
  80% {
    background-image: conic-gradient(#A8DADD 288deg, #1C3557 0); }
  81% {
    background-image: conic-gradient(#A8DADD 291.6deg, #1C3557 0); }
  82% {
    background-image: conic-gradient(#A8DADD 295.2deg, #1C3557 0); }
  83% {
    background-image: conic-gradient(#A8DADD 298.8deg, #1C3557 0); }
  84% {
    background-image: conic-gradient(#A8DADD 302.4deg, #1C3557 0); }
  85% {
    background-image: conic-gradient(#A8DADD 306deg, #1C3557 0); }
  86% {
    background-image: conic-gradient(#A8DADD 309.6deg, #1C3557 0); }
  87% {
    background-image: conic-gradient(#A8DADD 313.2deg, #1C3557 0); }
  88% {
    background-image: conic-gradient(#A8DADD 316.8deg, #1C3557 0); }
  89% {
    background-image: conic-gradient(#A8DADD 320.4deg, #1C3557 0); }
  90% {
    background-image: conic-gradient(#A8DADD 324deg, #1C3557 0); }
  91% {
    background-image: conic-gradient(#A8DADD 327.6deg, #1C3557 0); }
  92% {
    background-image: conic-gradient(#A8DADD 331.2deg, #1C3557 0); }
  93% {
    background-image: conic-gradient(#A8DADD 334.8deg, #1C3557 0); }
  94% {
    background-image: conic-gradient(#A8DADD 338.4deg, #1C3557 0); }
  95% {
    background-image: conic-gradient(#A8DADD 342deg, #1C3557 0); }
  96% {
    background-image: conic-gradient(#A8DADD 345.6deg, #1C3557 0); }
  97% {
    background-image: conic-gradient(#A8DADD 349.2deg, #1C3557 0); }
  98% {
    background-image: conic-gradient(#A8DADD 352.8deg, #1C3557 0); }
  99% {
    background-image: conic-gradient(#A8DADD 356.4deg, #1C3557 0); }
  100% {
    background-image: conic-gradient(#A8DADD 360deg, #1C3557 0); } }

@keyframes time {
  0% {
    background-image: conic-gradient(#A8DADD 0deg, #1C3557 0); }
  1% {
    background-image: conic-gradient(#A8DADD 3.6deg, #1C3557 0); }
  2% {
    background-image: conic-gradient(#A8DADD 7.2deg, #1C3557 0); }
  3% {
    background-image: conic-gradient(#A8DADD 10.8deg, #1C3557 0); }
  4% {
    background-image: conic-gradient(#A8DADD 14.4deg, #1C3557 0); }
  5% {
    background-image: conic-gradient(#A8DADD 18deg, #1C3557 0); }
  6% {
    background-image: conic-gradient(#A8DADD 21.6deg, #1C3557 0); }
  7% {
    background-image: conic-gradient(#A8DADD 25.2deg, #1C3557 0); }
  8% {
    background-image: conic-gradient(#A8DADD 28.8deg, #1C3557 0); }
  9% {
    background-image: conic-gradient(#A8DADD 32.4deg, #1C3557 0); }
  10% {
    background-image: conic-gradient(#A8DADD 36deg, #1C3557 0); }
  11% {
    background-image: conic-gradient(#A8DADD 39.6deg, #1C3557 0); }
  12% {
    background-image: conic-gradient(#A8DADD 43.2deg, #1C3557 0); }
  13% {
    background-image: conic-gradient(#A8DADD 46.8deg, #1C3557 0); }
  14% {
    background-image: conic-gradient(#A8DADD 50.4deg, #1C3557 0); }
  15% {
    background-image: conic-gradient(#A8DADD 54deg, #1C3557 0); }
  16% {
    background-image: conic-gradient(#A8DADD 57.6deg, #1C3557 0); }
  17% {
    background-image: conic-gradient(#A8DADD 61.2deg, #1C3557 0); }
  18% {
    background-image: conic-gradient(#A8DADD 64.8deg, #1C3557 0); }
  19% {
    background-image: conic-gradient(#A8DADD 68.4deg, #1C3557 0); }
  20% {
    background-image: conic-gradient(#A8DADD 72deg, #1C3557 0); }
  21% {
    background-image: conic-gradient(#A8DADD 75.6deg, #1C3557 0); }
  22% {
    background-image: conic-gradient(#A8DADD 79.2deg, #1C3557 0); }
  23% {
    background-image: conic-gradient(#A8DADD 82.8deg, #1C3557 0); }
  24% {
    background-image: conic-gradient(#A8DADD 86.4deg, #1C3557 0); }
  25% {
    background-image: conic-gradient(#A8DADD 90deg, #1C3557 0); }
  26% {
    background-image: conic-gradient(#A8DADD 93.6deg, #1C3557 0); }
  27% {
    background-image: conic-gradient(#A8DADD 97.2deg, #1C3557 0); }
  28% {
    background-image: conic-gradient(#A8DADD 100.8deg, #1C3557 0); }
  29% {
    background-image: conic-gradient(#A8DADD 104.4deg, #1C3557 0); }
  30% {
    background-image: conic-gradient(#A8DADD 108deg, #1C3557 0); }
  31% {
    background-image: conic-gradient(#A8DADD 111.6deg, #1C3557 0); }
  32% {
    background-image: conic-gradient(#A8DADD 115.2deg, #1C3557 0); }
  33% {
    background-image: conic-gradient(#A8DADD 118.8deg, #1C3557 0); }
  34% {
    background-image: conic-gradient(#A8DADD 122.4deg, #1C3557 0); }
  35% {
    background-image: conic-gradient(#A8DADD 126deg, #1C3557 0); }
  36% {
    background-image: conic-gradient(#A8DADD 129.6deg, #1C3557 0); }
  37% {
    background-image: conic-gradient(#A8DADD 133.2deg, #1C3557 0); }
  38% {
    background-image: conic-gradient(#A8DADD 136.8deg, #1C3557 0); }
  39% {
    background-image: conic-gradient(#A8DADD 140.4deg, #1C3557 0); }
  40% {
    background-image: conic-gradient(#A8DADD 144deg, #1C3557 0); }
  41% {
    background-image: conic-gradient(#A8DADD 147.6deg, #1C3557 0); }
  42% {
    background-image: conic-gradient(#A8DADD 151.2deg, #1C3557 0); }
  43% {
    background-image: conic-gradient(#A8DADD 154.8deg, #1C3557 0); }
  44% {
    background-image: conic-gradient(#A8DADD 158.4deg, #1C3557 0); }
  45% {
    background-image: conic-gradient(#A8DADD 162deg, #1C3557 0); }
  46% {
    background-image: conic-gradient(#A8DADD 165.6deg, #1C3557 0); }
  47% {
    background-image: conic-gradient(#A8DADD 169.2deg, #1C3557 0); }
  48% {
    background-image: conic-gradient(#A8DADD 172.8deg, #1C3557 0); }
  49% {
    background-image: conic-gradient(#A8DADD 176.4deg, #1C3557 0); }
  50% {
    background-image: conic-gradient(#A8DADD 180deg, #1C3557 0); }
  51% {
    background-image: conic-gradient(#A8DADD 183.6deg, #1C3557 0); }
  52% {
    background-image: conic-gradient(#A8DADD 187.2deg, #1C3557 0); }
  53% {
    background-image: conic-gradient(#A8DADD 190.8deg, #1C3557 0); }
  54% {
    background-image: conic-gradient(#A8DADD 194.4deg, #1C3557 0); }
  55% {
    background-image: conic-gradient(#A8DADD 198deg, #1C3557 0); }
  56% {
    background-image: conic-gradient(#A8DADD 201.6deg, #1C3557 0); }
  57% {
    background-image: conic-gradient(#A8DADD 205.2deg, #1C3557 0); }
  58% {
    background-image: conic-gradient(#A8DADD 208.8deg, #1C3557 0); }
  59% {
    background-image: conic-gradient(#A8DADD 212.4deg, #1C3557 0); }
  60% {
    background-image: conic-gradient(#A8DADD 216deg, #1C3557 0); }
  61% {
    background-image: conic-gradient(#A8DADD 219.6deg, #1C3557 0); }
  62% {
    background-image: conic-gradient(#A8DADD 223.2deg, #1C3557 0); }
  63% {
    background-image: conic-gradient(#A8DADD 226.8deg, #1C3557 0); }
  64% {
    background-image: conic-gradient(#A8DADD 230.4deg, #1C3557 0); }
  65% {
    background-image: conic-gradient(#A8DADD 234deg, #1C3557 0); }
  66% {
    background-image: conic-gradient(#A8DADD 237.6deg, #1C3557 0); }
  67% {
    background-image: conic-gradient(#A8DADD 241.2deg, #1C3557 0); }
  68% {
    background-image: conic-gradient(#A8DADD 244.8deg, #1C3557 0); }
  69% {
    background-image: conic-gradient(#A8DADD 248.4deg, #1C3557 0); }
  70% {
    background-image: conic-gradient(#A8DADD 252deg, #1C3557 0); }
  71% {
    background-image: conic-gradient(#A8DADD 255.6deg, #1C3557 0); }
  72% {
    background-image: conic-gradient(#A8DADD 259.2deg, #1C3557 0); }
  73% {
    background-image: conic-gradient(#A8DADD 262.8deg, #1C3557 0); }
  74% {
    background-image: conic-gradient(#A8DADD 266.4deg, #1C3557 0); }
  75% {
    background-image: conic-gradient(#A8DADD 270deg, #1C3557 0); }
  76% {
    background-image: conic-gradient(#A8DADD 273.6deg, #1C3557 0); }
  77% {
    background-image: conic-gradient(#A8DADD 277.2deg, #1C3557 0); }
  78% {
    background-image: conic-gradient(#A8DADD 280.8deg, #1C3557 0); }
  79% {
    background-image: conic-gradient(#A8DADD 284.4deg, #1C3557 0); }
  80% {
    background-image: conic-gradient(#A8DADD 288deg, #1C3557 0); }
  81% {
    background-image: conic-gradient(#A8DADD 291.6deg, #1C3557 0); }
  82% {
    background-image: conic-gradient(#A8DADD 295.2deg, #1C3557 0); }
  83% {
    background-image: conic-gradient(#A8DADD 298.8deg, #1C3557 0); }
  84% {
    background-image: conic-gradient(#A8DADD 302.4deg, #1C3557 0); }
  85% {
    background-image: conic-gradient(#A8DADD 306deg, #1C3557 0); }
  86% {
    background-image: conic-gradient(#A8DADD 309.6deg, #1C3557 0); }
  87% {
    background-image: conic-gradient(#A8DADD 313.2deg, #1C3557 0); }
  88% {
    background-image: conic-gradient(#A8DADD 316.8deg, #1C3557 0); }
  89% {
    background-image: conic-gradient(#A8DADD 320.4deg, #1C3557 0); }
  90% {
    background-image: conic-gradient(#A8DADD 324deg, #1C3557 0); }
  91% {
    background-image: conic-gradient(#A8DADD 327.6deg, #1C3557 0); }
  92% {
    background-image: conic-gradient(#A8DADD 331.2deg, #1C3557 0); }
  93% {
    background-image: conic-gradient(#A8DADD 334.8deg, #1C3557 0); }
  94% {
    background-image: conic-gradient(#A8DADD 338.4deg, #1C3557 0); }
  95% {
    background-image: conic-gradient(#A8DADD 342deg, #1C3557 0); }
  96% {
    background-image: conic-gradient(#A8DADD 345.6deg, #1C3557 0); }
  97% {
    background-image: conic-gradient(#A8DADD 349.2deg, #1C3557 0); }
  98% {
    background-image: conic-gradient(#A8DADD 352.8deg, #1C3557 0); }
  99% {
    background-image: conic-gradient(#A8DADD 356.4deg, #1C3557 0); }
  100% {
    background-image: conic-gradient(#A8DADD 360deg, #1C3557 0); } }
    #home ul.shortcuts li.not {
      padding: 1rem;
      background-color: #C7D3D5;
      width: calc(50% - 3rem);
      min-width: 30rem; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        #home ul.shortcuts li.not {
          min-width: 20rem;
          width: calc(50% - 4rem);
          height: 15rem;
          margin-bottom: 1rem; }
          #home ul.shortcuts li.not img {
            display: none; }
          #home ul.shortcuts li.not h2 {
            font-size: 1.6rem;
            margin-bottom: 0.5em; } }
      @media (min-width: 100px) and (max-width: 812px) {
        #home ul.shortcuts li.not {
          min-width: 20rem;
          width: calc(50% - 4rem);
          height: 15rem;
          margin-bottom: 1rem; }
          #home ul.shortcuts li.not img {
            display: none; }
          #home ul.shortcuts li.not h2 {
            font-size: 1.6rem;
            margin-bottom: 0.5em; } }
      #home ul.shortcuts li.not a {
        display: flex;
        flex-direction: column; }
        #home ul.shortcuts li.not a > div:not(:first-child) {
          padding: 1rem; }
        #home ul.shortcuts li.not a > div:last-of-type {
          display: none; }
  #home ul.shortcuts:last-of-type {
    margin-bottom: 10rem; }

#guide {
  max-width: 100rem;
  margin-bottom: 15rem; }
  #guide p {
    margin-left: 0; }
  #guide a {
    text-decoration: underline; }
    #guide a ol {
      margin: 1rem 3em;
      list-style: decimal; }
      #guide a ol li {
        margin-left: 0.5em; }
    #guide a:hover {
      color: #1C3557; }
  #guide .content {
    line-height: 1.5; }
    #guide .content ol {
      margin: 1rem 3em;
      list-style: decimal; }
      #guide .content ol li {
        margin-left: 0.5em; }
    #guide .content p, #guide .content h2, #guide .content ol li {
      color: white;
      margin-bottom: 1em; }
  #guide #videos {
    display: none;
    background-color: white;
    border-radius: 15px;
    margin-bottom: 5rem; }

#createForm {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-backdrop-filter: blur(0.7rem);
          backdrop-filter: blur(0.7rem);
  opacity: 0;
  transition: all 0.3s ease-out; }
  #createForm #formBG {
    position: absolute;
    width: 100%;
    height: 100%; }
  #createForm #form {
    width: 80rem;
    height: 40rem;
    position: absolute;
    top: 52%;
    right: 50%;
    transform: translate(50%, -50%) scale(0.9);
    background-color: #C7D3D5;
    border-radius: 10px;
    padding: 1em;
    transition: all 0.3s ease-out; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #createForm #form {
        width: 90%; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #createForm #form {
        width: 90%; } }
    #createForm #form label {
      font-size: 2.1rem;
      color: #1C3557;
      margin-bottom: 1em;
      font-weight: 600;
      display: block; }
    #createForm #form input, #createForm #form select {
      border: none;
      width: 100%;
      background-color: white; }
    #createForm #form form {
      height: 100%; }
      #createForm #form form > ul {
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: center;
        width: 70%;
        margin: 1em auto; }
        #createForm #form form > ul > li {
          margin: 1em; }
      #createForm #form form i {
        display: none; }
    #createForm #form #wrap_matchType {
      margin-top: 2rem; }
      #createForm #form #wrap_matchType label {
        margin-bottom: 0; }
      #createForm #form #wrap_matchType select#matchType {
        max-width: 50%; }
  #createForm.active {
    opacity: 1; }
    #createForm.active #form {
      top: 50%;
      transform: translate(50%, -50%) scale(1); }

.cross {
  position: absolute;
  top: 0rem;
  right: 0rem;
  height: 4rem;
  width: 4rem;
  cursor: pointer; }
  .cross .lineWrap {
    position: relative;
    height: 100%;
    width: 100%;
    /* margin: 5px; */ }
  .cross .line {
    width: 2.5rem;
    height: 3px;
    position: absolute;
    background-color: black;
    top: 50%;
    right: 50%;
    transition: all 1s cubic-bezier(0.56, 0.225, 0.29, 1.3);
    transform: translate(50%, -50%) rotate(180deg); }

.active .cross .line, .mobileOnly .cross .line {
  transform: translate(50%, -50%) rotate(135deg); }
  .active .cross .line:first-of-type, .mobileOnly .cross .line:first-of-type {
    transform: translate(50%, -50%) rotate(45deg); }

.active .cross:hover .line, .mobileOnly .cross:hover .line {
  transition: all 0.4s cubic-bezier(0.56, 0.225, 0.29, 1.3);
  transform: translate(50%, -50%) rotate(225deg); }
  .active .cross:hover .line:first-of-type, .mobileOnly .cross:hover .line:first-of-type {
    transform: translate(50%, -50%) rotate(135deg); }

#confirm, #submitReciept {
  position: absolute;
  width: 100vw;
  height: 100vh;
  left: 0;
  top: 0;
  opacity: 0;
  transition: all 0.3s ease-in;
  z-index: 1;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px); }
  #confirm.active, .active#submitReciept {
    opacity: 1; }
  #confirm > div, #submitReciept > div {
    width: 30%;
    height: 40%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: absolute;
    top: 55%;
    right: 50%;
    transform: translate(50%, -50%) scale(1);
    background-color: #C7D3D5;
    border-radius: 10px;
    padding: 2rem; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #confirm > div, #submitReciept > div {
        width: 80%;
        height: 30%;
        top: 40%; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #confirm > div, #submitReciept > div {
        width: 80%;
        height: 30%;
        top: 40%; } }
    #confirm > div > p, #submitReciept > div > p {
      flex-grow: 5;
      font-size: 2.1rem;
      text-align: center; }
    #confirm > div p:nth-child(2), #submitReciept > div p:nth-child(2) {
      font-size: 2.8rem; }
    #confirm > div p:first-child, #submitReciept > div p:first-child {
      margin-top: 1em; }
  #confirm .buttons, #submitReciept .buttons {
    display: flex;
    flex-grow: 10;
    align-items: center;
    justify-content: center; }
    #confirm .buttons .button, #submitReciept .buttons .button {
      height: 1.5em;
      font-size: 2.1rem; }
    #confirm .buttons .button:last-child, #submitReciept .buttons .button:last-child {
      width: 25%; }

#history {
  max-width: 60rem; }
  #history #empty {
    color: white;
    margin: 1em 0; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #history {
      width: calc(100% - 5rem); } }
  @media (min-width: 100px) and (max-width: 812px) {
    #history {
      width: calc(100% - 5rem); } }
  #history button, #history #confirm .buttons .button, #confirm .buttons #history .button, #history #submitReciept .buttons .button, #submitReciept .buttons #history .button, #history #dashboard #allEmails .links a, #dashboard #allEmails .links #history a, #history #dashboard #undo, #dashboard #history #undo {
    display: block; }
    #history button span, #history #confirm .buttons .button span, #confirm .buttons #history .button span, #history #submitReciept .buttons .button span, #submitReciept .buttons #history .button span, #history #dashboard #allEmails .links a span, #dashboard #allEmails .links #history a span, #history #dashboard #undo span, #dashboard #history #undo span {
      margin: 0; }
  #history .forhandling {
    background-color: #C7D3D5;
    padding: 2rem;
    margin: 2rem 0;
    border-radius: 10px;
    position: relative; }
    #history .forhandling .delete {
      position: absolute;
      top: 0.5rem;
      right: 0.5rem; }
      #history .forhandling .delete i {
        font-size: 3.1rem;
        transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        transform: rotate(0deg) scale(1); }
      #history .forhandling .delete:hover i {
        transform: rotate(90deg) scale(1); }
  #history h2 {
    font-size: 2.1rem;
    text-transform: uppercase;
    margin: 1rem 0 0 1rem; }
  #history h4 {
    text-transform: none;
    margin: 0 0 0.5em 1rem;
    display: block; }
  #history ol ol {
    display: flex;
    flex-direction: row; }
    #history ol ol li {
      display: flex;
      height: 7rem;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.1s ease-in-out;
      margin: 1rem;
      background-color: white;
      border: none; }
      #history ol ol li.pref {
        position: relative; }
        #history ol ol li.pref::after {
          position: absolute;
          right: -2rem;
          top: calc(50% - 2px);
          content: "";
          background-color: #1C3557;
          width: 2rem;
          height: 4px;
          transition: all 0.2s ease-in-out; }
        #history ol ol li.pref.done:hover {
          box-shadow: none;
          cursor: initial; }
      #history ol ol li.done + .resultNode::before {
        border-left: 2rem solid #1C3557; }
      #history ol ol li.notDone {
        background-color: #E89397; }
      #history ol ol li:hover {
        box-shadow: none;
        background-color: #F1D8A9;
        /* padding: calc(1em - 1px); */
        cursor: pointer; }
        #history ol ol li:hover.done, #history ol ol li:hover.notDone {
          color: black; }
          #history ol ol li:hover.done ~ li.resultNode.hasResult, #history ol ol li:hover.notDone ~ li.resultNode.hasResult {
            background-color: #767A7A;
            opacity: 0.7; }
          #history ol ol li:hover.done ~ li.resultNode::before, #history ol ol li:hover.notDone ~ li.resultNode::before {
            border-left-color: #C7D3D5;
            opacity: 0.2; }
        #history ol ol li:hover .tools .show {
          display: block; }
      #history ol ol li p, #history ol ol li a {
        font-size: 1.7rem;
        padding: 1em; }
        #history ol ol li p:hover, #history ol ol li a:hover {
          text-decoration: none; }
      #history ol ol li:nth-child(2):hover + .resultNode::before {
        border-left: 2rem solid #1C3557; }
      #history ol ol li.newData {
        position: relative; }
        #history ol ol li.newData::after {
          content: "ny data";
          position: absolute;
          top: -1rem;
          right: -3rem;
          font-size: 1rem;
          text-transform: uppercase;
          color: white;
          background-color: #00552f;
          padding: 0.5rem 1rem;
          border-radius: 10px 10px; }
      #history ol ol li.resultNode {
        position: relative;
        color: #000000;
        width: 35%; }
      #history ol ol li.resultNode.noResult {
        background-color: #767A7A;
        opacity: 0.7;
        cursor: initial;
        pointer-events: none; }
      #history ol ol li.resultNode.hasResult:hover {
        background-color: #F1D8A9; }
      #history ol ol li.resultNode.hasResult::before {
        content: "";
        position: absolute;
        height: 0px;
        width: 0px;
        border-left: 2rem solid #1C3557;
        border-bottom: 1rem solid transparent;
        border-top: 1rem solid transparent;
        top: calc(50% - 1rem);
        left: -2.1rem;
        transition: all 0.3s ease-in-out;
        opacity: 1;
        transform: translate(1px); }
      #history ol ol li.resultNode.hasResult a {
        pointer-events: initial; }
      #history ol ol li.resultNode.hasResult.unRead:not(.loading) {
        position: relative; }
        #history ol ol li.resultNode.hasResult.unRead:not(.loading)::after {
          content: "nyt";
          position: absolute;
          top: -1rem;
          right: -1rem;
          font-size: 1rem;
          text-transform: uppercase;
          color: white;
          background-color: #1C3557;
          padding: 0.5rem 1rem;
          border-radius: 10px 10px; }
      #history ol ol li.resultNode.hasResult img {
        transition: opacity 0.2s linear;
        display: block;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        height: 90%;
        opacity: 0;
        width: auto;
        -webkit-animation-name: rotate;
                animation-name: rotate;
        -webkit-animation-duration: 1.1s;
                animation-duration: 1.1s;
        -webkit-animation-iteration-count: infinite;
                animation-iteration-count: infinite;
        -webkit-animation-timing-function: cubic-bezier(0.31, -0.2, 0.3, 1.28);
                animation-timing-function: cubic-bezier(0.31, -0.2, 0.3, 1.28);
        pointer-events: none; }
      #history ol ol li.resultNode.hasResult.loading {
        cursor: default;
        position: relative;
        background-color: #C7D3D5; }
        #history ol ol li.resultNode.hasResult.loading::before {
          opacity: 0;
          transform: translate(-10px); }
        #history ol ol li.resultNode.hasResult.loading a {
          opacity: 0;
          pointer-events: none; }
        #history ol ol li.resultNode.hasResult.loading img {
          opacity: 1; }
      #history ol ol li .nb {
        position: absolute;
        font-size: 1rem;
        top: 6.4rem;
        width: 27rem;
        left: -1.4rem; }
  #history ul {
    border: none; }
    #history ul li {
      display: flex;
      padding: 1em;
      justify-content: space-between;
      border-radius: 5px;
      border: solid 1px;
      transition: all 0.2s ease-in-out;
      margin: 1rem;
      background-color: white; }
      #history ul li:hover {
        border: solid 1px #1C3557;
        /* padding: calc(1em - 1px); */
        background-color: #1C3557;
        cursor: pointer;
        box-shadow: 3px 11px 12px rgba(0, 0, 0, 0.36);
        color: white; }
        #history ul li:hover .tools .show {
          display: block; }
      #history ul li a {
        font-size: 2.1rem; }
        #history ul li a:hover {
          text-decoration: none; }
    #history ul div.titles {
      display: flex;
      flex-direction: column; }
    #history ul div.tools {
      flex-grow: 10;
      display: flex;
      justify-content: flex-end;
      align-self: center; }
      #history ul div.tools a, #history ul div.tools span {
        order: 2;
        display: flex; }
      #history ul div.tools p {
        display: none;
        margin-right: 1em;
        -ms-grid-row-align: center;
            align-self: center; }
      #history ul div.tools a.delete:hover ~ p.delete, #history ul div.tools a.edit:hover ~ p.edit, #history ul div.tools span.share:hover ~ p.share {
        display: block; }
      #history ul div.tools a.delete:hover ~ p.show, #history ul div.tools a.edit:hover ~ p.show, #history ul div.tools span.share:hover ~ p.show {
        display: none; }
      #history ul div.tools a i {
        margin-left: 0.5em; }

.button {
  margin: 2rem 1rem; }

#ProcessForgotPassword p {
  margin: 1em; }

#errors {
  position: fixed;
  top: 7rem;
  left: 28rem;
  z-index: 100;
  background-color: white;
  width: 50%;
  height: 10rem;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 3px 5px 19px grey;
  border-radius: 15px;
  border: 1px solid red; }

#submitReciept {
  display: none;
  color: white; }
  #submitReciept.active {
    display: block; }
  #submitReciept > div > p {
    flex-grow: 0; }
  #submitReciept.active ~ div {
    height: 90vh;
    overflow: hidden; }
  #submitReciept div {
    background-color: #1C3557;
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center; }
  #submitReciept img {
    width: 30%; }

main#profil {
  margin-bottom: 5em; }
  main#profil article:not(:first-of-type) {
    height: initial; }
  main#profil .vilkar {
    display: flex;
    font-size: 1.5rem;
    justify-content: flex-end; }
    main#profil .vilkar > * {
      margin-right: 0.5em; }
    main#profil .vilkar a {
      text-decoration: underline; }
      main#profil .vilkar a:hover {
        color: #1C3557; }
  main#profil #wrap_register_terms + .vilkar {
    transform: translate(31rem, -3.9rem);
    width: auto;
    justify-content: flex-start; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      main#profil #wrap_register_terms + .vilkar {
        transform: translate(0, -1.5rem);
        justify-content: flex-start;
        margin-left: 3.7rem;
        font-size: 2rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      main#profil #wrap_register_terms + .vilkar {
        transform: translate(0, -1.5rem);
        justify-content: flex-start;
        margin-left: 3.7rem;
        font-size: 2rem; } }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    main#profil .profileForm {
      width: 100%; } }
  @media (min-width: 100px) and (max-width: 812px) {
    main#profil .profileForm {
      width: 100%; } }

main#profil.guest {
  padding-left: initial; }
  main#profil.guest #logoMobile {
    display: none; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    main#profil.guest {
      margin: 0 auto; }
      main#profil.guest #logoMobile {
        display: block;
        margin: 2rem; }
        main#profil.guest #logoMobile img {
          width: 80%;
          height: auto;
          display: block;
          margin: 0 auto; } }
  @media (min-width: 100px) and (max-width: 812px) {
    main#profil.guest {
      margin: 0 auto; }
      main#profil.guest #logoMobile {
        display: block;
        margin: 2rem; }
        main#profil.guest #logoMobile img {
          width: 80%;
          height: auto;
          display: block;
          margin: 0 auto; } }
  main#profil.guest .profileForm {
    min-width: 45rem;
    width: 100%;
    max-width: 55rem;
    padding: 5rem;
    background-color: #C7D3D5;
    border-radius: 15px;
    margin: 10rem auto; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      main#profil.guest .profileForm {
        width: calc(100% - 6rem);
        min-width: 0;
        padding: 3rem;
        margin: 0; }
        main#profil.guest .profileForm ul.LoginRegisterLinks li a {
          font-size: 2.5rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      main#profil.guest .profileForm {
        width: calc(100% - 6rem);
        min-width: 0;
        padding: 3rem;
        margin: 0; }
        main#profil.guest .profileForm ul.LoginRegisterLinks li a {
          font-size: 2.5rem; } }

#input, #createForm #form input, #createForm #form select, .profileForm .LoginRegisterPro select, .profileForm .LoginRegisterPro input {
  height: 2em;
  box-sizing: border-box;
  height: 4rem;
  max-width: 100%;
  padding: 0 1rem;
  border: none;
  vertical-align: middle;
  display: inline-block;
  margin: 0.4rem 0.2rem;
  border-radius: 5px; }

.LoginRegisterPro small {
  font-size: 1.3rem; }

.LoginRegisterPro .LoginRegisterNotice {
  display: none; }

#confirmText {
  font-size: 2rem;
  width: 40%;
  /* margin-left: 30rem; */
  /* transform: translate(0px, 7rem); */
  /* min-width: 45%; */
  margin: 5rem auto 0 auto;
  color: white; }

ul.LoginRegisterLinks {
  padding-top: 1rem; }
  ul.LoginRegisterLinks li {
    text-align: right;
    margin-bottom: 0.5em; }
    ul.LoginRegisterLinks li a {
      padding: 0.5rem;
      font-size: 1.6rem; }

form.RegisterForm input[type=checkbox] {
  width: 2rem;
  height: 2rem;
  margin-right: 1rem; }

form.RegisterForm label, form.RegisterForm .description {
  margin-left: 0.5rem; }

form.RegisterForm .InputfieldHeader {
  font-weight: normal !important; }

form.RegisterForm .InputfieldCheckbox > .InputfieldHeader {
  display: none; }

form.RegisterForm #wrap_register_terms a {
  margin-left: 0.5em;
  text-decoration: underline; }
  form.RegisterForm #wrap_register_terms a:hover {
    font-weight: bold; }

form.LoginForm, form.RegisterForm {
  width: 100%;
  min-width: 400px; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    form.LoginForm, form.RegisterForm {
      min-width: 0; } }
  @media (min-width: 100px) and (max-width: 812px) {
    form.LoginForm, form.RegisterForm {
      min-width: 0; } }

#ProcessForgotPassword .description {
  margin: 2rem 0.5rem; }

form.LoginForm .InputfieldHeader {
  font-weight: normal !important;
  margin-left: 0.5rem !important; }

.profileForm {
  margin-top: 5rem; }
  .profileForm #wrap_Inputfield_profile_userGender {
    position: relative;
    margin-bottom: 5rem !important; }
    .profileForm #wrap_Inputfield_profile_userGender .notes {
      left: 17rem;
      position: absolute;
      /* right: -40px; */
      /* top: 0; */
      /* width: 18rem; */ }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        .profileForm #wrap_Inputfield_profile_userGender .notes {
          left: 1rem;
          line-height: 0.7; } }
      @media (min-width: 100px) and (max-width: 812px) {
        .profileForm #wrap_Inputfield_profile_userGender .notes {
          left: 1rem;
          line-height: 0.7; } }
  .profileForm .LoginRegisterPro .LoginNotice {
    position: fixed;
    right: 5rem;
    display: inline-block;
    white-space: nowrap;
    padding: 1rem 1rem;
    margin: 1em;
    background-color: #767A7A;
    border-radius: 10px;
    color: black;
    transition: all 0.5s ease-in-out;
    opacity: 1; }
    .profileForm .LoginRegisterPro .LoginNotice.dissolve {
      opacity: 0; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(1) {
    bottom: 5rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(2) {
    bottom: 10rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(3) {
    bottom: 15rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(4) {
    bottom: 20rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(5) {
    bottom: 25rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(6) {
    bottom: 30rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(7) {
    bottom: 35rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(8) {
    bottom: 40rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(9) {
    bottom: 45rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(10) {
    bottom: 50rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(11) {
    bottom: 55rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(12) {
    bottom: 60rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(13) {
    bottom: 65rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(14) {
    bottom: 70rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(15) {
    bottom: 75rem; }
  .profileForm .LoginRegisterPro .LoginNotice:nth-of-type(16) {
    bottom: 80rem; }
  .profileForm .LoginRegisterPro .Inputfield {
    padding: 0 !important;
    margin: 1.5rem 0 !important; }
  .profileForm .LoginRegisterPro select, .profileForm .LoginRegisterPro input {
    width: 100%; }
  .profileForm .LoginRegisterPro input[name=profile_notifications] {
    width: initial;
    margin-right: 0.5em; }
  .profileForm .LoginRegisterPro .Inputfield input[type=text], .profileForm .LoginRegisterPro input[type=email], .profileForm .LoginRegisterPro input[type=password] {
    height: 5rem;
    width: 100%;
    border: none; }
  .profileForm .LoginRegisterPro input[type=password] {
    margin-top: 1rem; }
  .profileForm form[name='profile'] h2 {
    display: none; }
  .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) {
    display: flex;
    align-items: center; }
    .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) label {
      width: 25%;
      font-weight: normal; }
    .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) div.InputfieldContent {
      width: 75%; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) {
        flex-direction: column;
        align-items: unset; }
        .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) div.InputfieldContent {
          width: 100%; }
        .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) label {
          width: 100%; } }
    @media (min-width: 100px) and (max-width: 812px) {
      .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) {
        flex-direction: column;
        align-items: unset; }
        .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) div.InputfieldContent {
          width: 100%; }
        .profileForm form[name='profile'] .Inputfield:not(.InputfieldFieldsetOpen):not(.Inputfield_profile_pass_ask):not(.InputfieldPassword):not(.Inputfield_profile_notifications) label {
          width: 100%; } }
  .profileForm #Inputfield_profile_UserFieldset, .profileForm #Inputfield_profile_userDataFieldset {
    margin: 1rem 0;
    padding: 0;
    background-color: #C7D3D5;
    max-width: 70rem;
    padding: 3rem !important;
    border-radius: 10px; }
    .profileForm #Inputfield_profile_UserFieldset > label.InputfieldHeader, .profileForm #Inputfield_profile_userDataFieldset > label.InputfieldHeader {
      font-size: 3rem;
      font-weight: normal;
      text-transform: uppercase;
      transform: translateX(-1em);
      display: block;
      margin: 0 0 2em 1em; }
    .profileForm #Inputfield_profile_UserFieldset #wrap_Inputfield_profile_pass, .profileForm #Inputfield_profile_userDataFieldset #wrap_Inputfield_profile_pass {
      margin-top: 4em; }
    .profileForm #Inputfield_profile_UserFieldset select, .profileForm #Inputfield_profile_userDataFieldset select {
      background-color: white; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      .profileForm #Inputfield_profile_UserFieldset, .profileForm #Inputfield_profile_userDataFieldset {
        max-width: none; } }
    @media (min-width: 100px) and (max-width: 812px) {
      .profileForm #Inputfield_profile_UserFieldset, .profileForm #Inputfield_profile_userDataFieldset {
        max-width: none; } }
  .profileForm #wrap_profile_submit {
    margin-top: 2em; }
  .profileForm #wrap_Inputfield_profile_userNewsLetter {
    margin: 3rem 0;
    flex-direction: row; }
    .profileForm #wrap_Inputfield_profile_userNewsLetter > label {
      flex-shrink: 3;
      width: auto; }
    .profileForm #wrap_Inputfield_profile_userNewsLetter .InputfieldContent {
      flex-grow: 10; }
      .profileForm #wrap_Inputfield_profile_userNewsLetter .InputfieldContent label {
        width: 100%;
        display: flex; }
        .profileForm #wrap_Inputfield_profile_userNewsLetter .InputfieldContent label input {
          width: 10rem; }
        .profileForm #wrap_Inputfield_profile_userNewsLetter .InputfieldContent label span {
          font-size: small;
          -ms-grid-row-align: center;
              align-self: center;
          width: 100%; }

main#results {
  background-color: #1C3557;
  padding-top: 0rem;
  border-radius: 15px;
  margin-bottom: 10rem; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    main#results {
      min-width: initial;
      max-width: none;
      padding: 0; } }
  @media (min-width: 100px) and (max-width: 812px) {
    main#results {
      min-width: initial;
      max-width: none;
      padding: 0; } }
  main#results #mainTitle {
    width: 100%;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    display: flex;
    align-items: center;
    z-index: 5;
    background-color: #1C3557; }
    main#results #mainTitle h1 {
      border: none;
      width: initial;
      margin: 3rem 3rem 2rem 1rem;
      padding: 1rem 2rem;
      border-radius: 10px;
      color: white;
      transition: all 0.1s linear; }
    main#results #mainTitle i {
      opacity: 0;
      transition: all 0.2s ease-in-out;
      font-size: 4rem;
      transform: translate(0px, 5px);
      color: white; }
    main#results #mainTitle.active {
      cursor: pointer; }
      main#results #mainTitle.active:hover i {
        opacity: 1; }
      main#results #mainTitle.active:hover h1, main#results #mainTitle.active:hover i {
        transform: scale(1.1); }

#misMatch table {
  padding: 3rem;
  display: block;
  font-size: 2.1rem; }
  #misMatch table tr td:first-of-type {
    display: flex;
    justify-content: space-between; }
  #misMatch table tr > *:first {
    width: 80%; }
  #misMatch table tr > *:last-child {
    width: 20%; }
  #misMatch table tr th {
    font-size: larger;
    text-align: right;
    height: 6rem;
    vertical-align: middle; }
    #misMatch table tr th:first-child {
      text-align: left; }
  #misMatch table tr.titles {
    vertical-align: center; }
  #misMatch table td:last-of-type {
    text-align: right; }

#fullReport {
  display: block;
  margin: 2em auto 0 auto; }

#resultBox {
  background-color: #C7D3D5;
  min-width: calc(50% - 5rem);
  margin: 0 0 3rem 0rem;
  padding: 2rem;
  border-radius: 15px;
  display: flex;
  justify-content: space-around;
  flex-direction: column; }
  #resultBox strong {
    margin-left: 1rem; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #resultBox {
      min-width: 90%; }
      #resultBox strong {
        display: block; }
      #resultBox p {
        font-size: 2.5rem;
        line-height: 2; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #resultBox {
      min-width: 90%; }
      #resultBox strong {
        display: block; }
      #resultBox p {
        font-size: 2.5rem;
        line-height: 2; } }

#svgPrecent {
  width: 33%;
  flex-shrink: 5; }
  #svgPrecent svg circle {
    transform: rotate(126deg);
    transform-origin: 50% 50%; }
  #svgPrecent svg .green {
    stroke: #F16568;
    transition: stroke-dashOffset 1s ease-out; }
  #svgPrecent svg .grey {
    stroke: white; }
  #svgPrecent svg text {
    fill: white;
    font-size: 50px; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #svgPrecent {
      width: 100%;
      transform: scale(0.75); }
      #svgPrecent svg {
        display: block;
        margin: 0 auto; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #svgPrecent {
      width: 100%;
      transform: scale(0.75); }
      #svgPrecent svg {
        display: block;
        margin: 0 auto; } }

#resultGraph {
  margin-top: 2rem;
  width: 100%;
  height: auto;
  border-right: solid 1px #A8DADD;
  background-size: 12.5% 100%;
  background-image: linear-gradient(90deg, transparent 0%, #A8DADD 0.5%, #A8DADD 0.8%, transparent 0.9%); }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #resultGraph {
      background-image: none;
      border-right: none; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #resultGraph {
      background-image: none;
      border-right: none; } }
  #resultGraph > div {
    width: 100%;
    cursor: pointer; }
    #resultGraph > div:hover span {
      background-color: #E89397; }
    #resultGraph > div h3 {
      margin: 0.5rem;
      font-size: 2.1rem;
      color: white; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        #resultGraph > div h3 {
          font-size: 3rem; } }
      @media (min-width: 100px) and (max-width: 812px) {
        #resultGraph > div h3 {
          font-size: 3rem; } }
    #resultGraph > div span {
      transition: width 1s ease-out;
      background-color: #C7D3D5;
      display: inline-block;
      text-align: center;
      font-size: 2.1rem;
      padding: 0.5rem 0;
      border-top-right-radius: 10px;
      border-bottom-right-radius: 10px;
      margin-bottom: 1rem; }
  #resultGraph .zero span {
    color: white; }

#allResults {
  display: none;
  margin-bottom: 5rem;
  width: 90%;
  max-width: 100rem; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #allResults {
      width: 100%; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #allResults {
      width: 100%; } }
  #allResults.active {
    display: block; }
  #allResults > div {
    padding-top: 9.2rem; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #allResults > div {
        padding-top: 10rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #allResults > div {
        padding-top: 10rem; } }
  #allResults .context {
    font-size: 1.5rem; }
    #allResults .context span.matchText {
      border-radius: 5px;
      padding-bottom: 0.1rem;
      display: inline-block; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #allResults .container {
      padding: 0rem; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #allResults .container {
      padding: 0rem; } }

html {
  scroll-behavior: smooth; }

a {
  color: inherit;
  text-decoration: none; }
  a:visited {
    color: inherit; }
  a:hover {
    text-decoration: underline; }

i.material-icons:not(#menuBurger), .materialClass {
  transform: scale(1.2);
  transition: transform 0.1s ease-in; }
  i.material-icons:not(#menuBurger):hover, .materialClass:hover {
    transform: scale(1.5); }
  i.material-icons:not(#menuBurger):active, .materialClass:active {
    color: #767A7A !important;
    transform: scale(0.9); }

#resultValue, .bottom > div > div div h2 span, .matchText, #forhandling .data > div .flex span:last-child, .results > .flex .flex span:last-child {
  background-color: #1C3557;
  color: white;
  text-align: center;
  padding: 0.5em;
  border-radius: 15px;
  white-space: nowrap;
  font-family: 'Roboto'; }

.percentResult {
  transition: color 3s ease-in-out; }

#overblik {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 1rem;
  margin-bottom: 0;
  width: 90%;
  max-width: 100rem; }
  #overblik .results.data {
    border: none;
    background-color: initial; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #overblik {
      width: 100%;
      justify-content: center;
      padding: 0; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #overblik {
      width: 100%;
      justify-content: center;
      padding: 0; } }

#lon p {
  margin: 2em 0; }

#lon .flex div h2 {
  margin-top: 0.4rem; }

#bonus .flex {
  flex-wrap: wrap;
  width: 40%; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    #bonus .flex {
      width: 100%; } }
  @media (min-width: 100px) and (max-width: 812px) {
    #bonus .flex {
      width: 100%; } }
  #bonus .flex h2 {
    width: 50%; }
  #bonus .flex h2:nth-child(even) {
    font-weight: normal; }

#bonus .column1-3 > * {
  margin-bottom: 1rem; }

.padding {
  padding: 2rem; }

.bottom {
  padding: 0;
  display: flex; }
  @media (min-device-width: 100px) and (max-device-width: 812px) {
    .bottom {
      flex-direction: column; } }
  @media (min-width: 100px) and (max-width: 812px) {
    .bottom {
      flex-direction: column; } }
  .bottom > div > div div {
    margin-bottom: 2rem; }
    .bottom > div > div div * {
      margin: 1em 0; }
    .bottom > div > div div h2 {
      white-space: nowrap; }
      .bottom > div > div div h2 span {
        margin-left: 1rem;
        color: white; }
        @media (min-device-width: 100px) and (max-device-width: 812px) {
          .bottom > div > div div h2 span {
            display: block;
            width: 60%;
            margin-left: auto;
            margin-right: auto; } }
        @media (min-width: 100px) and (max-width: 812px) {
          .bottom > div > div div h2 span {
            display: block;
            width: 60%;
            margin-left: auto;
            margin-right: auto; } }

#bruttolon .context > * {
  margin-bottom: 1rem; }

.matchText {
  padding: 0 0.5em; }

#forhandling .data > div > * {
  margin: 1em 0; }

#forhandling .data > div ol {
  list-style: inside; }
  #forhandling .data > div ol li {
    margin: 0.5em 1em; }

#forhandling .data > div .flex {
  align-items: center; }
  #forhandling .data > div .flex span:last-child {
    margin-left: 5rem; }

.match {
  border-radius: 27px; }
  .match .flex {
    align-items: center; }
    .match .flex span:last-child {
      font-size: 6rem; }

.results #barselInfo {
  border-top: 2px solid #eaeaea;
  padding: 0rem 2rem 0 3rem; }
  .results #barselInfo .vilkar p {
    padding: 0.5rem 1rem;
    padding-left: 0; }
    .results #barselInfo .vilkar p:last-of-type:not(:first-of-type) {
      padding: 1rem 1rem 3rem 0rem; }
  .results #barselInfo .vilkar h2 {
    padding: 2rem;
    padding-left: 0; }

.results > div:not(.column2-3) {
  padding: 2rem 2rem 0 3rem; }

.results .flex {
  display: flex;
  width: 100%; }
  .results .flex div {
    flex: 0 0 50%; }
  .results .flex > div:first-child {
    border-right: solid 1px black; }

.results > .flex {
  height: 100%; }
  .results > .flex .flex {
    justify-content: space-between; }
    .results > .flex .flex span:first-child {
      flex: 0 2 50%;
      -ms-grid-row-align: center;
          align-self: center; }
    .results > .flex .flex span:last-child {
      flex: 0 0 50%; }

.results.title h1 {
  margin: 0;
  border: none;
  color: white; }

.results .column1 {
  flex: 0 0 40%; }

.results .column2-3 {
  flex: 0 0 60%;
  margin-bottom: 2em; }
  .results .column2-3 li {
    display: flex;
    padding: 3rem; }
    .results .column2-3 li div {
      color: grey; }
    .results .column2-3 li div:last-of-type {
      flex: 0 0 66.6666%; }
    .results .column2-3 li div.center {
      flex: 0 0 33.3333%;
      height: 100%; }
    .results .column2-3 li.selected {
      border-radius: 0px; }
      .results .column2-3 li.selected div {
        color: #4e4e4e; }
      .results .column2-3 li.selected .center h1 {
        font-weight: 500; }

.results .score {
  margin-bottom: 1rem;
  display: flex;
  align-items: center; }
  .results .score h3 {
    margin-right: 1rem; }
  .results .score.results ul li {
    display: none; }
  .results .score.results ul li.selected {
    display: block; }

.results .vilkar {
  flex-basis: calc(50% - 2em); }
  .results .vilkar ul {
    margin: 3rem 0;
    border: none;
    width: calc(100% - 4em);
    list-style: none; }
    .results .vilkar ul li {
      padding: 0.5rem;
      display: flex; }
      .results .vilkar ul li i {
        margin-right: 1rem;
        transform: translate(0, -2px); }
        .results .vilkar ul li i:hover {
          transform: none; }
    .results .vilkar ul .na {
      list-style: none; }
      .results .vilkar ul .na.bad i {
        color: #F16568; }
      .results .vilkar ul .na.good i {
        color: #1C3557; }
  .results .vilkar.positiv {
    border-right: solid 2px #eaeaea; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      .results .vilkar.positiv {
        border-right: none; } }
    @media (min-width: 100px) and (max-width: 812px) {
      .results .vilkar.positiv {
        border-right: none; } }
    .results .vilkar.positiv li:not(.bad) i {
      color: #1C3557; }
  .results .vilkar.negativ li:not(.good) i {
    color: #F16568; }

.results .column1-3 {
  flex: 0 0 100%; }

.results.data {
  background-color: #C7D3D5;
  border-radius: 10px;
  padding-bottom: 2rem; }
  .results.data h3 {
    display: inline; }
  .results.data span {
    font-weight: 400; }
  .results.data .Big {
    font-size: 6rem;
    font-weight: 500;
    color: black;
    font-family: 'Roboto'; }
  .results.data .column1 .flexContainer {
    flex-direction: row;
    justify-content: space-between;
    height: 80%; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      .results.data .column1 .flexContainer {
        flex-direction: column; } }
    @media (min-width: 100px) and (max-width: 812px) {
      .results.data .column1 .flexContainer {
        flex-direction: column; } }

.results.title {
  padding: 1rem;
  align-items: flex-end; }

.results .anbefaling {
  width: 100%; }
  .results .anbefaling p {
    opacity: 1; }
  .results .anbefaling .selected {
    border-top: 2px solid #eaeaea; }
    .results .anbefaling .selected h1 {
      border: none;
      margin: 0; }
    .results .anbefaling .selected .anbefalingText p {
      color: black; }
    .results .anbefaling .selected .anbefalingText strong {
      margin: 1.5em 0 1em 0;
      display: block; }

.center {
  -ms-grid-row-align: center;
      align-self: center; }

.flexContainer {
  display: flex; }

#help {
  color: white; }
  #help .content {
    max-width: 60%;
    margin-bottom: 15rem; }
    #help .content > * {
      margin-bottom: 1em; }
    #help .content a {
      text-decoration: underline; }
      #help .content a:hover {
        font-weight: 800; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #help .content {
        max-width: 100%; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #help .content {
        max-width: 100%; } }

#promailer {
  display: flex;
  flex-direction: column;
  /* margin: 3rem auto; */
  width: 100%;
  height: 150px;
  justify-content: space-evenly;
  align-items: center;
  margin: 4rem auto; }
  #promailer #promailer-form {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center; }
    #promailer #promailer-form #unsub_email {
      height: 2em;
      margin: 0 3rem;
      padding: 0 1em;
      border-radius: 10px;
      border: none; }

#dashboard {
  width: 90%;
  margin: 5rem auto;
  color: white; }
  #dashboard #dashNav {
    margin-bottom: 3rem; }
    #dashboard #dashNav ol {
      display: flex; }
      #dashboard #dashNav ol li {
        margin-right: 1rem; }
        #dashboard #dashNav ol li:first-of-type {
          background-color: white;
          color: black;
          border-radius: 5px; }
        #dashboard #dashNav ol li * {
          border: solid 1px white;
          padding: 1rem;
          display: block;
          border-radius: 5px; }
        #dashboard #dashNav ol li:hover:not(:first-of-type) {
          background-color: white;
          color: black; }
  #dashboard #logo {
    position: fixed;
    right: 3rem;
    top: 2rem;
    width: 20rem; }
    @media (min-device-width: 100px) and (max-device-width: 812px) {
      #dashboard #logo {
        position: fixed;
        right: 1rem;
        top: 3rem;
        width: 7rem; } }
    @media (min-width: 100px) and (max-width: 812px) {
      #dashboard #logo {
        position: fixed;
        right: 1rem;
        top: 3rem;
        width: 7rem; } }
    #dashboard #logo img {
      width: 100%;
      height: auto; }
  #dashboard > * {
    margin-top: 2rem; }
  #dashboard h1 {
    font-size: 5rem; }
  #dashboard article {
    margin-left: 2rem; }
  #dashboard details summary {
    font-size: 2rem; }
  #dashboard details[open] summary {
    border: none; }
  #dashboard #stats > * {
    margin: 1rem 3rem; }
  #dashboard #allEmails {
    display: flex;
    width: 100%;
    flex-wrap: wrap; }
    #dashboard #allEmails article {
      margin: 1rem;
      padding: 2rem;
      width: calc(26% - 3rem);
      border: 1px solid whitesmoke;
      border-radius: 10px; }
      #dashboard #allEmails article.empty {
        display: none; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        #dashboard #allEmails article {
          width: 100%; } }
      @media (min-width: 100px) and (max-width: 812px) {
        #dashboard #allEmails article {
          width: 100%; } }
      #dashboard #allEmails article h2 {
        position: relative;
        margin-bottom: 2rem; }
        #dashboard #allEmails article h2 span {
          position: absolute;
          right: 0; }
          @media (min-device-width: 100px) and (max-device-width: 812px) {
            #dashboard #allEmails article h2 span {
              font-size: 5rem; } }
          @media (min-width: 100px) and (max-width: 812px) {
            #dashboard #allEmails article h2 span {
              font-size: 5rem; } }
    #dashboard #allEmails .links a {
      padding: 1rem;
      margin-bottom: 0.3rem;
      color: black;
      font-size: 1.2rem; }
      @media (min-device-width: 100px) and (max-device-width: 812px) {
        #dashboard #allEmails .links a {
          font-size: 2.5rem;
          padding: 2rem; } }
      @media (min-width: 100px) and (max-width: 812px) {
        #dashboard #allEmails .links a {
          font-size: 2.5rem;
          padding: 2rem; } }
  #dashboard #undo {
    padding: 1.5rem;
    color: black; }
  #dashboard code {
    display: block;
    width: 80%;
    border: solid 1px #000000;
    background-color: #767A7A;
    font-size: small;
    overflow: auto;
    padding: 1.5rem;
    color: black; }
    #dashboard code table {
      text-align: left;
      width: 100%; }
      #dashboard code table tbody tr:first-of-type {
        height: 2.5rem; }
        #dashboard code table tbody tr:first-of-type th {
          font-style: italic; }
      #dashboard code table th:first-of-type {
        width: 35%; }
      #dashboard code table th:nth-child(2) {
        width: 10%; }