@charset "UTF-8";
/*
* Default theme
*/
/* Use local font or CDN */
@import url("https://fonts.googleapis.com/css2?family=Public+Sans:wght@300;400;500;600;700&display=swap");
/*
* Sizes
*/
/* Default spacing */
/* Panel size */
/* Buttons */
/* Stepper */
body {
  background-color: #fff;
  padding: 1rem;
}

/* Colors

    CONTENT
    - Color palette
    - Functional colors

*/
/*-- Color palette --

    These variables should be written on this format:

    $color-{name}
    $background-{name}

*/
/* 
   encodeColor
   @param {string} $string
   Hex color code to encode
*/
/*-- Primary --*/
/*-- Secondary --*/
/* Function colors */
/*  Functional colors are used in your CSS instead of direct references to the palette colors.

    ${name}-color
    ${name}-background

    and with state

    ${name}-color__{state}

    ---

    # Example

    ## Variable in theme file

    $error-color: $color-tertiary;

    ## Used in CSS

    .error {
        color: $error-color;
        background-color: $error-background;
    }

    Do NOT write:

    .error {
        color: $color-tertiary;
    }
*/
/* Buttons */
/* Inputs */
/* icon colors */
/* Dialogs */
/* Tables */
/* $table-border-color: #666666 !default;
$table-background-odd: #f8f8f8 !default;
$table-background-even: #fff !default;
$table-background__hoover: #dddddd !default;
$table-border-outline-color: #eee !default;
$table-text: $color-dark !default;*/
/* Errors and messages */
/* Panels */
/*
* Text and typography
*
* Uses Public Sans variable font to allow many weights with a small footprint. The font is locally served.
* https://public-sans.digital.gov/
*
* Fallback to OS fonts. Remove reference to Public Sans to further increase page load.
*/
/*
* Breakpoints
* Statistics for screen size usage
* https://gs.statcounter.com/screen-resolution-stats
*
* Desktop: 1920, 1366, 1536, 1600, 1280, 768, 2560, 1024
* Mobile: 360, 375, 414, 412
* (Tablet): 786 1280 1024 800 962 600 1366 1080
*
*
Tiny: 360, 375, 412, 414
Extra small: 600, 601, 768
Small: 800, 810, 834, 962, 1024, 1080
Medium: 1280, 1366
Large: 1536, 1600, 1920
Extra large: 2560

*/
/*
:root {
    f-size: 20px;
    f-family: Helvetica, sans-serif;
}

@media (min-width: $width1) and (max-width: $width2) {
    :root {
        f-size: 22px;
        f-family: Helvetica;
        ;
    }
}

@media (min-width: $mq-hhd) {
    :root {
        f-size: 24px;
        f-family: sans-serif;
        ;
    }
}

.my-element {
    font-size: var(f-size);
    color: red;
    font-family: var(f-family);
}
*/
@font-face {
  font-family: system;
  src: local(".SFNSText-Light"), local(".HelveticaNeueDeskInterface-Light"), local(".LucidaGrandeUI"), local("Ubuntu Light"), local("Segoe UI Light"), local("Roboto-Light"), local("DroidSans"), local("Tahoma");
}
html {
  color: #222;
  background-color: #fff;
  font-size: 100%;
  font-size: 16px;
  line-height: 1.4;
}

body {
  font-family: "Public Sans", "system", sans-serif;
}

/* For checkboxes, radios */
/* -- Headers -- */
h1 {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 2.25rem;
  line-height: 1.25;
  margin-bottom: 2rem;
}
@media (max-width: 799px) {
  h1 {
    font-size: 1.6875rem;
  }
}

h2 {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 1.6875rem;
  margin: 1.5rem 0;
}
@media (max-width: 799px) {
  h2 {
    font-size: 1.5rem;
  }
}

footer h2 {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 1.5rem;
  margin: 0 0 1.5rem;
}
@media (max-width: 799px) {
  footer h2 {
    font-size: 1.3125rem;
  }
}

h3, .siteLogoText {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 1.3125rem;
  margin-bottom: 0.75rem;
}
@media (max-width: 799px) {
  h3, .siteLogoText {
    font-size: 1.125rem;
  }
}

h4 {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 1.125rem;
  margin-top: 0;
  margin-bottom: 0.25rem;
}

h5 {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-weight: 700;
  width: 100%;
  text-align: left;
  padding: 0;
  margin-bottom: 0.75rem;
}

/* TODO: Alla dessa borde göras till riktiga headers */
.container_titletext, .heading, .variableselector_valuesselect_variabletitle > label {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 1.125rem;
  margin-top: 0;
  margin-bottom: 0.25rem;
}

button.nested-accordion-header, .commandbar_changepresentation_changetext {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-weight: 700;
  width: 100%;
  text-align: left;
  padding: 0;
  margin-bottom: 0.75rem;
}

.container_titletext {
  margin-top: 0;
}

/* Reset radio and checkbox labels */
label span {
  font-weight: 400;
}

/* TODO: replace spans with labels and legends */
:not(fieldset) label, legend span.font-heading, label.font-heading, span.font-heading {
  font-weight: 600;
  font-size: 1ren;
  margin-bottom: 0.75rem;
  /* &:first-letter {
    text-transform: capitalize;
  }*/
  display: block;
}

input + label {
  font-size: 16px;
  margin-bottom: 0.75rem;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
}

/* -- Bold text -- */
.font-bold {
  font-weight: 600;
}

/* -- Regular text -- */
p, span, a, .steps {
  max-width: 720px;
  display: inline-block;
}

p {
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 400;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 22px;
}

input, select, button {
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 400;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 22px;
  font-family: "Public Sans", "system", sans-serif;
}

option {
  font-family: "Public Sans", "system", sans-serif;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
}

button, button.accordion-header, button.nested-accordion-header {
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 400;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 22px;
  background-color: #fff;
  color: #222;
}

.siteName {
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 400;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 22px;
}

/* Links */
a, a > span {
  color: #1e00be;
  cursor: pointer;
  text-decoration: underline;
  outline-color: transparent;
  border-color: transparent;
}
a:hover, a:focus, aactive, a > span:hover, a > span:focus, a > spanactive {
  color: #fff;
  background-color: #000;
  cursor: pointer;
}

footer a, header a, header a span {
  font-weight: 500;
}

/* Selected text */
::selection, ::-moz-selection, ::-webkit-selection {
  color: #fff;
  background-color: #222;
}

/*
* Panels used in choose variables
*/
.fullscreen main, .fullscreen div[role=main] {
  max-width: calc(100vw - 1.5rem - 1.5rem);
  margin: 0;
  padding: 0 1.5rem;
}

#Fullscreen:fullscreen {
  background-color: #fff;
  padding: 0;
  overflow: scroll;
  height: 100vh;
  width: 100vw;
}
#Fullscreen:fullscreen > div {
  margin: 0 auto;
  max-width: calc(100vw - 2rem - 2rem);
}

#Fullscreen > div:first-of-type {
  margin-bottom: 1.5rem;
  margin-top: 1rem;
}

header, #header {
  border-bottom: 1px solid #949494;
  margin-bottom: 1rem;
  padding: 0 0 1.25rem 0;
  background-color: #fff;
}

#header .headerleft a span {
  text-decoration: none;
  color: #222;
}
#header .headerleft a span:hover, #header .headerleft a span:focus, #header .headerleft a spanactive {
  color: #222;
  background-color: transparent;
  cursor: pointer;
}
#header .headerleft a:hover, #header .headerleft a:focus, #header .headerleft aactive {
  color: #222;
  background-color: transparent;
  cursor: pointer;
}

#header .headerright a:hover, #header .headerright a:focus, #header .headerright aactive {
  color: #fff;
  background-color: #000;
  cursor: pointer;
}

img.logo, .imgSiteLogo {
  max-height: 50px;
  margin-right: 1rem;
}

img.logo-quality, .officialStatisticsImage {
  margin-bottom: 0.5rem;
  height: 24px;
}

.top-link {
  position: fixed;
  bottom: 0;
  right: 48vw;
  padding: 1.5rem;
  background: #f7f7f7;
  display: flex;
  transition: 0.3s;
}

.siteLogoText {
  align-self: center;
  margin: 0;
}

.headerright {
  display: flex;
  flex-direction: row;
  gap: 2rem;
  justify-content: space-between;
  align-items: center;
}

/* SCB specific footer */
footer {
  width: 100%;
  padding: 0 0 1px;
  position: relative;
  background: #222;
  margin-top: 0;
  margin-top: 2rem;
}

footer .footer-bottom {
  margin: 0 auto;
  padding-top: 72px;
  max-width: 1440px;
  display: flex;
  flex-direction: row;
}
@media (max-width: 920px) {
  footer .footer-bottom {
    flex-direction: column;
    padding-top: 2rem;
    margin-left: 0;
    margin-right: 0;
  }
}

footer .footer-bottom .columns {
  padding-right: 2%;
  padding-left: 2%;
  margin-bottom: 2rem;
}
@media (max-width: 920px) {
  footer .footer-bottom .columns {
    padding-right: 1rem;
    padding-left: 1rem;
  }
}

