Sid Gifari File Manager

🏠 Root / home2 / iuywvcmy / public_html / wp-content / plugins / beaver-builder-lite-version / css / build /

Editing: vendor-bb-fluid.bundle.css

@charset "UTF-8";
.fluid {
  /**
  * Static Colors
  *
  * Below are a list of colors that are static, meaning that they do not change based on dark or light color schemes or any other contextual change.
  */
  --fl-brand-light-blue: #84d5d6;
  --fl-brand-dark-blue: #1b7a97;
  --fl-brand-red: #ee521f;
  --fl-brand-yellow: #fba613;
  --fl-brand-green: #64dc87;
  --fl-brand-purple: #7461c7;
  --fl-brand-cool-neutral: #d9d9cf;
  --fl-brand-warm-neutral: #ecdfc3;
  --fl-brand-tan: #FFF4DC;
  --fluid-hue: 210;
  /* Darks */
  --fluid-opaque-0: black;
  --fluid-opaque-1: hsl( var(--fluid-hue), 10%, 10% );
  --fluid-opaque-1-5: hsl( var(--fluid-hue), 10%, 13% );
  --fluid-opaque-2: hsl( var(--fluid-hue), 10%, 15% );
  --fluid-opaque-3: hsl( var(--fluid-hue), 10%, 20% );
  --fluid-opaque-4: hsl( var(--fluid-hue), 10%, 25% );
  --fluid-opaque-5: hsl( var(--fluid-hue), 10%, 30% );
  --fluid-opaque-6: hsl( var(--fluid-hue), 10%, 35% );
  /* Middle Grey */
  --fluid-opaque-7: hsl( var(--fluid-hue), 10%, 50% );
  /* Lights */
  --fluid-opaque-8: hsl( var(--fluid-hue), 27%, 87% );
  --fluid-opaque-9: hsl( var(--fluid-hue), 33%, 89% );
  --fluid-opaque-10: hsl( var(--fluid-hue), 33%, 91% );
  --fluid-opaque-11: hsl( var(--fluid-hue), 33%, 93% );
  --fluid-opaque-12: hsl( var(--fluid-hue), 33%, 95% );
  --fluid-opaque-13: hsl( var(--fluid-hue), 33%, 97.5% );
  --fluid-opaque-14: white;
  /* Black can't be mimiced transparently */
  --fluid-transparent-1: hsla( var(--fluid-hue), 10%, 10%, 80% );
  --fluid-transparent-2: hsla( var(--fluid-hue), 10%, 19%, 80% );
  --fluid-transparent-3: hsla( var(--fluid-hue), 10%, 25%, 80% );
  --fluid-transparent-4: hsla( var(--fluid-hue), 10%, 31%, 80% );
  --fluid-transparent-5: hsla( var(--fluid-hue), 10%, 38%, 80% );
  --fluid-transparent-6: hsla( var(--fluid-hue), 10%, 44%, 80% );
  /* There is no middle grey in this scale */
  --fluid-transparent-8: hsla( var(--fluid-hue), 27%, 84%, 80% );
  --fluid-transparent-9: hsla( var(--fluid-hue), 33%, 86%, 80% );
  --fluid-transparent-10: hsla( var(--fluid-hue), 33%, 89%, 80% );
  --fluid-transparent-11: hsla( var(--fluid-hue), 34%, 90%, 80% );
  --fluid-transparent-12: hsla( var(--fluid-hue), 38%, 94%, 80% );
  --fluid-transparent-13: hsla( var(--fluid-hue), 38%, 98%, 80% );
  /* White can't be mimiced transparently */
  /* Blue Scale */
  --fluid-blue-hue: var(--fluid-hue);
  /* Darks */
  --fluid-blue-0: black;
  --fluid-blue-1: hsl( var(--fluid-blue-hue), 100%, 10% );
  --fluid-blue-2: hsl( var(--fluid-blue-hue), 100%, 15% );
  --fluid-blue-3: hsl( var(--fluid-blue-hue), 100%, 20% );
  --fluid-blue-4: hsl( var(--fluid-blue-hue), 100%, 25% );
  --fluid-blue-5: hsl( var(--fluid-blue-hue), 100%, 30% );
  --fluid-blue-6: hsl( var(--fluid-blue-hue), 100%, 35% );
  /* Middle Blue */
  --fluid-blue-7: hsl( var(--fluid-blue-hue), 100%, 45% );
  /* Lights */
  --fluid-blue-8: hsl( var(--fluid-blue-hue), 100%, 87% );
  --fluid-blue-9: hsl( var(--fluid-blue-hue), 100%, 89% );
  --fluid-blue-10: hsl( var(--fluid-blue-hue), 100%, 91% );
  --fluid-blue-11: hsl( var(--fluid-blue-hue), 100%, 93% );
  --fluid-blue-12: hsl( var(--fluid-blue-hue), 100%, 95% );
  --fluid-blue-13: hsl( var(--fluid-blue-hue), 100%, 98% );
  --fluid-blue-14: white;
  /* Primary Accent Blue */
  --fluid-blue: var(--fluid-blue-7);
  --fluid-accent: var(--fluid-blue);
  accent-color: var(--fluid-accent);
  --fluid-dark-background: var(--fluid-opaque-2);
  --fluid-dark-color: var(--fluid-opaque-11);
  /**
  * Dynamic Colors - Colors that change depending on color scheme & context
  */
  --fluid-background: var(--fluid-opaque-14);
  --fluid-color: var(--fluid-opaque-0);
  --fluid-box-background: var(--fluid-transparent-12);
  --fluid-box-color: var(--fluid-opaque-3);
  --fluid-box-hover-background: var(--fluid-transparent-10);
  --fluid-box-hover-color: var(--fluid-opaque-0);
  --fluid-inset-background: var(--fluid-opaque-13);
  --fluid-inset-color: var(--fluid-opaque-0);
  --fluid-primary-background: var(--fluid-blue-7);
  --fluid-primary-color: white;
  --fluid-primary-hover-background: var(--fluid-blue-6);
  --fluid-alert-background: #FEF4EA;
  --fluid-alert-color: #A95700;
  --fluid-alert-hover-background: #FCE3CA;
  --fluid-destructive-background: #FEF3F1;
  --fluid-destructive-color: #BC0A00;
  --fluid-destructive-hover-background: #F9DAD4;
  --fluid-muted-text-color: var(--fluid-opaque-7);
  --fluid-line-color: var(--fluid-transparent-11);
  --fluid-dark-line-color: var(--fluid-opaque-0);
}

.fluid .fluid-vibrant-background {
  --bg-effect: blur(80px) saturate(300%);
  background: rgba(128, 128, 128, 0.75);
  -webkit-backdrop-filter: var(--bg-effect);
  backdrop-filter: var(--bg-effect);
}

.fluid .fluid-color-scheme-dark {
  --fluid-background: var(--fluid-dark-background);
  --fluid-color: var(--fluid-dark-color);
  --fluid-line-color: var(--fluid-dark-line-color);
  --fluid-box-background: var(--fluid-opaque-1);
  --fluid-box-color: var(--fluid-dark-color);
  --fluid-box-hover-background: var(--fluid-opaque-3);
  --fluid-inset-background: var(--fluid-opaque-1-5);
  --fluid-inset-color: var(--fluid-dark-color);
  --fluid-alert-background: hsl(31, 55%, 10%);
  --fluid-alert-color: hsl(31, 100%, 72%);
  --fluid-alert-hover-background: hsl(31, 45%, 14%);
  --fluid-destructive-background: hsl(0, 100%, 7%);
  --fluid-destructive-color: hsl(3, 100%, 67%);
  --fluid-destructive-hover-background: hsl(0, 80%, 12%);
}

