/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
:root {
  --color-black: #000;
  --color-white: #fff;
}

@font-face {
  font-family: 'daikin-icons';
  src: url("https://139607367.fs1.hubspotusercontent-eu1.net/hubfs/139607367/raw_assets/public/dmep-daikin-docs-2024/fonts/daikin-icons.woff2") format('woff2');
  font-weight: 400;
  font-style: normal;
}



/* CSS variables */

:root {
  --column-gap: 2.13%;
  --column-width-multiplier: 8.333;
}

/* Mobile layout */

.row-fluid {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}


  .row-fluid .span1,
  .row-fluid .span2,
  .row-fluid .span3,
  .row-fluid .span4,
  .row-fluid .span5,
  .row-fluid .span6,
  .row-fluid .span7,
  .row-fluid .span8,
  .row-fluid .span9,
  .row-fluid .span10,
  .row-fluid .span11,
  .row-fluid .span12{
  min-height: 1px;
  width: 100%;
}

/* Desktop layout */

@media (min-width: 960px) {
  .row-fluid {
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  
    .row-fluid .span1 {
      width: calc(var(--column-width-multiplier) * 1% * 1 - var(--column-gap) * (11 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span2 {
      width: calc(var(--column-width-multiplier) * 1% * 2 - var(--column-gap) * (10 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span3 {
      width: calc(var(--column-width-multiplier) * 1% * 3 - var(--column-gap) * (9 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span4 {
      width: calc(var(--column-width-multiplier) * 1% * 4 - var(--column-gap) * (8 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span5 {
      width: calc(var(--column-width-multiplier) * 1% * 5 - var(--column-gap) * (7 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span6 {
      width: calc(var(--column-width-multiplier) * 1% * 6 - var(--column-gap) * (6 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span7 {
      width: calc(var(--column-width-multiplier) * 1% * 7 - var(--column-gap) * (5 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span8 {
      width: calc(var(--column-width-multiplier) * 1% * 8 - var(--column-gap) * (4 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span9 {
      width: calc(var(--column-width-multiplier) * 1% * 9 - var(--column-gap) * (3 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span10 {
      width: calc(var(--column-width-multiplier) * 1% * 10 - var(--column-gap) * (2 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span11 {
      width: calc(var(--column-width-multiplier) * 1% * 11 - var(--column-gap) * (1 * var(--column-width-multiplier) / 100));
    }
  
}

/*! http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) |&&| normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css |&&| html5doctor.com Reset Stylesheet v1.6.1 | Last Updated: 2010-09-17 | Author: Richard Clark - http://richclarkdesign.com | Twitter: @rich_clark *** Merged and trimmed to keep the best from both by Daniele O'rlmente?! Messa */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: transparent;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block;
}

progress {
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote::before, blockquote::after,
q::before, q::after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  background-color: transparent;
}

a:focus,
a:active,
a:hover {
  outline: 0;
}

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

b,
mark,
strong {
  font-weight: bold;
}

i,
em,
dfn,
mark {
  font-style: italic;
}

del {
  text-decoration: line-through;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  -ms-interpolation-mode: bicubic;
}

svg:not(:root) {
  overflow: hidden;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

pre {
  overflow: auto;
}

code,
kbd,
pre,
samp {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
  font-family: monospace, monospace;
  font-size: 1em;
}

optgroup {
  font-weight: bold;
}

button[disabled],
input[disabled] {
  cursor: default;
}

/*! DMEP Daikin Docs 2024 v1.0.0 Styles | (c)2024 License: wtfpl v2 | by Daniele O'lrmente Messa */
:root {
  --font-size-display: 7.2rem;
  --font-size-h1: 5.1rem;
  --font-size-h2: 3rem;
  --font-size-h3: 2.4rem;
  --font-size-base: 1.8rem;
  --font-size-p: 1.6rem;
  --font-size-small: 1.4rem;
  --font-size-tiny: 1.3rem;
  --line-height-display: 8rem;
  --line-height-h1: 5.6rem;
  --line-height-h2: 4rem;
  --line-height-h3: 3.2rem;
  --line-height-base: 2.4rem;
  --line-height-p: 2.4rem;
  --line-height-small: 1.6rem;
  --color-white: #fff;
  --color-black: #000;
  --color-grey: #565656;
  --color-grey-light: #f7f8f8;
  --color-grey-medium: #d2d2d2;
  --color-grey-medium-dark: #b2b2b2;
  --color-grey-dark: #231f20;
  --color-grey-blue: #68808a;
  --color-grey-blue-light: #d7dbde;
  --color-grey-blue-dark: #323f4a;
  --color-green: #99f600;
  --color-green-medium: #558900;
  --color-blue: #01a0e3;
  --color-blue-light: #f2f8fe;
  --color-blue-dark: #013b57;
  --color-red: #ff0000;
  --color-red-dark: #990000;
  --color-lines: #d7dbde;
  --color-transparent: rgba(255, 255, 255, 0);
  --color-transparent-black: rgba(0, 0, 0, .6);
  --color-transparent-white: rgba(255, 255, 255, .5);
  --color-transparent-blue: rgba(1, 154, 219, .85);
  --color-shadow-black: rgba(0, 0, 0, .08);
  --font-serif: "Open Sans", sans serif;
  --font-sans: "Open Sans", sans serif;
  --font-icons: "daikin-icons";
  --size-header-height: 11rem;
  --size-header-height-mobile: 6rem;
  --size-logo-height: 7rem;
  --size-logo-height-mobile: 4rem;
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;
}

/* Grid System - @begin */
.columns {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  align-content: flex-start;
}
.columns.columns-center {
  justify-content: center;
}
.columns.columns-middle {
  flex-wrap: nowrap;
  align-items: center;
}
.columns.columns-stretch {
  flex-wrap: nowrap;
  align-items: stretch;
}
.columns.columns-vertical {
  flex-direction: column;
}
.column {
  margin-left: 0;
  margin-right: 0;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  flex-basis: auto;
  flex-grow: 0;
  flex-shrink: 0;
}

.column-no-pad {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0 !important;
  padding-right: 0 !important;
  flex-basis: auto;
  flex-grow: 0;
  flex-shrink: 0;
}

.column-middle.column, .column-middle.column-no-pad {
  align-self: center;
}

.column-stretch.column, .column-stretch.column-no-pad {
  flex-grow: 1;
  align-self: stretch;
}

.last-col {
  margin-left: auto !important;
}

@media all {
  .m-all {
    width: 100%;
  }
  .m-1of2 {
    width: 50%;
  }
  .m-1of3 {
    width: 33.3333333333%;
  }
  .m-2of3 {
    width: 66.6666666667%;
  }
  .m-1of4 {
    width: 25%;
  }
  .m-3of4 {
    width: 75%;
  }
  .m-1of5 {
    width: 20%;
  }
  .m-2of5 {
    width: 40%;
  }
  .m-3of5 {
    width: 60%;
  }
  .m-4of5 {
    width: 80%;
  }
  .m-1of6 {
    width: 16.6666666667%;
  }
  .m-5of6 {
    width: 83.3333333333%;
  }
}
@media ( min-width: 480px ) {
  .p-all {
    width: 100%;
  }
  .p-1of2 {
    width: 50%;
  }
  .p-1of3 {
    width: 33.3333333333%;
  }
  .p-2of3 {
    width: 66.6666666667%;
  }
  .p-1of4 {
    width: 25%;
  }
  .p-3of4 {
    width: 75%;
  }
  .p-1of5 {
    width: 20%;
  }
  .p-2of5 {
    width: 40%;
  }
  .p-3of5 {
    width: 60%;
  }
  .p-4of5 {
    width: 80%;
  }
  .p-1of6 {
    width: 16.6666666667%;
  }
  .p-5of6 {
    width: 83.3333333333%;
  }
  .p-1of7 {
    width: 14.2857142857%;
  }
  .p-2of7 {
    width: 28.5714285714%;
  }
  .p-3of7 {
    width: 42.8571428571%;
  }
  .p-4of7 {
    width: 57.1428571429%;
  }
  .p-5of7 {
    width: 71.4285714286%;
  }
  .p-6of7 {
    width: 85.7142857143%;
  }
  .p-1of8 {
    width: 12.5%;
  }
  .p-3of8 {
    width: 37.5%;
  }
  .p-5of8 {
    width: 62.5%;
  }
  .p-7of8 {
    width: 87.5%;
  }
}
@media ( min-width: 960px ) {
  .t-all {
    width: 100%;
  }
  .t-1of2 {
    width: 50%;
  }
  .t-1of3 {
    width: 33.3333333333%;
  }
  .t-2of3 {
    width: 66.6666666667%;
  }
  .t-1of4 {
    width: 25%;
  }
  .t-3of4 {
    width: 75%;
  }
  .t-1of5 {
    width: 20%;
  }
  .t-2of5 {
    width: 40%;
  }
  .t-3of5 {
    width: 60%;
  }
  .t-4of5 {
    width: 80%;
  }
  .t-1of6 {
    width: 16.6666666667%;
  }
  .t-5of6 {
    width: 83.3333333333%;
  }
  .t-1of7 {
    width: 14.2857142857%;
  }
  .t-2of7 {
    width: 28.5714285714%;
  }
  .t-3of7 {
    width: 42.8571428571%;
  }
  .t-4of7 {
    width: 57.1428571429%;
  }
  .t-5of7 {
    width: 71.4285714286%;
  }
  .t-6of7 {
    width: 85.7142857143%;
  }
  .t-1of8 {
    width: 12.5%;
  }
  .t-3of8 {
    width: 37.5%;
  }
  .t-5of8 {
    width: 62.5%;
  }
  .t-7of8 {
    width: 87.5%;
  }
  .t-1of9 {
    width: 11.1111111111%;
  }
  .t-5of9 {
    width: 55.5555555556%;
  }
  .t-4of9 {
    width: 44.4444444444%;
  }
  .t-1of10 {
    width: 10%;
  }
  .t-1of11 {
    width: 9.0909090909%;
  }
  .t-1of12 {
    width: 8.3333333333%;
  }
  .t-5of12 {
    width: 41.6666666667%;
  }
  .t-7of12 {
    width: 58.3333333333%;
  }
  .t-10of12 {
    width: 83.3333333333%;
  }
  .t-11of12 {
    width: 91.6666666667%;
  }
}
@media ( min-width: 1040px ) {
  .d-all {
    width: 100%;
  }
  .d-1of2 {
    width: 50%;
  }
  .d-1of3 {
    width: 33.3333333333%;
  }
  .d-2of3 {
    width: 66.6666666667%;
  }
  .d-1of4 {
    width: 25%;
  }
  .d-3of4 {
    width: 75%;
  }
  .d-1of5 {
    width: 20%;
  }
  .d-2of5 {
    width: 40%;
  }
  .d-3of5 {
    width: 60%;
  }
  .d-4of5 {
    width: 80%;
  }
  .d-1of6 {
    width: 16.6666666667%;
  }
  .d-5of6 {
    width: 83.3333333333%;
  }
  .d-1of7 {
    width: 14.2857142857%;
  }
  .d-2of7 {
    width: 28.5714285714%;
  }
  .d-3of7 {
    width: 42.8571428571%;
  }
  .d-4of7 {
    width: 57.1428571429%;
  }
  .d-5of7 {
    width: 71.4285714286%;
  }
  .d-6of7 {
    width: 85.7142857143%;
  }
  .d-1of8 {
    width: 12.5%;
  }
  .d-3of8 {
    width: 37.5%;
  }
  .d-5of8 {
    width: 62.5%;
  }
  .d-7of8 {
    width: 87.5%;
  }
  .d-1of9 {
    width: 11.1111111111%;
  }
  .d-5of9 {
    width: 55.5555555556%;
  }
  .d-4of9 {
    width: 44.4444444444%;
  }
  .d-1of10 {
    width: 10%;
  }
  .d-1of11 {
    width: 9.0909090909%;
  }
  .d-1of12 {
    width: 8.3333333333%;
  }
  .d-5of12 {
    width: 41.6666666667%;
  }
  .d-7of12 {
    width: 58.3333333333%;
  }
  .d-10of12 {
    width: 83.3333333333%;
  }
  .d-11of12 {
    width: 91.6666666667%;
  }
}
/* Grid System - @end */
/* Typography - @begin */
.font-sans {
  font-family: var(--font-sans), "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;
}

.font-serif {
  font-family: var(--font-serif), "Georgia", "Cambria", "Times New Roman", "Times", serif;
}

.font-mono {
  font-family: "Bitstream Vera Sans Mono", "Consolas", "Courier", monospace;
}

.font-icon {
  font-family: "daikin-icons";
}

.font-light {
  font-weight: 300;
}

.font-normal {
  font-weight: 400;
}

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

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-justify {
  text-align: justify;
}

.text-lower {
  text-transform: lowercase;
}

.text-upper {
  text-transform: uppercase;
}

.text-capitalize {
  text-transform: capitalize;
}

.text-ucfirst {
  text-transform: lowercase;
}
.text-ucfirst::first-letter {
  text-transform: uppercase;
}

.text-underline {
  text-decoration: underline;
}

.font-light.font-light {
  font-weight: var(--weight-light);
}

.font-regular.font-regular {
  font-weight: var(--weight-regular);
}

.font-medium.font-medium {
  font-weight: var(--weight-medium);
}

.font-bold.font-bold {
  font-weight: var(--weight-bold);
}

.font-serif {
  font-family: var(--font-serif);
}

.font-sans {
  font-family: var(--font-sans);
}

.text-72 {
  font-size: var(--font-size-display);
  line-height: var(--line-height-display);
}

.text-51 {
  font-size: var(--font-size-h1);
  line-height: var(--line-height-h1);
}

.text-36 {
  font-size: var(--font-size-h2);
  line-height: var(--line-height-h2);
}

.text-25 {
  font-size: var(--font-size-h3);
  line-height: var(--line-height-h3);
}

.text-18 {
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
}

.text-16 {
  font-size: var(--font-size-p);
  line-height: var(--line-height-p);
}

.text-14 {
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
}

.text-13 {
  font-size: var(--font-size-tiny);
  line-height: var(--line-height-small);
}

.text-12 {
  font-size: var(--font-size-tiny);
  line-height: var(--line-height-small);
}

.text-black {
  color: var(--color-black);
}

.text-white {
  color: var(--color-white);
}

.text-grey-medium {
  color: var(--color-grey);
}

.text-grey-dark {
  color: var(--color-grey-dark);
}

.text-grey-blue {
  color: var(--color-grey-blue);
}

.text-white {
  color: var(--color-white);
}

.text-blue {
  color: var(--color-blue);
}

.text-green {
  color: var(--color-green);
}

.text-red {
  color: var(--color-red);
}

.text-red-dark {
  color: var(--color-red-dark);
}

/* Typography - @end */
/* Icons - @begin */
.icon {
  position: relative;
  display: inline-block;
  height: 1.1em;
  width: 1.1em;
  overflow: hidden;
  text-align: center;
}
.icon::before {
  speak: never;
  content: "";
  display: inline-block;
  text-align: center;
  font-family: "daikin-icons";
  width: 1em;
  line-height: 1;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon.icon-before, .icon.icon-after {
  display: inline-flex;
  align-items: center;
  width: auto;
  overflow: visible;
}
.icon.icon-before::before, .icon.icon-after::before {
  position: absolute;
  top: 0;
}
.icon.icon-before {
  padding-left: 1.5em;
  text-align: left;
}
.icon.icon-before::before {
  left: 0;
}
.icon.icon-after {
  padding-right: 1.5em;
  text-align: right;
}
.icon.icon-after::before {
  left: auto;
  right: 0;
}

.icon-label {
  display: inherit;
}
.icon:not(.icon-before):not(.icon-after) .icon-label {
  overflow: hidden;
  text-indent: 101%;
}

.icon-grid-view:before {
  content: "\e91d";
}

.icon-baloon:before {
  content: "\e91e";
}

.icon-list:before {
  content: "\e91f";
}

.icon-plus-2:before {
  content: "\e920";
}

.icon-list-view:before {
  content: "\e921";
}

.icon-star:before {
  content: "\e927";
}

.icon-triangle-down:before {
  content: "\e922";
}

.icon-triangle-up:before {
  content: "\e925";
}

.icon-triangle-right:before {
  content: "\e923";
}

.icon-triangle-left:before {
  content: "\e926";
}

.icon-youtube:before {
  content: "\e924";
}

.icon-arrow-down:before {
  content: "\e900";
}

.icon-arrow-left:before {
  content: "\e901";
}

.icon-arrow-right:before {
  content: "\e902";
}

.icon-arrow-up:before {
  content: "\e903";
}

.icon-close:before {
  content: "\e904";
}

.icon-docs:before {
  content: "\e905";
}

.icon-facebook:before {
  content: "\e906";
}

.icon-instagram:before {
  content: "\e907";
}

.icon-linkedin:before {
  content: "\e908";
}

.icon-minus:before {
  content: "\e909";
}

.icon-plus:before {
  content: "\e90a";
}

.icon-search:before {
  content: "\e90b";
}

.icon-select-down:before {
  content: "\e90c";
}

.icon-select-left:before {
  content: "\e90d";
}

.icon-select-right:before {
  content: "\e90e";
}

.icon-select-up:before {
  content: "\e90f";
}

.icon-triangle:before {
  content: "\e911";
}

.icon-share:before {
  content: "\e910";
}

.icon-hamburger:before {
  content: "\e912";
}

.icon-arrow-sw-ne:before {
  content: "\e914";
}

.icon-arrow-se-nw:before {
  content: "\e913";
}

.icon-arrow-ne-sw:before {
  content: "\e915";
}

.icon-arrow-nw-se:before {
  content: "\e916";
}

.icon-lt:before {
  content: "\e917";
}

.icon-gt:before {
  content: "\e918";
}

.icon-play:before {
  content: "\e919";
}

.icon-filters:before {
  content: "\e91a";
}

.icon-download:before {
  content: "\e91b";
}

.icon-mail:before {
  content: "\e91c";
}

/* Icons - @end */
/* Setup - @begin */
html {
  box-sizing: border-box;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-size: 62.5%;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

*:not(table):not(thead):not(tbody):not(tfoot):not(tr):not(td):not(th) {
  backface-visibility: hidden;
}

body {
  overflow-x: hidden;
  font-family: var(--font-sans), "Helvetica Neue", "Helvetica", "Roboto", "Arial", sans-serif;
  font-size: 1.4rem;
}

h1,
h2,
h3,
h4 {
  font-family: var(--font-serif), "Georgia", "Cambria", "Times New Roman", "Times", serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-weight: 700;
  line-height: normal;
  text-rendering: optimizelegibility;
  text-wrap: balance;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  text-decoration: none;
}

h1 {
  font-size: 3.5rem;
}

h2 {
  font-size: 2.8rem;
}

h3 {
  font-size: 2.52rem;
}

h4 {
  font-size: 2.1rem;
}

h5 {
  font-size: 1.4rem;
}

h6 {
  font-size: 1.26rem;
}

ol {
  list-style: inside decimal;
}

ul {
  list-style: inside disc;
}

ol,
ul {
  margin: 1rem auto;
  list-style: outside none;
}

ol ol,
ul ul,
ol ul,
ul ol {
  margin-left: 1em;
  font-size: 90%;
}

ol ol,
ul ol {
  list-style-type: upper-roman;
}
ol ol.no-bullets,
ul ol.no-bullets {
  list-style: outside none;
}

ol ul,
ul ul {
  list-style-type: square;
}
ol ul.no-bullets,
ul ul.no-bullets {
  list-style: outside none;
}

li {
  margin: 0 auto 1rem;
}

a,
button {
  color: inherit;
}

a:link {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

p,
span,
blockquote,
q {
  text-wrap: balance;
  /* autoprefixer: off */
}

p + p,
p + a,
a + p,
p + h4,
p + h3 {
  margin-top: 1em;
}

img,
picture {
  display: block;
  max-width: 100%;
  height: auto;
}
img.vertical-image,
picture.vertical-image {
  max-height: 100%;
  width: auto;
}

table {
  table-layout: fixed;
  margin: 0;
}

caption {
  padding: 0 1em 1em;
}

tr,
th,
td {
  vertical-align: middle;
}

th,
td {
  padding: 0.5em 1em;
  text-align: left;
}

th {
  border-bottom: 1px solid #000;
}

td {
  border-top: 1px solid #bfbfbf;
}

ol ol ol, ul ol ol, ul ul ol {
  list-style-type: lower-alpha;
}

ul ul ul, ol ul ul, ol ol ul {
  list-style-type: circle;
}

ol.bullets {
  list-style: inside decimal;
}

ul.bullets {
  list-style: inside disc;
}

blockquote,
q,
pre {
  margin: 1em 1.5em;
}

label,
button,
input[type=button],
input[type=image],
input[type=file],
input[type=reset],
input[type=submit] {
  cursor: pointer;
}

textarea {
  resize: none;
}

:focus {
  outline-color: transparent;
  outline-style: none;
}

/* Setup - @end */
/* Forms - @begin */
input:focus,
select:focus,
textarea:focus,
button:focus {
  outline: none;
}

.input-fieldset {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.input-fieldset + .input-fieldset {
  padding-top: 2rem;
}
.input-fieldset.last-fieldset {
  padding-top: 2rem !important;
}

.fieldset-heading {
  margin-bottom: 2.4rem;
}

.input {
  border-radius: 0;
  border: 0 none;
  margin: 1em 0 0;
  padding: 1em;
  background-color: var(--color-blue-light);
  color: var(--color-black);
}

.input-multiselect {
  position: relative;
}
.input-multiselect .multiselect-items {
  margin-bottom: 0;
  max-height: 11.5em;
  overflow: auto;
}
.input-multiselect .multiselect-label {
  display: block;
}
.input-multiselect .multiselect-label:hover {
  background-color: var(--color-grey-light);
}
.input-multiselect .multiselect-check {
  margin-right: 1rem;
  cursor: pointer;
}
.input-multiselect .search-box-wrapper {
  position: relative;
}
.input-multiselect .search-box-wrapper input {
  border-bottom: solid 1px;
  padding-left: 30px;
  margin-top: 0;
  margin-bottom: 1em;
}
.input-multiselect .search-box-wrapper .search-icon {
  position: absolute;
  left: 5px;
  top: 40%;
  transform: translateY(-50%);
  color: #aaa;
  display: inline-block;
}

.input-summary {
  display: list-item;
  cursor: pointer;
}
.input-summary::marker {
  color: var(--color-grey-blue);
}
[open] .input-summary::marker, .input-summary:hover::marker {
  color: var(--color-blue);
}

.fieldset-actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  margin-top: 2.4rem;
}

.drop-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 15rem;
  border-radius: 0.5rem;
  border: 0.7rem dashed var(--color-grey-blue-light);
  padding: 2rem;
  text-align: center;
  color: var(--color-grey-blue);
  cursor: pointer;
  background-color: var(--color-blue-light);
  font-weight: var(--weight-medium);
}
.drop-area.dragover {
  background-color: var(--color-grey-light);
}
.drop-area .files-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
}
.drop-area .file-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin: 1rem;
  width: 15rem;
  border: 1px solid var(--color-blue);
  padding: 1rem;
  background-color: var(--color-white);
  color: var(--color-black);
  font-weight: var(--weight-regular);
}
.drop-area .file-item.loading {
  filter: grayscale(1);
  opacity: 0.75;
}
.drop-area .file-name {
  padding-top: 1em;
  padding-bottom: 1em;
}
.drop-area .file-name,
.drop-area .file-status {
  margin-top: auto;
  word-break: break-word;
}
.drop-area .file-status {
  font-weight: var(--weight-medium);
}
.drop-area .file-status.status-ok {
  color: var(--color-green-medium);
}
.drop-area .file-status.status-ko {
  color: var(--color-red-dark);
}

.search-form {
  display: flex;
  margin-right: auto;
}

.search-form .input-search {
  margin-top: 0;
}

.search-form .search-submit {
  margin-left: 1em;
}

/* Forms - @end */
/* Base - @begin */
/********************
WORDPRESS BODY CLASSES
style a page via class
********************/
/*********************
LINK STYLES
*********************/
/*********************
H1, H2, H3, H4, H5 STYLES
*********************/
/*********************
LAYOUT & GRID STYLES
*********************/
.wrap {
  max-width: 110rem;
  margin: 0 auto;
  width: calc(100% - 2 * (2.5rem - 1.5rem));
}
@media screen and ( min-width: 480px ) {
  .wrap {
    width: calc(100% - 2 * (5rem - 1.5rem));
  }
}

.page-container {
  min-height: calc(100vh - (15rem));
}

/*********************
HEADER STYLES
*********************/
/* Header - @begin */
.main-header {
  background-color: #131313;
  height: 7.5rem;
}

.main-logo {
  margin: 0;
}
.main-logo a {
  color: #fafafa;
}

/* Header - @end */
/*********************
NAVIGATION STYLES
*********************/
/* Navigations - @begin */
.nav {
  border-bottom: 0;
  margin: 0;
}
.nav li a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: 0.75em;
}
.nav li ul.sub-menu li a,
.nav li ul.children li a {
  padding-left: 30px;
}
/* Navigations - @end */
/*********************
POSTS & CONTENT STYLES
*********************/
/* Posts - @begin */
@media screen and ( min-width: 1040px ) {
  #content {
    min-height: calc(100vh - 7.5rem);
  }
}

.hentry header {
  border-bottom: 1px solid #ccc;
  padding: 1.5em;
}
.hentry footer {
  padding: 1.5em;
  border-top: 1px solid #ccc;
}
.hentry footer p {
  margin: 0;
}

.single-title,
.page-title,
.entry-title {
  margin: 0;
}

/* post meta */
.byline {
  font-style: italic;
  margin: 0;
}
/* entry content */
.entry-content {
  padding: 1.5em 1.5em 0;
}
.entry-content p {
  margin: 0 0 1.5em;
}
.entry-content table {
  width: 100%;
  border: 1px solid #ccc;
  margin-bottom: 1.5em;
}
.entry-content table caption {
  margin: 0 0 7px;
  font-size: 0.75em;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.entry-content tr {
  border-bottom: 1px solid #ccc;
}
.entry-content tr:nth-child(even) {
  background-color: #fafafa;
}
.entry-content td {
  padding: 7px;
  border-right: 1px solid #ccc;
}
.entry-content td:last-child {
  border-right: 0;
}
.entry-content th {
  background-color: #fafafa;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
.entry-content th:last-child {
  border-right: 0;
}
.entry-content blockquote {
  margin: 0 0 1.5em 0.75em;
  padding: 0 0 0 0.75em;
  border-left: 3px solid #2980b9;
  font-style: italic;
}
.entry-content dd {
  margin-left: 0;
  font-size: 0.9em;
  margin-bottom: 1.5em;
}
.entry-content img {
  margin: 0 0 1.5em 0;
  max-width: 100%;
  height: auto;
}
.entry-content .size-auto,
.entry-content .size-full,
.entry-content .size-large,
.entry-content .size-medium,
.entry-content .size-thumbnail {
  max-width: 100%;
  height: auto;
}
.entry-content pre {
  background: #000;
  font-size: 0.9em;
  padding: 1.5em;
  margin: 0 0 1.5em;
  border-radius: 3px;
}

.wp-caption {
  max-width: 100%;
  padding: 5px;
}
.wp-caption img {
  max-width: 100%;
  margin-bottom: 0;
  width: 100%;
}
.wp-caption p.wp-caption-text {
  font-size: 0.85em;
  margin: 4px 0 7px;
  text-align: center;
}

.tags {
  margin: 0;
}

/* Posts - @end */
/*********************
PAGE NAVI STYLES
*********************/
/* Pagination - @begin */
.pagination,
.wp-prev-next {
  margin: 1.5em 0;
}

.pagination {
  text-align: center;
}
.pagination ul {
  display: inline-block;
  background-color: #fff;
  white-space: nowrap;
  padding: 0;
  clear: both;
  border-radius: 3px;
}
.pagination li {
  padding: 0;
  margin: 0;
  float: left;
  display: inline;
  overflow: hidden;
  border-right: 1px solid #ccc;
}
.pagination a,
.pagination span {
  margin: 0;
  text-decoration: none;
  padding: 0;
  line-height: 1em;
  font-size: 1em;
  font-weight: normal;
  padding: 0.75em;
  min-width: 1em;
  display: block;
  color: #2980b9;
}
.pagination a:hover, .pagination a:focus,
.pagination span:hover,
.pagination span:focus {
  background-color: #2980b9;
  color: #fff;
}
.pagination .current {
  cursor: default;
  color: #1e1e1e;
}
.pagination .current:hover, .pagination .current:focus {
  background-color: #fff;
  color: #1e1e1e;
}

.wp-prev-next .prev-link {
  float: left;
}
.wp-prev-next .next-link {
  float: right;
}

/* Pagination - @end */
/*********************
COMMENT STYLES + COMMENT FORM STYLES
*********************/
/*********************
SIDEBARS & ASIDES
*********************/
/* Sidebar - @begin */
.no-widgets {
  background-color: #fff;
  padding: 1.5em;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 2px;
  margin-bottom: 1.5em;
}

/* Sidebar - @end */
/*********************
FOOTER STYLES
*********************/
/* Footer - @begin */
.main-footer {
  clear: both;
  height: auto;
  background-color: #131313;
  color: #fafafa;
}

/* Footer - @end */
/* Base - @end */
/* ClearFix - @begin */
.cf:after {
  content: "";
  display: table;
  clear: both;
}

/* ClearFix - @end */
/* Floats - @begin */
.to-left {
  float: left;
}

.to-right {
  float: right;
}

/* Floats - @end */
/* Display - @begin */
.flex.flex {
  display: flex;
}

.inline-flex.inline-flex {
  display: inline-flex;
}

.inline.inline {
  display: inline;
}

.block.block {
  display: block;
}

.inline-block.inline-block {
  display: inline-block;
}

.hidden.hidden {
  display: none;
  visibility: hidden;
}

.invisible.invisible {
  visibility: hidden;
  opacity: 0;
}

/* Display - @end */
/* Visibility - @begin */
.p-up.p-up,
.p-down.p-down,
.m-up.m-up,
.m-down.m-down,
.t-up.t-up,
.t-down.t-down,
.t-only.t-only,
.d-up.d-up {
  display: none !important;
}

@media ( min-width: 480px ) {
  .p-up.p-up {
    display: block !important;
  }
  .p-up.p-up.columns, .p-up.p-up.flex {
    display: flex !important;
  }
  .p-up.p-up.inline-flex {
    display: inline-flex !important;
  }
  .p-up.p-up.inline-block {
    display: inline-block !important;
  }
  .p-up.p-up.inline {
    display: inline !important;
  }
  .p-up.p-up.hidden {
    display: none !important;
    visibility: hidden;
  }
}
@media ( max-width: 479px ) {
  .p-down.p-down {
    display: block !important;
  }
  .p-down.p-down.columns, .p-down.p-down.flex {
    display: flex !important;
  }
  .p-down.p-down.inline-flex {
    display: inline-flex !important;
  }
  .p-down.p-down.inline-block {
    display: inline-block !important;
  }
  .p-down.p-down.inline {
    display: inline !important;
  }
  .p-down.p-down.hidden {
    display: none !important;
    visibility: hidden;
  }
}
@media ( min-width: 768px ) {
  .t-up.t-up {
    display: block !important;
  }
  .t-up.t-up.columns, .t-up.t-up.flex {
    display: flex !important;
  }
  .t-up.t-up.inline-flex {
    display: inline-flex !important;
  }
  .t-up.t-up.inline-block {
    display: inline-block !important;
  }
  .t-up.t-up.inline {
    display: inline !important;
  }
  .t-up.t-up.hidden {
    display: none !important;
    visibility: hidden;
  }
}
@media ( max-width: 1039px ) {
  .t-down.t-down {
    display: block !important;
  }
  .t-down.t-down.columns, .t-down.t-down.flex {
    display: flex !important;
  }
  .t-down.t-down.inline-flex {
    display: inline-flex !important;
  }
  .t-down.t-down.inline-block {
    display: inline-block !important;
  }
  .t-down.t-down.inline {
    display: inline !important;
  }
  .t-down.t-down.hidden {
    display: none !important;
    visibility: hidden;
  }
}
@media ( min-width: 768px ) and ( max-width: 1039px ) {
  .t-only.t-only {
    display: block !important;
  }
  .t-only.t-only.columns, .t-only.t-only.flex {
    display: flex !important;
  }
  .t-only.t-only.inline-flex {
    display: inline-flex !important;
  }
  .t-only.t-only.inline-block {
    display: inline-block !important;
  }
  .t-only.t-only.inline {
    display: inline !important;
  }
  .t-only.t-only.hidden {
    display: none !important;
    visibility: hidden;
  }
}
@media ( min-width: 1040px ) {
  .d-up.d-up {
    display: block !important;
  }
  .d-up.d-up.columns, .d-up.d-up.flex {
    display: flex !important;
  }
  .d-up.d-up.inline-flex {
    display: inline-flex !important;
  }
  .d-up.d-up.inline-block {
    display: inline-block !important;
  }
  .d-up.d-up.inline {
    display: inline !important;
  }
  .d-up.d-up.hidden {
    display: none !important;
    visibility: hidden;
  }
}
@media ( max-width: 959px ) {
  .m-down.m-down {
    display: block !important;
  }
  .m-down.m-down.columns, .m-down.m-down.flex {
    display: flex !important;
  }
  .m-down.m-down.inline-flex {
    display: inline-flex !important;
  }
  .m-down.m-down.inline-block {
    display: inline-block !important;
  }
  .m-down.m-down.inline {
    display: inline !important;
  }
  .m-down.m-down.hidden {
    display: none !important;
    visibility: hidden;
  }
}
@media ( min-width: 960px ) {
  .m-up.m-up {
    display: block !important;
  }
  .m-up.m-up.columns, .m-up.m-up.flex {
    display: flex !important;
  }
  .m-up.m-up.inline-flex {
    display: inline-flex !important;
  }
  .m-up.m-up.inline-block {
    display: inline-block !important;
  }
  .m-up.m-up.inline {
    display: inline !important;
  }
  .m-up.m-up.hidden {
    display: none !important;
    visibility: hidden;
  }
}
/* Visibility - @end */
/* Positions - @begin */
.static {
  position: static;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.fixed {
  position: fixed;
}

/* Positions - @end */
/* Centering - @begin */
.center {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.middle {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.centered {
  position: relative;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}

.absolute-center {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.absolute-middle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.absolute-centered {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}

/* Centering - @end */
/* Margins - @begin */
.mgn-lft-auto.mgn-lft-auto {
  margin-left: auto;
}

.mgn-rgt-auto.mgn-rgt-auto {
  margin-right: auto;
}

.mgn-top-auto.mgn-top-auto {
  margin-top: auto;
}

.mgn-btm-auto.mgn-btm-auto {
  margin-bottom: auto;
}

.mgn-x-auto.mgn-x-auto {
  margin-left: auto;
  margin-right: auto;
}

.mgn-y-auto.mgn-y-auto {
  margin-left: auto;
  margin-right: auto;
}

.mgn-auto.mgn-auto {
  margin: auto;
}

/* Margins - @end */
/* Backgrounds (images, sizes, etc) - @begin */
.bg-img {
  background-color: transparent;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 50%;
}

.bg-contain {
  background-size: contain;
}

.bg-cover {
  background-size: cover;
}

.fader {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
}

/* Backgrounds (images, sizes, etc) - @end */
/* Fittings - @begin */
.fit-contain {
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.fit-cover {
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
  width: 100%;
  height: 100%;
}

/* Fittings - @end */
/* Ratios - @begin */
.ratio {
  position: relative;
  display: inline-block;
  margin: 0;
  vertical-align: top;
}
@supports not (aspect-ratio: auto) {
  .ratio::before {
    position: relative;
    z-index: 1;
    content: "";
    display: block;
  }
}
.ratio > .ratio-content {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
}
.ratio > .ratio-content.no-crop {
  overflow: visible;
}

@media all {
  @supports not (aspect-ratio: auto) {
    .ratio-1x2::before {
      padding-top: 200%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-1x2 {
      aspect-ratio: 1/2;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-2x3::before {
      padding-top: 150%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-2x3 {
      aspect-ratio: 2/3;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-1x1::before {
      padding-top: 100%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-1x1 {
      aspect-ratio: 1/1;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-2x1::before {
      padding-top: 50%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-2x1 {
      aspect-ratio: 2/1;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-3x2::before {
      padding-top: 66.6666666667%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-3x2 {
      aspect-ratio: 3/2;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-3x4::before {
      padding-top: 133.3333333333%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-3x4 {
      aspect-ratio: 3/4;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-4x3::before {
      padding-top: 75%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-4x3 {
      aspect-ratio: 4/3;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-16x9::before {
      padding-top: 56.25%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-16x9 {
      aspect-ratio: 16/9;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-16x10::before {
      padding-top: 62.5%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-16x10 {
      aspect-ratio: 16/10;
    }
  }
  @supports not (aspect-ratio: auto) {
    .ratio-21x9::before {
      padding-top: 42.8571428571%;
    }
  }
  @supports (aspect-ratio: auto) {
    .ratio-21x9 {
      aspect-ratio: 21/9;
    }
  }
}
@media ( min-width: 480px ) {
  @supports not (aspect-ratio: auto) {
    .p-ratio-1x2::before {
      padding-top: 200%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-1x2 {
      aspect-ratio: 1/2;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-2x3::before {
      padding-top: 150%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-2x3 {
      aspect-ratio: 2/3;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-1x1::before {
      padding-top: 100%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-1x1 {
      aspect-ratio: 1/1;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-2x1::before {
      padding-top: 50%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-2x1 {
      aspect-ratio: 2/1;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-3x2::before {
      padding-top: 66.6666666667%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-3x2 {
      aspect-ratio: 3/2;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-3x4::before {
      padding-top: 133.3333333333%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-3x4 {
      aspect-ratio: 3/4;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-4x3::before {
      padding-top: 75%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-4x3 {
      aspect-ratio: 4/3;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-16x9::before {
      padding-top: 56.25%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-16x9 {
      aspect-ratio: 16/9;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-16x10::before {
      padding-top: 62.5%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-16x10 {
      aspect-ratio: 16/10;
    }
  }
  @supports not (aspect-ratio: auto) {
    .p-ratio-21x9::before {
      padding-top: 42.8571428571%;
    }
  }
  @supports (aspect-ratio: auto) {
    .p-ratio-21x9 {
      aspect-ratio: 21/9;
    }
  }
}
@media ( min-width: 960px ) {
  @supports not (aspect-ratio: auto) {
    .t-ratio-1x2::before {
      padding-top: 200%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-1x2 {
      aspect-ratio: 1/2;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-2x3::before {
      padding-top: 150%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-2x3 {
      aspect-ratio: 2/3;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-1x1::before {
      padding-top: 100%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-1x1 {
      aspect-ratio: 1/1;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-2x1::before {
      padding-top: 50%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-2x1 {
      aspect-ratio: 2/1;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-3x2::before {
      padding-top: 66.6666666667%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-3x2 {
      aspect-ratio: 3/2;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-3x4::before {
      padding-top: 133.3333333333%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-3x4 {
      aspect-ratio: 3/4;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-4x3::before {
      padding-top: 75%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-4x3 {
      aspect-ratio: 4/3;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-16x9::before {
      padding-top: 56.25%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-16x9 {
      aspect-ratio: 16/9;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-16x10::before {
      padding-top: 62.5%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-16x10 {
      aspect-ratio: 16/10;
    }
  }
  @supports not (aspect-ratio: auto) {
    .t-ratio-21x9::before {
      padding-top: 42.8571428571%;
    }
  }
  @supports (aspect-ratio: auto) {
    .t-ratio-21x9 {
      aspect-ratio: 21/9;
    }
  }
}
@media ( min-width: 1040px ) {
  @supports not (aspect-ratio: auto) {
    .d-ratio-1x2::before {
      padding-top: 200%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-1x2 {
      aspect-ratio: 1/2;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-2x3::before {
      padding-top: 150%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-2x3 {
      aspect-ratio: 2/3;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-1x1::before {
      padding-top: 100%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-1x1 {
      aspect-ratio: 1/1;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-2x1::before {
      padding-top: 50%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-2x1 {
      aspect-ratio: 2/1;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-3x2::before {
      padding-top: 66.6666666667%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-3x2 {
      aspect-ratio: 3/2;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-3x4::before {
      padding-top: 133.3333333333%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-3x4 {
      aspect-ratio: 3/4;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-4x3::before {
      padding-top: 75%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-4x3 {
      aspect-ratio: 4/3;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-16x9::before {
      padding-top: 56.25%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-16x9 {
      aspect-ratio: 16/9;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-16x10::before {
      padding-top: 62.5%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-16x10 {
      aspect-ratio: 16/10;
    }
  }
  @supports not (aspect-ratio: auto) {
    .d-ratio-21x9::before {
      padding-top: 42.8571428571%;
    }
  }
  @supports (aspect-ratio: auto) {
    .d-ratio-21x9 {
      aspect-ratio: 21/9;
    }
  }
}
/* Ratios - @end */
/* Events - @begin */
.no-events {
  pointer-events: none;
}

.all-events {
  pointer-events: all;
}

/* Events - @end */
/* Debug - @begin */
.debug {
  border: 1px dashed cyan;
}
.debug .debug {
  border-color: magenta;
}
.debug .debug .debug {
  border-color: yellow;
}
.debug .debug .debug .debug {
  border-color: red;
}
.debug .debug .debug .debug .debug {
  border-color: green;
}
.debug .debug .debug .debug .debug .debug {
  border-color: blue;
}

/* Debug - @end */
/* @begin css dots spinner */
.daikin-ellipsis {
  display: block;
  margin: 0 auto;
  position: relative;
  width: 8rem;
  aspect-ratio: 1/1;
}
.daikin-ellipsis.not-active {
  display: none;
}
.daikin-ellipsis div {
  position: absolute;
  top: calc(50% - 0.7rem);
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 50%;
  background: var(--color-blue);
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.daikin-ellipsis div:nth-child(1) {
  left: 0.8rem;
  animation: daikin-ellipsis1 0.6s infinite;
}
.daikin-ellipsis div:nth-child(2) {
  left: 0.8rem;
  animation: daikin-ellipsis2 0.6s infinite;
}
.daikin-ellipsis div:nth-child(3) {
  left: 3.2rem;
  animation: daikin-ellipsis2 0.6s infinite;
}
.daikin-ellipsis div:nth-child(4) {
  left: 5.6rem;
  animation: daikin-ellipsis3 0.6s infinite;
}

@keyframes daikin-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes daikin-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes daikin-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(2.4rem, 0);
  }
}
/* @end css dots spinner */
/* Media Queries - @begin */
@media screen and ( min-width: 1040px ) {
  /* Desktop Up - @begin */
  .wrap {
    max-width: 102.4rem;
  }
  /* Desktop Up - @end */
}
@media screen and ( min-width: 1280px ) {
  /* Big Desktop Up - @begin */
  .wrap {
    max-width: 128rem;
  }
  /* Big Desktop Up - @end */
}
/* Media Queries - @end */
/* Vendor overrides - @begin */
/* Vendor overrides - @end */
html,
body {
  scroll-behavior: smooth;
}
@media screen and (max-width: 960px) {
  html,
  body {
    overflow-x: hidden;
    overflow-y: auto;
  }
  html.mobile-menu-opened,
  body.mobile-menu-opened {
    overflow-y: hidden;
  }
}

.accordion-group {
  margin-top: 1.5rem;
}
.accordion-group.opened + .accordion-group {
  margin-top: 9rem;
}
.accordion-group.empty .accordion-group-toggle {
  pointer-events: none;
  cursor: pointer;
}
.accordion-group.empty .accordion-group-label .doctype-label,
.accordion-group.empty .accordion-group-label .doctype-qty {
  opacity: 0.5;
}
.accordion-group .accordion-group-toggle {
  transition: margin 0.4s;
}
.accordion-group .accordion-group-toggle .doctype-qty {
  margin-right: auto;
  padding: 0 1em;
}
.accordion-group .accordion-group-label {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 0 none;
  padding: 1.6rem 3.2rem;
  text-align: left;
  background-color: var(--color-blue-light);
}
.accordion-group .accordion-group-label::after {
  content: "";
  display: block;
  width: 1.8rem;
  aspect-ratio: 1;
  border-top: 2px solid var(--color-transparent);
  border-right: 2px solid var(--color-grey-blue-dark);
  border-bottom: 2px solid var(--color-grey-blue-dark);
  border-left: 2px solid var(--color-transparent);
  transform-origin: center;
  transform: translateY(-40%) rotate(45deg);
  transition: transform 0.4s;
}
.accordion-group .accordion-contents {
  overflow: hidden;
  height: 0;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  grid-gap: 3rem;
  transition: height 0.4s;
}
@media screen and (( min-width: 1040px )) {
  .accordion-group .accordion-contents {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.accordion-group.opened .accordion-group-toggle {
  margin-bottom: 3rem;
}
.accordion-group.opened .accordion-group-label::after {
  transform: translateY(40%) rotate(-135deg);
}

.document-item .inner-wrapper {
  padding: 6rem 3rem 3rem;
  height: 100%;
  background-color: var(--color-blue-light);
  display: flex;
  flex-direction: column;
}
.document-item .document-metas {
  width: 100%;
}
.document-item .document-mimetype {
  display: inline-flex;
  align-items: flex-end;
  height: 8rem;
  width: 6rem;
  padding: 0.75em;
  color: var(--color-white);
  background-color: var(--color-blue-dark);
  clip-path: polygon(0 0, calc(100% - 1.5rem) 0, 100% 1.5rem, 100% 100%, 0 100%);
}
.document-item .document-name {
  margin-top: 1.6rem;
  text-wrap: pretty;
  word-break: break-all;
}
.document-item .document-date {
  margin-bottom: 0.8rem;
}
.document-item .document-actions {
  margin-top: auto;
  display: flex;
  justify-content: flex-end;
}
.document-item .file-action svg {
  width: 3.2rem;
  height: 3.2rem;
}

.hs_cos_wrapper_type_module:has(.document-item.hidden) {
  display: none;
}

.page-anchor {
  position: absolute;
  top: 0;
  left: 0;
}

.modal {
  position: fixed;
  z-index: 10;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100dvw;
  height: 100dvh;
  background-color: var(--color-transparent-black);
  display: none;
  pointer-events: none;
}
.modal-opened .modal {
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: all;
}
.modal .modal-body {
  position: relative;
  display: block;
  padding: 3.2em 2.4em 2.4em 2.4em;
  min-width: 33.33333%;
  height: auto;
  background-color: var(--color-white);
}
.modal .modal-close {
  display: block;
  position: absolute;
  width: 1.8em;
  height: 1.8em;
  top: 1em;
  right: 1em;
  overflow: hidden;
  text-indent: 101%;
}
.modal .modal-close::before, .modal .modal-close::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.8em;
  height: 0.3rem;
  border: 0 none;
  background-color: var(--color-grey-blue);
  transform-origin: 50%;
}
.modal .modal-close::before {
  transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
.modal .modal-close::after {
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
.modal .modal-close:hover::before, .modal .modal-close:hover::after {
  background-color: var(--color-blue);
}
.button {
  display: block;
  max-width: -moz-fit-content;
  max-width: fit-content;
  padding: 0.6em 1.2em;
  border-radius: 0.4rem;
  font-family: var(--font-sans);
  font-weight: 700;
  text-decoration: none;
  border: 1px solid var(--color-black);
  color: var(--color-white);
  background-color: var(--color-black);
  transition: border-color 0.4s, color 0.4s, background-color 0.4s;
}
.button:disabled, .button.disabled {
  pointer-events: none;
  filter: grayscale(1);
  opacity: 0.75;
}
.button + .button {
  margin-left: 1em;
}
@media screen and ((min-width: 1040px)) {
  .button:hover {
    color: var(--color-black);
    background-color: var(--color-white);
  }
}
.button.button-white {
  border-color: var(--color-white);
  color: var(--color-black);
  background-color: var(--color-white);
}
@media screen and ((min-width: 1040px)) {
  .button.button-white:hover {
    color: var(--color-white);
    background-color: var(--color-black);
  }
}
.button.button-blue {
  border-color: var(--color-blue);
  color: var(--color-white);
  background-color: var(--color-blue);
}
@media screen and ((min-width: 1040px)) {
  .button.button-blue:hover {
    color: var(--color-blue);
    background-color: var(--color-white);
  }
}
.button.button-grey-light {
  border-color: var(--color-grey-light);
  color: var(--color-grey-blue);
  background-color: var(--color-grey-light);
}
@media screen and ((min-width: 1040px)) {
  .button.button-grey-light:hover {
    border-color: var(--color-grey-blue);
    color: var(--color-grey-blue);
    background-color: var(--color-white);
  }
}
.button.button-transparent {
  border-color: var(--color-transparent);
  color: var(--color-black);
  background-color: var(--color-transparent);
}
@media screen and ((min-width: 1040px)) {
  .button.button-transparent:hover {
    border-color: var(--color-transparent);
    background-color: var(--color-transparent);
    text-decoration: underline;
  }
}
.button.button-tab {
  padding: 1.2em 1.8em;
  border-radius: 0;
  border-color: var(--color-grey-blue-light);
  border-bottom-color: var(--color-white);
  color: var(--color-grey);
  background-color: var(--color-white);
}
.button.button-tab:not(.active) {
  color: var(--color-grey-medium-dark);
}
.button.button-tab:hover {
  color: var(--color-grey);
}
@media screen and ((min-width: 1040px)) {
  .button.button-tab:not(.active), .button.button-tab:hover {
    background-color: var(--color-grey-light);
  }
}
.button.button-tab + .button-tab {
  margin-left: 0;
}
.button.button-tab:not(:first-child):not(:last-child) {
  border-right: 0 none;
  border-left: 0 none;
}
.button.button-tab:first-child {
  border-radius: 0.6rem 0 0 0;
  border-right: 0 none;
}
.button.button-tab:last-child {
  border-radius: 0 0.6rem 0 0;
  border-left: 0 none;
}

.listing-page .main-contents,
.roles-page .main-contents,
.upload-page .main-contents {
  padding-bottom: 7rem;
}

.item-row {
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid var(--color-grey-blue-light);
}

.item-cell {
  display: flex;
  align-items: center;
  padding: 0.5em 1em;
}

.item-file .document-bulk-select,
.item-file .item-bulk-select {
  border-radius: 0.4rem;
  display: block;
  height: 2rem;
  margin: 0 3rem 0 0;
  padding: 0;
  position: relative;
  width: 2rem;
  border: 1px solid var(--color-grey-blue);
  cursor: pointer;
}
.item-file .document-bulk-select:has(:checked),
.item-file .item-bulk-select:has(:checked) {
  background-color: var(--color-grey-blue);
}
.item-file .bulk-select {
  cursor: pointer;
  height: 2rem;
  margin: 0;
  opacity: 0;
  padding: 0;
  width: 2rem;
}
.item-file .document-name,
.item-file .item-name {
  margin: 0;
  padding-left: 3rem;
}
.item-file .range-name,
.item-file .technology-name,
.item-file .doctype-name {
  padding-left: 0;
}
.item-file .range-thumb {
  border: 1px solid var(--color-grey-blue);
  max-width: 10rem;
  max-height: 10rem;
  width: 10rem;
  height: 10rem;
  display: flex;
  margin-right: 3rem;
}

.item-date {
  min-width: 10rem;
}
.item-date .document-date {
  margin: 0;
}

.item-actions {
  min-width: 20rem;
  justify-content: space-between;
}

.item-date,
.item-actions {
  border-left: 1px solid var(--color-grey-blue-light);
}

.bulk-options {
  overflow: hidden;
  height: 0;
  padding-top: 2em;
}
[data-edit=true] .bulk-options {
  height: auto;
}
@media screen and ((min-width: 1040px)) {
  .bulk-options .input-fieldset + .input-fieldset {
    padding-top: 0;
  }
}
@media screen and ((min-width: 1040px)) {
  .bulk-options .input-fieldset:nth-child(n+4) {
    padding-top: 2rem;
  }
}
.bulk-options .bulk-actions {
  flex-direction: row;
  justify-content: flex-end;
}

.roles-page .main-contents-heading {
  padding-top: 0.5em;
}
.roles-page .roles-tables-wrapper {
  overflow: auto;
  max-height: 70vh;
  height: 70vh;
  min-height: 70vh;
}
.roles-page .visibility-grid:not(.active) {
  display: none;
  pointer-events: none;
}
.roles-page .visibility-grid .alternate-row {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  min-height: 5rem;
  background-color: var(--color-white);
}
.roles-page .visibility-grid .alternate-row .first-col {
  background-color: var(--color-white);
}
.roles-page .visibility-grid .alternate-row:nth-child(even) {
  background-color: var(--color-blue-light);
}
.roles-page .visibility-grid .alternate-row:nth-child(even) .first-col {
  background-color: var(--color-blue-light);
}
.roles-page .visibility-grid .alternate-row.first-row {
  position: sticky;
  top: 0;
  z-index: 2;
}
.roles-page .visibility-grid .alternate-row.first-row .alternate-col {
  flex-direction: column;
  align-items: flex-start;
  text-align: center;
}
.roles-page .visibility-grid .alternate-col {
  min-width: 15rem;
  width: 15rem;
  max-width: 15rem;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  padding: 1rem;
  border-right: 1px solid var(--color-grey-blue-light);
}
.roles-page .visibility-grid .alternate-col:last-child {
  border-right: 1px solid var(--color-transparent);
}
.roles-page .visibility-grid .alternate-col.first-col {
  position: sticky;
  left: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  min-width: 20rem;
  width: 20rem;
  max-width: 20rem;
  padding-left: 1.5rem;
  z-index: 1;
}
.roles-page .visibility-grid .user-role,
.roles-page .visibility-grid .sales-area {
  margin: 0 auto;
}
.roles-page .visibility-grid .technology {
  color: var(--color-black);
}
.roles-page .visibility-grid .doctype,
.roles-page .visibility-grid .range {
  color: var(--color-grey);
}
.roles-page .visibility-grid p + p {
  margin-top: 0;
}
.roles-page .visibility-grid .actions {
  display: none;
}
.roles-page .visibility-grid .action {
  overflow: hidden;
  text-overflow: clip;
  text-indent: 101%;
  display: block;
  margin: 0;
  padding: 0;
  width: 2rem;
  height: 2rem;
  line-height: 2rem;
  border-radius: 50%;
  border: 1px solid var(--color-grey-blue-dark);
  background-color: var(--color-white);
  color: var(--color-grey-blue-dark);
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
}
.roles-page .visibility-grid .action.action-edit {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZGF0YS1uYW1lPSJQZW5jaWwiIHZlcnNpb249IjEuMSI+CiA8Zz4KICA8cGF0aCBkPSJtMTIuNTQ5MzYsNS40NzkxNGwtNi40ODIxOCw2LjQ4MjE4YzAsMCAtMC4xNDQwNSwwLjE0NDA1IC0wLjI4ODEsMC4yODgxYzAsMCAwLDAgMCwwYy0wLjE0NDA1LDAgLTAuNDMyMTUsMC4yODgxIC0wLjU3NjE5LDAuMjg4MWwtMS4yOTY0NCwwLjQzMjE1YzAsMCAtMC4xNDQwNSwwIC0wLjE0NDA1LDBjLTAuMTQ0MDUsMCAtMC40MzIxNSwwIC0wLjQzMjE1LC0wLjE0NDA1Yy0wLjE0NDA1LC0wLjE0NDA1IC0wLjI4ODEsLTAuNDMyMTUgLTAuMTQ0MDUsLTAuNzIwMjRsMC40MzIxNSwtMS4yOTY0NGMwLC0wLjI4ODEgMC4xNDQwNSwtMC40MzIxNSAwLjI4ODEsLTAuNTc2MTljMCwwIDAsMCAwLDBjMCwwIDAuMTQ0MDUsLTAuMjg4MSAwLjI4ODEsLTAuMjg4MWw2LjE5NDA4LC02LjYyNjIzYzAuMTQ0MDUsLTAuMTQ0MDUgMC40MzIxNSwtMC4yODgxIDAuNzIwMjQsLTAuMjg4MXMwLjU3NjE5LDAgMC43MjAyNCwwLjI4ODFsMC43MjAyNCwwLjcyMDI0YzAuNDMyMTUsMC40MzIxNSAwLjQzMjE1LDEuMTUyMzkgMCwxLjQ0MDQ4bDAsMGwwLjAwMDAxLDB6bS03LjYzNDU3LDYuMzM4MTNsLTAuODY0MjksLTAuODY0MjlsLTAuNDMyMTUsMS4yOTY0NGwxLjI5NjQ0LC0wLjQzMjE1em02LjE5NDA4LC01LjkwNTk5bC0xLjE1MjM5LC0xLjE1MjM5bC01LjYxNzg5LDUuNjE3ODlsMS4xNTIzOSwxLjE1MjM5bDUuNjE3ODksLTUuNjE3ODl6bTEuMDA4MzQsLTEuNDQwNDhsLTAuNzIwMjQsLTAuNzIwMjRzLTAuMTQ0MDUsMCAtMC4yODgxLDBzLTAuMTQ0MDUsMCAtMC4yODgxLDBsLTAuNDMyMTUsMC40MzIxNWwxLjE1MjM5LDEuMTUyMzlsMC40MzIxNSwtMC40MzIxNWMwLDAgMCwtMC4yODgxIDAsLTAuNDMyMTVsMCwwbDAuMTQ0MDUsMHoiIHN0cm9rZT0ibnVsbCIgZmlsbD0iIzMyM2Y0YSIgaWQ9InBlbmNpbCIvPgogPC9nPgo8L3N2Zz4K");
}
.roles-page .visibility-grid .action.action-delete {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZGF0YS1uYW1lPSJUcmFzaCBCaW4iIHZlcnNpb249IjEuMSI+CiA8Zz4KICA8cGF0aCBkPSJtMTEuNDgxMywzLjkyNzU0bC0yLjEwMTkxLDBsMCwtMC4yNjI3NGMwLC0wLjM5NDExIC0wLjI2Mjc0LC0wLjY1Njg1IC0wLjY1Njg1LC0wLjY1Njg1bC0wLjEzMTM3LDBzLTEuMzEzNywwIC0xLjMxMzcsMGMtMC41MjU0OCwwIC0wLjc4ODIyLDAuMjYyNzQgLTAuNzg4MjIsMC42NTY4NWwwLDAuMjYyNzRsLTIuMTAxOTEsMGMtMC4yNjI3NCwwIC0wLjUyNTQ4LDAuMjYyNzQgLTAuNTI1NDgsMC41MjU0OGwwLDAuNTI1NDhjMCwwLjI2Mjc0IDAuMTMxMzcsMC4zOTQxMSAwLjM5NDExLDAuNTI1NDhsMC41MjU0OCw3LjA5Mzk2YzAsMC4yNjI3NCAwLjI2Mjc0LDAuMzk0MTEgMC41MjU0OCwwLjM5NDExbDUuMzg2MTUsMGMwLjI2Mjc0LDAgMC41MjU0OCwtMC4yNjI3NCAwLjUyNTQ4LC0wLjM5NDExbDAuNTI1NDgsLTcuMDkzOTZjMC4yNjI3NCwwIDAuMzk0MTEsLTAuMjYyNzQgMC4zOTQxMSwtMC41MjU0OGwwLC0wLjUyNTQ4YzAsLTAuMjYyNzQgLTAuMjYyNzQsLTAuNTI1NDggLTAuNTI1NDgsLTAuNTI1NDhsLTAuMTMxMzcsMHptLTQuNDY2NTcsMGwwLC0wLjI2Mjc0czAsMCAwLDBsMS40NDUwNywwczAsMCAwLDBsMCwwLjI2Mjc0bC0xLjcwNzgsMGwwLjI2Mjc0LDBsLTAuMDAwMDEsMHptNC4zMzUyLDAuOTE5NTlsLTYuOTYyNTksMGwwLC0wLjM5NDExbDYuOTYyNTksMGwwLDAuMzk0MTF6bS0wLjM5NDExLDAuNjU2ODVsLTAuNTI1NDgsNi45NjI1OWwtNS4xMjM0MSwwbC0wLjUyNTQ4LC02Ljk2MjU5bDYuMTc0MzcsMHoiIGlkPSJ0cmFzaC1iaW4iIGZpbGw9IiMzMjNmNGEiIHN0cm9rZT0ibnVsbCIvPgogPC9nPgo8L3N2Zz4K");
}
.roles-page .visibility-grid .action.action-clone, .roles-page .visibility-grid .action.action-clone-column {
  background-size: 70%;
  background-position: center center;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAZElEQVR4nOXUWwrAIAxE0bu8Sve/Ae0+xv9C+ggxaDuQL4kHExC+HDmrAWUkIKBmvDwf2IEjYOaygBY0c1mAd3Y69c0J6MXZjwDd1PzA+jtIBa7yuG840II+OzPFiVRgs69dPR1cjsKRt7mLFwAAAABJRU5ErkJggg==");
}
.roles-page .visibility-grid .action.action-check {
  border: 0 none;
  border-radius: 0;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmVyc2lvbj0iMS4xIiBkYXRhLW5hbWU9IkNoZWNrIEJveCI+CiA8Zz4KICA8cmVjdCByeD0iMiIgaWQ9InN2Z18yIiBoZWlnaHQ9IjE0IiB3aWR0aD0iMTQiIHk9IjEiIHg9IjEiIHN0cm9rZT0iIzMyM2Y0YSIgZmlsbD0iI2ZmZiIvPgogIDxnIHN0cm9rZT0ibnVsbCIgaWQ9InN2Z181Ij4KICAgPGxpbmUgc3Ryb2tlPSIjMzIzZjRhIiBpZD0ic3ZnXzMiIHkyPSIxMS4zNTM1OSIgeDI9IjcuMjM4OTUiIHkxPSI2Ljg0MzA3IiB4MT0iMi43Mjg0MyIgZmlsbD0ibm9uZSIvPgogICA8bGluZSBzdHJva2U9IiMzMjNmNGEiIGlkPSJzdmdfNCIgeTI9IjQuNjQ2NDEiIHgyPSIxMy4yNzE1NyIgeTE9IjExLjM1MTIxIiB4MT0iNi41NjY3NyIgZmlsbD0ibm9uZSIvPgogIDwvZz4KIDwvZz4KPC9zdmc+Cg==");
}
.roles-page .visibility-grid .action.action-check[data-check-all=false] {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmVyc2lvbj0iMS4xIiBkYXRhLW5hbWU9IkNoZWNrIEJveCI+CiA8Zz4KICA8cmVjdCByeD0iMiIgaWQ9InN2Z18yIiBoZWlnaHQ9IjE0IiB3aWR0aD0iMTQiIHk9IjEiIHg9IjEiIHN0cm9rZT0iIzMyM2Y0YSIgZmlsbD0iI2ZmZiIvPgogPC9nPgo8L3N2Zz4K");
}
.roles-page .visibility-grid .action + .action {
  margin-left: 1rem;
}
.roles-page .visibility-grid .action + .action.action-check {
  margin-left: 2rem;
}
.roles-page .visibility-grid .visibility-check-label {
  position: relative;
  display: block;
  margin: 0;
  padding: 0;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--color-transparent);
  border-radius: 0.4rem;
  cursor: default;
  pointer-events: none;
}
.roles-page .visibility-grid .visibility-check-label::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 2rem;
  height: 1.5rem;
  border: 3px solid var(--color-transparent);
  transform-origin: 50%;
  transform: translateX(-50%) translateY(-80%) rotate(-45deg);
  pointer-events: none;
}
.roles-page .visibility-grid .visibility-check-label:has(input[type=checkbox]:checked)::after {
  border-bottom-color: var(--color-grey-blue);
  border-left-color: var(--color-grey-blue);
}
.roles-page .visibility-grid input[type=checkbox] {
  opacity: 0;
  margin: 0;
  padding: 0;
  width: 2rem;
  height: 2rem;
  cursor: default;
  pointer-events: none;
}
.roles-page .main-contents[data-edit=false] .roles-add,
.roles-page .main-contents[data-edit=false] .roles-cancel,
.roles-page .main-contents[data-edit=false] .roles-apply {
  display: none;
  pointer-events: none;
}
.roles-page .main-contents[data-edit=true] .user-role,
.roles-page .main-contents[data-edit=true] .sales-area {
  margin-bottom: 1rem;
}
.roles-page .main-contents[data-edit=true] .actions {
  display: flex;
  width: 100%;
  margin-top: auto;
  justify-content: center;
}
.roles-page .main-contents[data-edit=true] .first-col .actions {
  margin-top: 1rem;
  justify-content: flex-start;
}
.roles-page .main-contents[data-edit=true] .visibility-check-label {
  border-color: var(--color-grey-blue);
  cursor: pointer;
  pointer-events: all;
}
.roles-page .main-contents[data-edit=true] .visibility-check-label:has(input[type=checkbox]:checked) {
  background-color: var(--color-grey-blue);
}
.roles-page .main-contents[data-edit=true] .visibility-check-label:has(input[type=checkbox]:checked)::after {
  border-bottom-color: var(--color-transparent);
  border-left-color: var(--color-transparent);
}
.roles-page .main-contents[data-edit=true] .roles-edit {
  display: none;
}
.roles-page .main-contents[data-edit=true] .roles-add,
.roles-page .main-contents[data-edit=true] .roles-apply,
.roles-page .main-contents[data-edit=true] input[type=checkbox] {
  cursor: pointer;
  pointer-events: all;
}

.win .roles-page ::-webkit-scrollbar {
  width: 0.8rem;
}
.win .roles-page ::-webkit-scrollbar-track {
  background: var(--color-white);
}
.win .roles-page ::-webkit-scrollbar-thumb {
  background: var(--color-grey-blue-dark);
}
.win .roles-page * {
  scrollbar-width: thin;
  scrollbar-color: var(--color-grey-blue-dark) var(--color-white);
}

.dropdown-menu {
  max-height: 300px;
  overflow-y: auto;
}

.columns.roles-filters {
  margin-bottom: 40px;
}

.columns.roles-filters .column {
  padding-top: 0;
  padding-right: 0;
}

/*{ % include './globals/_buttons.css' % }*/

.system-page {
  margin: 0;
  padding: 2.5rem 2.5rem 4rem;
  min-height: 100vh;
  display: flex;
  flex-direction: row;
}
.system-page-contents {
  width: 100%;
  border-radius: 2rem;
  background-color: var(--color-grey-light);
  align-self: stretch;
  overflow: hidden;
}

.system-page .login-content {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 8rem;
  padding-bottom: 4rem;
  background-image: radial-gradient(ellipse at 40% 0%, rgba(4, 146, 207, 0.2) 0, rgba(4, 146, 207, 0) 35%, transparent 100%),
                    radial-gradient(circle at 5% 80%, rgba(4, 146, 207, 0.2) 0, rgba(4, 146, 207, 0) 35%, transparent 100%);
}
.system-page-header,
.system-page-body,
.system-page-footer {
  margin-left: auto;
  margin-right: auto;
}

.system-page-header .system-page-logo {
  display: block;
  width: fit-content;
}
.system-page-header .system-page-logo img {
  width: 100%;
  height: auto;
  max-width: 17rem;
}

.system-page-body .prompt-heading {}
.system-page-body .prompt-heading h2 {
  font-size: var(--font-size-h2);
  line-height: var(--line-height-h2);
}
.system-page-body .prompt-heading p {
  padding-top: 1rem;
  font-family: var(--font-sans);
  font-size: var(--font-size-p);
  line-height: var(--line-height-p);
  font-weight: var(--weight-bold);
  color: var(--color-black);
}
.system-page-body .prompt-form {}
.system-page-body .form-heading {
  margin-top: 3.2rem;
}
.system-page-body form * {
  font-family: var(--font-sans);
}
.system-page-body form div {
  padding-top: 3rem;
}
.system-page-body form .actions {
  padding-top: 0;
}
.system-page-body label {
  font-size: var(--font-size-tiny);
  line-height: var(--line-height-small);
  color: var(--color-black);
  font-weight: var(--weight-bold);
}
.system-page-body input[type=text],
.system-page-body input[type=email],
.system-page-body input[type=password] {
  margin-top: .8rem;
  font-size: var(--font-size-p);
  line-height: var(--line-height-p);
  padding: 1.6rem;
  display: block;
  width: 100%;
  background-color: var(--color-white);
  border: 0 none;
}
.system-page-body label + a {
  padding-left: .75em;
  color: var(--color-red);
  font-size: var(--font-size-tiny);
  line-height: var(--line-height-small);
  text-decoration: none;
}
#hs-login-widget-remember + label,
#hs-login-widget-remember {}
#hs_login_reset {
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
  color: var(--color-red);
  text-decoration: none;
  font-weight: var(--weight-bold);
}
#hs_cos_wrapper_membership_admin_content {
  font-weight: var(--weight-bold);
  padding-top: 3rem;
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
  color: var(--color-black);
}
#hs_cos_wrapper_membership_admin_content a {
  color: var(--color-blue);
}

.system-page-body input[type=submit] {
  padding: 1.6rem 2.4rem;
  border-radius: .4rem;
  display: block;
  width: 100%;
  border: 0 none;
  background-color: var(--color-blue);
  color: var(--color-white);
  cursor: pointer;
}

.system-page .visual-content {
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background-color: var(--color-grey-blue-dark);
}

.system-page .error-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  justify-content: center;
  height: 100%;
  padding-top: 8rem;
  padding-bottom: 4rem;
}

.system-page .error-content .heading {
  margin-top: auto;
}
.system-page .error-content .sub-heading {
  margin-top: 0.25em;
}
.system-page .error-content .back-button {
  display: block;
  margin-top: 1.5em;
  margin-bottom: auto;
}
.system-page .error-message {
  margin-top: 2rem;
}

.listing-page {
  min-height: 100vh;
  display: flex;
  flex-direction: row;
  background-color: var(--color-white);
}

.menu-toggler-wrapper {
  top: 0;
  right: 0;
  z-index: 2;
  position: fixed;
}

.menu-toggler {
  margin: 1.5rem 1.5rem 0 auto;
  position: relative;
  width: 3.2rem;
  aspect-ratio: 1/1;
  overflow: hidden;

  /*linear-gradient(90deg, var(--color-green) 0%, var(--color-green) 25%, var(--color-transparent) 25%, var(--color-transparent) 100%),*/
  background-image: linear-gradient(
    180deg,
    var(--color-transparent) 0%,
    var(--color-transparent) calc(50% - 2px),
    var(--color-grey-blue-dark) calc(50% - 2px),
    var(--color-grey-blue-dark) calc(50% + 2px),
    var(--color-transparent) calc(50% + 2px),
    var(--color-transparent) 100%
  );
}
.menu-toggler::before,
.menu-toggler::after {
  content: "";
  display: inherit;
  position: absolute;
  left: 50%;
  width: 3.2rem;
  height: 0.4rem;
  background-color: var(--color-grey-blue-dark);

  transform-origin: 50% 50%;
  transform: translate(-50%, -50%) rotate(0deg);
  transition:
    transform 0.3s,
    top 0.3s;
}
.menu-toggler::before {
  top: 15%;
}
.menu-toggler::after {
  top: 85%;
}
.mobile-menu-opened .menu-toggler {
  background-image: linear-gradient(
    180deg,
    var(--color-transparent) 0%,
    var(--color-transparent) calc(50% - 2px),
    var(--color-transparent) calc(50% - 2px),
    var(--color-transparent) calc(50% + 2px),
    var(--color-transparent) calc(50% + 2px),
    var(--color-transparent) 100%
  );
}
.mobile-menu-opened .menu-toggler::before {
  top: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
}
.mobile-menu-opened .menu-toggler::after {
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

.menu-toggler-label {
  pointer-events: none;
  display: inherit;
  transform: translateX(101%);
}

.listing-page-contents {
  align-self: stretch;
}

.listing-page-navigation {
  position: absolute;
  left: -100%;
  top: 0;
  align-self: flex-start;
  padding-top: 3rem;
  padding-bottom: 3rem;
  padding-left: 3rem;
  background-color: var(--color-white);
  min-height: 100dvh;
  height: 100%;
  transition: left 0.4s;

  @media screen and (min-width: 960px) {
    box-shadow: 8px 0px 28px 0px var(--color-shadow-black);
    /* position: sticky; */
    position: relative;
    left: 0;
  }
}
.mobile-menu-opened .listing-page-navigation {
  left: 0;
  @media screen and (max-width: 960px) {
    max-width: 100vw;
    position: fixed;
    z-index: 1;
    overflow-y: auto;
  }
}

.dashboard .listing-page-navigation {
  background-color: var(--color-grey-blue-dark);
}

.listing-page-logo {
  display: block;
  max-width: 125px;
}

.listing-page-nav {
  margin-top: 6rem;
}
.listing-page-nav + .listing-page-nav {
  margin-top: 4rem;
}
.listing-page-nav .menu-heading {
  color: var(--color-grey-blue);
}
.listing-page-nav .menu-voice {
  text-decoration: none;
  color: var(--color-grey-blue-dark);

  transition: color 0.3s;
}
.listing-page-nav .menu-voice.text-red-dark {
  color: var(--color-red-dark);
}

.listing-page-nav .menu-voice:hover,
.listing-page-nav .menu-voice.current {
  color: var(--color-blue);
  font-weight: bold;
}

.dashboard .listing-page-nav .menu-voice,
.dashboard .listing-page-nav .menu-voice:hover,
.dashboard .listing-page-nav .menu-voice.current {
  color: var(--color-grey-light);
}

.listing-page-nav .menu-voice.text-red-dark:hover {
  color: var(--color-red);
}

.listing-page-nav .menu-voice,
.listing-page-nav .menu-voice + .menu-voice {
  margin-top: 0.8rem;
}

.listing-content {
  padding-top: 3rem;
  padding-bottom: 9rem;
  min-height: 100%;
  background-color: var(--color-white);
}

.listing-inner-wrapper {
}

.main-listing-block {
}

.main-listing-header {
  padding-top: 4rem;
}

.main-contents {
  padding-top: 4.8rem;
}
.range-deatils-page .main-contents {
  padding-top: 0;
}

.main-contents-heading {
}

.main-contents .listing-wrapper {
  margin-top: 1rem;
}

.main-contents .category-item {
  margin-top: 1.5rem;
  text-decoration: none;
}

.main-contents .category-item .category-label {
  /*padding-top: 1.6rem;*/
}
.main-contents .category-item .category-details {
  padding-top: 0.8rem;
}

.main-contents .category-item .inner-wrapper {
  padding: 3rem;
  background-color: var(--color-blue);
  border-radius: 0.6rem;
  overflow: hidden;
}

.main-contents .category-item.inverted .inner-wrapper {
  background-color: var(--color-white);
  border: 2px solid var(--color-blue);
  color: var(--color-blue);
}

.main-contents .folders-block {
  margin-top: 5.6rem;
}

.main-contents .folders-block .folder-item {
  padding: 1.6rem 0;
  text-decoration: none;
  border-bottom: 1px solid var(--color-grey-blue-light);
}

.main-contents .folders-block .inner-wrapper {
  align-items: center;
}
.main-contents .folders-block .folder-image {
  max-width: 4.5rem;
}
.main-contents .folders-block .folder-label {
  padding-left: 4rem;
}

.main-contents .listing-utils {
  position: sticky;
  z-index: 1;
  top: 0;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
  line-height: 2.4rem;
  background-color: var(--color-white);
}
.main-contents .listing-utils .inner-wrapper {
  align-items: center;
  flex-wrap: wrap;
}

.listing-utils.tabbed-utils {
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 2.5rem;
}
.listing-utils.tabbed-utils .inner-wrapper {
  border-bottom: 1px solid var(--color-grey-blue-light);
}
.listing-utils.tabbed-utils .tools-tabs {
  margin-bottom: -1px;
}

.listing-utils.tabbed-utils .tools-filter + .tools-filter {
  padding-left: 1.2em;
}

.main-contents .breadcrumbs {
  margin-bottom: 1em;
}

.main-contents .tools-filter {
  position: relative;
  order: 3;
  margin-top: 1.2rem;
  padding-right: 0;
  display: flex;

  @media screen and (min-width: 480px) {
    order: unset;
    margin-top: 0;
  }
}
.main-contents .tools-filter:has(.items-filter-language) {
  padding-right: 1em;
}

.main-contents .tools-filter .input-search {
  border: 0 none;
  border-radius: 0.4rem;
  padding: 0.5em 1em;
  color: var(--color-grey);
  background-color: var(--color-grey-light);
}
.main-contents .input-search::placeholder {
  font-weight: 700;
}
.main-contents .input-search:not(:focus):hover::-webkit-search-cancel-button {
  display: none;
}

.main-contents .input-search + .items-search-label {
  right: 1em;
  top: 50%;
  transform: translateY(-50%);
  transition: opacity 0.4s;
  pointer-events: none;
}
.main-contents .input-search:focus + .items-search-label {
  opacity: 0;
}

.main-contents .items-filter-language {
  position: relative;
  appearance: none;
  margin: 0;
  padding: 0.5em 2.5em 0.5em 1em;
  border: 0 none;
  background: var(--color-grey-light);
  color: var(--color-grey);
  border-radius: 0.4rem;
  font-weight: bold;
}
.main-contents .tools-filter:has(.items-filter-language)::after {
  content: "";
  position: absolute;
  right: 1.5em;
  top: 50%;
  display: block;
  width: 0.5em;
  aspect-ratio: 1;
  border: 2px solid var(--color-transparent);
  border-right-color: var(--color-grey);
  border-bottom-color: var(--color-grey);

  transform: translateY(-40%) rotate(45deg);
}

.main-contents .tools-filter .reset-filters {
  margin-left: 1em;
  padding-top: 0.4em;
  padding-bottom: 0.4em;
}

.main-contents .tools-count {
  order: 1;

  @media screen and (min-width: 480px) {
    order: unset;
  }
}

.main-contents .tools-count-label {
  line-height: 2.4rem;
  margin-left: 0;

  @media screen and (min-width: 480px) {
    margin-left: auto;
  }
}

.main-contents .tools-count .folders-count,
.main-contents .tools-count .files-count {
  padding-left: 0.8rem;
  padding-right: 0.8rem;
}

.main-contents .tools-count .folders-count + .files-count,
.main-contents .tools-count .files-count + .folders-count {
  border-left: 1px solid var(--color-grey-blue-light);
}

.tools-switch-view {
  justify-content: flex-start;
  margin-top: 1rem;
  margin-left: auto;
  line-height: 2.4rem;

  @media screen and (min-width: 480px) {
    justify-content: flex-end;
    margin-top: 0;
  }
}
.tools-switch-label {
  line-height: 2.4rem;
}
.tools-switch-action {
  display: flex;
  align-items: center;
  margin-left: 1.6rem;
  margin-top: 0;
  text-decoration: none;
  color: var(--color-grey-medium);
}
.tools-switch-action svg {
  margin-right: 0.5em;
}
.tools-switch-action.active {
}
.tools-switch-action.active svg rect {
  fill: var(--color-grey-medium);
}

.main-contents .tools-count .folders-count {
}
.main-contents .tools-count .files-count {
}

.main-contents .files-block {
  margin-top: 5.6rem;
}

.main-contents .files-block .file-item {
}
.main-contents .files-block .inner-wrapper {
  flex-wrap: wrap;
  border-bottom: 1px solid var(--color-grey-blue-light);

  @media screen and (min-width: 960px) {
    flex-wrap: nowrap;
    align-items: stretch;
  }
}
.main-contents .files-block .file-column {
  display: flex;
  align-items: center;
  padding-top: 1.6rem;
  padding-bottom: 1.6rem;
}
.main-contents .files-block .file-column + .file-column {
  @media screen and (min-width: 960px) {
    border-left: 1px solid var(--color-grey-blue-light);
  }
}
.main-contents .files-block .file-name {
}
.main-contents .files-block[data-view="list"] .file-name .file-date,
.main-contents .files-block[data-view="list"] .file-name .file-action {
  display: none;
}
.main-contents .files-block .file-name .file-mimetype {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 8rem;
  aspect-ratio: 80/45;
  border-radius: 0.4rem;
  overflow: hidden;
  color: var(--color-white);
  background-position: 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
.main-contents .files-block .file-name .file-mimetype .has-preview {
}

.main-contents .files-block .file-name .file-extension {
}
.main-contents .files-block .file-name .has-preview .file-extension {
  display: none;
}
.main-contents .files-block .file-column .grid-wrapper {
  margin-left: auto;
}

.main-contents .files-block .file-name .file-label {
  padding-left: 1em;
  padding-right: 2em;
}
.main-contents .files-block .file-date {
  justify-content: center;
}
.main-contents .files-block .file-actions {
  justify-content: flex-end;
}
.main-contents .files-block .file-action {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0.8rem 1.6rem;
  border-radius: 0.4rem;
  overflow: hidden;
  background-color: var(--color-red);
  text-decoration: none;
}
.main-contents .files-block .file-action svg {
  margin-left: 1em;
}

.main-contents .files-block[data-view="grid"] {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.main-contents .files-block[data-view="grid"] .file-item {
  padding: 0 1.5rem;
  margin-bottom: 3rem;
  width: 100%;

  @media screen and (min-width: 768px) {
    width: 50%;
  }

  @media screen and (min-width: 960px) {
    width: 33.33333%;
  }
}

.main-contents .files-block[data-view="grid"] .inner-wrapper {
  flex-direction: column;
  height: 100%;
  border-bottom: 0 none;
  padding: 1.6rem;
  background-color: var(--color-grey);
}
.main-contents .files-block[data-view="grid"] .file-column {
  flex-direction: row;
  flex-wrap: wrap;
  padding-top: 0;
  padding-bottom: 0;
  width: 100%;
  align-items: flex-start;
}
.main-contents .files-block[data-view="grid"] .file-column + .file-column {
  border-left: 0 none;
}
.main-contents .files-block[data-view="grid"] .file-column .grid-wrapper {
  margin-left: 0;
}
.main-contents .files-block[data-view="grid"] .file-name {
}
.main-contents .files-block[data-view="grid"] .file-name .file-mimetype {
  width: 100%;
  margin-bottom: 2.4rem;
}
.main-contents
  .files-block[data-view="grid"]
  .file-name
  .file-mimetype
  .has-preview {
}

.main-contents .files-block[data-view="grid"] .file-name .file-extension {
  transform-origin: 50%;
  transform: scale(1.5);
}
.main-contents
  .files-block[data-view="grid"]
  .file-name
  .has-preview
  .file-extension {
  display: none;
}
.main-contents .files-block[data-view="grid"] .file-name .file-label {
  padding-left: 0;
  padding-bottom: 0.8rem;
}
.main-contents .files-block[data-view="grid"] .file-column.file-date {
  display: none;
}
.main-contents .files-block[data-view="grid"] .file-column.file-actions {
  display: none;
}
.main-contents .files-block[data-view="grid"] .file-action {
  display: block;
  background-color: transparent;
  margin: 0 0 0 auto;
  padding: 0;
}
.main-contents .files-block[data-view="grid"] .file-action svg {
  margin: 0;
  padding: 0;
  width: 3.2rem;
  height: 3.2rem;
}
.main-contents .files-block[data-view="grid"] .file-action svg path {
  fill: var(--color-grey-blue);
}
.main-contents .files-block[data-view="grid"] .file-action svg circle {
  stroke: var(--color-grey-blue);
}

.file-type-img.file-type-img {
  background-color: var(--color-grey-blue-medium);
}
.file-type-doc.file-type-doc {
  background-color: var(--color-blue);
}
.file-type-ppt.file-type-ppt {
  background-color: var(--color-orange);
}
.file-type-xls.file-type-xls {
  background-color: var(--color-green);
}
.file-type-pdf.file-type-pdf {
  background-color: var(--color-red);
}
.file-type-mp4.file-type-mp4 {
  background-color: var(--color-red);
}

.favourites-block,
.latest-block {
  margin-top: 13.6rem;
}

.favourites-block .favourites-header strong,
.latest-block .latest-header strong {
  color: var(--color-blue);
}

.favourites-block {
}

.latest-block {
}

.w-100 {
  width: 100%;
}

.add-button {
  margin: 20px auto;
  border-radius: 100%;
  width: 41px;
  height: 41px;
}

