/*
 * Obfuscated filename: ttl-1535113606.css
 */

/* Declaring needed fonts */
  /* Font used for entering barcode. */
  @font-face {
    font-family: 'Andale Mono Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Andale Mono Regular'), url('/typo3conf/ext/dstemplate/Resources/Public/Fonts/andalemo.woff') format('woff');
  }
  @font-face {
    font-family: 'HeartBreakingBad';
    src: url('/typo3conf/ext/dstemplate/Resources/Public/Fonts/HeartBreakingBad-zG0w.ttf')
  }

/* General */
  .underline {
    text-decoration: underline
  }
  .margin-left-10 {
    margin-left: 20px
  }
  .grid-list-2 {
    display: grid;
    grid-template-columns: 5% 95%
  }
  .grid-list-2-child-complete-row {
    grid-column: 2/2
  }
  #triton-projects li #current-project a:before {
    background-position: -100px 0
  }

  .teaser .button,
  #horizontal-scroll .hrzs-item .button,
  .tx-felogin-pi1 #submit-login .button {
    background:#e07950;
    border-color:#e07950;
    color:#fff;
    -webkit-text-fill-color: #fff
  }
  .teaser .button:hover,
  #horizontal-scroll .hrzs-item .button:hover,
  .tx-felogin-pi1 #submit-login .button:hover,
  .teaser .button:focus,
  #horizontal-scroll .hrzs-item .button:focus,
  .tx-felogin-pi1 #submit-login .button:focus {
    background:transparent;
    color:#e07950;
    -webkit-text-fill-color: #e07950
  }
  .tx-tritonlab .button {
    background: transparent;
    color: #e07950;
    -webkit-text-fill-color: #e07950
  }

  .tx-tritonlab .button,
  button {
    max-width: 280px;
    width: 100%;
  }
  
  .tx-tritonlab .button.button-inverted-tl-color {
    background: transparent;
    color: #fff;
    -webkit-text-fill-color: #fff
  }
  .tx-tritonlab .button.button-inverted-tl-color:hover,
  .tx-tritonlab .button.button-inverted-tl-color:focus {
    background: #ce5828;
    border-color: #ce5828;
    color: #fff;
    -webkit-text-fill-color: #fff
  }
  .button.button-inverted {
    background: transparent;
    color: #e07950;
    -webkit-text-fill-color: #e07950
  }
  .button.button-inverted:hover,
  .button.button-inverted:focus {
    background: #e07950;
    border-color: #e07950;
    color: #fff;
    -webkit-text-fill-color: #fff
  }
  @media screen and (max-width:1050px) {
    #header:after {
      background: #ce5828
    }
    #nav a:hover,
    #nav a:focus,
    #nav li.active a {
      background: #ce5828
    }
  }

  /* Modal rules */
    /* User id modal */
      #tmodal-user-id-explanation-content {
        text-align: left
      }
      #tmodal-user-id-explanation-content h3 {
        line-height: 33px !important
      }
      #tmodal-user-id-explanation-content ul > li > ul {
        margin-left: 19px;
        list-style-type: square
      }
      #tmodal-user-id-explanation-content ul > li > ul > li {
        color: #e07950;
        -webkit-text-fill-color: #e07950
      }
      #tmodal-user-id-explanation-content > h3,
      #tmodal-user-id-explanation-content > .content {
      margin: 30px 0px
      }
      #tmodal-user-id-explanation-content img {
        margin: 0 auto;
        display: block;
        max-width: 300px;
        margin-top: 50px
      }
    /* Profile modal for whole Triton-Lab area when logged in */
      #tmodal-profile-open img {
        height: 14px;
        width: auto;
        position: absolute;
        top: 7px;
        left: 11px;
      }
      #tmodal-profile.open {
        display: block
      }
      #tmodal-profile-content .profile-submenu {
        text-align: center;
        list-style: none;
        margin: 20px 0
      }
      #tmodal-profile-content .profile-submenu li {
        display: inline-block;
        margin-right: 6px;
        margin-bottom: 6px
      }
      #tmodal-profile img {
        height: 14px;
        width: auto;
        position: absolute;
        top: 7px;
        left: 11px;
      }
      #tmodal-profile h3 {
        font-weight: 700;
        margin-bottom: 20px
      }

    /* Eval progress modal callable in aq-list to see description page of what those porgress icons mean */
      #tmodal-eval-progress.open {
        display: block
      }
      #tmodal-eval-progress-wrap #tmodal-eval-progress-submenu {
        list-style: none;
        margin: 20px 0
      }
      #tmodal-eval-progress-submenu li {
        margin-bottom: 20px;
        font-size: 14px
      }
      #tmodal-eval-progress-submenu li.low-opacity {
        opacity: 0.2
      }
      #tmodal-eval-progress-submenu li,
      #tmodal-eval-progress-submenu li span {
        display: block
      }
      #tmodal-eval-progress-submenu .aq-list-eval-progress-desc-icon {
        font-size: 30px;
        color: #ce5828;
        -webkit-text-fill-color: #ce5828
      }
      #tmodal-eval-progress img {
        height: 14px;
        width: auto;
        position: absolute;
        top: 7px;
        left: 11px;
      }
      #tmodal-eval-progress h3 {
        margin-bottom: 20px
      }

    /* For Profile modal and Eval progress modal */
      @media screen and (max-width:767px) {
        .profile-submenu li {
            display: block!important
        }
        .profile-submenu li a {
            min-width: 250px
        }
      }