.fluid .fluid-color-scheme-dark .fluid-vibrant-background {
  background: rgba(38, 38, 38, 0.75);
}

.fluid {
  --fluid-sm-space: 5px;
  --fluid-med-space: 10px;
  --fluid-lg-space: 20px;
  --fluid-font-family-sans-serif: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  --fluid-font-family-serif: Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times, Source Serif Pro, serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  --fluid-font-family-mono: Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace;
  --fluid-radius: 6px;
  --fluid-med-radius: 12px;
  --fluid-target-size: 36px;
  --fluid-font-size: 13px;
  --fluid-font-family: var(--fluid-font-family-sans-serif);
  /* Root .fluid Element */
  color: var(--fluid-color);
  font-family: var(--fluid-font-family);
  font-size: var(--fluid-font-size);
  font-weight: normal;
  line-height: 1.2;
}

.fluid * {
  box-sizing: border-box;
}

.fluid hr {
  margin: 10px 0;
  padding: 0;
}

.fluid img {
  display: block;
  max-width: 100%;
  object-fit: cover;
  height: auto;
  width: auto;
  border: 0;
}

.fluid video {
  display: block;
}

.fluid svg {
  display: block;
}

.fluid a, .fluid button {
  box-sizing: border-box;
  -moz-user-select: none;
  user-select: none;
  cursor: pointer;
  letter-spacing: normal;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  background: transparent;
  border: none;
  user-select: none;
  padding: 0;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}

.fluid a:hover, .fluid button:hover {
  color: inherit;
  top: 0;
  box-shadow: none;
  border: none;
  background: transparent;
}

.fluid a:focus, .fluid button:focus {
  color: inherit;
  top: 0;
  border: none;
}

.fluid a[disabled], .fluid button[disabled] {
  color: inherit;
  opacity: 0.6;
  pointer-events: none;
}

.fluid a:visited, .fluid button:visited {
  color: inherit;
}

.fluid button {
  border-radius: var(--fluid-radius);
}

.fluid a {
  text-decoration: none;
}

.fluid a:hover {
  text-decoration: underline;
}

.fluid button {
  min-height: var(--fluid-target-size);
  min-width: var(--fluid-target-size);
}

.fluid button:focus {
  box-shadow: 0px 0px 0px 2px rgba(128, 128, 128, 0.5);
}

.fluid p,
.fluid h1,
.fluid h2,
.fluid h3,
.fluid h4,
.fluid h5,
.fluid h6,
.fluid blockquote,
.fluid pre,
.fluid form,
.fluid table {
  margin: var(--fluid-lg-space) 0;
}

.fluid p:first-child,
.fluid h1:first-child,
.fluid h2:first-child,
.fluid h3:first-child,
.fluid h4:first-child,
.fluid h5:first-child,
.fluid h6:first-child,
.fluid blockquote:first-child,
.fluid pre:first-child,
.fluid form:first-child,
.fluid table:first-child {
  margin-top: 0;
}

.fluid h1, .fluid h2, .fluid h3, .fluid h4, .fluid h5, .fluid h6 {
  color: inherit;
  font-family: var(--fluid-font-family);
  font-weight: normal;
}

.fluid h1::before, .fluid h2::before, .fluid h3::before, .fluid h4::before, .fluid h5::before, .fluid h6::before {
  all: unset !important;
}

.fluid h1 {
  font-size: calc(var(--fluid-font-size) + 14px);
}

.fluid h2 {
  font-size: calc(var(--fluid-font-size) + 10px);
}

.fluid h3 {
  font-size: calc(var(--fluid-font-size) + 6px);
}

.fluid p {
  font-size: 14px;
  line-height: 1.3;
}

.fluid ul, .fluid ol {
  list-style: none;
  margin: var(--fluid-med-space) 0;
  padding: 0;
}

.fluid ul li, .fluid ol li {
  margin: 0;
  padding: 0;
}

.fluid .fluid-mono {
  font-family: var(--fluid-font-family-mono);
}

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

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

.fluid table.fluid-table {
  font-size: var(--fluid-font-size);
  width: 100%;
  border-collapse: collapse;
  border: none;
}

.fluid table.fluid-table th, .fluid table.fluid-table td {
  text-align: left;
  padding: var(--fluid-sm-space) var(--fluid-med-space);
  border: none;
  border-right: 2px solid var(--fluid-line-color);
}

.fluid table.fluid-table th:first-child, .fluid table.fluid-table td:first-child {
  border-top-left-radius: var(--fluid-radius);
  border-bottom-left-radius: var(--fluid-radius);
}

.fluid table.fluid-table th:last-child, .fluid table.fluid-table td:last-child {
  border-right: 0;
  border-top-right-radius: var(--fluid-radius);
  border-bottom-right-radius: var(--fluid-radius);
}

.fluid table.fluid-table tr:nth-child(even) th, .fluid table.fluid-table tr:nth-child(even) td {
  background: var(--fluid-opaque-13);
}

.fluid .fluid-color-scheme-dark {
  color: var(--fluid-color);
}

.fluid .fluid-color-scheme-dark table.fluid-table tr:nth-child(even) th, .fluid .fluid-color-scheme-dark table.fluid-table tr:nth-child(even) td {
  background: var(--fluid-opaque-1);
}

.fluid label {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: inherit;
  font-weight: normal;
  line-height: 1.2;
  color: var(--fl-asst-text-color);
  text-transform: none;
  text-decoration: none;
  text-shadow: none;
  margin: 0 0 var(--fluid-med-space);
}

.fluid label abbr {
  display: flex;
  text-decoration: none;
  margin-left: 5px;
  color: var(--fl-asst-base-art-color);
}

.fluid .fl-asst-form-input,
.fluid input,
.fluid input[type=text],
.fluid input[type=email],
.fluid input[type=url],
.fluid input[type=password],
.fluid input[type=search],
.fluid input[type=number],
.fluid input[type=tel],
.fluid input[type=date],
.fluid input[type=month],
.fluid input[type=week],
.fluid input[type=time],
.fluid input[type=datetime],
.fluid input[type=datetime-local],
.fluid input[type=color],
.fluid textarea,
.fluid select {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: auto;
  flex: 1 1 auto;
  font-family: inherit;
  font-size: inherit;
  font-weight: normal;
  line-height: inherit;
  letter-spacing: normal;
  text-align: left;
  margin: 0;
  padding: var(--fluid-sm-space);
  color: inherit;
  border-radius: var(--fluid-radius);
  border: none;
  outline: none;
  background-color: var(--fluid-transparent-13);
  box-shadow: inset 0px 0px 0px 1.5px var(--fluid-line-color);
  min-height: var(--fluid-target-size);
}