.columns {
  width: 100%;
  float: left;
  box-sizing: border-box;
  max-width: 1440px;
  padding: 0;
  padding-right: 0px;
  margin-left: 0;
}

@media (max-width: 920px) {
  .three.columns {
    width: 100%;
  }
}

.inverted {
  color: #fff;
}

footer .footer-bottom a {
  font-weight: 500;
  color: #fff;
}
footer .footer-bottom a:hover, footer .footer-bottom a:focus {
  color: #222;
  background-color: #fff;
}

footer .footer-bottom ul {
  margin: 12px 0 0;
}
@media (max-width: 640px) {
  footer .footer-bottom ul {
    margin-bottom: 2rem;
  }
}

footer ul {
  list-style-type: none;
  padding: 0;
}

footer .footer-bottom li {
  margin-bottom: 16px;
}

footer .copyright {
  text-align: center;
  clear: both;
  max-width: 440px;
  margin: 48px auto;
  text-align: center;
  font-size: 14px;
}

footer .copyright img {
  margin-bottom: 18px;
}

.footer_logo {
  width: 40px;
}

footer img {
  height: auto;
  max-width: 100%;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.flex-row {
  display: flex;
  flex-direction: row;
}

.flex-wrap {
  flex-wrap: wrap;
  max-width: 100vw;
}

.justify-space-between {
  justify-content: space-between;
}

main {
  max-width: 1440px;
  margin: 0 0;
}

.result main {
  margin-right: calc(420 + 1.5rem);
}

#pxcontent {
  overflow: auto;
}

/* Variable select resizable handle */
.ui-resizable-e {
  cursor: e-resize;
  width: 7px;
  right: -5px;
  top: 0;
  height: 100%;
}

.ui-resizable-handle {
  position: absolute;
  font-size: 0.1px;
  display: block;
  touch-action: none;
}

/* About area */
.about-table {
  min-width: 100%;
}

.about-table .accordion-body button.accordion-header, .about-table .accordion-body button.nested-accordion-header {
  padding: 0.75rem 0 0;
  font-weight: 700;
  margin-bottom: 0;
}
.about-table .accordion-body button.accordion-header:hover > .header-text > span, .about-table .accordion-body button.accordion-header:hover > .header-text, .about-table .accordion-body button.accordion-header:focus > .header-text > span, .about-table .accordion-body button.accordion-header:focus > .header-text, .about-table .accordion-body button.nested-accordion-header:hover > .header-text > span, .about-table .accordion-body button.nested-accordion-header:hover > .header-text, .about-table .accordion-body button.nested-accordion-header:focus > .header-text > span, .about-table .accordion-body button.nested-accordion-header:focus > .header-text {
  text-decoration: none;
}

.about-table .accordion-body button {
  cursor: unset;
}

.information_definitionlist {
  columns: 320px 3;
  column-gap: 1rem;
}
.information_definitionlist button.nested-accordion-header {
  background-color: transparent;
  margin-bottom: 0;
}
.information_definitionlist button.nested-accordion-header:hover .header-text, .information_definitionlist button.nested-accordion-header:focus .header-text {
  text-decoration: none;
  cursor: default;
}

.about-table .accordion-body .header-text {
  border-bottom: 1px solid #222;
}
.about-table .accordion-body .header-text span {
  font-weight: 600;
  font-size: 1rem;
}
.about-table .accordion-body dl {
  margin: 0;
}

.information_definitionlist .nested-accordion-body {
  margin-bottom: 1.5rem;
}

.information_definitionlist button.nested-accordion-header.closed {
  border-top: none;
  padding: 0;
}

.operations-container button:first-of-type {
  border-top-width: 0;
  padding-top: 1.5rem;
  border-top: 1px solid var(--panel-border-color);
}

.operations-container .secondary-btn {
  margin-top: 0;
  margin-left: 0.5rem;
  float: left;
  clear: left;
}

.about-table dt {
  font-size: 1rem;
  margin-bottom: 0.25rem;
  font-weight: 600;
  line-height: 1.15rem;
}

.about-table dd {
  margin-left: 0;
  margin-bottom: 0.75rem;
}

.pxweb-accordion.about-table {
  margin-bottom: 2rem;
}

.mobilemenu .pxweb-accordion.about-table {
  margin-bottom: 0;
}

/*
* Generic form related styling. Buttons, inputs, select.
*/
/*
* Buttons
* Basic button is styled as primary button
*/
/* Default style for buttons */
button, input[type=button], input[type=submit] {
  padding: 0.5rem 0.75rem;
  border-radius: 0.25rem;
  margin-right: 0.5rem;
  margin-bottom: 0.75rem;
  max-height: 2.6rem;
  cursor: pointer;
  color: #fff;
  font-weight: 500;
  background-color: #1e00be;
  border: 1px #1e00be solid;
  outline: 1px transparent;
}
button:disabled, input[type=button]:disabled, input[type=submit]:disabled {
  border-color: #949494;
  background-color: transparent;
  color: #949494;
}
button:disabled:hover, button:disabled:focus, button:disabled:active, input[type=button]:disabled:hover, input[type=button]:disabled:focus, input[type=button]:disabled:active, input[type=submit]:disabled:hover, input[type=submit]:disabled:focus, input[type=submit]:disabled:active {
  cursor: not-allowed;
  background-color: transparent;
  border-color: #949494;
  color: #949494;
  outline-color: transparent;
}
button:focus, button:hover, input[type=button]:focus, input[type=button]:hover, input[type=submit]:focus, input[type=submit]:hover {
  background-color: #222;
  color: #fff;
  cursor: pointer;
  border-color: #222;
  outline-color: #222;
  text-decoration: underline;
}

button.primary-btn, input[type=button].primary-btn, input[type=submit].primary-btn, #OperationsPanel input[type=submit].primary-btn, input[type=submit].container_continuebutton {
  padding: 0.5rem 0.75rem;
  border-radius: 0.25rem;
  margin-right: 0.5rem;
  margin-bottom: 0.75rem;
  max-height: 2.6rem;
  cursor: pointer;
  color: #fff;
  font-weight: 500;
  background-color: #1e00be;
  border: 1px #1e00be solid;
  outline: 1px transparent;
}
button.primary-btn:disabled, input[type=button].primary-btn:disabled, input[type=submit].primary-btn:disabled, #OperationsPanel input[type=submit].primary-btn:disabled, input[type=submit].container_continuebutton:disabled {
  border-color: #949494;
  background-color: transparent;
  color: #949494;
}
button.primary-btn:disabled:hover, button.primary-btn:disabled:focus, button.primary-btn:disabled:active, input[type=button].primary-btn:disabled:hover, input[type=button].primary-btn:disabled:focus, input[type=button].primary-btn:disabled:active, input[type=submit].primary-btn:disabled:hover, input[type=submit].primary-btn:disabled:focus, input[type=submit].primary-btn:disabled:active, #OperationsPanel input[type=submit].primary-btn:disabled:hover, #OperationsPanel input[type=submit].primary-btn:disabled:focus, #OperationsPanel input[type=submit].primary-btn:disabled:active, input[type=submit].container_continuebutton:disabled:hover, input[type=submit].container_continuebutton:disabled:focus, input[type=submit].container_continuebutton:disabled:active {
  cursor: not-allowed;
  background-color: transparent;
  border-color: #949494;
  color: #949494;
  outline-color: transparent;
}
button.primary-btn:focus, button.primary-btn:hover, input[type=button].primary-btn:focus, input[type=button].primary-btn:hover, input[type=submit].primary-btn:focus, input[type=submit].primary-btn:hover, #OperationsPanel input[type=submit].primary-btn:focus, #OperationsPanel input[type=submit].primary-btn:hover, input[type=submit].container_continuebutton:focus, input[type=submit].container_continuebutton:hover {
  background-color: #222;
  color: #fff;
  cursor: pointer;
  border-color: #222;
  outline-color: #222;
  text-decoration: underline;
}

button.secondary, input[type=button].secondary-btn, input[type=submit] {
  background-color: transparent;
  border-color: #1e00be;
  color: #1e00be;
}
button.secondary:focus, button.secondary:hover, input[type=button].secondary-btn:focus, input[type=button].secondary-btn:hover, input[type=submit]:focus, input[type=submit]:hover {
  background-color: #222;
  color: #fff;
  cursor: pointer;
  border-color: #222;
  outline-color: #222;
  text-decoration: underline;
}

button.tertiar-btn, input.tertiar-btn {
  background-color: transparent;
  border-color: transparent;
  color: #1e00be;
  align-self: flex-start;
}
button.tertiar-btn:focus, button.tertiar-btn:hover, input.tertiar-btn:focus, input.tertiar-btn:hover {
  background-color: #222;
  color: #fff;
  cursor: pointer;
  border-color: #222;
  outline-color: #222;
  text-decoration: underline;
}