/* TRITON LAB - Evaluation page */
  /* Section */
    #c88 .tx-tritonlab {
      max-width: 930px;
      margin: 0px auto
    }
    .eval-section-title {
      border-bottom: 1px solid #cf5828;
      color: #cf5828;
      margin-top: 50px;
      text-transform: uppercase;
      font-weight: 600 !important;
      font-size: 25px !important;
      line-height: 45px !important;
      margin-bottom: 30px !important
    }

    .eval-group-title {
      border-bottom: 1px solid #599790
    }

    /* Evaluation warning colors */
      /*
      .evaluation .elem-warn-yellow,
      .evaluation-mobile .elem-warn-yellow {
        background-color: #fff57f !important
      }
      .evaluation-mobile .elem-warn-yellow h1 {
        color: #444 !important;
        -webkit-text-fill-color: #444 !important
      }
      .evaluation-mobile .elem-warn-yellow i.fas.fa-exclamation-circle {
        margin: -15px 0px 22px 0px !important;
        color: #ad8305;
        font-size: 18px
      }

      .evaluation .elem-warn-red,
      .evaluation-mobile .elem-warn-red {
        background-color: #e57777 !important;
        color: white!important;
        -webkit-text-fill-color: white!important
      }
      .evaluation-mobile .elem-warn-red i.fas.fa-exclamation-triangle {
        margin: -15px 0px 22px 0px !important;
        color: #720000;
        font-size: 18px
      }
      .evaluation .elem-warn-red td,
      .evaluation .elem-warn-red td .pt-elem,
      .evaluation .elem-warn-red td .bar .pointer,
      .evaluation-mobile article.elem-warn-red h1,
      .evaluation-mobile article.elem-warn-red .evaluation-mobile-value h2,
      .evaluation-mobile article.elem-warn-red .evaluation-mobile-value p,
      .evaluation-mobile article.elem-warn-red .bar-content-block .bar .pointer {
        color: #fff !important;
        -webkit-text-fill-color: #fff !important
      }
      .evaluation .elem-warn-red td .pt-elem {
        border: 1px solid white
      }
      */

    .dashboard-item p,
    .eval-section-title,
    .select-items,
    .select-selected,
    .select-selected:after {
      /* font-size: 16px!important; */
    }

    /* (TARB-CODE-2011181034)
    .eval-section {
      margin: 40px 0px
    }
    .eval-group-title {
      background-color: #009686;
      margin-top: -60px;
      margin-left: 2px;
      margin-right: 2px;
    }
    
    .eval-group {
      display: none;
      margin-top: -32px
    }

    .eval-group h2 {
      display: none
    }

    .eval-group-active {
      display: block
    }
    */

  /* Dashboard */
    .eval-section-title,
    .dashboard-item p,
    .select-selected,
    .select-selected:after,
    .select-items {
      /* font-size: 16px!important; */
    }
    
    /* Fix for IE9, IE10 */
      @media screen and (min-width:0\0) {
        .dashboard-item-padding {
          margin: 10px 0!important
        }
        .flex-item {
          flex-grow: 1!important;
          flex-shrink: 0;
          flex-basis: 0%!important
        }
        .flex-item-2 {
          flex-grow: 1!important;
          flex-shrink: 0;
          flex-basis: 0%!important
        }
      }
    
    /* Fix IE10 and above */
      @media all and (-ms-high-contrast: none),
      (-ms-high-contrast: active) {
        .flex-item {
          flex-grow: 1!important;
          flex-shrink: 0;
          flex-basis: 0%!important
        }
        .flex-item-2 {
          flex-grow: 1!important;
          flex-shrink: 0;
          flex-basis: 0%!important
        }
        #elem-no3-input {
          box-sizing: inherit !important
        }
      }
    
    .dashboard-item-color-required {
      color: #444 !important;
      border: 1px solid #999999 !important
    }
    .dashboard-item-color-grey {
      color: #000!important;
      border: 4px solid #424242!important;
      border-color: #424242!important
    }
    .dashboard-item-padding {
      margin: 5px 1% 0!important
    }
    .flex-container {
      display: flex;
      display: -ms-flexbox;
      display: -webkit-flex;
      justify-content: center;
      -ms-flex-line-pack: center;
      align-items: center;
      -ms-flex-align: center
    }
    .flex-item {
      flex-grow: 0;
      flex-shrink: 0;
      flex-basis: 49%
    }
    .flex-item-2 {
      flex-grow: 0;
      flex-shrink: 0;
      flex-basis: 49%
    }
    .dashboard-item p {
      /* padding: 7px 10px; */ /* padding-left:35px; */
    }
    .dashboard-item .dashboard-item-label {
      color: #599790 !important;
      -webkit-text-fill-color: #599790 !important;
    }
    .dashboard-item .dashboard-item-text {
      background: none!important;
      color: #545454!important;
      -webkit-text-fill-color: #545454!important;
      border: none!important
    }
    span.questionmark {
      font-size: 18px;
      display: inline-block;
      vertical-align: middle;
      margin-top: -3px;
      cursor: pointer
    }
    span.questionmark:hover {
      background-color: white;
      color: #009688;
      -webkit-text-fill-color: #d05728;

      /* padding: 0px 1.5px; */
      transition: background-color 0.5s ease    }
    .dashboard-item button,
    .dashboard-item input, .dashboard-item a {
      border: 1px solid #999999 !important;
      border-color: #535353;
      color: #444 !important;
      -webkit-text-fill-color: #444 !important;
      padding: 7px 16px !important;
      cursor: pointer;
      user-select: none;
      text-align: center;
      font-weight: 400;
      font-size: 16px !important;
      line-height: 24px !important;
      height: auto !important;
      box-shadow: none !important;
      width: 100% !important
      /* text-transform: uppercase */
    }
    .dashboard-item button:hover, .dashboard-item a:hover {
      background: #009687;
      color: #fff !important;
      -webkit-text-fill-color: #fff !important;
      border: 1px solid #009687 !important
    }
    .dashboard-item input {
      max-width: none !important;
      padding: 8px 16px !important;
      margin-top: 0px
    }
    .dashboard-item input.invalid {
      background: #ff7878;
      color: white;
      border-color: #ff7878!important;
      border: 4px solid #ff7878!important
    }
    .dashboard-item a {
      border: 1px solid #999999;
      text-decoration: none;
      display: block;
    }
    #copy-url-button {
      display: block;
      max-width: 100%;
      background-color: #fff;

      border-width: 1px
    }
    #button-download-pdf {
      font-family: Arial
    }
    #copy-url-button:hover, #button-download-pdf:hover {
      background-color: #599790;
      border: 1px solid #599790 !important
    }
    @media screen and (max-width:840px) {
      #copy-url-button{
        display: block;
        margin: 0 auto
      }
    }
    .shop-recommendation-not-found-link {
      padding: 0px !important
    }
    .shop-recommendation-not-found-link > a {
      text-transform: none
    }

    /* Expand flex-item, custom select and a background modal to deliver a better overview when let user select between options */
      .flex-container-expand {
        height: 336px;
        align-items: unset;
      }
      .select-items-expand {
        height: 265px;
        overflow: scroll;
        margin-top: -265px
      }
      .expand-z-index{
        z-index: 2
      }
      #expand-modal {
        visibility: hidden;
        opacity: 0;
        display: block;
        position: fixed;
        z-index: 1;
        padding-top: 100px;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
        background-color: #ffffff;
      }
      .expand-modal-visible {
        visibility: visible !important;
        opacity: 0.8 !important;
      }

    /* Custom dropdown */
      /* The container must be positioned relative */
        .custom-select {
          position: relative;
          font-family: Arial
        }
      /* Hide original SELECT element */
        .custom-select select {
          display: none
        }
        .select-selected {
          background-color: #fff
        }
      /* Style the arrow inside the select element */
        .select-selected:after {
          position: absolute;
          content: "";
          top: 19px;
          right: 10px;
          width: 0;
          height: 0;
          border: 7px solid transparent;
          border-color: #424242 transparent transparent
        }
      /* Point the arrow upwards when the select box is open (active) */
        .select-selected.select-arrow-active:after {
          top: 9px;
          border: 8px solid transparent;
          border-color: transparent transparent #424242 transparent
        }

      /* Style the items (options), including the selected item */
        .select-items div,
        .select-selected {

          color: #444;
          padding: 7px 16px;
          border-bottom: 1px solid #999999;
          border-color: #999999;
          cursor: pointer;
          user-select: none;
          text-align: center
        }

      /* Style items (options) */
        .select-items {
          position: absolute;
          background-color: #fff;
          top: 100%;
          left: 0;
          right: 0;
          z-index: 2;
          scrollbar-width: none;
          border: 1px solid #999999;
        }

      /* hide the items when the select box is closed */
        .select-hide {
          display: none
        }

      .select-items div:hover,
      .same-as-selected {
        background-color: #599790;
        color: #fff !important
      }
      .select-items::-webkit-scrollbar {
        display: none
      }
      .select-items-finger {
        position: absolute;
        opacity: 0;
        top: 10px;
        right: 0px;
        /*transition: 2s ease-in-out all;*/
        background: url(/typo3conf/ext/dstemplate/Resources/Public/Images/finger_swpie_up_3.png);
        background-position: center;
        width: 115px!important;
        height: 115px!important;
        background-size: cover;
      }
      .select-items-finger-swipe-up {
        animation-name: finger-swipe-up-animation;
        animation-duration: 2s; /* If time should change here then please make sure that will also get changed in related JS file: tarb_aq_list. */
        animation-timing-function: ease-in-out;
        animation-iteration-count: 2; /* If time should change here then please make sure that will also get changed in related JS file: tarb_aq_list. */
      }
      @keyframes finger-swipe-up-animation {
        0% {
          opacity: 0
        }
        25% {
          opacity: 0.8
        }
        50% {
          opacity: 0.8
        }
        100% {
          opacity: 0;
          top: 150px
        }
      }

  /* Bargraphs for elements */
    .tx-tritonlab .evaluation .bar {
      /* width: 200px; */
      /* height: 10px; */
      /* margin: 20px 0 */
    }
    .tx-tritonlab .evaluation .bar-uni {
      opacity: 0.8;

      background-image: -webkit-linear-gradient(90deg, green, #ff0, red);
      background-image: -moz-linear-gradient(90deg, green, #ff0, red);
      background-image: -ms-linear-gradient(90deg, green, #ff0, red);
      background-image: -o-linear-gradient(90deg, green, #ff0, red);
      background-image: linear-gradient(90deg, green, #ff0, red)
    }
    .tx-tritonlab .evaluation .bar-bi {
      opacity: 0.8;

      background-image: -webkit-linear-gradient(90deg, red, #ff0, green, #ff0, red);
      background-image: -moz-linear-gradient(90deg, red, #ff0, green, #ff0, red);
      background-image: -ms-linear-gradient(90deg, red, #ff0, green, #ff0, red);
      background-image: -o-linear-gradient(90deg, red, #ff0, green, #ff0, red);
      background-image: linear-gradient(90deg, red, #ff0, green, #ff0, red)
    }
    .tx-tritonlab .evaluation .pointer {
      opacity: .25;
      color: #000
    }
    .evaluation .pointer-bi,
    .tx-tritonlab .evaluation .pointer-uni {
      margin-left: -6px;
      display: inline-block;
      margin-top: 0px
    }

  /* N-DOC: N-NO3 bargraph */
    #elems-no3-n-relation-bar {
      width: 200px;
      height: 10px
    }
    .vertical-state-bar-item-soll {

      height: 10px;
      width: 100%;
      transition: all .5s;
      position: relative;
      background-image: linear-gradient(to right, red, red 6%, yellow 23%, yellow 40%, green 57%, green 76%, yellow 95%, yellow)
    }
    .vertical-state-bar-item {
      transition: all .5s;
      position: relative
    }
    .vertical-state-bar-item span {
      position: absolute;
      bottom: -30px;
      left: 0;
      font-weight: 700
    }
    .vertical-state-bar-item:last-child span {
      right: 0;
      left: inherit;
      white-space: nowrap
    }
    #state-no3-pointer {
      top: -29px;
      right: -11px;
      z-index: 1;
      left: none;
      left: auto;
      font-size: 16px;
      color: black
    }
    .subcols-special {
      margin-bottom: 10px
    }
    .subcols-special:before,
    .subcols-special:after {
      content: ' ';
      display: table
    }

  /* "Help" & "Dose" */
    .advice-detection,
    .ah-detection {
      padding-left: 10px;
      margin: 11px 0 11px 0
    }
    .advice-measures,
    .ah-measures {
      padding-left: 10px;
      margin: 11px 0 11px 0
    }
    .advice-measures .fas.fa-exclamation-triangle {
      position: relative;
      margin-right: 10px;
      font-size: 1.1em;
      color: #cf5828;
      -webkit-text-fill-color: #cf5828
    }
    .advice-measures-daily {
      padding-left: 10px;
      margin: 11px 0 11px 0
    }
    .ah-item .fab,
    .ah-item .fas,
    .advice-item .fab,
    .advice-item .fas {
      position: absolute;
      color: #599790
    }
    .ah-item .fab,
    .advice-item .fab {
      font-size: 1.5em
    }
    .ah-item .fas,
    .advice-item .fas {
      font-size: 1.3em
    }

    /* Stars used in "Dose" */
      svg {
        max-height: 100%;
        overflow: hidden
      }
      .icon {
        height: 17px;
        width: 110px;
        vertical-align: middle;
        margin: 10px 0 12px;
        opacity: 0.8
      }
      .dosage-block-head {
        display: block
      }
      @media screen and (max-width:840px) {
        .dosage-block-head,
        .shop-product-btn {
          text-align: center
        }
      }

    .text-missing {
      font-style: italic;
      color: #d3d3d3
    }
    .filtered {
      display: none
    }
    .aqua-dosage-box {
      margin-right: 5px;
      display: block;
      float: left;
      font-size: 20px;
      font-weight: 700;
      text-align: center;
      color: #fff;
      cursor: pointer
    }
    #advice-filter-detection,
    #ah-filter-detection {
      background-color: #207cca
    }
    #advice-filter-measures,
    #ah-filter-measures {
      background-color: green
    }
    .aqua-dosage-box,
    .aqua-helping-box {
      opacity: .5
    }
    .aqua-dosage-box,
    .aqua-helping-box {
      min-width: 39px;
      min-height: 39px
    }

  /* Chart box in visual tab */
    .chart-box,
    .chart-box-download,
    .chart-box-reset {
      /* margin: 5px;
      padding: 20px;
      display: block;
      float: left;
      font-size: 20px;
      font-weight: 700;
      text-align: center;
      background-color: grey;
      color: #fff;
      cursor: pointer */
    }
    .chart-box {
      opacity: .5
    }
    .chart-box {
      min-width: 39px;
      min-height: 39px
    }
    .chart-box-download,
    .chart-box-reset {
      /* width: 662px; */
      /* background-color: #007fe2 !important */
    }
    .chart-box-download {
      margin-bottom: 10px !important
    }

  /* Mobile design */
    @media screen and (max-width: 840px) {
      .eval-section-title {
        /* border: none */
      }
      .flex-container {
        display: block;
        margin: 10px auto;
        padding: 3px 3px 8px 3px;
        max-width: 300px
      }
      .eval-section-title,
      .dashboard-item p,
      .select-selected,
      .select-selected:after,
      .select-items {
        text-align: center
      }
      .tx-tritonlab #ds-tabmenu-1 {
        display: block !important
      }
      .eval-group {
        max-width: 400px;
        margin: 9px auto 0px auto
      }
      .mobile-element {
        text-align: center
      }
      .mobile-element h2,
      .mobile-element p {
        display: inline-block;
        margin-bottom: 0px
      }
      .mobile-element .bar-content-block {
        display: block;
        width: 100%;
        clear: both
      }
      .select-items-expand {
        margin-top: 0px
      }
      .select-items-finger {
        top: 150px;
        background: url(/typo3conf/ext/dstemplate/Resources/Public/Images/finger_swpie_up.png);
        width: 100px!important;
        height: 90px!important;
      }
      .select-items-finger-swipe-up {
        top: 10px;
        opacity: 0
      }
      .tx-tritonlab .bar-bi,
      .tx-tritonlab .bar-uni {
        text-align: left
      }
    }

/* TRITON LAB - Aquaria-list page. */
  /* TRITON agent user data details table */
    .agent-user-data-table{
      font-family: arial, sans-serif;
      border-collapse: collapse;
      width: 100%
    }
    .agent-user-data-table td,
    .agent-user-data-table th {
      border: 1px solid #dddddd;
      text-align: left;
      padding: 8px
    }
    .agent-user-data-table th {
      font-weight: bold
    }
    .agent-user-data-table tr:nth-child(even) {
      background-color: #dddddd
    }

  .aquaria-headlines,
  .tmodal-content h3 {
    text-align: center;
    border-bottom: 1px solid #cf5828;
    color: #cf5828;
    -webkit-text-fill-color: #cf5828;
    margin-top: 50px;
    text-transform: uppercase;
    font-weight: 600 !important;
    font-size: 25px !important;
    line-height: 45px !important
  }
  h1 i, h2 i {
    margin-right: 10px
  }
  #user-id-shown,
  #add-aquarium-btn-quickaction {
    display: block;
    margin: 0 auto;
    text-align: center;
    max-width: 370px;
    margin-top: 6px
  }
  #do-update-now-sentence {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 30px auto
  }
  #modal-bg {
    opacity: 0.8;
    display: block;
    width: 100%;
    background: #fff;
    position: fixed;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    display: none;
  }
  #aq-flex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  #aq-list-history {
    margin-bottom: 38px;
    transition: 0.3s all ease-out
  }
  .latest-evals,
  .unfinished-barcodes {
    display: block;
    width: 100%;
    text-align: center;
    margin-top: 40px
  }
  ul.latest-evals-ul li .button,
  ul.unfinished-barcodes-ul li .button,
  .shop-product-btn .button {
    max-width: 400px;
    overflow: hidden;
    height: auto;
    line-height: 24px;
    font-size: 14px;
  }
  ul.latest-evals-ul .fa-vial {
    font-size: 20px;
    margin-right: 5px;
    vertical-align: middle
  }
  #change-eval-date-format {
    text-align: center;
    font-size: 12px;
    color: #818181;
    -webkit-text-fill-color: #818181
  }
  #change-eval-date-format-link {
    text-decoration: underline;
    cursor: pointer
  }
  .box-aquarium {
    position: relative;
    display: inline-block;
    width: 300px;
    min-height: 400px;
    border: 1px solid #599790;

    margin: 0px 5px;
    margin-bottom: 45px; /*When two-in-a-row tiles -> don't make it smaller than 45px */
    margin-top: 100px;
    background-color: #ffffff;
    font-family: "Noto Sans", sans-serif;
    transition: 0.3s ease-out all
  }
  .box-aquarium-new {
    background-color: #efefef;
  }
  .box-aquarium.subscription-tank {
    background-color: #cf5828;
  }
  .subscription-tank-info {
    color: white;
    -webkit-text-fill-color: white;
    position: relative;
    display: block;
    text-align: center;
    margin-top: 28px;
  }
  .box-aquarium .level-box-1 {
    background: #599790;
    width: 0%;
    height: 100%;
    opacity: 1;
    position: absolute;
    top: 0px;
    z-index: -1;
    transition: 0.3s ease-out all;
  }
  .box-aquarium .level-box-1-content {
    background: #599790;
    margin: auto;
    padding: 0px;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(8%, -50%);
    transform: translate(-50%, -50%);
    width: 260px;
    height: 91%;
    list-style: none;
    opacity: 0;
    overflow: auto;
    -webkit-overflow-scrolling: auto;
    transition: 0.3s ease-out all;
  }
  .box-aquarium .level-box-1-content-new,
  .box-aquarium .level-box-1-content-edit {
    width: 290px
  }
  .box-aquarium .level-box-1 > .level-box-1-content > ul {
    padding: 0px
  }
  .box-aquarium .level-box-1 > .level-box-1-content > ul > li {
    position: relative;
    text-align: center;
    margin-top: 10px;
    border: 1px solid #fff;
    display: block;
    margin: 10px 30px;

    font-size: 14px;
    line-height: 25px;
    color: #fff;
    -webkit-text-fill-color: #fff;
    height: 40px;
    line-height: 40px
  }
  .box-aquarium .level-box-1 > .level-box-1-content > ul > li.back-to-eval-types {
    min-height: 40px;
    height: auto;
    line-height: inherit;
    padding: 7px
  }
  .box-aquarium .level-box-1 > .level-box-1-content > ul > li a {
    display: block;
    color: #ffffff;
    -webkit-text-fill-color: #ffffff
  }
  .box-aquarium .level-box-1 > .level-box-1-content > ul > li a:hover {
    color: #cf5828;
    -webkit-text-fill-color: #cf5828;
    text-decoration: none
  }
  .box-aquarium .level-box-1 > .level-box-1-content > ul > li:hover {
    border: 1px solid #cf5828;
    color: #cf5828;
    -webkit-text-fill-color: #cf5828;
    background-color: #fff;
    cursor: pointer
  }
  .box-aquarium .level-box-1 .level-box-1-content > ul > li .fal {
      padding: 0px 3px;
  }
  .box-aquarium .level-box-1 > .level-box-1-content > input, .box-aquarium .level-box-1 > .level-box-1-content > select {
    display: block;
    margin: 0 auto;
    border: none;
    font-size: 14px;
    width: 170px;
    padding: 2px 5px;
    line-height: 25px;
    text-align: center
  }
  .box-aquarium .level-box-1 > .level-box-1-content-new > input,
  .box-aquarium .level-box-1 > .level-box-1-content-new > select,
  .box-aquarium .level-box-1 > .level-box-1-content-edit > input,
  .box-aquarium .level-box-1 > .level-box-1-content-edit > select {
    width: 235px;

    height: 40px
  }
  .box-aquarium .level-box-1 > .level-box-1-content-new > input.error,
  .box-aquarium .level-box-1 > .level-box-1-content-new > select.error,
  .box-aquarium .level-box-1 > .level-box-1-content-edit > input.error,
  .box-aquarium .level-box-1 > .level-box-1-content-edit > select.error {
    color: #fff;
    -webkit-text-fill-color: #fff;
    background-color: #9c51a9
  }
  .box-aquarium .level-box-1 > .level-box-1-content > select {
    width: 180px;
    height: 40px;
    /*
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;

    border: none;
    background-image: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23444' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>");
    background-position: 100% 50%;
    background-repeat: no-repeat
    */
  }
  .box-aquarium .level-box-1 > .level-box-1-content-new > select,
  .box-aquarium .level-box-1 > .level-box-1-content-edit > select {
    width: 235px
  }
  .box-aquarium .level-box-1 > .level-box-1-content > textarea {
    width: 265px;
    margin: 0px auto;
    display: block;
    font-size: 14px;
    font-family: "Noto Sans", sans-serif;
    resize: none;
    border: none
  }
  .box-aquarium .level-box-1 > .level-box-1-content > p {
    color: #fff;
    -webkit-text-fill-color: #fff;
    text-align: center;
  }
  .box-aquarium .level-box-1 > .bc-connect-loader {
    display: none;
    margin: 0 auto;
    text-align: center;
    font-size: 40px;
    color: #fff;
    -webkit-text-fill-color: #fff;
    opacity: 0;
    margin-top: -8px;
    transition: 0.3s ease-out all;
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0px;
    background: rgb(0 0 0 / 52%);
    padding: 61% 43%;
  }
  
  /* Box glow animation */
    /*
    .aquarium-created {
      background-image: url(https://www.triton.de/fileadmin/test/glitter.gif);
      background-repeat: no-repeat;
      background-position: center;
      background-size: 435px;
      position: absolute;
      width: 600px;
      height: 300px;
      margin-left: -150px;
      bottom: -5px
    }*/

    @keyframes box-glow-animation {
      0% {
        /* in order: x offset, y offset, blur size, spread size, color */
        /* blur size and spread size are optional (they default to 0) */
        box-shadow: 0px 0px 0px 0px #ff8100;
      }
      25% {
        box-shadow: 0px 0px 40px 20px #ff8100;
      }
      100% {
        box-shadow: 0px 0px 0px 0px #ff8100;
      }
    }
    
    .aquarium-created {
      animation-name: box-glow-animation;
      animation-duration: 1s;
      animation-iteration-count: 3
    }

    #slides-container #slides .slide .fa-circle-notch {
      font-size: 40px;
      color: #cf5828;
      -webkit-text-fill-color: #cf5828
    }

  .box-bg-image {
    display: inline-block;
    height: 100px;
    position: absolute;
    top: -103px;
    margin-left: 23px;
  }
  .box-aquarium h3 {
    all: unset;
    display: block;
    font-size: 18px;
    font-weight: 300;
    margin: 20px 0px;
    padding: 15px 10px 0px 10px;
    color: #599790;
    -webkit-text-fill-color: #599790;
    text-align: center;
    font-family: "Noto Sans", sans-serif;
    overflow: hidden;
    height: 48px
  }
  .box-aquarium-new h3 {
    color: #009685;
    -webkit-text-fill-color: #009685;
    height: auto
  }
  .box-label {
    display: block;
    width: 100px;
    height: 100px;
    border: 1px solid #599790;
    margin: 0 auto;
    margin-top: -50px;
    transform: rotate(45deg);
    z-index: 2;
    background-color: white;
    text-align: center;
    transition: 0.3s ease-out all;
    line-height: normal
  }
  .box-aquarium.subscription-tank h3,
  .box-aquarium.subscription-tank .infobox .fal {
    color: white;
    -webkit-text-fill-color: white;
  }
  .box-label.minified {
    transform: rotate(0deg);
    margin-top: -52px;
    height: 52px;
  }
  .box-label.minified .letter {
    font-size: 22px;
  }
  .box-label {
    color: #599790;
    -webkit-text-fill-color: #599790;
  }
  .box-label .letter {
    font-size: 55px;
  }
  .infobox {
    display: block;
    text-align: center
  }
  .infobox,
  .infobox .fal {
    color: #599790;
    -webkit-text-fill-color: #599790;
  }
  .box-aquarium .action-buttons.action-buttons-connect-bc,
  .box-aquarium .action-buttons.action-buttons-create-aq {
    all: unset;
    display: block;
    text-align: center;
    opacity: 1;
    transition: 0.3s ease-out all
  }
  .box-aquarium .level-box-1 > .level-box-1-content > #input-bc,
  .box-aquarium .level-box-1 > .level-box-1-content > .barcodes-list {
    font-family:'Andale Mono Regular' !important;
    font-weight:normal !important
  }
  .box-aquarium .level-box-1 > .level-box-1-content > ul.barcodes-list > li {
    text-align: left;
    padding-left: 22px
  }
  .infobox .fal {
    font-size: 1em;
  }
  .infobox span {
    font-size: 24px;
    font-family: "Noto Sans", sans-serif;
    margin-top: -10px;
    padding-left: 5px;
  }
  .action-buttons-wrapper {
    position: relative;
  }
  .action-buttons {
    display: block;
    margin-top: 20px;
    color: #676666;
    -webkit-text-fill-color: #676666
  }
  .action-buttons div {
    position: relative;
    width: 165px;
    margin: 3px auto;
    padding: 7px;
    min-width: 20px;
    font-size: 14px;
    background-color: #fff;

    box-shadow: 0 0.46875rem 1.1875rem rgb(4 9 20 / 10%), 0 0.5375rem 0.40625rem rgb(4 9 20 / 10%), 0 0.25rem 0.13125rem rgb(4 9 20 / 10%), 0 0.125rem 0.0875rem rgb(4 9 20 / 10%);
    transition: 0.1s ease-out all;
  }
  .action-buttons div:hover {
    width: 200px;
    background: #fff;
    color: #cf5828;
    -webkit-text-fill-color: #cf5828;
    cursor: pointer;

    opacity: 1;
  }
  .action-buttons div > i.fal {
    position: absolute;
    right: 0px;
    top: 11px
  }
  .action-buttons div > i.fal.fa-plus {
    right: 2px
  }
  .level-box-1-content-edit .action-buttons {
    margin-top: 0px
  }
  .action-buttons .fal.fa-plus-circle {
    min-width: 19px 
  }
  .action-buttons .fal::before,
  .action-buttons .far::before {
    padding-right: 14px
  }
  /* Finger points to the create-aq button with animation */
    .action-buttons .create-aq-finger {
      font-size: 30px;
      position: absolute;
      left: 90px;
      top: 5px;
      -webkit-animation: createAqFingerAnimation 5s infinite;
      -moz-animation: createAqFingerAnimation 5s infinite;
      -o-animation: createAqFingerAnimation 5s infinite;
      animation: createAqFingerAnimation 5s infinite;
    }
    @keyframes createAqFingerAnimation {
      0%   { opacity:0.5; left: 70px }
      15%  { opacity:1; left: 90px }
    }
    @-o-keyframes createAqFingerAnimation {
      0%   { opacity:0.5; left: 70px }
      15%  { opacity:1; left: 90px }
    }
    @-moz-keyframes createAqFingerAnimation {
      0%   { opacity:0.5; left: 70px }
      15%  { opacity:1; left: 90px }
    }
    @-webkit-keyframes createAqFingerAnimation {
      0%   { opacity:0.5; left: 70px }
      15%  { opacity:1; left: 90px }
    }
  .coral-stamp {
    background-repeat: no-repeat;
    /*
    background-position: 229px 193px;
    background-size: 71px;
    */
    background-position: 220px 100%;
    background-size: 105px;
  }
  /* .coral-stamp-1 {
    background-image: url("/typo3conf/ext/dstemplate/Resources/Public/Images/Triton-lab/Aquaria-list/Corals/coral-stamp_01.png");
  }
  .coral-stamp-2 {
    background-image: url("/typo3conf/ext/dstemplate/Resources/Public/Images/Triton-lab/Aquaria-list/Corals/coral-stamp_02.png");
  }
  .coral-stamp-3 {
    background-image: url("/typo3conf/ext/dstemplate/Resources/Public/Images/Triton-lab/Aquaria-list/Corals/coral-stamp_03.png");
  }
  .coral-stamp-4 {
    background-image: url("/typo3conf/ext/dstemplate/Resources/Public/Images/Triton-lab/Aquaria-list/Corals/coral-stamp_04.png");
  }
  .coral-stamp-5 {
    background-image: url("/typo3conf/ext/dstemplate/Resources/Public/Images/Triton-lab/Aquaria-list/Corals/coral-stamp_05.png");
  }
  .coral-stamp-6 {
    background-image: url("/typo3conf/ext/dstemplate/Resources/Public/Images/Triton-lab/Aquaria-list/Corals/coral-stamp_06.png");
  }
  .coral-stamp-7 {
    background-image: url("/typo3conf/ext/dstemplate/Resources/Public/Images/Triton-lab/Aquaria-list/Corals/coral-stamp_07.png");
  }
  .coral-stamp-8 {
    background-image: url("/typo3conf/ext/dstemplate/Resources/Public/Images/Triton-lab/Aquaria-list/Corals/coral-stamp_08.png");
  } */

  .close {
    position: absolute;
    right: 0px;
    top: -27px;
    display: none;
    width: 24px;
    height: 24px;
    opacity: 0;
    z-index: 1;
    background: #cf5828;

  }
  .close:hover {
    cursor: pointer;
    opacity: 1 !important;

    border: 2px solid #cf5828;
    background: #fff;
    width: 24px;
    top: -27px;
    height: 24px;
  }
  .close:before, .close:after {
    position: absolute;
    left: 11px;
    top: 5px;
    content: ' ';
    height: 11px;
    width: 0px;
    border: 1px solid #fff;
    background: #fff;
  }
  .close:before {
    transform: rotate(45deg);
  }
  .close:after {
    transform: rotate(-45deg);
  }
  .close:hover:before,
  .close:hover:after{
    border: 1px solid #cf5828;
    background: #cf5828;
    top: 3px;
    left: 9px;
  }

  .scroller{
    scrollbar-color: #cf5828 #fff;
    scrollbar-width: thin
  }
  .scroller::-webkit-scrollbar {
    width: 8.5px;
  }
  .scroller::-webkit-scrollbar-track {
    background: white;
  }
  .scroller::-webkit-scrollbar-thumb {
    background: #cf5828;
    border: 2px solid white;
  }