.fluid .fl-asst-form-input::-webkit-input-placeholder,
.fluid input::-webkit-input-placeholder,
.fluid input[type=text]::-webkit-input-placeholder,
.fluid input[type=email]::-webkit-input-placeholder,
.fluid input[type=url]::-webkit-input-placeholder,
.fluid input[type=password]::-webkit-input-placeholder,
.fluid input[type=search]::-webkit-input-placeholder,
.fluid input[type=number]::-webkit-input-placeholder,
.fluid input[type=tel]::-webkit-input-placeholder,
.fluid input[type=date]::-webkit-input-placeholder,
.fluid input[type=month]::-webkit-input-placeholder,
.fluid input[type=week]::-webkit-input-placeholder,
.fluid input[type=time]::-webkit-input-placeholder,
.fluid input[type=datetime]::-webkit-input-placeholder,
.fluid input[type=datetime-local]::-webkit-input-placeholder,
.fluid input[type=color]::-webkit-input-placeholder,
.fluid textarea::-webkit-input-placeholder,
.fluid select::-webkit-input-placeholder {
  text-align: left;
  color: var(--fluid-muted-text-color);
}

.fluid .fl-asst-form-input::-ms-input-placeholder,
.fluid input::-ms-input-placeholder,
.fluid input[type=text]::-ms-input-placeholder,
.fluid input[type=email]::-ms-input-placeholder,
.fluid input[type=url]::-ms-input-placeholder,
.fluid input[type=password]::-ms-input-placeholder,
.fluid input[type=search]::-ms-input-placeholder,
.fluid input[type=number]::-ms-input-placeholder,
.fluid input[type=tel]::-ms-input-placeholder,
.fluid input[type=date]::-ms-input-placeholder,
.fluid input[type=month]::-ms-input-placeholder,
.fluid input[type=week]::-ms-input-placeholder,
.fluid input[type=time]::-ms-input-placeholder,
.fluid input[type=datetime]::-ms-input-placeholder,
.fluid input[type=datetime-local]::-ms-input-placeholder,
.fluid input[type=color]::-ms-input-placeholder,
.fluid textarea::-ms-input-placeholder,
.fluid select::-ms-input-placeholder {
  text-align: left;
  color: var(--fluid-muted-text-color);
}

.fluid .fl-asst-form-input::placeholder,
.fluid input::placeholder,
.fluid input[type=text]::placeholder,
.fluid input[type=email]::placeholder,
.fluid input[type=url]::placeholder,
.fluid input[type=password]::placeholder,
.fluid input[type=search]::placeholder,
.fluid input[type=number]::placeholder,
.fluid input[type=tel]::placeholder,
.fluid input[type=date]::placeholder,
.fluid input[type=month]::placeholder,
.fluid input[type=week]::placeholder,
.fluid input[type=time]::placeholder,
.fluid input[type=datetime]::placeholder,
.fluid input[type=datetime-local]::placeholder,
.fluid input[type=color]::placeholder,
.fluid textarea::placeholder,
.fluid select::placeholder {
  text-align: left;
  color: var(--fluid-muted-text-color);
}

.fluid .fl-asst-form-input:focus, .fluid .fl-asst-form-input:invalid,
.fluid input:focus,
.fluid input:invalid,
.fluid input[type=text]:focus,
.fluid input[type=text]:invalid,
.fluid input[type=email]:focus,
.fluid input[type=email]:invalid,
.fluid input[type=url]:focus,
.fluid input[type=url]:invalid,
.fluid input[type=password]:focus,
.fluid input[type=password]:invalid,
.fluid input[type=search]:focus,
.fluid input[type=search]:invalid,
.fluid input[type=number]:focus,
.fluid input[type=number]:invalid,
.fluid input[type=tel]:focus,
.fluid input[type=tel]:invalid,
.fluid input[type=date]:focus,
.fluid input[type=date]:invalid,
.fluid input[type=month]:focus,
.fluid input[type=month]:invalid,
.fluid input[type=week]:focus,
.fluid input[type=week]:invalid,
.fluid input[type=time]:focus,
.fluid input[type=time]:invalid,
.fluid input[type=datetime]:focus,
.fluid input[type=datetime]:invalid,
.fluid input[type=datetime-local]:focus,
.fluid input[type=datetime-local]:invalid,
.fluid input[type=color]:focus,
.fluid input[type=color]:invalid,
.fluid textarea:focus,
.fluid textarea:invalid,
.fluid select:focus,
.fluid select:invalid {
  background-color: var(--fluid-box-background);
  border: none;
  outline: none;
  box-shadow: inset 0px 0px 0px 1.5px var(--fluid-background), 0px 0px 0px 1.5px var(--fluid-accent);
}

.fluid .fl-asst-form-input:focus::-webkit-input-placeholder, .fluid .fl-asst-form-input:invalid::-webkit-input-placeholder,
.fluid input:focus::-webkit-input-placeholder,
.fluid input:invalid::-webkit-input-placeholder,
.fluid input[type=text]:focus::-webkit-input-placeholder,
.fluid input[type=text]:invalid::-webkit-input-placeholder,
.fluid input[type=email]:focus::-webkit-input-placeholder,
.fluid input[type=email]:invalid::-webkit-input-placeholder,
.fluid input[type=url]:focus::-webkit-input-placeholder,
.fluid input[type=url]:invalid::-webkit-input-placeholder,
.fluid input[type=password]:focus::-webkit-input-placeholder,
.fluid input[type=password]:invalid::-webkit-input-placeholder,
.fluid input[type=search]:focus::-webkit-input-placeholder,
.fluid input[type=search]:invalid::-webkit-input-placeholder,
.fluid input[type=number]:focus::-webkit-input-placeholder,
.fluid input[type=number]:invalid::-webkit-input-placeholder,
.fluid input[type=tel]:focus::-webkit-input-placeholder,
.fluid input[type=tel]:invalid::-webkit-input-placeholder,
.fluid input[type=date]:focus::-webkit-input-placeholder,
.fluid input[type=date]:invalid::-webkit-input-placeholder,
.fluid input[type=month]:focus::-webkit-input-placeholder,
.fluid input[type=month]:invalid::-webkit-input-placeholder,
.fluid input[type=week]:focus::-webkit-input-placeholder,
.fluid input[type=week]:invalid::-webkit-input-placeholder,
.fluid input[type=time]:focus::-webkit-input-placeholder,
.fluid input[type=time]:invalid::-webkit-input-placeholder,
.fluid input[type=datetime]:focus::-webkit-input-placeholder,
.fluid input[type=datetime]:invalid::-webkit-input-placeholder,
.fluid input[type=datetime-local]:focus::-webkit-input-placeholder,
.fluid input[type=datetime-local]:invalid::-webkit-input-placeholder,
.fluid input[type=color]:focus::-webkit-input-placeholder,
.fluid input[type=color]:invalid::-webkit-input-placeholder,
.fluid textarea:focus::-webkit-input-placeholder,
.fluid textarea:invalid::-webkit-input-placeholder,
.fluid select:focus::-webkit-input-placeholder,
.fluid select:invalid::-webkit-input-placeholder {
  text-align: left;
  color: var(--fluid-color);
}