/* Buttons with icons */
input.icon-placement, input[type=button].maximize-icon, input[type=button].minimize-icon, .container_exit_buttons_row input:first-of-type, .container_exit_buttons_row input:nth-of-type(2), #OperationsPanel .container_exit_buttons_row input.primary-btn {
  background-repeat: no-repeat;
  padding-left: 2.25rem;
  padding-right: 1rem;
  background-size: 1.5rem;
  background-position: 0.4rem center;
}

#PresentationLeft input.icon-placement {
  padding-left: 0.75rem;
  background-image: none;
}

input.download-icon, input.fetch-all-button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z'/%3E%3C/svg%3E");
}
input.download-icon:hover, input.download-icon:active, input.download-icon:focus, input.fetch-all-button:hover, input.fetch-all-button:active, input.fetch-all-button:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z'/%3E%3C/svg%3E");
}

input.pivotManual {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z'/%3E%3C/svg%3E");
}
input.pivotManual:hover, input.pivotManual:active, input.pivotManual:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z'/%3E%3C/svg%3E");
}

input.pivotCCW {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M7.11 8.53L5.7 7.11C4.8 8.27 4.24 9.61 4.07 11h2.02c.14-.87.49-1.72 1.02-2.47zM6.09 13H4.07c.17 1.39.72 2.73 1.62 3.89l1.41-1.42c-.52-.75-.87-1.59-1.01-2.47zm1.01 5.32c1.16.9 2.51 1.44 3.9 1.61V17.9c-.87-.15-1.71-.49-2.46-1.03L7.1 18.32zM13 4.07V1L8.45 5.55 13 10V6.09c2.84.48 5 2.94 5 5.91s-2.16 5.43-5 5.91v2.02c3.95-.49 7-3.85 7-7.93s-3.05-7.44-7-7.93z'/%3E%3C/svg%3E");
}
input.pivotCCW:hover, input.pivotCCW:active, input.pivotCCW:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M7.11 8.53L5.7 7.11C4.8 8.27 4.24 9.61 4.07 11h2.02c.14-.87.49-1.72 1.02-2.47zM6.09 13H4.07c.17 1.39.72 2.73 1.62 3.89l1.41-1.42c-.52-.75-.87-1.59-1.01-2.47zm1.01 5.32c1.16.9 2.51 1.44 3.9 1.61V17.9c-.87-.15-1.71-.49-2.46-1.03L7.1 18.32zM13 4.07V1L8.45 5.55 13 10V6.09c2.84.48 5 2.94 5 5.91s-2.16 5.43-5 5.91v2.02c3.95-.49 7-3.85 7-7.93s-3.05-7.44-7-7.93z'/%3E%3C/svg%3E");
}

input.pivotCW {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M15.55 5.55L11 1v3.07C7.06 4.56 4 7.92 4 12s3.05 7.44 7 7.93v-2.02c-2.84-.48-5-2.94-5-5.91s2.16-5.43 5-5.91V10l4.55-4.45zM19.93 11c-.17-1.39-.72-2.73-1.62-3.89l-1.42 1.42c.54.75.88 1.6 1.02 2.47h2.02zM13 17.9v2.02c1.39-.17 2.74-.71 3.9-1.61l-1.44-1.44c-.75.54-1.59.89-2.46 1.03zm3.89-2.42l1.42 1.41c.9-1.16 1.45-2.5 1.62-3.89h-2.02c-.14.87-.48 1.72-1.02 2.48z'/%3E%3C/svg%3E");
}
input.pivotCW:hover, input.pivotCW:active, input.pivotCW:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M15.55 5.55L11 1v3.07C7.06 4.56 4 7.92 4 12s3.05 7.44 7 7.93v-2.02c-2.84-.48-5-2.94-5-5.91s2.16-5.43 5-5.91V10l4.55-4.45zM19.93 11c-.17-1.39-.72-2.73-1.62-3.89l-1.42 1.42c.54.75.88 1.6 1.02 2.47h2.02zM13 17.9v2.02c1.39-.17 2.74-.71 3.9-1.61l-1.44-1.44c-.75.54-1.59.89-2.46 1.03zm3.89-2.42l1.42 1.41c.9-1.16 1.45-2.5 1.62-3.89h-2.02c-.14.87-.48 1.72-1.02 2.48z'/%3E%3C/svg%3E");
}

input.burger_menu-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E");
}
input.burger_menu-icon:hover, input.burger_menu-icon:active, input.burger_menu-icon:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E");
}

input.burger_menu_open-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z'/%3E%3C/svg%3E");
}
input.burger_menu_open-icon:hover, input.burger_menu_open-icon:active, input.burger_menu_open-icon:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z'/%3E%3C/svg%3E");
}

input.maximize-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z'/%3E%3C/svg%3E");
}
input.maximize-icon:hover, input.maximize-icon:active, input.maximize-icon:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z'/%3E%3C/svg%3E");
}

input.minimize-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z'/%3E%3C/svg%3E");
}
input.minimize-icon:hover, input.minimize-icon:active, input.minimize-icon:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z'/%3E%3C/svg%3E");
}

input.variableselector-compact-view {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cg%3E%3Cpath d='M14.67,5v6.5H9.33V5H14.67z M15.67,11.5H21V5h-5.33V11.5z M14.67,19v-6.5H9.33V19H14.67z M15.67,12.5V19H21v-6.5H15.67z M8.33,12.5H3V19h5.33V12.5z M8.33,11.5V5H3v6.5H8.33z'/%3E%3C/g%3E%3C/svg%3E");
}
input.variableselector-compact-view:hover, input.variableselector-compact-view:active, input.variableselector-compact-view:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cg%3E%3Cpath d='M14.67,5v6.5H9.33V5H14.67z M15.67,11.5H21V5h-5.33V11.5z M14.67,19v-6.5H9.33V19H14.67z M15.67,12.5V19H21v-6.5H15.67z M8.33,12.5H3V19h5.33V12.5z M8.33,11.5V5H3v6.5H8.33z'/%3E%3C/g%3E%3C/svg%3E");
}

input.variableselector-list-view {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cpath d='M3,14h4v-4H3V14z M3,19h4v-4H3V19z M3,9h4V5H3V9z M8,14h13v-4H8V14z M8,19h13v-4H8V19z M8,5v4h13V5H8z'/%3E%3C/svg%3E");
}
input.variableselector-list-view:hover, input.variableselector-list-view:active, input.variableselector-list-view:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cpath d='M3,14h4v-4H3V14z M3,19h4v-4H3V19z M3,9h4V5H3V9z M8,14h13v-4H8V14z M8,19h13v-4H8V19z M8,5v4h13V5H8z'/%3E%3C/svg%3E");
}

/* 
OK/Cancel buttons in tool menu

Made the assumption of the first item allways being cancel and second being continue or ok

TODO: Add classes to all buttons.
TODO: Add continue icon

*/
/* Cancel button */
.container_exit_buttons_row input:first-of-type, input.selectfromgroup-cancel, .pxweb-buttons.cancel-icon {
  background-repeat: no-repeat;
  padding-left: 2.25rem;
  padding-right: 1rem;
  background-size: 1.5rem;
  background-position: 0.4rem center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E");
  padding-left: 2.25rem;
  padding-right: 1rem;
  background-size: 1.25rem;
  background-position: 0.5rem center;
}
.container_exit_buttons_row input:first-of-type:hover, .container_exit_buttons_row input:first-of-type:active, .container_exit_buttons_row input:first-of-type:focus, input.selectfromgroup-cancel:hover, input.selectfromgroup-cancel:active, input.selectfromgroup-cancel:focus, .pxweb-buttons.cancel-icon:hover, .pxweb-buttons.cancel-icon:active, .pxweb-buttons.cancel-icon:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E");
}

/* Continue/OK button */
.container_exit_buttons_row input:nth-of-type(2) {
  background-repeat: no-repeat;
  padding-left: 2.25rem;
  padding-right: 1rem;
  background-size: 1.5rem;
  background-position: 0.4rem center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z'/%3E%3C/svg%3E");
  background-size: 1.25rem;
  background-position: 0.5rem center;
}
.container_exit_buttons_row input:nth-of-type(2):hover, .container_exit_buttons_row input:nth-of-type(2):active, .container_exit_buttons_row input:nth-of-type(2):focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z'/%3E%3C/svg%3E");
}

/* Special hierarchy button */
.variableselector_valuesselect_select_hierarcical_imagebutton {
  background-repeat: no-repeat;
  padding: 0 1.5rem 0;
  padding-right: 1rem;
  background-size: 1.5rem;
  background-position: center;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M22 11V3h-7v3H9V3H2v8h7V8h2v10h4v3h7v-8h-7v3h-2V8h2v3z'/%3E%3C/svg%3E");
}
.variableselector_valuesselect_select_hierarcical_imagebutton:hover, .variableselector_valuesselect_select_hierarcical_imagebutton:active, .variableselector_valuesselect_select_hierarcical_imagebutton:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M22 11V3h-7v3H9V3H2v8h7V8h2v10h4v3h7v-8h-7v3h-2V8h2v3z'/%3E%3C/svg%3E");
  background-color: #222;
  color: #fff;
  border-color: #222;
  outline-color: #222;
}