/* TRITON LAB - Profile page */
  /* Deactivated */
    /* Social auth */
      /*
      #socialauth form{display:inline-block}
      */
    /* Maintain access to external providers to use my data. */
      /*
      #content button.disconntect{background:#555;border:1px solid #555;margin:0 0 0 10px}
      #content button.disconntect:hover,#content button.disconntect:focus{background:transparent;color:#555; -webkit-text-fill-color: #555}
      .togglearea{margin-bottom:40px;max-width:640px}
      .togglearea h2{font-weight:400;font-size:18px;line-height:34px;border-bottom:2px solid #999}
      .togglearea h2 i{display:none}
      #content button.conntect{margin:0}
      #content .tx-tritonlab button.conntect.api {background:#f28220;border-color:#f28220}
      */
    /* Allow login via social media accounts like facebook */
      /*
      #socialconnect th{line-height:30px;height:30px;padding:0;width:120px;color:#999; -webkit-text-fill-color: #999}
      #socialconnect th,#socialconnect td{text-align:left}
      #socialconnect .fa-check-circle{color:#019c72; -webkit-text-fill-color: #019c72}
      #socialconnect button i,#neptunesystems button i{margin-right:6px}
      #content #socialauth-facebook,#content #socialauth-gplus{margin-bottom:7px;margin-top:0;border:0}
      #content #socialauth-facebook,#content .tx-tritonlab button.conntect.facebook{background:#4267b2}
      #content #socialauth-gplus,#content .tx-tritonlab button.conntect.gplus{background:#dd4b3c}
      #content #socialauth-gplus:hover,#content #socialauth-gplus:focus,#content #socialauth-facebook:hover{background-color:#333!important;color:#fff; -webkit-text-fill-color: #fff}
      #content #socialauth-facebook:focus,#content .tx-tritonlab button.conntect:hover,#content .tx-tritonlab button.conntect:focus{color:#fff; -webkit-text-fill-color: #fff}
      .tx-tritonlab .copyinputwrap{position:relative;display:block}
      .tx-tritonlab .copyinputcontent{position:absolute;right:7px;top:28px;height:23px;margin:0;border:0;background:#cf5829;color:#fff; -webkit-text-fill-color: #fff;font-size:10px;padding:0 9px;transition:.3s all}
      .tx-tritonlab .copyinputcontent:hover,.tx-tritonlab .copyinputcontent:focus{background:#333}
      .tx-tritonlab .copyedcontent{background:#383;padding:0 10px;color:#fff; -webkit-text-fill-color: #fff;font-size:10px;position:absolute;right:-60px;top:28px;height:23px;line-height:23px;opacity:0;transition:.5s all}
      .tx-tritonlab .copyedcontent.show{transition:none;opacity:1}
      .tx-tritonlab #apigatekey{width:calc(100% - 87px);margin:0;height:15px;border:0;padding:7px 80px 7px 7px;outline:0;color:#000; -webkit-text-fill-color: #000}
      .tx-tritonlab #apigatekey:focus{background:#eee}
      .tx-tritonlab #profile-edit #fe_apigatekey{max-width:none;padding-right:70px;width:calc(100% - 82px)}
      @media screen and (max-width:767px) {
        .tx-tritonlab #fe_apigatekey{max-width:calc(100% - 83px)}
        .tx-tritonlab #apigatekey{height:61px}
        .tx-tritonlab .copyinputcontent{top:35px}
        .tx-tritonlab .copyedcontent{right:0;top:-3px}
      }
      */

  /* Maintain profile data */
    .profile-headlines {
      text-align: center;
      font-size: 25px !important
    }
    #profile-data {
      margin-left:auto; 
      margin-right:auto;
      margin-bottom: 50px
    }
    #profile-data th {
      font-weight: normal;
      text-align: right;
      color: #999;
      -webkit-text-fill-color: #999
    }
    .passwordRequirements {
      color: #888;
      -webkit-text-fill-color: #888;
      border: 1px solid #888;
      background: #f9f9f9;
      padding: 5px 10px;
      margin-bottom: 20px;
      font-weight: 400
    }
    #profile-edit {
      display: block;
      margin: 0 auto;
      text-align: center;
      margin: 10px 0px 50px 0px;
      transition: 0.3s ease-out all
    }
    #profile-edit textarea {
      height: 100px
    }
    .successUpdate,
    .errorUpdate {
      padding: 5px 10px;
      margin-bottom: 12px;
      font-weight: 400
    }
    .successUpdate {
      color: #080;
      -webkit-text-fill-color: #080;
      border: 1px solid #080;
      background: #f1fbf1
    }
    .errorUpdate {
      color: #e00;
      -webkit-text-fill-color: #e00;
      border: 1px solid #e00;
      background: #fbf1f1
    }
    .passwordRequirements {
      color: #888;
      -webkit-text-fill-color: #888;
      border: 1px solid #888;
      background: #f9f9f9;
      padding: 5px 10px;
      margin-bottom: 20px;
      font-weight: 400
    }
    .passwordRequirements ul {
      list-style: disc;
      padding-left: 20px
    }
    .tx-tritonlab .successUpdate,
    .tx-tritonlab .errorUpdate {
      padding: 5px 10px;
      margin-bottom: 12px;
      font-weight: 400;
      max-width: 500px;
      text-align: center;
      display: block;
      margin: 20px auto
    }
    .tx-tritonlab .successUpdate {
      color: #080;
      -webkit-text-fill-color: #080;
      border: 1px solid #080;
      background: #f1fbf1
    }
    .tx-tritonlab .errorUpdate {
      color: #e00;
      -webkit-text-fill-color: #e00;
      border: 1px solid #e00;
      background: #fbf1f1
    }
    .tx-tritonlab .passwordRequirements {
      color: #888;
      -webkit-text-fill-color: #888;
      border: 1px solid #888;
      background: #f9f9f9;
      padding: 5px 10px;
      margin-bottom: 20px;
      font-weight: 400
    }