.fluid .fl-asst-form-input:focus::-ms-input-placeholder, .fluid .fl-asst-form-input:invalid::-ms-input-placeholder,
.fluid input:focus::-ms-input-placeholder,
.fluid input:invalid::-ms-input-placeholder,
.fluid input[type=text]:focus::-ms-input-placeholder,
.fluid input[type=text]:invalid::-ms-input-placeholder,
.fluid input[type=email]:focus::-ms-input-placeholder,
.fluid input[type=email]:invalid::-ms-input-placeholder,
.fluid input[type=url]:focus::-ms-input-placeholder,
.fluid input[type=url]:invalid::-ms-input-placeholder,
.fluid input[type=password]:focus::-ms-input-placeholder,
.fluid input[type=password]:invalid::-ms-input-placeholder,
.fluid input[type=search]:focus::-ms-input-placeholder,
.fluid input[type=search]:invalid::-ms-input-placeholder,
.fluid input[type=number]:focus::-ms-input-placeholder,
.fluid input[type=number]:invalid::-ms-input-placeholder,
.fluid input[type=tel]:focus::-ms-input-placeholder,
.fluid input[type=tel]:invalid::-ms-input-placeholder,
.fluid input[type=date]:focus::-ms-input-placeholder,
.fluid input[type=date]:invalid::-ms-input-placeholder,
.fluid input[type=month]:focus::-ms-input-placeholder,
.fluid input[type=month]:invalid::-ms-input-placeholder,
.fluid input[type=week]:focus::-ms-input-placeholder,
.fluid input[type=week]:invalid::-ms-input-placeholder,
.fluid input[type=time]:focus::-ms-input-placeholder,
.fluid input[type=time]:invalid::-ms-input-placeholder,
.fluid input[type=datetime]:focus::-ms-input-placeholder,
.fluid input[type=datetime]:invalid::-ms-input-placeholder,
.fluid input[type=datetime-local]:focus::-ms-input-placeholder,
.fluid input[type=datetime-local]:invalid::-ms-input-placeholder,
.fluid input[type=color]:focus::-ms-input-placeholder,
.fluid input[type=color]:invalid::-ms-input-placeholder,
.fluid textarea:focus::-ms-input-placeholder,
.fluid textarea:invalid::-ms-input-placeholder,
.fluid select:focus::-ms-input-placeholder,
.fluid select:invalid::-ms-input-placeholder {
  text-align: left;
  color: var(--fluid-color);
}

.fluid .fl-asst-form-input:focus::placeholder, .fluid .fl-asst-form-input:invalid::placeholder,
.fluid input:focus::placeholder,
.fluid input:invalid::placeholder,
.fluid input[type=text]:focus::placeholder,
.fluid input[type=text]:invalid::placeholder,
.fluid input[type=email]:focus::placeholder,
.fluid input[type=email]:invalid::placeholder,
.fluid input[type=url]:focus::placeholder,
.fluid input[type=url]:invalid::placeholder,
.fluid input[type=password]:focus::placeholder,
.fluid input[type=password]:invalid::placeholder,
.fluid input[type=search]:focus::placeholder,
.fluid input[type=search]:invalid::placeholder,
.fluid input[type=number]:focus::placeholder,
.fluid input[type=number]:invalid::placeholder,
.fluid input[type=tel]:focus::placeholder,
.fluid input[type=tel]:invalid::placeholder,
.fluid input[type=date]:focus::placeholder,
.fluid input[type=date]:invalid::placeholder,
.fluid input[type=month]:focus::placeholder,
.fluid input[type=month]:invalid::placeholder,
.fluid input[type=week]:focus::placeholder,
.fluid input[type=week]:invalid::placeholder,
.fluid input[type=time]:focus::placeholder,
.fluid input[type=time]:invalid::placeholder,
.fluid input[type=datetime]:focus::placeholder,
.fluid input[type=datetime]:invalid::placeholder,
.fluid input[type=datetime-local]:focus::placeholder,
.fluid input[type=datetime-local]:invalid::placeholder,
.fluid input[type=color]:focus::placeholder,
.fluid input[type=color]:invalid::placeholder,
.fluid textarea:focus::placeholder,
.fluid textarea:invalid::placeholder,
.fluid select:focus::placeholder,
.fluid select:invalid::placeholder {
  text-align: left;
  color: var(--fluid-color);
}

.fluid input[type=range] {
  -webkit-appearance: slider-horizontal;
}

.fluid input[type=checkbox],
.fluid input[type=radio] {
  -moz-appearace: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  margin: 0;
  margin-right: var(--fluid-med-space);
  color: white;
  width: 22px;
  height: 22px;
  max-width: 22px;
  max-height: 22px;
  min-height: 0;
  min-width: 0;
  border-radius: var(--fluid-radius);
  box-shadow: none;
  border: none;
  background-color: var(--fluid-transparent-11);
}

.fluid input[type=checkbox]:focus,
.fluid input[type=radio]:focus {
  box-shadow: inset 0px 0px 0px 1.5px var(--fluid-background), 0px 0px 0px 1.5px var(--fluid-accent);
}

.fluid input[type=checkbox]:checked,
.fluid input[type=radio]:checked {
  background-color: var(--fluid-blue);
  box-shadow: none;
}

.fluid input[type=checkbox]:checked:focus,
.fluid input[type=radio]:checked:focus {
  box-shadow: inset 0px 0px 0px 1.5px var(--fluid-background), 0px 0px 0px 1.5px var(--fluid-accent);
}

.fluid input[type=checkbox]:checked:after,
.fluid input[type=radio]:checked:after {
  display: block;
  content: "✓";
  color: white;
  font-family: var(--fluid-font-family);
  font-size: 16px !important;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  margin-left: -1px;
  margin-top: -3px;
}

.fluid input[type=checkbox]:checked:before,
.fluid input[type=radio]:checked:before {
  content: "" !important;
  display: none !important;
}

.fluid input[type=radio] {
  border-radius: 50%;
}

.fluid input[disabled],
.fluid select[disabled],
.fluid textarea[disabled],
.fluid [aria-disabled=true],
.fluid .fluid-is-disabled {
  pointer-events: none;
  opacity: 0.5;
  font-style: italic;
  color: var(--fluid-muted-text-color);
}

.fluid select {
  padding: var(--fluid-sm-space);
  padding-right: 30px;
}

.fluid select:focus {
  background-color: var(--fluid-box-background);
  color: var(--fluid-color) !important;
  border: none;
  outline: none;
  box-shadow: inset 0px 0px 0px 2px var(--fluid-box-background), 0px 0px 0px 1.5px var(--fluid-accent);
}

.fluid select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

.fluid select::-ms-expand {
  display: none;
}

.fluid select[multiple] {
  height: auto;
  padding: 10px 7px 0;
  background-image: none;
}

.fluid select[multiple] option {
  padding: 2px 7px;
  margin: 1px 0;
  border-radius: 3px;
  font-weight: normal;
}

@supports (-webkit-appearance: none) {
  .fluid select {
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 14px;
    padding-right: 30px;
  }
  .fluid select::-ms-expand {
    display: none;
  }
}
.fluid .fluid-color-scheme-dark .fl-asst-form-input,
.fluid .fluid-color-scheme-dark input,
.fluid .fluid-color-scheme-dark input[type=text],
.fluid .fluid-color-scheme-dark input[type=email],
.fluid .fluid-color-scheme-dark input[type=url],
.fluid .fluid-color-scheme-dark input[type=password],
.fluid .fluid-color-scheme-dark input[type=search],
.fluid .fluid-color-scheme-dark input[type=number],
.fluid .fluid-color-scheme-dark input[type=tel],
.fluid .fluid-color-scheme-dark input[type=date],
.fluid .fluid-color-scheme-dark input[type=month],
.fluid .fluid-color-scheme-dark input[type=week],
.fluid .fluid-color-scheme-dark input[type=time],
.fluid .fluid-color-scheme-dark input[type=datetime],
.fluid .fluid-color-scheme-dark input[type=datetime-local],
.fluid .fluid-color-scheme-dark input[type=color],
.fluid .fluid-color-scheme-dark textarea,
.fluid .fluid-color-scheme-dark select {
  background-color: var(--fluid-transparent-1);
}