/* Hierarcy radios */
.hierarchical_selectionbuttonregion {
  display: flex;
  flex-direction: row-reverse;
  justify-content: start;
}
.hierarchical_selectionbuttonregion span {
  margin-right: 1rem;
}

/* Sekundärknapper för val, med check */
input.selectfromgroup-groupsbutton {
  background-repeat: no-repeat;
  padding-left: 2.25rem;
  padding-right: 1rem;
  background-size: 1.5rem;
  background-position: 0.4rem center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z'/%3E%3C/svg%3E");
}
input.selectfromgroup-groupsbutton:hover, input.selectfromgroup-groupsbutton:active, input.selectfromgroup-groupsbutton:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z'/%3E%3C/svg%3E");
}

/* 
* Left menu buttons with icons 
*/
/* Arrow up */
#OperationsPanel .icon-placement.arrow-up {
  background-repeat: no-repeat;
  padding-left: 2.25rem;
  padding-right: 1rem;
  background-size: 1.5rem;
  background-position: 0.4rem center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cpath d='M5,9l1.41,1.41L11,5.83V22H13V5.83l4.59,4.59L19,9l-7-7L5,9z'/%3E%3C/svg%3E");
}
#OperationsPanel .icon-placement.arrow-up:hover, #OperationsPanel .icon-placement.arrow-up:active, #OperationsPanel .icon-placement.arrow-up:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cpath d='M5,9l1.41,1.41L11,5.83V22H13V5.83l4.59,4.59L19,9l-7-7L5,9z'/%3E%3C/svg%3E");
}

/* Arrow down */
/* .arrow-down-icon exists only on the "search variable" page */
#OperationsPanel .icon-placement.arrow-down, .arrow-down-icon.pxweb-btn {
  background-repeat: no-repeat;
  padding-left: 2.25rem;
  padding-right: 1rem;
  background-size: 1.5rem;
  background-position: 0.4rem center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%231E00BE'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cpath d='M19,15l-1.41-1.41L13,18.17V2H11v16.17l-4.59-4.59L5,15l7,7L19,15z'/%3E%3C/svg%3E");
}
#OperationsPanel .icon-placement.arrow-down:disabled, .arrow-down-icon.pxweb-btn:disabled {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%23949494'%3E%3Crect fill='none'  height='24' width='24'/%3E%3Cpath d='M19,15l-1.41-1.41L13,18.17V2H11v16.17l-4.59-4.59L5,15l7,7L19,15z'/%3E%3C/svg%3E");
}
#OperationsPanel .icon-placement.arrow-down:hover, #OperationsPanel .icon-placement.arrow-down:active, #OperationsPanel .icon-placement.arrow-down:focus, .arrow-down-icon.pxweb-btn:hover, .arrow-down-icon.pxweb-btn:active, .arrow-down-icon.pxweb-btn:focus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%23FFFFFF'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cpath d='M19,15l-1.41-1.41L13,18.17V2H11v16.17l-4.59-4.59L5,15l7,7L19,15z'/%3E%3C/svg%3E");
}

/*
* Input fields
*/
input {
  padding: 0.5rem;
  margin-bottom: 0;
  margin-right: 0.5rem;
  border: 1px solid #949494;
  outline: 1px solid transparent;
  background-color: #fff;
  border-radius: 4px;
}
input:hover, input:focus, input:active {
  border: 1px solid #222;
  outline: 1px solid #222;
}

select {
  padding: 0.5rem;
  margin-bottom: 0;
  margin-right: 0.5rem;
  border: 1px solid #949494;
  outline: 1px solid transparent;
  background-color: #fff;
  border-radius: 4px;
  min-width: 16rem;
}
select:hover, select:focus, select:active {
  border: 1px solid #222;
  outline: 1px solid #222;
}

input[type=text] {
  min-width: 10rem;
  margin-top: 0.5rem;
}
input[type=text]:read-only {
  border-style: dashed;
  border-width: 2px;
}

input[type=number] {
  min-width: 6rem;
}

input[type=radio], input[type=checkbox], input[type=radio]:checked, input[type=checkbox]:checked {
  /* margin-bottom: sizes.$space-medium;
  margin-right: sizes.$space-small;
  margin-top: sizes.$space-tiny;
  margin-left: sizes.$space-extra-small;*/
  margin-bottom: 1rem;
  margin-right: 0.5rem;
  display: inline-block;
  border: none !important;
  outline: none !important;
  border-radius: 0;
}
input[type=radio]:hover, input[type=radio]:focus, input[type=radio]:active, input[type=checkbox]:hover, input[type=checkbox]:focus, input[type=checkbox]:active, input[type=radio]:checked:hover, input[type=radio]:checked:focus, input[type=radio]:checked:active, input[type=checkbox]:checked:hover, input[type=checkbox]:checked:focus, input[type=checkbox]:checked:active {
  color: #222;
  background-color: transparent;
  border: none !important;
  outline: none !important;
}

input[type=radio] + label, input[type=radio]:checked + label, input[type=checkbox] + label, input[type=checkbox]:checked + label {
  font-weight: 400;
  border-width: 0;
  outline-color: transparent;
}

input[type=radio]:checked + label, input[type=checkbox] + label {
  font-weight: 400;
  color: #222;
}

input[type=radio] + label, input[type=checkbox] + label {
  margin-bottom: 1rem;
  margin-right: 1rem;
  width: calc(100% - 4rem);
  vertical-align: top;
  padding: 0;
  line-height: 140%;
}

input:disabled {
  background-color: transparent;
  color: #949494;
}
input:disabled + label {
  color: #949494;
}
input:disabled + label:hover {
  cursor: not-allowed;
}

fieldset {
  padding: 1rem 0;
  border: none;
}
fieldset input[type=radio] + label, fieldset input[type=checkbox] + label {
  display: inline-block;
  color: #333;
  font-weight: 300;
}
fieldset legend {
  font-weight: 600;
  margin-top: 1rem;
}

.pxweb-accordion > fieldset > legend {
  margin-top: 0;
}

input[type=radio]:hover + label, input[type=checkbox]:hover + label, input[type=radio]:focus + label, input[type=checkbox]:focus + label, input[type=radio]:active + label, input[type=checkbox]:active + label {
  color: #000;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
}

/*
* Select boxes
*/
select {
  padding: 0.5rem;
  margin-bottom: 0;
  margin-right: 0.5rem;
  border: 1px solid #949494;
  outline: 1px solid transparent;
  background-color: #fff;
  border-radius: 4px;
  -webkit-appearance: none;
  -moz-appearance: none;
  -o-appearance: none;
  appearance: none;
  background-position: 97% center;
  background-repeat: no-repeat;
  outline: none;
}
select:hover, select:focus, select:active {
  border: 1px solid #222;
  outline: 1px solid #222;
}

select:not([multiple]):not([size]) {
  background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 255 255' width='18' height='18' xmlns='http://www.w3.org/2000/svg'><g><polygon points='0,63.75 127.5,191.25 255,63.75' fill='black' /></g></svg>");
}

select[multiple] {
  padding: 0.5rem;
  margin-bottom: 0;
  margin-right: 0.5rem;
  border: 1px solid #949494;
  outline: 1px solid transparent;
  background-color: #fff;
  border-radius: 4px;
  appearance: none;
  background-image: none;
  margin-bottom: 0.75rem;
  border-radius: 4px;
  max-height: 12rem;
  height: fit-content;
}
select[multiple]:hover, select[multiple]:focus, select[multiple]:active {
  border: 1px solid #222;
  outline: 1px solid #222;
}
@media only screen and (min-device-width: 799px) {
  select[multiple] {
    padding: 0;
  }
}
@media only screen and (max-device-width: 599px) {
  select[multiple] {
    width: 100vw;
  }
}
@media only screen and (max-device-width: 799px) {
  select[multiple] {
    max-height: 2.4rem;
    padding: 0.6rem 0.75rem;
    width: 100%;
  }
  select[multiple] option {
    padding-left: 0;
    padding-right: 0;
  }
}

/* Mobile hack */
@media only screen and (max-device-width: 799px) {
  .variableselector_valuesselect_valuesselect_panel::after {
    content: "...";
    float: right;
    font-size: 115%;
    color: #222;
    border-radius: 5px;
    font-size: 150%;
    margin-right: 0.65rem;
    margin-top: -3.1rem;
    padding: 0;
    position: relative;
  }
  .variableselector_valuesselect_valuesselect_panel::after:hover, .variableselector_valuesselect_valuesselect_panel::after:focus {
    color: "%23FFFFFF";
  }
}

select[multiple] option:checked {
  background: #222 linear-gradient(0deg, #222 0%, #222 100%);
  -webkit-text-fill-color: #fff;
  color: #fff;
}

select:disabled {
  background-image: none;
  background-color: transparent;
}

option {
  padding: 0.6rem 0.75rem;
  min-width: 10rem;
  margin-bottom: 0;
}