/* Eval page */
  .eval-headlines {
    text-align: center;
    font-size: 25px !important;
    margin: 25px 0px
  }
  .button-back-to-list {
    margin: 0px auto;
    display: block;
    height: 40px;
    line-height: 40px
  }
  .button-back-to-list.margin-50 {
    margin: 50px auto;
  }
  /* Evaluation table */
    .tx-tritonlab .evaluation table {

      border-collapse: initial;
      table-layout: fixed;
      margin-top: 10px;
      width: 100%;
      border: 1px solid #e7e4e4
    }
    .tx-tritonlab .eval-group:nth-of-type(n+2) {
      margin-top: 80px
    }
    .tx-tritonlab .evaluation thead {
      font-weight: 400 !important;
      font-size: 23px !important;
      line-height: 20px;
      color: #599790;
      -webkit-text-fill-color: #599790;
      text-align: center !important
    }
    .tx-tritonlab .evaluation tbody tr {
      height: 50px;
      font-size: 14px
    }
    .tx-tritonlab .evaluation th:first-child,
    .tx-tritonlab .evaluation td:first-child {
      width: 6%
    }
    .tx-tritonlab .evaluation th:nth-child(2),
    .tx-tritonlab .evaluation td:nth-child(2) {
      width: 15%
    }
    .tx-tritonlab .evaluation th,
    .tx-tritonlab .evaluation td {
      width: 20%
    }
    .tx-tritonlab .evaluation th {
      padding: 14px 0px;
      font-size: 16px
    }
    .tx-tritonlab .evaluation tbody tr:nth-child(even) {
      background: #f5f5f5
    }
    .tx-tritonlab .evaluation tbody tr td {
      vertical-align: middle;
      line-height: 27px;
      color: #5f5d5d;
      -webkit-text-fill-color: #5f5d5d
    }
    .tx-tritonlab .evaluation tbody tr td:nth-child(-n+4) {
      text-align: center
    }

    /* Periodic table elements */
      .pt-elem {
        display: block;
        margin: 6px 3px 6px 10px;
        padding: 2px;
        position: relative;
        width: 63px;
        height: 63px;
        overflow: hidden;
        text-align: center;
        font-size: 20px;
        font-weight: 700;
        color: #599790;
        -webkit-text-fill-color: #599790;
        /*background-color: #F9EC31;*/
        border: 1px solid #599790;
        /* border-radius: 5px */
        /*border-color: #FFFFFF;*/
        /* */
        /* */
        /* */
      }

      .pt-elem .atomic-number {
          position: absolute;
          top: -3px;
          left: 0px;
          width: 100%;
          font-size: 10px
      }
      
      .pt-elem .atomic-sign {
          position: absolute;
          top: 19px;
          left: 0px;
          width: 100%;
          line-height: 90%;
          font-weight: bold
      }
      
      .pt-elem .atomic-name, .pt-elem .atomic-weight {
          font-size: 7.5px;
          position: absolute;
          left: 0px;
          width: 100%
      }
      
      .pt-elem .atomic-name {
        /* top: 41px; */
        display: none
      }
      .pt-elem .atomic-weight {
        top: 39px
      }

  /* Tab menü and tab content */
    .tx-tritonlab .ds-tabs {
      margin: 10px 0;
      padding: 10px 0
    }
    .tx-tritonlab .ds-tab {
      display: none
    }
    .tx-tritonlab .ds-tab.active {
      display: block
    }
    .tx-tritonlab #ds-tabmenu-1/*,
    .tx-tritonlab #ds-subtabmenu-1*/ {  /* (TARB-CODE-2011181034) */
      display: flex;
      flex-direction: row;
      text-align: center !important
    }
    /* (TARB-CODE-2011181034) 
    .tx-tritonlab #ds-subtabmenu-1 {
      border: 3px solid #009686
    }
    .tx-tritonlab #ds-subtabmenu-1 button.active {  
      color: #009686;
      -webkit-text-fill-color: #009686;
      pointer-events: none
    }
    .tx-tritonlab #ds-subtabmenu-1 button.active:focus {  
      background: none
    }
    .tx-tritonlab #ds-subtabmenu-1 button.active:hover {  
      background: none;
      color: #009686;
      -webkit-text-fill-color: #009686
    }
    .tx-tritonlab #ds-subtabmenu-1.hide { 
      display: none !important
    }
    */
    .tx-tritonlab .ds-tabmenu button {
      flex-grow: 1;
      padding: 10px 20px;
      border: none;
      outline: 0;
      box-shadow: none;
      font-weight: 400 !important;
      font-size: 16px !important;
      line-height: 20px;
      background-color: #fff;

      color: #444;
      -webkit-text-fill-color: #444;
      border: 1px solid #fff
    }
    .tx-tritonlab .ds-tabmenu button:hover:not(:focus):not(.active) {
      color: #599790;
      -webkit-text-fill-color: #599790;
      border: 1px solid #599790
    }
    .tx-tritonlab .ds-tabmenu button i {
      color: #599790;
      -webkit-text-fill-color: #599790
    }
    .tx-tritonlab #ds-tabmenu-1 {
      margin-top: 5px
    }
    .tx-tritonlab #ds-tabmenu-1 button.active {
      color: #599790;
      -webkit-text-fill-color: #599790;
      border: 1px solid #599790;
      cursor: auto
    }
    .tx-tritonlab .ds-tabmenu button.active:hover {
      /* color: #fff!important; */
      /* -webkit-text-fill-color: #fff!important; */
      /* background: #599790 */
    }

  /* Allow socials in cookie-banner */
    .tx-tritonlab #socials span {
      display: block;
      padding: 5px;
      background: #f3f3f3;
      color: #000;
      -webkit-text-fill-color: #000;
      width: 155px;
      text-align: center;
      font-weight: 700;
      font-size: 9px;
      margin-bottom: 10px
    }
    .tx-tritonlab #socials a {
      margin-left: 10px
    }
    .tx-tritonlab #socials iframe {
      height: 25px;
      margin-top: 5px
    }

  /* Help & Dosage */
    .tx-tritonlab .ah-detection,
    .tx-tritonlab .ad-detection {
      padding-left: 10px;
      margin: 11px 0
    }
    .tx-tritonlab .ah-measures,
    .tx-tritonlab .ad-measures {
      padding-left: 10px;
      margin: 11px 0
    }
    .tx-tritonlab .ad-measures-daily {
      padding-left: 10px;
      margin: 11px 0
    }
    .tx-tritonlab #lead-sentence {
      padding: 13px 0px;
      padding-bottom: 35px;
      display: none
    }
    .tx-tritonlab .ecs-block,
    .tx-tritonlab .dosage-block {
      border-top: 1px solid #009685
    }
    .tx-tritonlab .dosage-block span,
    .tx-tritonlab .ecs-block span {
      /* background:#009686; */
      color: #009686;
      -webkit-text-fill-color: #009686;
      padding: 6px;
      width: 45px;
      text-align: center;
      display: block;
      border: 1px solid #009686;
      margin-top: -1px;
    }
    .tx-tritonlab .ecs-block .ah-item p,
    .tx-tritonlab .dosage-block .advice-item p {
      line-height: 26px;
      margin-left: 33px;
      border-left: 1px solid #c3c3c3;
      padding-left: 8px
    }
    .tx-tritonlab .ecs-block .fal.fa-siren-on {
      font-size: 20px
    }
    .tx-tritonlab .dosage-block-group {
      margin-bottom: 40px
    }
    .tx-tritonlab .dosage-block-group img {
      display: inline-block;
      vertical-align: middle;
      margin-bottom: 17px
    }
    .tx-tritonlab .dosage-block-group h3, .tx-tritonlab .eval-section h3 {
      display: inline-block;
      font-weight: 400 !important;
      color: #599790;
      -webkit-text-fill-color: #599790;
      /* text-transform: uppercase; */
      /* line-height: 35px; */
      vertical-align: middle;
      margin: 10px 0!important
    }
    .tx-tritonlab .text-missing {
      font-style: italic;
      color: #d3d3d3;
      -webkit-text-fill-color: #d3d3d3
    }

    .tx-tritonlab .no-dosage-available {
      text-align: center
    }

    /*.tx-tritonlab .filtered{display:none}
      .tx-tritonlab .aqua-helping-box,.tx-tritonlab .aqua-dosage-box{margin-right:5px;padding:20px;display:block;float:left;font-size:20px;font-weight:700;text-align:center;background-color:grey;color:#fff;cursor:pointer}
      .tx-tritonlab .aqua-helping-box,.tx-tritonlab .aqua-dosage-box{opacity:.5;float: none;display: inline-block;margin: 0 auto;width: 185px}
      .tx-tritonlab #aqua-helping-filters,.tx-tritonlab #aqua-dosage-filters{overflow:hidden;text-align: center}
      */

  /* Visual tab - Elem chart */
    .tx-tritonlab .chart-box,
    .tx-tritonlab .chart-box-reset,
    .tx-tritonlab .chart-box-download {
      margin: 5px;
      padding: 20px;
      display: block;
      float: left;
      font-size: 16px;
      /* font-weight: 700; */
      text-align: center;
      background-color: #a5a5a5;
      color: #fff;
      -webkit-text-fill-color: #fff;
      cursor: pointer
    }
    .tx-tritonlab .chart-box {
      opacity: .5
    }
    .tx-tritonlab .chart-box {
      min-width: 64px;
      line-height: 0px;
    }
    .tx-tritonlab .chart-box-reset,
    .tx-tritonlab .chart-box-download {
      clear: both;
      padding: 7px 16px!important;


      color: #599790;
      background-color: #fff;
      -webkit-text-fill-color: #599790;
      border: 1px solid #599790;
      cursor: pointer;
    }
    .tx-tritonlab .chart-box-reset:hover,
    .tx-tritonlab .chart-box-download:hover {
      color: #fff;
      -webkit-text-fill-color: #fff;
      background-color: #599790;
      border: 1px solid #599790
    }
    .tx-tritonlab #Elemchart {
      margin-top: 50px;
      border: 1px solid #cf5828
    }

  /* Bargraphs */
    /* Common rule for any bargraph */
      .tx-tritonlab .bar {
        width: 200px;
        height: 7px
        /* margin: 20px 0 */
      }

  /* Bargraphs for test purposes */
    .tx-tritonlab .bar-uni {
      opacity: 0.8;

      background-image: -webkit-linear-gradient(90deg, green, yellow, red);
      background-image: -moz-linear-gradient(90deg, green, yellow, red);
      background-image: -ms-linear-gradient(90deg, green, yellow, red);
      background-image: -o-linear-gradient(90deg, green, yellow, red);
      background-image: linear-gradient(90deg, green, yellow, red)
    }
    .tx-tritonlab .bar-bi {
      opacity: 0.8;

      /* background-image: -webkit-linear-gradient(90deg, red, yellow, green, yellow, red); */
      background-image: -moz-linear-gradient(90deg, red, yellow, green, yellow, red);
      background-image: -ms-linear-gradient(90deg, red, yellow, green, yellow, red);
      background-image: -o-linear-gradient(90deg, red, yellow, green, yellow, red);
      background-image: linear-gradient(90deg, red, yellow, green, yellow, red)
    }
    .tx-tritonlab .pointer {
      opacity: .25;
      color: #000;
      -webkit-text-fill-color: #000
    }
    .tx-tritonlab .pointer-uni,
    .tx-tritonlab .pointer-bi {
      margin-left: -6px
    }