.fluid .fluid-color-scheme-dark input[type=checkbox],
.fluid .fluid-color-scheme-dark input[type=radio] {
  background-color: var(--fluid-opaque-0);
}

.fluid .fluid-color-scheme-dark input[type=checkbox]:checked,
.fluid .fluid-color-scheme-dark input[type=radio]:checked {
  background-color: var(--fluid-blue);
}

.fl.uid .fluid-text-title {
  flex: 0 1 auto;
  font-size: 16px;
  display: flex;
  flex-direction: column;
}

.fl.uid .fluid-text-eyebrow,
.fl.uid .fluid-text-subtitle {
  font-size: 12px;
  font-weight: 500;
  color: var(--fluid-muted-text-color);
}

.fl.uid .fluid-text-eyebrow {
  font-size: 13px;
  text-transform: uppercase;
}

.fl.uid .fluid-size-med .fluid-text-title {
  font-size: 13px;
}

.fl.uid .fluid-size-sm .fluid-text-title {
  font-size: 13px;
}

.fluid .fluid-aspect-box {
  position: relative;
  padding-top: 100%;
  background: var(--fluid-box-background);
  overflow: hidden;
}

.fluid .fluid-aspect-box > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: center;
}

.fluid .fluid-loading-bar {
  flex: 1 1 auto;
  border-radius: 10px;
  min-height: 20px;
  padding: var(--fluid-sm-space);
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.fluid .fluid-loading-bar .fluid-dot {
  display: inline-flex;
  flex: 0 0 auto;
  width: 6px;
  height: 6px;
  border-radius: 3px;
  margin: 0 3px;
  background: var(--fluid-accent);
  -webkit-animation: fl-asst-dot-bounce 1.4s infinite ease-in-out both;
  animation: fl-asst-dot-bounce 1.4s infinite ease-in-out both;
}

.fluid .fluid-loading-bar .fluid-dot:first-child {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.fluid .fluid-loading-bar .fluid-dot:nth-child(2n+2) {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

@-webkit-keyframes fl-asst-dot-bounce {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes fl-asst-dot-bounce {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.fluid .fluid-message {
  flex: 0 0 auto;
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background: var(--fluid-box-background);
  color: var(--fluid-box-color);
  border-radius: var(--fluid-radius);
  min-height: var(--fluid-target-size);
  padding: 0 var(--fluid-med-space);
  text-decoration: none;
}

.fluid .fluid-message-icon {
  margin-right: 7px;
  height: 100%;
  width: 7%;
}

.fluid .fluid-split {
  position: relative;
  flex: 1 1 auto;
  display: flex;
  flex-direction: row;
  min-height: 0;
  max-height: 100%;
}

.fluid .fluid-split .fluid-split-pane {
  position: relative;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: 100%;
  overflow: auto;
  border-right: 2px solid var(--fluid-line-color);
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

.fluid .fluid-split .fluid-split-pane:last-child {
  border-right: none;
}

.fluid .fluid-toolbar {
  flex: 0 0 60px;
  display: flex;
  flex-direction: row;
  align-items: center;
  min-height: 60px;
  padding: 0 10px;
  background: var(--fluid-background);
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
}

.fluid .fluid-toolbar.fluid-is-sticky {
  position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
  position: sticky;
  top: 0;
}

.fluid .fluid-toolbar.fluid-is-selected {
  --fluid-background: var(--fluid-blue);
  background-color: var(--fluid-blue);
  color: white;
}

.fluid .fluid-toolbar.fluid-size-lg {
  min-height: 60px;
}

.fluid .fluid-toolbar.fluid-size-med {
  min-height: 50px;
}

.fluid .fluid-toolbar.fluid-size-sm {
  min-height: 40px;
}

.fluid .fluid-toolbar > * {
  margin-right: var(--fluid-sm-space);
}

.fluid .fluid-toolbar > *:last-child {
  margin-right: 0;
}

.fluid .fluid-box {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

.fluid .fluid-box.fluid-box-outset {
  margin-left: calc(0px - var(--fluid-lg-space));
  margin-right: calc(0px - var(--fluid-lg-space));
}

.fluid .fluid-box.fluid-row {
  --fluid-gap: 0px;
  flex-direction: row;
}

.fluid .fluid-box.fluid-row > * {
  margin-right: var(--fluid-gap);
}

.fluid .fluid-box.fluid-row > *:last-child {
  margin-right: 0;
}

.fluid .fluid-headline {
  font-size: 20px;
  font-weight: normal;
  word-break: break-word;
}

.fluid .fluid-content-boundary {
  width: clamp(40ch, 80ch, 100%);
  margin: 0 auto;
  padding: 0 var(--fluid-lg-space) var(--fluid-lg-space);
}

.fluid .fluid-drop-area {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  max-height: 100%;
  min-height: 0;
  overflow: auto;
  position: relative;
}

.fluid-menu {
  width: 180px;
  background: var(--fluid-background);
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
  border-radius: var(--fluid-med-space);
  z-index: 1;
  display: flex;
  flex-direction: column;
  padding: var(--fluid-sm-space);
}

.fluid-menu > :first-child {
  margin-top: 0;
}

.fluid-menu .fluid-menu-item.fluid-button {
  flex: 0 0 var(--fluid-target-size);
  justify-content: flex-start;
  padding: 0 var(--fluid-lg-space);
}

.fluid-menu .fluid-menu-item.fluid-button > span {
  justify-content: flex-start;
  flex: 1 1 auto;
}

.fluid-menu .fluid-menu-item.fluid-button.is-selected {
  box-shadow: inset 3px 0 0 var(--fluid-accent);
}

.fluid-menu .fluid-menu-item.fluid-button:hover {
  transform: scale(1) !important;
}

.fluid-color-scheme-dark .fluid-menu {
  background: var(--fluid-box-background);
}

.fluid .fluid-button-group {
  box-sizing: border-box;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: wrap;
  background: var(--fluid-transparent-12);
  color: var(--fluid-color);
  border-radius: var(--fluid-radius);
  min-height: var(--fluid-target-size);
  max-width: 100%;
  position: relative;
}

.fluid .fluid-button-group .fluid-button:hover, .fluid .fluid-button-group .fluid-button.is-hovering {
  transform: scale(1);
}

.fluid .fluid-button-group > select {
  background-color: var(--fluid-transparent-12);
  box-shadow: none;
  padding: var(--fluid-sm-space);
  text-align-last: center;
  cursor: pointer;
}

.fluid .fluid-button-group > select:hover {
  background-color: var(--fluid-transparent-10);
}

.fluid .fluid-button-group > select:focus {
  box-shadow: inset 0px 0px 0px 1.5px var(--fluid-background), 0px 0px 0px 1.5px var(--fluid-accent);
}

.fluid .fluid-button-group.fluid-button-group-row {
  align-self: center;
  justify-content: flex-start;
}

.fluid .fluid-button-group.fluid-button-group-column {
  flex-direction: column;
}

.fluid .fluid-button-group.fluid-button-group-appearance-normal .fluid-button {
  white-space: nowrap;
}

.fluid .fluid-button-group.fluid-button-group-appearance-buttons {
  display: flex;
  flex-direction: row;
  gap: var(--fluid-sm-space);
  background: transparent;
  padding: 2px 0;
  min-height: var(--fluid-target-size);
  overflow: visible;
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs {
  flex: 1 1 auto;
  background: var(--fluid-box-background);
  padding: 0 var(--fluid-med-space);
  padding-right: 2px;
  min-height: 40px;
  border-radius: 0;
  justify-content: flex-start;
  align-self: stretch;
  overflow: visible;
  flex-wrap: nowrap;
  max-width: 100%;
  min-width: 0;
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs .fluid-button {
  margin: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0 12px;
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs .fluid-button:hover {
  background: var(--fluid-box-hover-background);
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs .fluid-button:focus {
  border-radius: var(--fluid-radius);
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs .fluid-button.is-selected {
  border-radius: 0;
  background: var(--fluid-blue-7);
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs .fluid-button.is-selected:focus {
  box-shadow: inset 0px 0px 0px 2px var(--fluid-box-background), 0px 0px 0px 1.5 var(--fluid-accent), 0px 4px 4px 0px rgba(0, 0, 0, 0.1);
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs .fluid-button:last-child {
  margin-right: 0;
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs .fluid-button.fluid-more-button {
  margin-left: auto !important;
}

.fluid .fluid-button-group.fluid-button-group-appearance-tabs .fluid-button .fluid-count-badge {
  margin-left: 5px;
  padding: 3px;
  background: var(--fluid-primary-background);
  color: var(--fluid-primary-color);
  border-radius: 3px;
}

.fluid .fluid-button-group .fluid-vertical-divider {
  flex: 0 0 auto;
  margin: var(--fluid-sm-space) 0;
  background: var(--fluid-background);
  border: none;
  border-radius: 2px;
}

.fluid .fluid-button-group .fluid-horizontal-divider {
  flex: 0 0 auto;
  margin: 0 var(--fluid-sm-space);
  background: var(--fluid-background);
  border: none;
  border-radius: 2px;
}

.fluid .fluid-button-group .fluid-is-selected + .fluid-divider {
  visibility: hidden;
}

.fluid .fluid-button-group.fluid-button-group-appearance-grid {
  background: transparent !important;
  flex: 1 1 auto;
  display: grid;
  grid-gap: var(--fluid-sm-space);
  grid-template-columns: 1fr 1fr;
  margin: -3px;
}

.fluid .fluid-divider.fluid-horizontal-divider {
  box-sizing: border-box;
  background: var(--fluid-background);
}

.fluid .fluid-divider.fluid-vertical-divider {
  box-sizing: border-box;
  background: var(--fluid-background);
  width: 2px;
  height: auto;
}

.fluid .fluid-is-hidden {
  visibility: hidden;
}

.fluid .fluid-more-menu {
  background: var(--fluid-box-background);
  color: var(--fluid-box-color);
  border-radius: var(--fluid-radius);
  padding: 3px;
  display: flex;
  flex-direction: column;
}

.fluid .fluid-color-scheme-dark .fluid-button-group {
  background: var(--fluid-transparent-1);
}

.fluid .fluid-color-scheme-dark .fluid-button-group > select {
  background-color: var(--fluid-transparent-1);
}

.fluid .fluid-color-scheme-dark .fluid-button-group > select:hover {
  background-color: var(--fluid-transparent-3);
}

.fl.uid .fluid-button {
  --color: var(--fluid-opaque-5);
  --background: var(--fluid-transparent-12);
  --hover: var(--fluid-transparent-10);
  --hover-color: var(--fluid-opaque-0);
  box-sizing: border-box;
  flex: 0 0 auto;
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background: var(--background);
  color: var(--color);
  border-radius: var(--fluid-radius);
  box-shadow: 0px 0px 0px transparent;
  min-height: var(--fluid-target-size);
  min-width: var(--fluid-target-size);
  padding: 5px 8px;
  text-decoration: none;
  font-weight: normal;
  text-transform: none;
  line-height: 1.1;
}

.fl.uid .fluid-button > span {
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  min-width: 0;
}

.fl.uid .fluid-button:hover, .fl.uid .fluid-button.is-hovering {
  text-decoration: none;
  color: var(--hover-color);
  background: var(--hover);
  z-index: 1;
}

.fl.uid .fluid-button:focus, .fl.uid .fluid-button.is-focused {
  top: 0;
  z-index: 3;
  outline: none;
  text-decoration: none;
  box-shadow: inset 0px 0px 0px 2px var(--fluid-background), 0px 0px 0px 1.5px var(--fluid-accent);
}

.fl.uid .fluid-button:active, .fl.uid .fluid-button.is-active {
  background: var(--hover);
  box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
}

.fl.uid .fluid-button.is-selected {
  background: var(--fluid-blue-7);
  color: var(--fluid-blue-14);
}

.fl.uid .fluid-button.is-selected:focus, .fl.uid .fluid-button.is-selected.is-focused {
  background: var(--fluid-blue-7);
  color: var(--fluid-blue-14);
}

.fl.uid .fluid-button.fluid-shape-round {
  border-radius: 50%;
}

.fl.uid .fluid-button.fluid-shape-round.fluid-size-sm {
  padding: 3px;
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  max-width: 30px;
  max-height: 30px;
}

.fl.uid .fluid-button.fluid-shape-round.fluid-size-med {
  padding: 3px;
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  max-width: 36px;
  max-height: 36px;
}

.fl.uid .fluid-button.fluid-shape-round.fluid-size-lg {
  padding: 3px;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  max-width: 44px;
  max-height: 44px;
}

.fl.uid .fluid-button.fluid-appearance-elevator {
  height: 44px;
  width: 44px;
  padding: 5px 12px;
  border-radius: 50%;
}

.fl.uid .fluid-button.fluid-appearance-pillbox {
  border-radius: 30px !important;
}

.fl.uid .fluid-button.fluid-appearance-pillbox:not(.fluid-appearance-transparent) {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.fl.uid .fluid-button.fluid-appearance-transparent {
  --background: transparent;
  box-shadow: none;
  border: none;
  outline: none;
}

.fl.uid .fluid-button.fluid-appearance-transparent:focus, .fl.uid .fluid-button.fluid-appearance-transparent.is-focused {
  box-shadow: inset 0px 0px 0px 2px var(--fluid-background), 0px 0px 0px 1.5px var(--fluid-accent);
}

.fl.uid .fluid-button.fluid-status-primary {
  --background: var(--fluid-blue-12);
  --color: var(--fluid-blue-5);
  --hover: var(--fluid-blue-10);
  --hover-color: var(--fluid-blue-3);
}

.fl.uid .fluid-button.fluid-status-primary.fluid-appearance-transparent {
  --background: transparent;
  --color: var(--fluid-blue-6);
  --hover: var(--fluid-blue-12);
  --hover-color: var(--fluid-blue-5);
}

.fl.uid .fluid-button.fluid-status-alert {
  --fluid-accent: var(--fluid-alert-color);
  --hover-color: var(--fluid-alert-color);
  --color: var(--fluid-alert-color);
}

.fl.uid .fluid-button.fluid-status-destructive {
  --fluid-accent: var(--fluid-destructive-color);
  --hover-color: var(--fluid-destructive-color);
  --color: var(--fluid-destructive-color);
}

.fl.uid .fluid-button.fluid-size-sm {
  font-size: 12px;
  padding: 5px;
  min-height: 30px;
  min-width: 30px;
}

.fl.uid .fluid-button.fluid-size-med {
  min-height: var(--fluid-target-size);
  min-width: var(--fluid-target-size);
}

.fl.uid .fluid-button.fluid-size-lg {
  font-size: 16px;
  padding: 5px 12px;
  min-height: 44px;
  min-width: 44px;
}

.fl.uid .fluid-button .fluid-button-icon {
  flex: 0 0 auto;
  margin-right: 0.5em;
}

.fl.uid .fluid-button .fluid-button-icon:last-child {
  margin-right: 0;
}

.fl.uid .fluid-color-scheme-dark .fluid-button {
  --color: var(--fluid-opaque-10);
  --background: var(--fluid-transparent-1);
  --hover: var(--fluid-transparent-3);
  --hover-color: var(--fluid-opaque-14);
}

.fl.uid .fluid-color-scheme-dark .fluid-button:focus, .fl.uid .fluid-color-scheme-dark .fluid-button.is-focused {
  background: var(--fluid-opaque-0);
}

.fl.uid .fluid-color-scheme-dark .fluid-button.fluid-appearance-transparent {
  --background: transparent;
}

.fl.uid .fluid-color-scheme-dark .fluid-button.fluid-status-primary {
  --color: var(--fluid-blue-14);
  --background: var(--fluid-blue-7);
  --hover: var(--fluid-blue-6);
  --hover-color: var(--fluid-blue-13);
}

.fl.uid .fluid-color-scheme-dark .fluid-button.fluid-status-primary.fluid-appearance-transparent {
  --background: transparent;
  --color: var(--fluid-blue-8);
  --hover: var(--fluid-blue-4);
  --hover-color: var(--fluid-blue-14);
}

.fl.uid .fluid-color-scheme-dark .fluid-button.fluid-status-destructive {
  --fluid-accent: var(--fluid-destructive-color);
  --color: var(--fluid-destructive-color);
  --hover-color: var(--fluid-destructive-color);
}

.fluid-dialog {
  background-color: rgba(0, 0, 0, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--fluid-med-space);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1000;
}

.fluid-dialog-window {
  background: var(--fluid-background);
  border-radius: var(--fluid-radius);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
  padding: var(--fluid-lg-space);
  max-width: 460px;
  width: 100%;
}

.fluid-dialog-title {
  font-size: 20px;
  margin-bottom: var(--fluid-med-space);
}

.fluid-dialog-message {
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: var(--fluid-lg-space);
}

.fluid-dialog-buttons {
  display: flex;
  justify-content: flex-end;
}

.fluid-dialog-buttons button {
  margin-left: var(--fluid-sm-space);
  min-width: 70px !important;
}

.fluid-modal-root-scrollable {
  position: absolute;
  width: 100%;
}

.fluid-lightbox {
  background-color: rgba(0, 0, 0, 0.75);
  padding: var(--fluid-med-space);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1000;
}

.fluid-lightbox .fluid-lightbox-close,
.fluid-lightbox .fluid-lightbox-close:hover,
.fluid-lightbox .fluid-lightbox-close:active,
.fluid-lightbox .fluid-lightbox-close:focus {
  background-color: rgba(0, 0, 0, 0.75) !important;
  color: #fff !important;
  position: absolute;
  position: fixed;
  top: 23px !important;
  right: 28px !important;
  z-index: 2;
}

.fluid-lightbox .fluid-lightbox-left,
.fluid-lightbox .fluid-lightbox-right {
  background-color: rgba(0, 0, 0, 0.75) !important;
  color: #fff !important;
  position: fixed !important;
  z-index: 2;
}

.fluid-lightbox.fluid-lightbox-scrollable {
  position: relative;
  min-height: 100vh;
}

.fluid-lightbox.fluid-lightbox-scrollable .fluid-lightbox-content {
  position: relative;
}

.fluid-lightbox.fluid-lightbox-scrollable .fluid-lightbox-content img {
  max-width: 80%;
}

.fluid-lightbox .fluid-lightbox-content {
  cursor: zoom-out;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--fluid-lg-space);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.fluid-lightbox .fluid-lightbox-content img {
  max-width: 100%;
  max-height: 100%;
}

.fl.uid .fluid-page .fluid-section {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  margin: 0 calc(0px - var(--fluid-lg-space));
}

.fl.uid .fluid-page .fluid-section .fluid-section-title {
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  padding: 9px var(--fluid-lg-space) 0;
  text-transform: uppercase;
  border-bottom: 2px solid var(--fluid-line-color);
  min-height: var(--fluid-target-size);
}

.fl.uid .fluid-page .fluid-section .fluid-section-title .fluid-section-title-text {
  display: inline-flex;
  max-width: 70%;
  box-shadow: 0px 2px 0px 0px currentColor;
  align-items: flex-end;
  padding: 0 0 5px;
  font-weight: 500;
}

.fl.uid .fluid-page .fluid-section .fluid-section-description {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  padding: var(--fluid-lg-space);
  padding-bottom: 0;
  font-style: italic;
}

.fl.uid .fluid-page .fluid-section .fluid-section-description > :first-child {
  margin-top: 0;
}

.fl.uid .fluid-page .fluid-section .fluid-section-description > :last-child {
  margin-bottom: 0;
}

.fl.uid .fluid-page .fluid-section .fluid-section-content {
  flex: 1 0 auto;
  display: grid;
  grid-row-gap: var(--fluid-sm-space);
}

.fl.uid .fluid-scroller {
  box-sizing: border-box;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.fl.uid .fluid-pad {
  box-sizing: border-box;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: 100%;
  padding: var(--fluid-lg-space);
}

.fl.uid .fluid-pad-x {
  padding-left: var(--fluid-lg-space);
  padding-right: var(--fluid-lg-space);
}

.fl.uid .fluid-pad-y {
  padding-top: var(--fluid-lg-space);
  padding-bottom: var(--fluid-lg-space);
}

.fl.uid .fluid-page {
  --fluid-top-inset: 0px;
  position: relative;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  background-color: var(--fluid-background);
  color: var(--fluid-color);
  max-height: 100%;
  min-height: 0;
}

.fl.uid .fluid-page .fluid-sticky-element {
  position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
  position: sticky;
  top: var(--fluid-top-inset);
  background: var(--fluid-background);
  z-index: 9;
}

.fl.uid .fluid-page .fluid-page-actions {
  margin-left: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
}

.fl.uid .fluid-page .fluid-page-toolbar-content {
  position: static;
  padding: 0 var(--fluid-med-space);
  padding-left: 2px;
  flex: 1 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.fl.uid .fluid-page .fluid-page-title-icon {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 20px;
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 0;
}

.fl.uid .fluid-page .fluid-page-headline {
  font-size: 24px;
  font-weight: 600;
}

.fl.uid .fluid-page .fluid-page-content {
  box-sizing: border-box;
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  background: var(--fluid-background);
  z-index: 1;
}

.fl.uid .fluid-page-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  box-sizing: border-box;
  min-height: 55px;
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-start;
  background: var(--fluid-background);
  border-top: 2px solid var(--fluid-box-background);
  z-index: 9;
}

.fl.uid .fluid-page-footer > .fluid-button {
  margin-right: var(--fluid-sm-space);
}

.fl.uid .fluid-page-footer > .fluid-button:last-child {
  margin-right: 0px;
}

.fl.uid .fluid-page-overlay {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  pointer-events: none;
}

.fluid .fluid-collection {
  --icon-area: 40px;
  --accessory-area: 0px;
  --thumbnail-brightness: 97%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: var(--fluid-lg-space);
  position: relative;
  padding: var(--fluid-lg-space);
  padding-top: 2px;
  margin: 0;
}

.fluid .fluid-collection.fluid-collection-appearance-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.fluid .fluid-collection .fluid-collection-item {
  --bg-color: var(--fluid-box-background);
  --fg-color: var(--fluid-box-color);
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  -webkit-user-select: none;
  user-select: none;
}

.fluid .fluid-collection .fluid-collection-item-thumbnail {
  flex: 0 0 auto;
  transition-property: transform;
  transition-duration: 0.15s;
  transform-origin: top center;
  z-index: 1;
  background-color: var(--fluid-inset-background);
}

.fluid .fluid-collection .fluid-collection-item-thumbnail .fluid-aspect-box {
  -webkit-filter: brightness(var(--thumbnail-brightness));
  filter: brightness(var(--thumbnail-brightness));
}

.fluid .fluid-collection .fluid-collection-item-text {
  flex: 1 1 auto;
  display: flex;
  min-height: 50px;
}

.fluid .fluid-collection .fluid-collection-item-text .fluid-item-title {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  max-width: 100%;
  padding: 0 10px;
}

.fluid .fluid-collection .fluid-collection-item-text .fluid-item-title .fluid-item-title-text,
.fluid .fluid-collection .fluid-collection-item-text .fluid-item-title .fluid-item-description {
  line-height: 1;
  word-break: break-word;
  text-align: left;
}

.fluid .fluid-collection .fluid-collection-item-text .fluid-item-title .fluid-item-description {
  padding-top: 3px;
  opacity: 0.7;
  font-size: 11px;
  line-height: 1.3;
}

.fluid .fluid-collection .fluid-collection-item-text .fluid-item-title .fluid-truncate {
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.fluid .fluid-collection .fluid-collection-item-text.item-has-icon .fluid-item-title {
  padding-left: 0;
  max-width: calc(100% - (var(--icon-area) + var(--accessory-area)));
}

.fluid .fluid-collection .fluid-collection-item-icon,
.fluid .fluid-collection .fluid-collection-item-accessory {
  flex: 0 0 var(--icon-area);
  width: var(--icon-area);
  min-height: var(--icon-area);
  display: flex;
  justify-content: center;
  align-items: center;
}

.fluid .fluid-collection .fluid-button.fluid-collection-item-primary-action {
  flex: 1 1 auto;
  padding: 0;
  color: var(--fg-color) !important;
  background: var(--bg-color) !important;
  border-radius: var(--fluid-med-radius);
  overflow: hidden;
  transition-property: background-color box-shadow;
  transition-duration: 0.2s;
}

.fluid .fluid-collection .fluid-button.fluid-collection-item-primary-action > span {
  flex: 1 1 auto;
  flex-direction: column;
  align-items: stretch;
}

.fluid .fluid-collection .fluid-button.fluid-collection-item-primary-action:focus {
  box-shadow: 0 0 0 2px var(--fluid-background), 0 0 0 4px var(--fluid-blue);
}

.fluid .fluid-collection.fluid-collection-appearance-list .fluid-button.fluid-collection-item-primary-action {
  border-radius: var(--fluid-radius);
}

.fluid .fluid-collection .fluid-collection-item.is-selected {
  --bg-color: var(--fluid-blue);
  --fg-color: white;
}

.fluid .fluid-collection .fluid-collection-item.is-selected .fluid-button.fluid-collection-item-primary-action {
  box-shadow: 0 0 0 2px var(--fluid-background), 0 0 0 6px var(--fluid-blue);
}

.fluid .fluid-collection .fluid-collection-item.is-selected .fluid-button.fluid-collection-item-primary-action:hover, .fluid .fluid-collection .fluid-collection-item.is-selected .fluid-button.fluid-collection-item-primary-action:focus {
  --bg-color: var(--fluid-blue);
}

.fluid .fluid-collection .fluid-collection-item.is-dragover {
  padding: 2px;
  border: 3px dashed var(--fluid-line-color);
}

.fluid .fluid-collection .fluid-collection-item-list-content {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--fluid-med-space);
}

.fluid .fluid-collection .fluid-collection-item-list-content .fluid-collection-item-thumbnail {
  width: 120px;
  align-self: stretch;
  background-color: var(--fluid-box-background);
}

.fluid .fluid-collection .fluid-collection-item-list-content .fluid-item-title {
  font-size: 14px;
}

.fluid .fluid-collection .fluid-collection-item-grid-content {
  display: flex;
  flex-direction: column;
}

.fluid .fluid-collection .fluid-collection-item-grid-content .fluid-item-title {
  font-size: 12px;
}

.fluid .fluid-color-scheme-dark .fluid-collection-item .fluid-button.fluid-collection-item-primary-action {
  --fg-color: var(--fluid-opaque-14;)
  		--bg-color: var(--fluid-opaque-1);
}

.fluid .fluid-color-scheme-dark .fluid-collection-item .fluid-button.fluid-collection-item-primary-action:hover {
  --bg-color: var(--fluid-opaque-0);
}

.fluid .fluid-color-scheme-dark .fluid-collection-item.is-selected .fluid-button.fluid-collection-item-primary-action {
  --bg-color: var(--fluid-blue);
  --fg-color: white;
}

.fluid .fluid-color-scheme-dark .fluid-collection-item.is-dragover {
  border: 3px dashed var(--fluid-opaque-4);
}

.fluid-tool-bar .fluid-tool-bar-item {
  border-radius: var(--fluid-med-radius) !important;
  background-color: var(--fluid-box-background);
  color: var(--fluid-box-color);
}

.fluid .fluid-tool-bar {
  --toolbar-size: 60px;
  --toolbar-background: var(--fluid-inset-background);
  --space: 6px;
  flex: 0 0 var(--toolbar-size);
  min-height: var(--toolbar-size);
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--space);
  padding: 0 16px;
  background: var(--toolbar-background);
  border-bottom: 1px solid var(--fluid-line-color);
  z-index: 1;
}

.fluid .fluid-tool-bar.fluid-is-sticky {
  position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
  position: sticky;
  top: 0;
}

.fluid .fluid-tool-bar.fluid-size-lg {
  --toolbar-size: 60px;
}

.fluid .fluid-tool-bar.fluid-size-med {
  --toolbar-size: 50px;
}

.fluid .fluid-tool-bar.fluid-size-sm {
  --toolbar-size: 40px;
}

.fluid .fluid-tool-bar.fluid-tool-bar-appearance-stack {
  flex: 0 0 auto;
  flex-direction: column;
  align-items: stretch;
  min-height: auto;
  padding: 0;
}

.fluid .fluid-tool-bar.fluid-tool-bar-appearance-stack > .fluid-tool-bar-section {
  flex-direction: column;
  gap: 16px;
  padding: 16px;
}

.fluid .fluid-tool-bar.fluid-tool-bar-appearance-stack > .fluid-tool-bar-section > * {
  flex: 1 1 auto;
}

.fluid .fluid-tool-bar .fluid-tool-bar-section {
  flex: 1 1 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 9px;
}

Argonautisbc.gr — Coming Soon

Coming Soon!

A New WordPress Site

How to Build a Website: A Practical Guide to WordPress on Bluehost
How to Migrate a Website to Bluehost?
Why choose Bluehost for your WordPress site?