option:checked {
  background-color: #222;
  color: #fff;
  cursor: pointer;
}

option:hover, option:active, option:focus {
  background-color: #ccc;
  color: #000;
  text-decoration: underline;
  cursor: pointer;
}

/*
* Accordions
*/
.variableselector_variable_box_container > div, div.accordion {
  background-color: #f7f7f7;
  margin-bottom: 2rem;
}

.accordion-panels legend {
  width: 100%;
  padding: 0;
}

.accordion-panels fieldset {
  padding: 0;
  border: 0;
  margin: 0;
}

button.accordion-header, button.nested-accordion-header {
  width: 100%;
  border-width: 0;
  border-radius: 0;
  text-align: left;
  padding: 1.5rem 1rem 1.5rem 0;
  border-top: 1px solid #949494;
  font-weight: 700;
  outline-color: transparent;
}
button.accordion-header:hover, button.accordion-header:focus, button.nested-accordion-header:hover, button.nested-accordion-header:focus {
  color: #222;
  background-color: transparent;
}
button.accordion-header:hover > .header-text > span, button.accordion-header:hover > .header-text, button.accordion-header:focus > .header-text > span, button.accordion-header:focus > .header-text, button.nested-accordion-header:hover > .header-text > span, button.nested-accordion-header:hover > .header-text, button.nested-accordion-header:focus > .header-text > span, button.nested-accordion-header:focus > .header-text {
  text-decoration: underline;
}
button.accordion-header:active, button.nested-accordion-header:active {
  color: #222;
}

button.accordion-header.closed, button.nested-accordion-header.closed {
  display: inline-block;
  border-top: 1px solid #949494;
}

button.accordion-header.closed:before {
  content: "▾";
}

button.nested-accordion-header {
  background-color: #f7f7f7;
}

button.accordion-header:before {
  content: "▴";
  padding-right: 0;
  margin-right: 0.75rem;
  max-width: 1rem;
  font-size: 1.125rem;
  line-height: 1;
}

.pxweb-nested-accordion {
  break-inside: avoid;
}
.pxweb-nested-accordion dl {
  display: flex;
  justify-content: start;
  flex-direction: column;
}

.accordion-body {
  background-color: transparent;
  border-top: 0;
  border-radius: 0;
  text-align: left;
  margin-bottom: 2rem;
  margin-top: 0.75rem;
  width: auto;
}
@media (max-width: 660px) {
  .accordion-body {
    padding: 0 1rem;
  }
}

.accordion-body.closed {
  display: none;
}

.accordion-body div {
  width: 100%;
}

.accordion-body fieldset {
  border: none;
  margin: 0;
  padding: 0;
}

/* Accordions in main area */
.presentation-main .accordion-body, #placeholder .accordion-body {
  padding: 0;
}

.presentation-main button.accordion-header, button.nested-accordion-header, #SelectionPage button.accordion-header {
  padding-left: 0;
}

.pxweb-accordion {
  max-width: 720px;
}

/*
* Default table styling
*/
table {
  margin-top: 12px;
  border-spacing: 0px;
  margin-bottom: 36px;
  line-height: 20px;
  overflow: hidden;
}

thead, thead:fullscreen {
  position: sticky;
  top: 0;
  box-shadow: 0 0 0.25rem rgba(0, 0, 0, 0.4);
  z-index: 10;
}

tbody > tr:nth-child(odd) > td, tbody > tr:nth-child(odd) > th {
  background: #f8f8f8;
}

tbody > tr:nth-child(even) > td, tbody > tr:nth-child(even) > th {
  background: #fff;
}

tbody > tr:hover > th, tbody > tr:hover > td, tbody > tr:nth-child(2n+1):hover > th, tbody > tr:nth-child(2n+1):hover > td, tbody > tr:nth-child(2n):hover > td > th, tbody > tr:nth-child(2n):hover > td > td {
  border-top-color: #000;
  border-bottom-color: #000;
  background-color: #ddd;
  color: #000;
}

td, th {
  padding: 0.75rem 0.5rem;
  border-left: 1px solid #1e00be;
  border-top: 1px solid #1e00be;
  border-bottom: none;
  border-right: none;
  vertical-align: text-top;
  text-align: right;
  color: #1e00be;
}

td {
  white-space: nowrap;
}

tbody td.left {
  text-align: left;
}
tbody td.right {
  text-align: right;
}

table {
  border-bottom: 2px solid #1e00be;
}

thead > tr:first-child > td, thead > tr:first-child > th {
  border-top: 2px solid #1e00be;
}

thead > tr:first-child > td {
  /* border-left: 1px solid colors.$table-border-outline-color;*/
  border-left: 1px solid #1e00be;
  border-right: 1px solid #1e00be;
  position: sticky;
  left: 0;
  z-index: 5;
}

tbody tr th:last-child {
  border-left: 1px solid #1e00be;
}

tbody tr th[rowspan]:first-child {
  border-right: 1px solid #1e00be;
}

tbody tr th[rowspan="1"]:first-child {
  border-right: none;
}

tbody tr th:first-child {
  text-align: left;
  /* border-left: 1px solid colors.$table-border-outline-color;*/
  /* border-right: 1px solid colors.$table-border-color;*/
  position: sticky;
  left: 0;
  z-index: 5;
  font-weight: 600;
}
tbody tr th:first-child[scope=row] {
  border-left-color: #1e00be;
}
@media (max-width: 799px) {
  tbody tr th:first-child {
    max-width: 30vw;
  }
}

tbody tr th:first-child {
  max-width: 25vw;
}

thead > tr:last-child > td, thead > tr:last-child > th, thead > tr:first-child td[rowspan] {
  border-bottom: 1px solid #1e00be;
}

thead > tr td:first-child {
  border-left-width: 0;
}

thead > tr th:last-child, tbody > tr td:last-child {
  border-right-width: 0;
}

thead th {
  border-left: 1px solid #1e00be;
}
thead th input[type=submit] {
  padding: 0;
}

thead th, thead td {
  font-weight: bold;
  text-align: left;
  background-color: #fff;
}

tbody th {
  text-align: left;
}

tbody tr td:first-child {
  border-left: none !important;
  border-right-color: #1e00be;
}

tbody tr th {
  border-left: none !important;
  border-right-color: #1e00be;
  border-right-width: 1px;
}

/* PxWeb table classes */
/* Indent */
th.layout1-table-stub2 {
  padding-left: 1.5rem;
}

th.layout1-table-stub3 {
  padding-left: calc(1.5rem + 1.5rem);
}

th.layout1-table-stub4 {
  padding-left: calc(1.5rem + 1.5rem + 1.5rem);
}

/* Cells with attributes */
td.attribute-cell {
  padding: 0 0 0.5rem;
}
td.attribute-cell::after {
  content: "";
  border-left: 0.75rem solid transparent;
  border-top: 0.75rem solid #1e00be;
}
td.attribute-cell:hover {
  cursor: pointer;
  text-decoration: underline;
  color: #000;
  background-color: #fff;
}
td.attribute-cell:hover::after {
  border-top-color: #fff;
}

/*
* Stepper, the three steps of PX Web
*/
.navigationFlowArea {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  height: 5rem;
  margin: 2rem 1.5rem 0;
  padding: 0.75rem;
  max-width: 768px;
}

.navigationFlowArea a img {
  display: none;
}

/* Adjust text position of stepp */
.navigationFlowArea a:first-of-type span {
  margin-left: -2rem;
}

.navigationFlowArea a:nth-of-type(2) span {
  margin-left: -2.5rem;
}

.navigationFlowArea a:nth-of-type(3) span {
  margin-left: -2rem;
}

.navigationFlowArea a {
  display: inline-block;
  padding: 0;
  line-height: 100%;
  text-decoration: none;
}
.navigationFlowArea a:hover, .navigationFlowArea a:focus, .navigationFlowArea a:active {
  color: #222;
  background-color: transparent;
}
.navigationFlowArea a:hover span, .navigationFlowArea a:focus span, .navigationFlowArea a:active span {
  color: #fff;
  background-color: #000;
}

.navigationFlowArea a span {
  position: absolute;
  margin-top: 1rem;
}

.navigationFlowArea a::before {
  color: #fff;
  font-size: 2rem;
  display: block;
}

.navigationFlowArea a.active::before {
  content: "◉";
  color: #222;
}

.navigationFlowArea a.future::before {
  content: "○";
  color: #949494;
}

.navigationFlowArea a.passive:hover::before, .navigationFlowArea a.passive:focus::before, .navigationFlowArea a.passive:active::before {
  content: "◉";
  color: #222;
  background-color: transparent;
}
.navigationFlowArea a.passive::before {
  content: "○";
  color: #222;
  background-color: transparent;
}

.navigationFlowArea a.future span {
  color: #949494;
  text-decoration: none;
}

.navigationFlowArea a.active {
  color: #222;
  text-decoration: none;
}

.navigationFlowArea span.active {
  text-decoration: none;
  color: #222;
}