/* Product modal */
  /* The Modal (background) */
    .shop-product-modal {
      visibility: hidden;
      opacity: 0;
      display: flex;
      position: fixed;
      z-index: 11;
      /* padding-top: 80px; */
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      overflow: auto;
      background-color:#fff;
      transition: 0.1s linear all;
    }
    .shop-product-modal-active{
      visibility: visible;
      opacity: 1;
    }
  
  /* Modal Content */
    .shop-product-modal-content {
      position: relative;
      color: #fff;
      -webkit-text-fill-color: #fff;
      margin: auto;
      /*padding: 0;*/
      /*width: 90%;*/
      max-width: 600px;
      /*padding: 15px;*/
      text-align: center;
    }
    .shop-product-modal-content p {
      margin: 12px 0px;
      padding: 0 15px
    }
    .shop-product-modal-content img {
      display: inline-block;
      background-color: #fff;
      /* max-height: 300px; */
    }

    /* Animation for loading image */
      @keyframes flickerAnimation {
        0%   { opacity:0.5; border: 30px solid #d05829; }
        50%  { opacity:0.1; }
        100% { opacity:0.5; }
      }
      @-o-keyframes flickerAnimation {
        0%   { opacity:0.5; border: 30px solid #d05829; }
        50%  { opacity:0.1; }
        100% { opacity:0.5; }
      }
      @-moz-keyframes flickerAnimation {
        0%   { opacity:0.5; border: 30px solid #d05829; }
        50%  { opacity:0.1; }
        100% { opacity:0.5; }
      }
      @-webkit-keyframes flickerAnimation {
        0%   { opacity:0.5; border: 30px solid #d05829; }
        50%  { opacity:0.1; }
        100% { opacity:0.5; }
      }
      .animate-flicker {
        -webkit-animation: flickerAnimation 0.6s infinite;
        -moz-animation: flickerAnimation 0.6s infinite;
        -o-animation: flickerAnimation 0.6s infinite;
        animation: flickerAnimation 0.6s infinite;
        filter: blur(3px);
      }

    .shop-product-modal-content-button {

        box-shadow: 0px 0px 0px 0 rgb(255,255,255,0)
    }
    .shop-product-modal-content-button:hover {
      background-color: #fff
    }
    a.button.shop-product-modal-content-button {
      width: 175px;
    }
    #product-list li {
      background-color: #fff;
      margin: 10px auto;
      text-align: center;
      padding: 20px;
      position: relative;

      border: 1px solid #e7e4e4
    }
    #product-list li img {
      max-height: 250px;
      width: auto;
      margin-bottom: 0px;

      display: block;
      margin: 0 auto;
    }
    #product-list li:hover {
      border: 1px solid #666
    }
    .product-information {
      width: 38%;
      display: inline-block;
      margin: 0 auto;
      cursor: -webkit-zoom-in
    }
    .product-information span {
      margin-top: 20px;
      display: block
    }
    #product-list .product-information i.fas.fa-search-plus {
      display: none
    }
    .products-in-basket {
      display: none;
      position: absolute;
      bottom: 20px;
      right: 57px;
      font-size: 23px;
      min-width: 42px;
      color: #666666;
      -webkit-text-fill-color: #666666
    }
    .products-in-basket .product-amount {
      font-size: 15px;
      vertical-align: top
    }
    .product-actions {
      display: none;
      position: absolute;
      bottom: 0px;
      right: 9px;
      cursor: pointer;
      font-size: 18px;
      min-width: 42px;
      min-height: 77px
    }
    .product-actions i {
      color: #e07950;
      -webkit-text-fill-color: #e07950;
      padding: 5px 0px;
      text-align: center;
      display: block;
      font-size: 21px
    }
    .product-actions i:hover {
      /* animation-name: product-action-icon-zoom-in;
      animation-duration: 0.1s;
      font-size: 25px; */
    }
    /* @keyframes product-action-icon-zoom-in {
      0%   {font-size: 23px;}
      100% {font-size: 25px;}
    } */
    .product-recommend::before {
      content: "";
      z-index: -1;
      overflow: hidden;
      transform: rotate(-135deg);
      width: 120px;
      display: block; 
      background: #009687;
      background: linear-gradient(#44ffed 0%, #009687 100%);
      box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
      position: absolute;
      top: 34px;
      right: -16px;
      clip-path: polygon(120px 20px, 90px -10px, 30px -10px, 0px 20px, 10px 30px,  110px 30px);
      height: 20px;
      width: 120px
    }
    .product-recommend::after {
      content: "important";
      z-index: 1;
      overflow: hidden;
      font-size: 10px;
      font-weight: bold;
      color: #FFF;
      text-transform: uppercase;
      text-align: center;
      line-height: 20px;
      transform: rotate(45deg);
      width: 120px;
      display: block; 
      background: #009687;
      background: linear-gradient(#1dc1b0 0%, #009687 100%);
      box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
      position: absolute;
      top: 20px; right: -30px;
      clip-path: polygon(120px 20px, 90px -10px, 30px -10px, 0px 20px, 10px 30px,  110px 30px)
    }
    @media screen and (max-width: 399px) {
      .shop-product-modal-content img {
        /* max-height: 150px; */
      }
    }

/* Eval page - Mobile */
  .tx-tritonlab .evaluation-mobile {
    display: none
  }
  @media (max-width: 840px) {
    .tx-tritonlab .evaluation-mobile {
      display: block
    }
    .tx-tritonlab .evaluation-desktop {
      display: none
    }
    .tx-tritonlab .mobile-element {
      /* border: 3px solid #009686 !important; */
      border: 1px solid #e7e4e4
    }
    .tx-tritonlab .mobile-element h1 {
      /* background: #009686 !important; */
    }
    .mobile-element h1 {
      font-weight: 400!important;
      font-size: 17px !important;
      margin-top: 10px
    }
    .product-information {
      width: auto
    }
    .product-actions {
      position: initial
    }
    .products-in-basket {
      right: 10px
    }
    #product-list .product-information i.fas.fa-search-plus {
      position: absolute;
      top: 53px;
      right: 142px;
      font-size: 50px;
      color: black;
      opacity: 0.6;
      display: inline-block
    }
  }
  @media screen  and (max-width: 500px) {
    .evaluation-mobile-value {
      padding-bottom: 8px!important;
      float: none;
      display: block
    }
    .icon {
      display: block;
      margin: 0px auto 20px auto;
    }
    .tx-tritonlab .dosage-block, .tx-tritonlab .ecs-block {
      /* border: none; */
    }
  }
  .evaluation-mobile-value {
    padding-bottom: 20px
  }
  .tx-tritonlab .mobile-element {
    /* padding: 20px 20px 0; */
    margin-bottom: 10px;
  }
  .tx-tritonlab .mobile-element .evaluation-mobile-value {
    padding: 0px 10px 27px 10px
  }
  .tx-tritonlab .mobile-element .evaluation-mobile-value h2 {
    padding-right: 5px
  }
  .tx-tritonlab .mobile-element .bar {
    margin: 20px auto
  }
  .tx-tritonlab .mobile-element h1 {
    text-align: center;
    color: #599790;
    -webkit-text-fill-color: #599790
  }
  .tx-tritonlab .mobile-element h2 {
    margin: 0;
    font-size: 14px;
    line-height: 26px
  }
  .tx-tritonlab .mobile-element p {
    font-size: 14px
  }

/* Profile page */
  .tx-tritonlab .profile-submenu {
    text-align: center;
    margin-bottom: 35px
  }
  .tx-tritonlab ul.profile-submenu li {
    text-align: center;
    display: inline-block;
    margin-bottom: 10px
  }

  #premium-fe-user-active {
    display: block;
    margin: 0px auto;
    text-align: center;
    width: auto;
    margin-bottom: 40px;
    background: yellow;
    max-width: 280px;
    padding: 20px;
    text-transform: uppercase;
    font-size: 12px;
  }

  .tx-tritonlab #profile-data tr th {
    font-weight: 400;
    display: block;
    text-align: center
  }
  .tx-tritonlab #profile-data tr td {
    font-weight: 400;
    color: #9a9a9a;
    -webkit-text-fill-color: #9a9a9a;
    display: block;
    text-align: center;
    margin-bottom: 20px;
    border: 1px dashed #999999;
    min-width: 280px;

    font-size: 14px;
    line-height: 30px
  }
  h2#profile-stored-data {
    text-align: center;
    font-size: 20px
  }