hr {
  flex-grow: 2;
  border: none;
  border-top: 2px solid #949494;
  margin-top: 0.5rem;
}

hr.future {
  border: none;
  border-color: #949494;
  border-top-style: dashed;
}

/* Tools menu position */
/* valid options are 'left', 'right' or 'default' */
/* Theme settings */
.presentation-left.mobilemenu {
  position: fixed;
  overflow: auto;
  height: 100vh;
  max-width: 80vw;
  background-color: #ffffff;
  border-left: 1px solid #ddd;
  overflow-x: hidden;
  z-index: 100;
  padding: 1.5rem;
  width: calc(420px - 1.5rem - 1.5rem);
}
@media (max-width: 599px) {
  .presentation-left.mobilemenu {
    height: 100vh;
    box-shadow: none;
    border-width: 0;
    max-width: 100vw;
    left: 0;
    margin-top: calc(2 * 2rem);
  }
  .presentation-left.mobilemenu.mobilemenuhidden {
    display: none;
  }
  .presentation-left.mobilemenu .tools-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    background-color: #fff;
    box-shadow: 0 0 8px rgba(25, 25, 25, 0.4);
    min-height: calc(2 * 2rem);
  }
  .presentation-left.mobilemenu .tools-header h2 {
    margin: 1rem;
    padding: 0;
  }
  .presentation-left.mobilemenu .tools-header button {
    top: 0.75rem;
  }
}

/* Animate slide in and out from left*/
.presentation-left.mobilemenu:not(.mobilemenuhidden) {
  top: 0;
  right: 0;
}

.presentation-left.mobilemenu.mobilemenuhidden {
  top: 0;
  right: -460px;
  padding-left: 0;
}

.presentation-left button.accordion-header, .presentation-left button.nested-accordion-header.closed, .presentation-left .closed .accordion-body {
  background-color: #ffffff;
}

.tools-header {
  margin-bottom: 2rem;
}
.tools-header button {
  position: absolute;
  right: 1rem;
  top: 2.9rem;
  background-color: #fff;
  color: #1e00be;
  border: #fff;
}

.encodeColor_buttons_row {
  margin-top: 1.5rem;
  /* padding: sizes.$space-medium 0;
  border-top: 1px solid colors.$panel-border-color;*/
}

#SettingsBody .chartsettings label {
  margin: 0;
  font-size: 1rem;
  width: fit-content;
}
#SettingsBody .chartsettings input {
  margin-bottom: 0.5rem;
}
#SettingsBody .chartsettings input[type=checkbox], #SettingsBody .chartsettings input[type=radio] {
  margin-bottom: 0;
}
#SettingsBody .chartsettings .px_setting_checkbox, #SettingsBody .chartsettings .px_setting_radiobuttonlist {
  display: flex;
  margin-bottom: 0.5rem;
}

#sizeSettings {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  width: min-content;
  flex-wrap: wrap;
}

#legendSettings {
  display: flex;
  flex-direction: column;
}

/* Delete variable specific */
.delete_variable_rootdiv .commandbar-listbox-container {
  margin: 0;
}

/* Change texts */
.commandbar_changepresentation_inputrow .commandbar_changepresentation_changetext {
  margin: 0;
}

/* The toolbar - now named commandbar */
/* Container for burger menu button */
@media (min-width: 799px) {
  .tools-menu-item {
    float: left;
  }
}
@media (max-width: 799px) {
  #CommandBarShortCuts {
    display: none;
  }
}
#btnBurgerMenu:visited, #btnBurgerMenu:active {
  background-color: #1e00be;
}

/* Errors and messages */
.px-messages, .variableselector_error_summary {
  padding: 1rem;
  font-weight: 700;
  margin-bottom: 1rem;
  background-color: #e1ecef;
  width: calc(100% - 2rem);
}

#pxwebcontent .variableselector_selectionerror_label {
  color: rgb(183, 0, 0);
  background-color: rgb(255, 190, 190);
  margin-left: -1rem;
  padding: 1rem;
}

#pxwebcontent .variableselector_selectionerror_label_text {
  display: none;
}

.variableselector_error_summary {
  background-color: rgb(255, 190, 190);
}

.variableselector_error_summary li {
  text-transform: capitalize;
  font-weight: 300;
}

.pxweb-input-error, .time_warning_panel {
  padding: 0.75rem 1rem;
  background-color: rgb(255, 190, 190);
  border-radius: 0.75rem;
  display: inline-block;
  margin-top: 0.5rem;
}

.pxweb-input-error::before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 0.5rem solid rgb(255, 190, 190);
  border-right: 0.5rem solid transparent;
  border-top: 1rem solid transparent;
  border-bottom: 1rem solid rgb(255, 190, 190);
  margin-left: -0.5rem;
  margin-top: -2rem;
}

.pxweb-info-text {
  padding: 0.75rem 0;
  background-color: transparent;
}

select.variableselector_valuesselect_box_error {
  border-color: rgb(183, 0, 0);
  outline-color: rgb(183, 0, 0);
}

/*
* Navigation related styling. Breadcrumbs, tree.
*/
nav#breadcrumb {
  display: flex;
  flex-wrap: wrap;
}
nav#breadcrumb a:first-of-type {
  /*text-decoration: none;
  padding: 0;*/
  font-size: 1.25rem;
  line-height: 1;
}
nav#breadcrumb a:first-of-type::before {
  content: "⌂";
}

nav a {
  /* font-weight: typography.$font-weight-medium;
  padding: 0.25rem 0.25rem 0.05rem;
  line-height: 150%;
  vertical-align: top;
  display: inline;*/
  vertical-align: sub;
}

nav .breadcrumb_sep {
  /*vertical-align: -webkit-baseline-middle;
  vertical-align: sub;*/
  vertical-align: bottom;
  padding: 0 0.25rem;
}

nav a span {
  vertical-align: bottom;
}

.breadcrumb_text_nolink {
  text-decoration: none;
  color: #222;
  font-weight: 400;
  display: inline;
}

/*
* Treeview, used to select table
*
* TODO: Replace classes in HTML
*/
/* Reset list style */
.AspNet-TreeView ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.AspNet-TreeView > ul {
  border-top: 1px solid #949494;
  margin-top: 1rem;
}

.AspNet-TreeView ul ul {
  border-top: 1px solid #949494;
}

.AspNet-TreeView ul ul li {
  margin-left: 1.5rem;
}

.AspNet-TreeView ul li {
  background-image: none;
  border-bottom: 1px solid #949494;
  padding: 0;
}

.AspNet-TreeView a, .AspNet-TreeView-ClickableNonLink {
  padding: 0.75rem 0;
  text-decoration: none;
}

.AspNet-TreeView-Collapse + .AspNet-TreeView-ClickableNonLink {
  font-weight: 700;
}

.AspNet-TreeView ul li:last-of-type {
  border-bottom: none;
}

/* Expanded parent node */
.AspNet-TreeView-Expand::before {
  content: "＋";
}

.AspNet-TreeView-Collapse::before {
  content: "－";
}

.AspNet-TreeView-Collapse, .AspNet-TreeView-Expand {
  margin: 0;
}
.AspNet-TreeView-Collapse:hover, .AspNet-TreeView-Expand:hover {
  cursor: pointer;
  color: #fff;
  background-color: #000;
}

.AspNet-TreeView-Collapse::before:hover, .AspNet-TreeView-Collapse::before:focus, .AspNet-TreeView-Expand::before:hover, .AspNet-TreeView-Expand::before:focus {
  color: #fff;
  background-color: #000;
}

/* Clickable leaf node */
.AspNet-TreeView-Leaf {
  margin-left: 0px;
  padding-left: 0.5rem;
}

/* Hide node */
.AspNet-TreeView-Hide {
  display: none;
}

/* Clickable nodes */
.AspNet-TreeView ul li span.AspNet-TreeView-ClickableNonLink, .AspNet-TreeView a, .AspNet-TreeView a span {
  color: #1e00be;
  cursor: pointer;
  text-decoration: underline;
  outline-color: transparent;
  border-color: transparent;
  text-decoration: none;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.AspNet-TreeView ul li span.AspNet-TreeView-ClickableNonLink:hover, .AspNet-TreeView ul li span.AspNet-TreeView-ClickableNonLink:focus, .AspNet-TreeView ul li span.AspNet-TreeView-ClickableNonLinkactive, .AspNet-TreeView a:hover, .AspNet-TreeView a:focus, .AspNet-TreeView aactive, .AspNet-TreeView a span:hover, .AspNet-TreeView a span:focus, .AspNet-TreeView a spanactive {
  color: #fff;
  background-color: #000;
  cursor: pointer;
}

.AspNet-TreeView .AspNet-TreeView-Leaf a:focus span, .AspNet-TreeView .AspNet-TreeView-Leaf a:hover span, .AspNet-TreeView .AspNet-TreeView-Leaf a:active span {
  color: #fff;
  background-color: #000;
  cursor: pointer;
  text-decoration: underline;
}

/* Icons */
.AspNet-TreeView img {
  margin-left: 1rem;
}

/* Hierarcy tree */
.AspNet-TreeView li {
  /* &.AspNet-TreeView-Leaf, &.AspNet-TreeView-Parent, &.AspNet-TreeView-Root {
      white-space: nowrap;
  }*/
}
.AspNet-TreeView li label {
  width: fit-content;
}
.AspNet-TreeView li.AspNet-TreeView-Leaf {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.AspNet-TreeView li.AspNet-TreeView-Parent, .AspNet-TreeView li.AspNet-TreeView-Root {
  display: block;
}
.AspNet-TreeView li input[type=checkbox] {
  margin: 0.75rem;
}
.AspNet-TreeView li input[type=checkbox] + label {
  width: auto;
  width: fit-content;
}
.AspNet-TreeView li a > span, .AspNet-TreeView li a {
  max-width: unset;
}

#datasort_description {
  width: 100%;
}

.tablesorter button, .tablesorter input {
  border-color: transparent;
  outline-color: transparent;
}
.tablesorter button:hover, .tablesorter button:focus, .tablesorter button:active, .tablesorter input:hover, .tablesorter input:focus, .tablesorter input:active {
  border-color: transparent;
  outline-color: transparent;
}

th:first-of-type {
  border-left: none;
}

table .header::after {
  content: "↕";
  font-size: 1.5rem;
}
table .headerSortDown::after {
  content: "↓";
  font-size: 1.5rem;
}
table .headerSortUp::after {
  content: "↑";
  font-size: 1.5rem;
}

/* 

Select variable

*/
#SelectionPage .flex-row.justify-space-between {
  flex-wrap: wrap;
  justify-content: flex-end;
}

#SelectionPage .about-table button {
  border-top: none;
  padding-left: 0;
}

#SelectionPage .about-table {
  border-bottom: 1px solid #ccc;
}

#SelectionPage .justify-center {
  justify-content: left;
}

/* Title */
.variableselector_valuesselect_variabletitle {
  width: 100%;
}
.variableselector_valuesselect_variabletitle label {
  display: inline-block;
}

.variableselector_valuesselect_mandatory_text {
  margin-left: 0.25rem;
  line-height: 1.9rem;
}
.variableselector_valuesselect_mandatory_text::after {
  content: ")";
}
.variableselector_valuesselect_mandatory_text::before {
  content: "(";
}

input[type=submit].variableselector_continue_button {
  font-size: 1.3125rem;
  max-height: unset;
  padding: 1rem 1.5rem;
  margin: 1rem 0 1.5rem;
}

.variableselector_valuesselect_search_textstart_checkbox label {
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 400;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 22px;
  width: fit-content;
}

.variableselector_valuesselect_search_textstart_checkbox {
  width: fit-content;
  width: -moz-available;
  width: -webkit-fill-available;
  width: stretch;
  padding: 0.5rem 0 1rem;
  display: flex;
  white-space: nowrap;
}

.variableselector_valuesselect_aggregations {
  margin-top: 1.5rem;
}

.variableselector_variable_box_container.flex-row.flex-wrap {
  justify-content: start;
  gap: 2rem;
}

.variableselector_valuesselect_box_compact, .variableselector_valuesselect_box_list {
  width: min-content;
}

.variableselector_variable_box_container > div {
  background-color: #f7f7f7;
  padding: 1rem;
}
@media (max-width: 660px) {
  .variableselector_variable_box_container > div {
    width: revert;
    min-width: unset;
    max-width: unset;
    margin-right: -1rem;
    margin-left: -1rem;
  }
}

.selectfromgroup-container {
  margin-right: 2rem;
  min-width: 20rem;
  max-width: 25vw;
}
@media (max-width: 660px) {
  .selectfromgroup-container {
    width: revert;
    min-width: unset;
    max-width: unset;
    margin-right: unset;
  }
}

@media screen and (max-width: 1200) {
  .variableselector_variable_box_container > div {
    width: 48%;
  }
}
.optional-variable-icon-panel, .optional-variable-text {
  display: none;
}

.variableselector_variable_box_container input[type=submit], input[type=submit].variableselector_valuesselect_deselect_all_button {
  border-color: transparent;
  text-decoration: underline;
  padding: 0;
  border-radius: 0;
  margin-bottom: 1rem;
  /* @media (max-width: breakpoints.$small) {
    &:first-of-type {
      margin-bottom: sizes.$space-extra-small;
    }
  }*/
}

/* HACK - Search form button positioning */
.arrow-down-icon + .variableselector_valuesselect_deselect_all_button {
  margin-top: 0.5rem;
  margin-left: 0.75rem;
}
.arrow-down-icon + .variableselector_valuesselect_deselect_all_button:hover, .arrow-down-icon + .variableselector_valuesselect_deselect_all_button:focus, .arrow-down-icon + .variableselector_valuesselect_deselect_all_button:active {
  border-color: transparent;
}

.variableselector_valuesselect_statistics_panel p {
  margin-bottom: 0.5rem;
}

.variableselector_valuesselect_aggregations {
  margin-bottom: 1rem;
}

.variableselector_valuesselect_select_all_button, .variableselector_valuesselect_deselect_all_button {
  margin-top: 0.75rem;
}

.search-panel .input-wrapper {
  display: flex;
  flex-direction: row;
  width: fit-content;
}

/* Result page specific styling */
/* Command bar */
.commandbar_container br {
  display: none;
}

.commandbar_container .variableselector_variable_box_container > div {
  padding: 0;
}

/* Used for remove variable in tools menu */
.delete_variable_rootdiv .variableselector_variable_box_container .commandbar-listbox-container {
  background-color: transparent;
}

.commandbar-listbox-container {
  margin-top: 1rem;
}

.commandbar_saveas_dropdownlist {
  width: 90%;
}

/* Edit and caculate module for sum, multiply, divide and subtract */
.commandbar_sum_operandspanel_row {
  flex-wrap: wrap;
}

/* Label */
/* Select */
.commandbar_sum_sumallvaluesnewvariabelname_dropdown {
  margin-bottom: 1rem;
}

/* Handle the dialogs we still have */
.ui-dialog-title {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 1.3125rem;
  margin-bottom: 0.75rem;
}
@media (max-width: 799px) {
  .ui-dialog-title {
    font-size: 1.125rem;
  }
}

.table_cellinformation_cell, .table_cellinformation_notes {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 1.125rem;
  margin-top: 0;
  margin-bottom: 0.25rem;
}

.ui-dialog {
  border: 1px solid #949494;
  background-color: #fff;
  box-shadow: 3px 0 8px rgba(25, 25, 25, 0.4);
  z-index: 100;
}

.ui-dialog-titlebar {
  padding: 1rem 0.5rem 1rem 1rem;
  border-bottom: 1px solid #949494;
}

.ui-dialog-content {
  padding: 1rem 1rem;
  overflow-y: scroll;
}

.ui-draggable .ui-draggable-handle {
  cursor: move;
}

.ui-dialog-titlebar-close {
  float: right;
}

.ui-dialog-buttonpane {
  display: none;
}

/* Style related to search */
.search-option {
  display: flex;
}

.search-settings {
  display: flex;
  align-items: first baseline;
}

#environmentInformation {
  background-color: #329b46;
  position: fixed;
  top: 0px;
  left: 0px;
  padding-top: 10px;
  width: 100%;
  opacity: 0.6;
  max-width: none;
  color: #ffffff;
  font-weight: bold;
  text-transform: uppercase;
  display: flex;
  justify-content: center;
  padding-bottom: 0.5rem;
}

/* SCB only - Move */
#testMiljoText {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  font-size: 0.8rem;
  background-color: #2E8657;
  color: #ffffff;
  height: 7rem;
  width: 13rem;
  transform: rotate(45deg);
  z-index: 501;
  position: fixed;
  top: -3rem;
  right: -6rem;
  font-weight: bold;
  text-transform: uppercase;
  padding-bottom: 0.25rem;
}
#testMiljoText:hover {
  opacity: 0.3;
}

/* Elements that should have been inside the main wrapper */
div[role=main], #table-title, #ctl00_navigationFlowControl, #ctl00_ctl00_navigationFlowControl, .h1title {
  max-width: 1440px;
  margin: 0 0;
}

#ctl00_breadcrumb1 {
  max-width: none;
  margin: 0 0;
}

div:empty, span:empty, a:empty, p:empty {
  display: none;
}

.h1title {
  margin-top: 1rem;
  margin-bottom: 2rem;
}

.font-bold {
  font-weight: 600;
}

.header-text, .commandbar_changedecimal_titletext, .commandbar_changetexts_titletext {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  /* 
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 0.5rem;
  */
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.4;
  margin-top: 0;
  margin-bottom: 0.5rem;
}

.commandbar_changedecimal_selectvaluetext, .commandbar_changedecimal_titletext, .commandbar_changepresentation_changetext, .commandbar_sum_sumallvaluestext {
  width: calc(100% - 2rem);
}