/* Profile edit page */
  .tx-tritonlab #profile-edit input,
  .tx-tritonlab #profile-edit textarea,
  .tx-tritonlab #profile-edit select {
    display: inline;
  }
  .tx-tritonlab #profile-edit #update-profile-btn,
  .tx-tritonlab #pw-change-main #send-new-pw,
  .tx-tritonlab #terms-and-conditions,
  .tx-tritonlab #gdpr {
    position: relative;
    margin-top: 12px;
    max-width: 280px;
    height: 100px;
    margin: 0 auto;
  }
  #email-validation-notification .button,
  .tx-felogin-pi1 .button,
  .tx-tritonlab #profile-edit .button,
  .tx-tritonlab #pw-change-main .button,
  .tx-tritonlab .profile-submenu .button,
  .tx-tritonlab #aq-list-history .button,
  .tx-tritonlab #user-id-shown.button,
  .tx-tritonlab .eval-section .button,
  .tx-tritonlab #shop-product-modal .button,
  #profileModal .button,
  #add-aquarium-btn-quickaction {
    transition: 0.3s ease-out all;
    height: 40px !important;
    line-height: 40px;
  }
  .tx-tritonlab #profile-edit label,
  .tx-tritonlab #aq-maintain label {
    color: #ce5828;
    -webkit-text-fill-color: #ce5828;
    vertical-align: top;
    padding-top: 4px
  }
  .tx-tritonlab #profile-edit button,
  .tx-tritonlab #aq-maintain button {
    outline: 0
  }
  .tx-tritonlab #profile-edit .required,
  .tx-tritonlab #aq-maintain .required {
    color: red;
    -webkit-text-fill-color: red;
    font-weight: 700
  }
  .tx-tritonlab #profile-edit input.error,
  .tx-tritonlab #profile-edit input.error::placeholder {
    color: #f3665c;
    -webkit-text-fill-color: #f3665c;
    font-weight: 700;
  }
  .tx-tritonlab #profile-edit input.error {
    border: 1px solid #f3665c;
  }
  .tx-tritonlab #profile-edit .bc-connect-loader {
    display: none;
    opacity: 0;
    position: absolute;
    top: 15px;
    left: 119px;
    font-size: 40px;
    color: #e07950;
    -webkit-text-fill-color: #e07950;
    transition: 0.3s ease-out all
  }

/* Profile password page and register page  */
  #pw-change-main {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 500px;
    text-align: center;
    /*border: 1px solid black;*/
    padding-top: 20px;
    color: #212529;
    -webkit-text-fill-color: #212529;
    min-height: 600px;
  }
  #pw-change-main h1 {
    margin-bottom: 25px;
    font-size: 25px
  }
  #pw-change-main p {
    font-size: 12px;
    line-height: 18px;
    margin: 12px 0px 0px 0px
  }
  #pw-change-main .button {
    height: 40px;
    background: #e07950;
    border-color: #e07950;
    color: white;
    -webkit-text-fill-color: white;
    line-height: 16px
  }
  #pw-change-main .button:hover {
    background: transparent !important;
    color: #e07950;
    -webkit-text-fill-color: #e07950
  }
  #pw-change-main .fa-user-robot {
    font-size: 15px
  }
  #pw-change-main #pw-form {
    margin-bottom: 20px
  }
  #pw-change-main #pw-form .input-field {
    position: relative
  }
  #pw-change-main #pw-form input.error,
  #pw-change-main #pw-indicator p#suggestion.error {
    color: #f3665c;
    -webkit-text-fill-color: #f3665c;
    font-weight: 700
  }
  #pw-change-main #pw-form input.error {
    border: 1px solid #f3665c;
  }
  #pw-change-main #pw-form input[type="password"] {
    letter-spacing: 3px
  }
  #pw-change-main #pw-form input[type="password"]::placeholder {
    letter-spacing: 0px
  }
  #pw-change-main #pw-form span.left {
    position: absolute;
    top: 10px;
    width: 16px;
    margin-left: -17px;
    margin-top: 3px;
    font-size: 10px
  }
  #profile-edit span.left.error {
    color: #f3665c;
    -webkit-text-fill-color: #f3665c
  }
  #profile-edit .input-field{
    position: relative
  }
  #profile-edit i.fa-check-circle-input {
    position: absolute;
    display: inline-block;
    top: 33px;
    margin-left: -26px;
    color: green;
    -webkit-text-fill-color: green
  }
  #profile-edit i.fa-check-circle-submit,
  #pw-change-main i.fa-check-circle-submit {
    display: inline-block;
    margin-top: 15px;
    color: #e07950;
    -webkit-text-fill-color: #e07950;
    font-size: 35px
  }
  #pw-change-main #pw-form i.checkmark,
  #pw-change-main #pw-form i.pw-hidden-option {
    position: absolute;
    display: inline-block;
    top: 33px;
    margin-left: -30px;
    cursor: pointer;
    color: #424950;
    -webkit-text-fill-color: #424950
  }
  #pw-change-main #pw-form i.pw-hidden-option.error {
    color: #f3665c;
    -webkit-text-fill-color: #f3665c
  }
  #pw-change-main #pw-indicator {
    display: block;
    max-width: 280px;
    width: 100%;
    margin: 0 auto;
    transition: 0.3s ease-out all;
    min-height: 90px
  }
  #pw-change-main #pw-indicator .faded-out {
    opacity: 0.3
  }
  #pw-change-main #pw-indicator .pw-ind-level {
    display: inline-block;
    position: relative;
    height: 5px;
    width: 66px;
    border: 1px solid #dedede;
    transition: 0.3s ease-out all
  }
  #pw-change-main #pw-indicator .pw-ind-level span {
    display: inline-block;
    position: absolute;
    left: 24px;
    top: -11px;
    font-size: 25px;
    opacity: 0;
    transition: 0.3s ease-out all
  }
  #pw-change-main #send-new-pw, .tx-felogin-pi1 #submit-login {
    position: relative;
    margin-top: 12px;
    max-width: 280px;
    margin: 0 auto
  }
  #pw-change-main #send-new-pw button, .tx-felogin-pi1 #submit-login button {
    transition: 0.3s ease-out all;
    word-break: break-word
  }
  #pw-change-main #send-new-pw .bc-connect-loader, .tx-felogin-pi1 #submit-login .bc-connect-loader {
    display: none;
    opacity: 0;
    position: absolute;
    top: 15px;
    left: 119px;
    font-size: 40px;
    color: #e07950;
    -webkit-text-fill-color: #e07950;
    transition: 0.3s ease-out all
  }
  #terms-and-conditions label,
  #terms-and-conditions p,
  #gdpr label,
  #gdpr p {
    display: inline
  }
  #terms-and-conditions,
  #gdpr {
    height: auto !important
  }

  /* Animation confetti when succesfully registered */
    @keyframes confetti-slow {
      0% {
        transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
      }
      100% {
        transform: translate3d(25px, 105vh, 0) rotateX(360deg) rotateY(180deg);
      }
    }
    @keyframes confetti-medium {
      0% {
        transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
      }
      100% {
        transform: translate3d(100px, 105vh, 0) rotateX(100deg) rotateY(360deg);
      }
    }
    @keyframes confetti-fast {
      0% {
        transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
      }
      100% {
        transform: translate3d(-50px, 105vh, 0) rotateX(10deg) rotateY(250deg);
      }
    }
    .con-con {
      perspective: 700px;
      position: absolute;
      overflow: hidden;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      transition: 0.3s ease-out all
    }
    .conft {
      position: absolute;
      z-index: 1;
      top: -10px;

    }
    .conft-as {
      animation: confetti-slow 2.25s linear 1 forwards;
    }
    .conft-am {
      animation: confetti-medium 1.75s linear 1 forwards;
    }
    .conft-af {
      animation: confetti-fast 1.25s linear 1 forwards;
    } 

  @media only screen and (max-width: 660px) {
    #pw-change-main #pw-indicator .pw-ind-level span {
      all: unset;
      display: block;
      position: relative;
      margin-top: -11px;
      font-size: 25px;
      opacity: 0;
      transition: 0.3s ease-out all
    }
  }
  #profile-edit .label-error {
    color: #f3665b;
    -webkit-text-fill-color: #f3665b;
    display: block;
    margin-top: 20px;
    transition: 0.3s ease-out all;
    opacity: 0
  }

/* Profile edit page and profile password page */
#profile-edit .back-to-profile,
  #pw-change-main .back-to-profile {
    margin: 40px 0px
  }

/* Email validation page when registred and normal regiser page */
  #registration-successful {
    transition: 0.3s ease-out all
  }
  #email-validation-notification, #registration-successful {
    max-width: 280px;
    margin: 0 auto;
    text-align: center
  }
  #email-validation-notification h1, #registration-successful h1 {
    line-height: 24px;
    margin-bottom: 20px!important
  }
  #email-validation-notification .button, #registration-successful.button {
    margin-bottom: 30px;
    line-height: 40px
  }
  #email-validation-notification i.fal, #registration-successful i.fal {
    font-size: 35px;
    padding: 12px 0px;
    color: #cf5828;
    -webkit-text-fill-color: #cf5828
  }