.commandbar_changepresentation_radio {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.pxweb-input {
  display: block;
}

.xs-margin-left {
  margin-left: 0.5rem;
}

.switch-layout-container {
  display: inline-block;
  position: absolute;
}
.switch-layout-container input {
  margin: 0.75rem 0 0;
}
@media (max-width: 660px) {
  .switch-layout-container {
    display: none;
  }
}

.searchvalues-container select {
  float: left;
  clear: left;
}
.searchvalues-container .pxweb-info-text {
  float: left;
}

.pxweb-buttons.cancel-icon, .pxweb-buttons.selectfromgroup-cancel {
  width: -moz-fit-content;
  width: min-content;
}

.savequery_container input[type=text] {
  width: calc(100% - 2rem - 2rem);
}

.querySummary div:nth-of-type(2) {
  margin-top: 1rem;
}

#SaveAsPanel input[type=submit] {
  margin-top: 1rem;
}

#OperationsPanel input[type=submit].primary-btn {
  text-decoration: none;
}

.container_exit_buttons_row {
  margin-top: 1rem;
  /* padding: 1rem 0; */
  /* border-top: 1px solid #ccc; */
}

.view-state {
  float: right;
  margin-top: -3rem;
  margin-bottom: 0.75rem;
}

.seperator {
  margin: 0 0.75rem;
  color: #949494;
}

.view-state span {
  font-weight: 700;
}

/* Very specific styling */
.footnotes_container {
  max-width: 720px;
}

.footnotes {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  max-width: 720px;
  border-bottom: 1px solid #949494;
}

.footnotes_container br {
  display: unset;
}

/* Make span tags in footnotes behave as paragraphs */
.the_encodeColor_text.notetype_note_value, .notetype_valuenote_value, .the_long_text.notetype_note_value {
  margin-bottom: 1rem;
  display: block;
}

.obs-notes {
  margin-bottom: 1.5rem;
}

.obs-notes-h3 {
  min-width: 100%;
}

.the_encodeColor_text .notetype_note_value, .the_encodeColor_text .notetype_valuenote_value {
  display: block;
  margin-bottom: 1.5rem;
}

/* Choose variables trigger */
.justify-center {
  display: flex;
  justify-content: center;
}

/* Result page specific */
#ApiAccordionHeader > span {
  color: #1e00be;
  cursor: pointer;
  text-decoration: underline;
  outline-color: transparent;
  border-color: transparent;
}
#ApiAccordionHeader > span:hover, #ApiAccordionHeader > span:focus, #ApiAccordionHeader > spanactive {
  color: #fff;
  background-color: #000;
  cursor: pointer;
}
#ApiAccordionHeader > span > span {
  text-decoration: underline;
}
#ApiAccordionHeader::before {
  content: "API";
  font-weight: 400;
  background-color: #5d5d5d;
  color: white;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
}
#ApiAccordionHeader::before:hover, #ApiAccordionHeader::before:focus {
  color: #fff;
  background-color: #000;
}

.tablequery_informationpanel label {
  margin-top: 1rem;
}

.tablequery_query {
  font-size: 1.15rem;
}

.operations-container {
  align-items: start;
}

/* Menu button styling */
/* Search field */
.search_panel input[type=text] {
  margin-right: 0;
}

.search_label {
  display: block;
}

a.search-icon svg {
  display: none;
}

a.search-icon {
  padding: 0.5rem 0.75rem;
  border-radius: 0.25rem;
  margin-right: 0.5rem;
  margin-bottom: 0.75rem;
  max-height: 2.6rem;
  cursor: pointer;
  color: #fff;
  font-weight: 500;
  background-color: #1e00be;
  border: 1px #1e00be solid;
  outline: 1px transparent;
  text-decoration: none;
  margin-top: 0.75rem;
  margin-bottom: 0.25rem;
}
a.search-icon:disabled {
  border-color: #949494;
  background-color: transparent;
  color: #949494;
}
a.search-icon:disabled:hover, a.search-icon:disabled:focus, a.search-icon:disabled:active {
  cursor: not-allowed;
  background-color: transparent;
  border-color: #949494;
  color: #949494;
  outline-color: transparent;
}
a.search-icon:focus, a.search-icon:hover {
  background-color: #222;
  color: #fff;
  cursor: pointer;
  border-color: #222;
  outline-color: #222;
  text-decoration: underline;
}

a.go-to-advanced-search::before {
  margin-right: 0.25rem;
}

a.search-icon::before {
  content: "🔎︎";
}

.px-external-search-div a::before {
  margin-right: 0.25rem;
}

a.search-icon:hover::before, a.search-icon:focus::before, .go-to-advanced-search::before {
  text-decoration: none;
}

a.search-icon:hover:focus, a.search-icon:hover:hover, a.search-icon:focus:focus, a.search-icon:focus:hover {
  background-color: #222;
  color: #fff;
  cursor: pointer;
  border-color: #222;
  outline-color: #222;
  text-decoration: underline;
}

.tools-header button::before, button.ui-dialog-titlebar-close::before {
  content: "✖";
  margin-right: 0.75rem;
}

.tools-header button:focus, .tools-header button:hover {
  background-color: #222;
  color: #fff;
  cursor: pointer;
  border-color: #222;
  outline-color: #222;
  text-decoration: underline;
}

.savequery_rblist input + label {
  width: calc(100% - 4rem);
}

input.download-icon {
  margin-top: 1rem;
}

/* Edit and calculate dialogs */
#ctl00_ctl00_ContentPlaceHolderMain_CommandBar1_CommandBar1_PluginControl_PluginControl_ChangeTextPanel {
  display: flex;
  flex-direction: column;
}

.commandbar_deletevariable_nametext {
  display: flex;
  flex-direction: row;
}

#ctl00_ctl00_ContentPlaceHolderMain_CommandBar1_CommandBar1_PluginControl_PluginControl_DeleteValuePanel .font-normal-text {
  display: flex;
  flex-direction: row-reverse;
  justify-content: start;
  margin-top: 1rem;
}

/* 
* Search variable form - For large amounts of values 
*/
/* Hack for fetch all positioning */
input.fetch-all-button {
  margin-right: 50%;
  margin-top: 1rem;
}

/* 
* Media queries 
*/
@media (max-width: 1140px) {
  main {
    /* margin:0 calc(420 + 1.5rem) 0 auto;*/
    margin: 0 auto;
  }
  .presentation-left.mobilemenuhidden {
    width: 420px;
  }
}
@media (max-width: 768px) {
  main {
    max-width: calc(100vw - 2rem);
    padding: 0;
  }
  .view-state {
    float: none;
    margin-top: 0;
  }
}
/* Advanced workflow styling */
.arrow-right-pxbox-icon {
  padding: 0.75rem 0;
}

/* Hierarchy tree */
#ctl00_ContentPlaceHolderMain_VariableSelector1_VariableSelector1_SelectHierarchichalVariable_SelectHierarchichalVariable_VariableTreeView.AspNet-TreeView li.AspNet-TreeView-Parent, #ctl00_ContentPlaceHolderMain_VariableSelector1_VariableSelector1_SelectHierarchichalVariable_SelectHierarchichalVariable_VariableTreeView.AspNet-TreeView li.AspNet-TreeView-Root {
  display: grid;
  grid-template-columns: 1rem auto 1fr;
  justify-items: start;
  align-items: baseline;
}
#ctl00_ContentPlaceHolderMain_VariableSelector1_VariableSelector1_SelectHierarchichalVariable_SelectHierarchichalVariable_VariableTreeView.AspNet-TreeView li.AspNet-TreeView-Parent input, #ctl00_ContentPlaceHolderMain_VariableSelector1_VariableSelector1_SelectHierarchichalVariable_SelectHierarchichalVariable_VariableTreeView.AspNet-TreeView li.AspNet-TreeView-Root input {
  justify-self: center;
}
#ctl00_ContentPlaceHolderMain_VariableSelector1_VariableSelector1_SelectHierarchichalVariable_SelectHierarchichalVariable_VariableTreeView.AspNet-TreeView li.AspNet-TreeView-Parent label, #ctl00_ContentPlaceHolderMain_VariableSelector1_VariableSelector1_SelectHierarchichalVariable_SelectHierarchichalVariable_VariableTreeView.AspNet-TreeView li.AspNet-TreeView-Root label {
  padding: 0.5rem;
  margin: 0;
}

.hierarchical_selectionbuttonregion + p:first-of-type {
  font-weight: 700;
  max-width: 920px;
  line-height: 1.4;
  /*&:first-letter {
    text-transform: capitalize;
  }*/
  font-size: 1.3125rem;
  margin-bottom: 0.75rem;
  margin-top: 1.5rem;
  margin-bottom: 0;
}
@media (max-width: 799px) {
  .hierarchical_selectionbuttonregion + p:first-of-type {
    font-size: 1.125rem;
  }
}

#ctl00_ContentPlaceHolderMain_VariableSelector1_VariableSelector1_SelectHierarchichalVariable_SelectHierarchichalVariable_VariableTreeView ul:first-of-type {
  margin-bottom: 1.5rem;
}

.screenreader-only {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.hidden {
  display: none;
}