/* Old & unused */
  /*
  .tx-tritonlab #calc .c25l,.tx-tritonlab #calc .c25r{width:200px}
  .tx-tritonlab #calc .c25l{float:left;margin-right:20px}
  .tx-tritonlab #calc .c25r{float:right}
  .tx-tritonlab #calc .img-orange,.tx-tritonlab #calc .c25l .subcols-orange,.tx-tritonlab #calc .c25r .subcols-orange{display:block;width:170px;margin:5px auto;padding:12px;border:3px solid #feac00;}
  .tx-tritonlab #calc .img-red,.tx-tritonlab #calc .c25l .subcols-red,.tx-tritonlab #calc .c25r .subcols-red{display:block;width:170px;margin:5px auto;padding:12px;border:3px solid #ce5828;}
  .tx-tritonlab #calc .img-green,.tx-tritonlab #calc .c25l .subcols-green,.tx-tritonlab #calc .c25r .subcols-green{display:block;width:170px;margin:5px auto;padding:12px;border:3px solid #009b9d;}
  .tx-tritonlab #cal-result h3{margin-top:0;color:#b4b0b1; -webkit-text-fill-color: #b4b0b1}
  .tx-tritonlab .cal-input{font-size:18px;line-height:25px;padding:0 10px;width:75px;margin-left:16px;outline:0;border:0;color:#484647; -webkit-text-fill-color: #484647;border:2px solid transparent;font-family:'Open Sans',sans-serif}
  .tx-tritonlab #calc span{width:110px;margin-left:24px;font-size:18px;line-height:29px;text-align:center;display:block;float:left}
  .tx-tritonlab #calc span.cal-unit{width:auto;float:right;margin:0 16px 0 0;display:block}
  .tx-tritonlab .cal-result{text-align:center;display:none;border:3px solid #02a5a7;padding:12px;}
  .tx-tritonlab .cal-result p{font-size:28px;line-height:35px;font-weight:700;color:#484647; -webkit-text-fill-color: #484647}
  .tx-tritonlab .cal-result-box{width:27px!important}
  */

  /*
  .tx-tritonlab ul.profile-submenu{list-style:none;margin:20px 0}
  .tx-tritonlab .profile-submenu li{display:inline-block;margin-bottom:6px}
  #content .tx-tritonlab .profile-submenu a{display:inline-block;padding:5px 10px;border:1px solid;text-transform:uppercase;margin-right:10px;text-decoration:none;background:#ce5828;color:#fff;font-weight:400}
  #content .tx-tritonlab .profile-submenu a.passive{background:#fff;color:#8d8d8d;border-color:transparent;font-weight:300}
  #content .tx-tritonlab .profile-submenu a:hover,#content .tx-tritonlab .profile-submenu a:active{background:#fff;color:#ce5828;border-color:#ce5828}
  #content .tx-tritonlab .profile-submenu.invert-button-color a{background:#fff;color:#ce5828;border-color:#ce5828}
  #content .tx-tritonlab .profile-submenu.invert-button-color a:hover,#content .tx-tritonlab .profile-submenu.invert-button-color a:active{background:#ce5828;color:#fff}
  */

  /*
  .tx-tritonlab .mobile-element .evalcomment{margin:3px -23px -3px;padding:0 20px;background:#f3f5f9;border:0 solid #c6d6f3;max-height:0;transition:max-height .15s ease-out;overflow:hidden}
  .tx-tritonlab .mobile-element.showsubarticle .evalcomment{max-height:550px;transition:max-height .25s ease-in;border-width:0 3px 3px;padding:20px}
  .tx-tritonlab .mobile-element .evalcomment h1{margin:0 0 10px;background:transparent;color:#585858; -webkit-text-fill-color: #585858;text-align:left}
  .tx-tritonlab .mobile-element .showevalcomment{margin:0 -23px -3px;border-bottom:3px solid #424242}
  .tx-tritonlab .mobile-element .showevalcomment button{display:block;margin:0 auto -3px;background:#424242;border:3px solid #424242;border-bottom-color:#424242;color: #fff;-webkit-text-fill-color: #fff;padding:5px 30px;outline:0}
  .tx-tritonlab .mobile-element.showsubarticle .showevalcomment button{border-bottom-color:transparent}
  */

  /*
  .tx-tritonlab #bc-upload-icon,.tx-tritonlab #bc-cam-icon{border:0;box-shadow:none;display:block;text-indent:-99000px;width:60px;height:49px}
  .tx-tritonlab #bc-upload-icon{background:transparent url(/typo3conf/ext/tritonlab/Resources/Public/Images/bc_upload_icon.png) no-repeat 0 0}
  .tx-tritonlab #bc-cam-icon{background:transparent url(/typo3conf/ext/tritonlab/Resources/Public/Images/bc_cam_icon.png) no-repeat 0 0}

  .tx-tritonlab .btn,#content .tx-tritonlab a.btn,#content .tx-tritonlab a.btn:hover,#content .tx-tritonlab a.btn:focus{text-decoration:none;background:#999;color:#fff; -webkit-text-fill-color: #fff;display:inline-block;font-weight:400;text-align:center;white-space:nowrap;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:1px solid #888;padding:.375rem .75rem;font-size:1rem;line-height:1.5;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;outline:0}
  .tx-tritonlab .btn:hover,.tx-tritonlab .btn:focus,#content .tx-tritonlab a.btn:hover,#content .tx-tritonlab a.btn:focus{background:#777;border-color:#777}

  .tx-tritonlab .aquarium{border:1px solid #ddd;padding:15px 15px 15px 100px;position:relative;margin-bottom:10px;background:url(/typo3conf/ext/tritonlab/Resources/Public/Images/aquarium-letter-box.png) no-repeat 15px 15px}
  .tx-tritonlab .aquarium h2{margin:0 0 15px;display:inline-block;font-size:14px;line-height:normal;text-transform:capitalize;color:#585858; -webkit-text-fill-color: #585858;font-weight:700}
  .tx-tritonlab .aquarium .btn,#content .tx-tritonlab .aquarium a.btn,#content .tx-tritonlab .aquarium a.btn:hover,#content .tx-tritonlab .aquarium a.btn:focus{font-size:12px;line-height:12px;color:#009686; -webkit-text-fill-color: #009686;background:#fff;border-color:#009686;box-sizing:border-box}
  .tx-tritonlab .aquarium .btn:hover,.tx-tritonlab .aquarium .btn:focus,#content .tx-tritonlab .aquarium a.btn:hover,#content .tx-tritonlab .aquarium a.btn:focus{background:#009686;border-color:#009686;color:#fff; -webkit-text-fill-color: #fff}
  .tx-tritonlab .aquarium-id,.tx-tritonlab .aquarium-fill{margin-left:10px;color:#585858; -webkit-text-fill-color: #585858;cursor:default}
  .tx-tritonlab .aquarium-id i,.tx-tritonlab .aquarium-fill i{color:#db7f5d; -webkit-text-fill-color: #db7f5d}
  .tx-tritonlab .aquarium-evaluation-lists{display:none;position:relative;margin:20px -15px -15px -100px;background:#f1f1f1;padding:5px 15px;color:#333; -webkit-text-fill-color: #333}
  .tx-tritonlab .aquarium-evaluation-lists.open{display:block}
  .tx-tritonlab .aquarium-evaluation-lists:before,.tx-tritonlab .aquarium-evaluation-lists:after{content:'';display:table;clear:both;overflow:hidden}
  .tx-tritonlab .aquarium h3{margin:10px 0;font-size:14px;line-height:normal}
  .tx-tritonlab .aquarium-evaluations{box-sizing:border-box;width:50%;float:left;text-align:center;padding-bottom:15px}
  .tx-tritonlab .aq-single-eval{margin-bottom:5px}
  #content .tx-tritonlab .aquarium a.btn.barcode-orange{background:#008ed0;border-color:#1d759e;color:#fff; -webkit-text-fill-color: #fff}
  #content .tx-tritonlab .aquarium a.btn.barcode-orange:hover,#content .tx-tritonlab .aquarium a.btn.barcode-orange:focus{background:#fff;border-color:#1d759e;color:#1d759e; -webkit-text-fill-color: #1d759e}
  .tx-tritonlab .aq-single-eval{color:#009686!important; -webkit-text-fill-color: #009686!important;border-color:#009686!important}
  .tx-tritonlab .aq-single-eval:hover,.tx-tritonlab .aq-single-eval:focus{color:#fff!important; -webkit-text-fill-color: #fff!important;background:#009686!important;border-color:#009686!important}
  @media screen and (max-width:767px) {
    .tx-tritonlab .aquarium-evaluations{width:100%;float:none;text-align:left}
    .tx-tritonlab .aquarium-menu .btn,#content .tx-tritonlab .aquarium-menu a.btn,#content .tx-tritonlab .aquarium-menu a.btn:hover,#content .tx-tritonlab .aquarium-menu a.btn:focus{display:block;width:100%;margin-bottom:10px}
    .tx-tritonlab .aquarium h2,.tx-tritonlab .aquarium-id,.tx-tritonlab .aquarium-fill{display:block;margin:0 0 5px}
  }
  .tx-tritonlab .aq-letter-box-id{position:absolute;left:21px;top:13px;color:#fff; -webkit-text-fill-color: #fff;font-size:11px}
  .tx-tritonlab .aq-letter-box-char{position:absolute;left:18px;width:58px;text-align:center;top:42px;font-size:39px;color:#a74c19; -webkit-text-fill-color: #a74c19;font-family:sans-serif}
  */

  /*
  .tx-tritonlab ul.profile-submenu{list-style:none;margin:20px 0}
  .tx-tritonlab .profile-submenu li{display:inline-block;margin-bottom:6px}
  #content .tx-tritonlab .profile-submenu a{display:inline-block;padding:5px 10px;border:1px solid;text-transform:uppercase;margin-right:10px;text-decoration:none;background:#ce5828;color:#fff;font-weight:400}
  #content .tx-tritonlab .profile-submenu a.passive{background:#fff;color:#8d8d8d;border-color:transparent;font-weight:300}
  #content .tx-tritonlab .profile-submenu a:hover,#content .tx-tritonlab .profile-submenu a:active{background:#fff;color:#ce5828;border-color:#ce5828}
  #content .tx-tritonlab .profile-submenu.invert-button-color a{line-height:20px;background:#fff;color:#ce5828;border-color:#ce5828}
  #content .tx-tritonlab .profile-submenu.invert-button-color a:hover,#content .tx-tritonlab .profile-submenu.invert-button-color a:active{background:#ce5828;color:#fff}
  */