/*
Theme Name: monolith
Theme URI:
Author:
Author URI:
Description:
Version:
License:
License URI:
Tags: 
Text Domain: monolith
Tested up to:
Requires PHP:
*/

a.custom-logo-link {
	margin-left: 18px; /* default 20px */
}

.demo-mobile a.custom-logo-link img,
.demo-tablet a.custom-logo-link img,
a.custom-logo-link img {
	height: 24px;
	width: auto;
}

.has-dark-theme a.custom-logo-link img {
	filter: invert(100%);
}

@media only screen and (min-width: 600px) {
	a.custom-logo-link img {
		height: 32px;
	}
}


.demo-mobile .entry-content {
	margin-top: var(--app-bar-height);
}

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------

	0. 	CSS Reset
	1. 	Document Setup
	2. 	Element Base
	3. 	Helper Classes
	4. 	Site Header
	5. 	Menu Modal
	6. 	Search Modal
	7. 	Page Templates
		a. 	Template: Cover Template
		c. 	Template: Full Width
	8.  Post: Archive
	9.  Post: Single
	10. Blocks
	11. Entry Content
	12. Comments
	13. Site Pagination
	14. Error 404
	15. Widgets
	16. Site Footer
	17. Media Queries

# 2.0 Typography
# 2.1 Text alignment
# 2.2 
# 2.3 
/*--------------------------------------------------------------
# 1.0 Color
# 1.1 Color: Light theme background colors
# 1.2 Color: Dark theme background colors
# 1.3 Color: Text colors
# 1.4 Color: Icon colors
# 1.5 Color: Shadows
# 1.6 Color: Ripple
----------------------------------------------------------------
----------------------------------------------------------------
# 3.0 Layout
# 3.1 Layout: Margin
# 3.2 Layout: Width
# 3.3 Layout: Components heights
----------------------------------------------------------------
# 4.0 Iconography
----------------------------------------------------------------
# 6.0 Components
# 6.1 App bars: top
# 6.2 App bars: bottom
# 6.3 Backdrop
# 6.4 Banners
# 6.5 Bottom navigation
# 6.6 Buttons
# 6.6.4 Buttons: Icon toggle
# 6.7 Buttons: floating action button
# 6.8 Cards
# 6.9 Chips
# 6.10 Data tables
# 6.11 Dialogs
# 6.12 Dividers
# 6.13 Image lists
# 6.14 Lists
# 6.15 Menus
# 6.16 Navigation drawer
# 6.17 Navigation rail
# 6.18 Pickers
# 6.19 Progress indicators
# 6.20 Selection controls
# 6.21 Sheets: bottom
# 6.22 Sheets: side
# 6.23 Sliders
# 6.24 Snackbars
# 6.25 Tabs
# 6.26 Text fields
# 6.27 Tooltips
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# 0.0 Viewport
--------------------------------------------------------------*/ 
 
/**
 * Does the same thing as <meta name="viewport" content="width=device-width">,
 * but in the future W3C standard way. -ms- prefix is required for IE10+ to
 * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
 * the meta tag. See https://core.trac.wordpress.org/ticket/25888.
 */
@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

/*--------------------------------------------------------------
# 0.0 CSS Reset
--------------------------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
address,
big,
cite,
code,
em,
font,
img,
small,
strike,
sub,
sup,
li,
ol,
ul,
fieldset,
form,
label,
legend,
button,
table,
caption,
tr,
th,
td,

figure,
input,
select,
textarea {
	border: none;
	/* font-size: inherit; */
	/* line-height: inherit; */
	margin: 0;
	padding: 0;
	text-align: inherit;
}

input,
select,
textarea {
	
}


/* from customizer */
:root {
--light-theme-primary-red: 98;
--light-theme-primary-green: 0;
--light-theme-primary-blue: 238;
--light-theme-primary-color: #6200EE;
--light-theme-secondary-red: 3;
--light-theme-secondary-green: 218;
--light-theme-secondary-blue: 198;
--light-theme-secondary-color: #03DAC6;
--light-theme-background-red: 224;
--light-theme-background-green: 223;
--light-theme-background-blue: 229;
--light-theme-background-color: #E0DFE5;
--light-theme-surface-red: 255;
--light-theme-surface-green: 255;
--light-theme-surface-blue: 255;
--light-theme-surface-color: #FFFFFF;
--light-theme-error-red: 176;
--light-theme-error-green: 0;
--light-theme-error-blue: 32;
--light-theme-error-color: #B00020;
--dark-theme-primary-red: 187;
--dark-theme-primary-green: 134;
--dark-theme-primary-blue: 252;
--dark-theme-primary-color: #BB86FC;
--dark-theme-secondary-red: 3;
--dark-theme-secondary-green: 218;
--dark-theme-secondary-blue: 198;
--dark-theme-secondary-color: #03DAC6;
--dark-theme-background-red: 18;
--dark-theme-background-green: 18;
--dark-theme-background-blue: 18;
--dark-theme-background-color: #121212;
--dark-theme-surface-red: 18;
--dark-theme-surface-green: 18;
--dark-theme-surface-blue: 18;
--dark-theme-surface-color: #121212;
--dark-theme-error-red: 207;
--dark-theme-error-green: 102;
--dark-theme-error-blue: 121;
--dark-theme-error-color: #CF6679;
}

/*--------------------------------------------------------------
# 0.0 TYPOGRAPHY
--------------------------------------------------------------*/

:root {
	--headline-1-font-family: "Univers LT W01_55 Roman1475956" !important;
	--headline-2-font-family: "Univers LT W01_55 Roman1475956" !important;
	--headline-3-font-family: "Univers LT W01_55 Roman1475956" !important;
	--headline-4-font-family: "Univers LT W01_55 Roman1475956" !important;
	--headline-5-font-family: "Univers LT W01_55 Roman1475956" !important;
	--headline-6-font-family: "Univers LT W01_55 Roman1475956" !important;
	--subtitle-1-font-family: "Univers LT W01_55 Roman1475956" !important;
	--subtitle-2-font-family: "Univers LT W01_55 Roman1475956" !important;
	--body-1-font-family: "Univers LT W01_55 Roman1475956" !important;
	--body-2-font-family: "Univers LT W01_55 Roman1475956" !important;
	--button-font-family: "Univers LT W01_55 Roman1475956" !important;
	--caption-font-family: "Univers LT W01_55 Roman1475956" !important;
	--overline-font-family: "Univers LT W01_55 Roman1475956" !important;
}

h1 {
	xxx-font-size: 16.8791px;
	xxx-line-height: 24px;
	padding: 0.05px 0;
}

h1::before,
h2::before,
h3::before,
h4::before,
h5::before,
h6::before,
p::before,
.headline-1::before,
.headline-2::before,
.headline-3::before,
.headline-4::before,
.headline-5::before,
.headline-6::before,
.subtitle-1::before,
.subtitle-2::before,
.overline::before,
.caption::before,
h1::after,
h2::after,
h3::after,
h4::after,
h5::after,
h6::after,
p::after 
.headline-1::after,
.headline-2::after,
.headline-3::after,
.headline-4::after,
.headline-5::after,
.headline-6::after,
.subtitle-1::after,
.subtitle-2::after,
.overline::after,
.caption::after {
	content: "";
	display: block;
	height: 0;
}

h1,
.headline-1 {
	margin-bottom: -24px;
}

h1::before,
.headline-1::before {
	margin-top: -0.1750em;
}

h1::after,
.headline-1::after {
	margin-bottom: -0.1027em;
}

h2::before,
.headline-2::before {
	margin-top: -0.1757em;
}

h2::after,
.headline-2::after {
	margin-bottom: -0.1027em;
}

h3::before,
.headline-3::before {
	margin-top: -0.1757em;
}

h3::after,
.headline-3::after {
	margin-bottom: -0.1027em;
}

h4::before,
.headline-4::before {
	margin-top: -0.1757em;
}

h4::after,
.headline-4::after {
	margin-bottom: -0.1027em;
}

h5::before,
.headline-5::before {
	margin-top: -0.25em;
}

h5::after,
.headline-5::after {

}

h6::before,
.headline-6::before {
	margin-top: -0.25em;
}

h6::after,
.headline-6::after {

}

p {
  font-size: 14px;
  line-height: 22.136px;
  padding: 0.05px 0;
  margin-top: 1em !important;
  margin-bottom: 1em !important;
}

p::before {
  content: "";	
  margin-top: -0.4686em;	
  display: block;	
  height: 0;	
}

p::after {
  content: "";	
  margin-bottom: -0.3956em;	
  display: block;	
  height: 0;	
}

/* Headline 1 */

h1 + h1,
.headline-1 + .headline-1 {
	margin-top: 0px;
}

h1 + h2,
.headline-1 + .headline-2 {
	margin-top: 0px;
}

h1 + h3,
.headline-1 + .headline-3 {
	margin-top: 0px;
}

h1 + h4,
.headline-1 + .headline-4 {
	margin-top: 0px;
}

h1 + h5,
.headline-1 + .headline-5 {
	margin-top: 0px;
}

h1 + h6,
.headline-1 + .headline-6 {
	margin-top: 0px;
}

h1 + .subtitle-1,
.headline-1 + .subtitle-1 {
	margin-top: 0px;
}

h1 + .subtitle-2,
.headline-1 + .subtitle-2 {
	margin-top: 0px;
}

h1 + p,
.headline-1 + p {
	margin-top: 0px;
}

h1 + .body-2,
.headline-1 + .body-2 {
	margin-top: 0px;
}

/* Headline 2 */

h2 + h1 {
	margin-top: 16px;
}

h2 + h2 {
	margin-top: 11px;
}

h2 + h3 {
	margin-top: 3px;
}

h2 + h4 {
	margin-top: 0px;
}

h2 + h5 {
	margin-top: 3px;
}

h2 + h6 {
	margin-top: 6px;
}

h2 + .subtitle-1 {
	margin-top: 8px;
}

h2 + .subtitle-2 {
	margin-top: 8px;
}

h2 + p {
	margin-top: -9px;
}

h2 + .body-2 {
	margin-top: 8px;
}

/* OVERLINE */

p.overline {
	margin-top: unset; /* default */
	margin-bottom: unset; /* default */
}

p.overline::before {
	margin-top: -0.055em;
}

p.overline::after {
	margin-bottom: -0.5em;
}

.overline + h1,
.overline + .headline-1 {
	margin-top: 0px;
}

.overline + h2,
.overline + .headline-2 {
	margin-top: 0px;
}

.overline + h3,
.overline + .headline-3 {
	margin-top: 0px;
}

.overline + h4,
.overline + .headline-4 {
	margin-top: 0px;
}

.overline + h5,
.overline + .headline-5 {
	margin-top: 0px;
}

.overline + h6,
.overline + .headline-6 {
	margin-top: 0px;
}

.overline + .subtitle-1 {
	margin-top: 0px;
}

.overline + .subtitle-2 {
	margin-top: 0px;
}

.overline + p {
	margin-top: 12px;
}

.overline + .body-2 {
	margin-top: 0px;
}












body,
[class*="body-1"] {
	font-family: var(--body-1-font-family);
	font-size: var(--body-1-font-size);
	font-weight: var(--body-1-font-weight);
	line-height: var(--body-1-line-height, normal);
	letter-spacing: var(--body-1-letter-spacing, normal);

	color: var(--primary-text-color);
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
option {
	font-family: var(--body-1-font-family);
	font-size: var(--body-1-font-size);
	font-style: var(--body-1-font-style, normal);
	font-weight: var(--body-1-font-weight, normal);
	line-height: var(--body-1-line-height, normal);
	letter-spacing: var(--body-1-letter-spacing, normal);
}

[class*="body-2"],
.woocommerce-variation-description {
	font-family: var(--body-2-font-family);
	font-size: var(--body-2-font-size);
	font-weight: var(--body-2-font-weight, normal);
	line-height: var(--body-2-line-height, normal);
	letter-spacing: var(--body-2-letter-spacing, normal);
	text-transform: var(--body-2-text-transform, none);
}

h1:not([class*="headline-"]):not([class*="subtitle-"]):not(.entry-title),
[class*="headline-1"] {
	font-family: var(--headline-1-font-family);
	font-size: var(--headline-1-font-size);
	font-weight: var(--headline-1-font-weight, normal);
	line-height: var(--headline-1-line-height, normal);
	letter-spacing: var(--headline-1-letter-spacing, normal);
	color: var(--primary-text-color);
}

h2:not([class*="headline-"]):not([class*="subtitle-"]):not(.woocommerce-loop-product__title),
[class*="headline-2"] {
	font-family: var(--headline-2-font-family);
	font-size: var(--headline-2-font-size);
	font-weight: var(--headline-2-font-weight, normal);
	line-height: var(--headline-2-line-height, normal);
	letter-spacing: var(--headline-2-letter-spacing, normal);
	color: var(--primary-text-color);
}

h3:not([class*="headline-"]):not([class*="subtitle-"]):not([class*="calendar"]):not([class*="tribe-common-h4"]),
[class*="headline-3"] {
	font-family: var(--headline-3-font-family);
	font-size: var(--headline-3-font-size);
	font-weight: var(--headline-3-font-weight, normal);
	line-height: var(--headline-3-line-height, normal);
	letter-spacing: var(--headline-3-letter-spacing, normal);
	color: var(--primary-text-color);
}

h4:not([class*="headline-"]):not([class*="subtitle-"]),
h1.entry-title,
[class*="headline-4"] {
	font-family: var(--headline-4-font-family);
	font-size: var(--headline-4-font-size);
	font-weight: var(--headline-4-font-weight, normal);
	line-height: var(--headline-4-line-height, normal);
	letter-spacing: var(--headline-4-letter-spacing, normal);
	color: var(--primary-text-color);
}

h5:not([class*="headline-"]):not([class*="subtitle-"]),
.card h2,
.woocommerce-loop-product__title,
table.variations label,
.single-product span.woocommerce-Price-amount.amount,
time.tribe-events-calendar-list__month-separator-text, /* LIST */
[class*="tribe-common-b3"], /* MONTH WEEKDAY */
[class*="tribe-common-h4"], /* MONTH DAYNUM */
[class*="headline-5"] {
	font-family: var(--headline-5-font-family);
	font-size: var(--headline-5-font-size);
	font-weight: var(--headline-5-font-weight, normal);
	line-height: var(--headline-5-line-height, normal);
	letter-spacing: var(--headline-5-letter-spacing, normal);
	color: var(--primary-text-color);
}

table.variations label {
	margin-bottom: 0;
}

h6:not([class*="headline-"]):not([class*="subtitle-"]),
[class*="headline-6"] {
	font-family: var(--headline-6-font-family);
	font-size: var(--headline-6-font-size);
	font-weight: var(--headline-6-font-weight, normal);
	line-height: var(--headline-6-line-height, normal);
	letter-spacing: var(--headline-6-letter-spacing, normal);
	color: var(--primary-text-color);
}

[class*="subtitle-1"],
.three-line-list ul li a h2 {
	font-family: var(--subtitle-1-font-family);
	font-size: var(--subtitle-1-font-size);
	font-weight: var(--subtitle-1-font-weight, normal);
	line-height: var(--subtitle-1-line-height, normal);
	letter-spacing: var(--subtitle-1-letter-spacing, normal);
	text-transform: var(--subtitle-1-text-transform, none);
	color: var(--primary-text-color);
	text-align: var(--subtitle-1-text-align);
}

[class*="subtitle-2"] {
	font-family: var(--subtitle-2-font-family);
	font-size: var(--subtitle-2-font-size);
	font-weight: var(--subtitle-2-font-weight, normal);
	line-height: var(--subtitle-2-line-height, normal);
	letter-spacing: var(--subtitle-2-letter-spacing, normal);
	text-transform: var(--subtitle-2-text-transform, none);
	color: var(--primary-text-color);
	text-align: var(--subtitle-2-text-align);
}

[class*="overline"] {
	font-family: var(--overline-font-family) !important; /* prevent ... */
	font-size: var(--overline-font-size) !important; /* prevent ... */
	font-weight: var(--overline-font-weight) !important; /* prevent ... */
	line-height: var(--overline-line-height) !important; /* prevent ... */
	letter-spacing: var(--overline-letter-spacing) !important; /* prevent ... */
	text-transform: var(--overline-text-transform, uppercase) !important; /* prevent ... */
	color: var(--secondary-text-color) !important; /* wp-block-cover */
}

button,
[type="button"],
[type="reset"],
[type="submit"],
[class*=button],
[class*=btn]:not([class*=icon]):not(.btn-float),
.nav-tabs a.nav-link {
	font-family: var(--button-font-family);
	font-size: var(--button-font-size);
	font-weight: var(--button-font-weight, normal);
	line-height: var(--button-line-height, normal);
	letter-spacing: var(--button-letter-spacing, normal);
	text-transform: var(--button-text-transform, uppercase);
}

caption,
.caption,
cite,
figcaption,
small.helper-text,
.legal-price-info {
	font-family: var(--caption-font-family);
	font-size: var(--caption-font-size);
	font-weight: var(--caption-font-weight);
	line-height: var(--caption-line-height, normal);
	letter-spacing: var(--caption-letter-spacing, normal);
	text-align: var(--caption-text-align, left);
	text-transform: var(--caption-text-transform, none);
	color: var(--secondary-text-color); 
}

em,
i:not(.material-icons):not(.waves-effect),
q,
dfn {
	font-family: var(--italic-font-family);
	font-size: var(--italic-font-size);
	font-style: var(--italic-font-style, italic);
	font-weight: var(--italic-font-weight);
	line-height: var(--italic-line-height);
	letter-spacing: var(--italic-letter-spacing);
}

b,
dt,
strong,
th {
	font-family: var(--bold-font-family);
	font-size: var(--bold-font-size);
	font-style: var(--bold-font-style);
	font-weight: var(--bold-font-weight, 500);
	line-height: var(--bold-line-height);
	letter-spacing: var(--bold-letter-spacing);
}

code,
kbd,
pre,
samp {
	font-family: var(--monospace-font-family, monospace);
	font-size: var(--monospace-font-size);
	font-style: var(--monospace-font-style);
	font-weight: var(--monospace-font-weight);
	line-height: var(--monospace-line-height);
	letter-spacing: var(--monospace-letter-spacing, normal);
}

.has-small-font-size {
	font-size: 13px;
	line-height: 1.2;
}

.has-regular-font-size, /* Not used now, kept because of backward compatibility. */
.has-normal-font-size {
	font-size: 16px;
	line-height: 1.2;
}

.has-medium-font-size {
	font-size: 20px;
	line-height: 1.2;
}

.has-large-font-size {
	font-size: 36px;
	line-height: 1.2;
}

.has-larger-font-size, /*  Not used now, kept because of backward compatibility. */
.has-huge-font-size {
	font-size: 42px;
	line-height: 1.2;
}

p[stylexxx] {
	line-height: 1.2 !important;
	border: 2px solid blue;
}

/* Text alignments. */

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

.has-text-align-left {
	/*rtl:ignore*/
	text-align: left;
}

.has-text-align-right {
	/*rtl:ignore*/
	text-align: right;
}









/*--------------------------------------------------------------
# 0.0 ICONOGRAPHY
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# 0.0 COMPONENTS HEIGHT
--------------------------------------------------------------*/

:root {
	--app-bar-height: 56px;
}

@media only screen and (min-width: 600px) {
	:root {
		--app-bar-height: 64px;
	}
}

@media only screen and (min-width: 1280px) {
	:root {
		--app-bar-height: 64px;
	}
}

.app-bar-top {
	min-height: 56px;
}

.app-bar-bottom {
	min-height: 56px;
}

/*--------------------------------------------------------------
# 0.0 VERTICAL SPACING
--------------------------------------------------------------*/

blockquote,
.figure,
figure.aligncenter, .wp-block-cover.aligncenter, img.aligncenter /* classic */,
figure.alignfull, .wp-block-cover.alignfull, img.alignfull /* classic */,
figure.alignwide, .wp-block-cover.alignwide, img.alignwide /* classic */,
figure.alignnone, .wp-block-cover.alignnone, img.alignnone /* classic */,
figure.wp-block-audio,
figure.wp-block-gallery,
figure.wp-block-image,
figure.wp-block-table,
figure.wp-block-video,
:not(figure) > pre.wp-block-code,
:not(figure) > pre.wp-block-preformatted,
:not(figure) > pre.wp-block-verse,
:not(figure):not(a) > img:not([class*="wp-image"]):not([class*="avatar"]):not(.attachment-woocommerce_thumbnail):not(.alignright):not(.alignleft),
:not(figure):not(form) > table:not([class*="calendar"]) {
	margin-top: var(--figure-margin-top-NEU, 56px);
	margin-bottom: var(--figure-margin-bottom-NEU, 56px);
	border-top: 1px dotted pink;
	border-bottom: 1px dotted pink;
}

figure.alignright, .wp-block-cover.alignright,
img.alignright,
figure.alignleft, .wp-block-cover.alignleft,
img.alignleft {
	margin-top: var(--figure-margin-top-NEU, 0.3333em);
	margin-bottom: var(--figure-margin-bottom-NEU, 56px);
	border-top: 1px dotted orange;
	border-bottom: 1px dotted orange;
}

figure.aligncenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

img.aligncenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

.wp-block-image .aligncenter {
	display: table;
	margin-right: auto;
	margin-left: auto;
}

.wp-block-cover.aligncenter,
.wp-block-cover-image.aligncenter {
	display: flex;
	margin-right: auto;
	margin-left: auto;
}


h1 + figure:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h2 + figure:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h3 + figure:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h4 + figure:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h5 + figure:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h6 + figure:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone) {
	margin-top: var(--figure-margin-top-NEU, 1.5em);
}

h1 + table:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h2 + table:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h3 + table:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h4 + table:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h5 + table:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone),
h6 + table:not(.alignfull):not(.alignwide):not(.alignright):not(.alignleft):not(.aligncenter):not(.alignnone) {
	margin-top: var(--figure-margin-top-NEU, 0.5em);
}

h1 + ul,
h2 + ul,
h3 + ul,
h4 + ul,
h5 + ul,
h6 + ul ,
h1 + ol,
h2 + ol,
h3 + ol,
h4 + ol,
h5 + ol,
h6 + ol,
h1 + dl,
h2 + dl,
h3 + dl,
h4 + dl,
h5 + dl,
h6 + dl,
h1 + pre,
h2 + pre,
h3 + pre,
h4 + pre,
h5 + pre,
h6 + pre {
	margin-top: var(--figure-margin-top-NEU, 0.5em);
}



p + pre {
	margin-top: var(--figure-margin-top-NEU, 0em);
}

h1 + .block-wrapper.figure,
h2 + .block-wrapper.figure,
h3 + .block-wrapper.figure,
h4 + .block-wrapper.figure,
h5 + .block-wrapper.figure,
h6 + .block-wrapper.figure,
p + .block-wrapper.figure {
	margin-top: var(--figure-margin-top-NEU, -0.5em);
}

hr {
	margin-top: 56px; /* TODO vertical spacing */
	margin-bottom: 56px; /* TODO vertical spacing */
}



main > .entry-content > *:not(:last-child):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(p):not(span):not(ul):not(ol):not(.avatar):not(.wp-block-image):not(.wp-block-spacer) {
	margin-bottom: 56px;
	border: 1px dotted red;
}

main > .entry-content > h1,
main > .entry-content > h2,
main > .entry-content > h3,
main > .entry-content > h4,
main > .entry-content > h5,
main > .entry-content > h6 {
	margin-bottom: 8px;
	border: 1px dotted red;
}

main > .entry-content > ul:not(:last-child),
main > .entry-content > ol:not(:last-child) {
	margin-bottom: 1.5em;
}

main > .entry-content > p {
	margin-bottom: 1em;
}

main > .entry-content > :last-child,
main > .entry-content > ul:last-child,
main > .entry-content > ol:last-child {
	margin-bottom: 0 !important;
}





.has-entry-content-max-width {
	max-width: calc( var(--entry-content-max-width) + 2 * var(--entry-content-margin) );
}



.alignfull:not(.wp-block-image) {
	width: calc( 100% + 2 * var(--entry-content-margin) );
	margin-right: calc( -1 * var(--entry-content-margin) );
	margin-left: calc( -1 * var(--entry-content-margin) );
}

.alignfull.wp-block-image img {
	width: calc( 100% + 2 * var(--entry-content-margin) );
	max-width: calc( 100% + 2 * var(--entry-content-margin) );
	margin-right: calc( -1 * var(--entry-content-margin) );
	margin-left: calc( -1 * var(--entry-content-margin) );
}



/*--------------------------------------------------------------
# 0.0 Image alignment
--------------------------------------------------------------*/

.img-placeholder {
	background: #CCC;
}













/*--------------------------------------------------------------
# 0.0 COLOR
--------------------------------------------------------------*/



/*--------------------------------------------------------------
# 0.0 Lists
--------------------------------------------------------------*/




/*--------------------------------------------------------------
# 0.0 Lists styles
--------------------------------------------------------------*/

.has-list-style-type-disc {
	list-style-type: disc;
}

.has-list-style-type-circle {
	list-style-type: circle;
}

.has-list-style-type-square {
	list-style-type: square;
}

/*--------------------------------------------------------------
# 0.0 CLASSES: Display
--------------------------------------------------------------*/

.display-block {
	display: block;
}

.display-flex {
	display: flex;
}

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

.display-none {
	display: none;
}

@media only screen and (min-width: 600px) {

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

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

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

	.display-none-600 {
		display: none;
	}

}

@media only screen and (min-width: 1280px) {

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

	.display-block-important-1280 {
		display: block !important;
	}

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

	.display-flex-important-1280 {
		display: flex !important;
	}

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

	.display-inline-flex-important-1280 {
		display: inline-flex !important;
	}

	.display-none-1280 {
		display: none;
	}

	.display-none-important-1280 {
		display: none !important;
	}

}

/*--------------------------------------------------------------
# 0.0 CLASSES: Height
--------------------------------------------------------------*/

.height-100 {
	height: 100%;
}

/*--------------------------------------------------------------
# 0.0 CLASSES: Min-Height
--------------------------------------------------------------*/

.min-height-100 {
	min-height: 100%;
}

.min-height-50vh {
	min-height: 50vh;
}

/*--------------------------------------------------------------
# 0.0 CLASSES: Width
--------------------------------------------------------------*/

.width-100 {
	width: 100%;
}

.width-sidenav {
	width: var(--sidenav-width);
}

.max-width-600 {
	max-width: 600px;
}

.max-width-1024 {
	max-width: 1024px;
}

.max-width-1280 {
	max-width: 1280px;
}

/*--------------------------------------------------------------
# 0.0 CLASSES: Min-Width
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# 0.0 CLASSES: Max-Width
--------------------------------------------------------------*/

.max-width-sidenav {
	max-width: calc( var(--sidenav-width, 256px) );
}

@media only screen and (min-width: 600px) {
	.max-width-sidenav-600 {
		max-width: calc( var(--sidenav-width, 256px) );
	}
}

@media only screen and (min-width: 1280px) {
	.max-width-sidenav-1280 {
		max-width: calc( var(--sidenav-width, 256px) );
	}
}

/*--------------------------------------------------------------
# 0.0 CLASSES: Margin
--------------------------------------------------------------*/

.has-app-bar-margin {
	margin-right: 0;
	margin-left: 0;
}



.margin-0 {
	margin: 0;
}




.margin-top-app-bar-height {
	margin-top: var(--app-bar-height);
}

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

.margin-top-unset {
	margin-top: unset !important;
}

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

.margin-right-unset {
	margin-right: unset;
}

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

.margin-bottom-unset {
	margin-bottom: unset !important;
}

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

.margin-left-unset {
	margin-right: unset;
}




.padding-0 {
	padding: 0;
}

.padding-top-app-bar-height {
	padding-top: var(--app-bar-height);
}




/*--------------------------------------------------------------
# 0.0 CLASSES: Position
--------------------------------------------------------------*/



.position-absolute {
	position: absolute;
}

.position-fixed {
	position: fixed;
}

.position-relative {
	position: relative;
}


.position-absolute-top {
	position: absolute;
	top: 0;
	right: 0;
	bottom: auto;
	left: 0;
}

.position-fixed-all {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.position-fixed-top {
	position: fixed;
	top: 0;
	right: 0;
	bottom: auto;
	left: 0;
}

.position-fixed-left {
	position: fixed;
	top: 0;
	right: auto;
	bottom: 0;
	left: 0;
}

.position-sticky-top {
	position: sticky;
	top: 0;
	right: 0;
	bottom: auto;
	left: 0;
}

@media only screen and (min-width: 1280px) {

	.position-absolute-top-1280 {
		position: absolute;
		top: 0;
		right: 0;
		bottom: auto;
		left: 0;
	}

	.position-fixed-top-1280 {
		position: fixed;
		top: 0;
		right: 0;
		bottom: auto;
		left: 0;
	}

	.position-sticky-top-1280 {
		position: sticky;
		top: 0;
		right: 0;
		bottom: auto;
		left: 0;
	}

}


.top-auto {
	top: auto;
}

.right-auto {
	right: auto;
}

.bottom-auto {
	bottom: auto;
}

.left-auto {
	left: auto;
}

@media only screen and (min-width: 600px) {

	.top-600-auto {
		top: auto;
	}

	.right-600-auto {
		right: auto;
	}

	.bottom-600-auto {
		bottom: auto;
	}

	.left-600-auto {
		left: auto;
	}

}

@media only screen and (min-width: 1280px) {

	.top-1280-auto {
		top: auto;
	}

	.right-1280-auto {
		right: auto;
	}

	.bottom-1280-auto {
		bottom: auto;
	}

	.left-1280-auto {
		left: auto;
	}

}

/*--------------------------------------------------------------
# 0.0 CLASSES: Box-shadow
--------------------------------------------------------------*/

:root {
	--shadow-00: none;
	--shadow-01: 0 2px 1px -1px rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 1px 3px 0 rgba(0,0,0,0.12);
	--shadow-02: 0 3px 1px -2px rgba(0,0,0,0.2), 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12);
	--shadow-03: 0 3px 3px -2px rgba(0,0,0,0.2), 0 3px 4px 0 rgba(0,0,0,0.14), 0 1px 8px 0 rgba(0,0,0,0.12);
	--shadow-04: 0 2px 4px -1px rgba(0,0,0,0.2), 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12);
	--shadow-05: 0 3px 5px -1px rgba(0,0,0,0.2), 0 5px 8px 0 rgba(0,0,0,0.14), 0 1px 14px 0 rgba(0,0,0,0.12);
	--shadow-06: 0 3px 5px -1px rgba(0,0,0,0.2), 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12);
	--shadow-07: 0 4px 5px -2px rgba(0,0,0,0.2), 0 7px 10px 1px rgba(0,0,0,0.14), 0 2px 16px 1px rgba(0,0,0,0.12);
	--shadow-08: 0 5px 5px -3px rgba(0,0,0,0.2), 0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12);
	--shadow-09: 0 5px 6px -3px rgba(0,0,0,0.2), 0 9px 12px 1px rgba(0,0,0,0.14), 0 3px 16px 2px rgba(0,0,0,0.12);
	--shadow-10: 0 6px 6px -3px rgba(0,0,0,0.2), 0 10px 14px 1px rgba(0,0,0,0.14), 0 4px 18px 3px rgba(0,0,0,0.12);
	--shadow-11: 0 6px 7px -4px rgba(0,0,0,0.2), 0 11px 15px 1px rgba(0,0,0,0.14), 0 4px 20px 3px rgba(0,0,0,0.12);
	--shadow-12: 0 7px 8px -4px rgba(0,0,0,0.2), 0 12px 17px 2px rgba(0,0,0,0.14), 0 5px 22px 4px rgba(0,0,0,0.12);
	--shadow-13: 0 7px 8px -4px rgba(0,0,0,0.2), 0 13px 19px 2px rgba(0,0,0,0.14), 0 5px 24px 4px rgba(0,0,0,0.12);
	--shadow-14: 0 7px 9px -4px rgba(0,0,0,0.2), 0 14px 21px 2px rgba(0,0,0,0.14), 0 5px 26px 4px rgba(0,0,0,0.12);
	--shadow-15: 0 8px 9px -5px rgba(0,0,0,0.2), 0 15px 22px 2px rgba(0,0,0,0.14), 0 6px 28px 5px rgba(0,0,0,0.12);
	--shadow-16: 0 8px 10px -5px rgba(0,0,0,0.2), 0 16px 24px 2px rgba(0,0,0,0.14), 0 6px 30px 5px rgba(0,0,0,0.12);
	--shadow-17: 0 8px 11px -5px rgba(0,0,0,0.2), 0 17px 26px 2px rgba(0,0,0,0.14), 0 6px 32px 5px rgba(0,0,0,0.12);
	--shadow-18: 0 9px 11px -5px rgba(0,0,0,0.2), 0 18px 28px 2px rgba(0,0,0,0.14), 0 7px 34px 6px rgba(0,0,0,0.12);
	--shadow-19: 0 9px 12px -6px rgba(0,0,0,0.2), 0 19px 29px 2px rgba(0,0,0,0.14), 0 7px 36px 6px rgba(0,0,0,0.12);
	--shadow-20: 0 10px 13px -6px rgba(0,0,0,0.2), 0 20px 31px 3px rgba(0,0,0,0.14), 0 8px 38px 7px rgba(0,0,0,0.12);
	--shadow-21: 0 10px 13px -6px rgba(0,0,0,0.2), 0 21px 33px 3px rgba(0,0,0,0.14), 0 8px 40px 7px rgba(0,0,0,0.12);
	--shadow-22: 0 10px 14px -6px rgba(0,0,0,0.2), 0 22px 35px 3px rgba(0,0,0,0.14), 0 8px 42px 7px rgba(0,0,0,0.12);
	--shadow-23: 0 11px 14px -7px rgba(0,0,0,0.2), 0 23px 36px 3px rgba(0,0,0,0.14), 0 9px 44px 8px rgba(0,0,0,0.12);
	--shadow-24: 0 11px 15px -7px rgba(0,0,0,0.2), 0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12);
}

.box-shadow-none {
	box-shadow: none;
}

.has-shadow-level-01,
.box-shadow-01 {
	box-shadow: var(--shadow-01);
}

.has-shadow-level-02,
.box-shadow-02 {
	box-shadow: var(--shadow-02);
}

.has-shadow-level-03,
.box-shadow-03 {
	box-shadow: var(--shadow-03);
}

.has-shadow-level-04,
.box-shadow-04 {
	box-shadow: var(--shadow-04);
}

.has-shadow-level-05,
.box-shadow-05 {
	box-shadow: var(--shadow-05);
}

.has-shadow-level-06,
.box-shadow-06 {
	box-shadow: var(--shadow-06);
}

.has-shadow-level-07,
.box-shadow-07 {
	box-shadow: var(--shadow-07);
}

.has-shadow-level-08,
.box-shadow-08 {
	box-shadow: var(--shadow-08);
}

.has-shadow-level-09,
.box-shadow-09 {
	box-shadow: var(--shadow-09);
}

.has-shadow-level-10,
.box-shadow-10 {
	box-shadow: var(--shadow-10);
}

.has-shadow-level-11,
.box-shadow-11 {
	box-shadow: var(--shadow-11);
}

.has-shadow-level-12,
.box-shadow-12 {
	box-shadow: var(--shadow-12);
}

.has-shadow-level-13,
.box-shadow-13 {
	box-shadow: var(--shadow-13);
}

.has-shadow-level-14,
.box-shadow-14 {
	box-shadow: var(--shadow-14);
}

.has-shadow-level-15,
.box-shadow-15 {
	box-shadow: var(--shadow-16);
}

.has-shadow-level-16,
.box-shadow-16 {
	box-shadow: var(--shadow-16);
}

.has-shadow-level-17,
.box-shadow-17 {
	box-shadow: var(--shadow-17);
}

.has-shadow-level-18,
.box-shadow-18 {
	box-shadow: var(--shadow-18);
}

.has-shadow-level-19,
.box-shadow-19 {
	box-shadow: var(--shadow-19);
}

.has-shadow-level-20,
.box-shadow-20 {
	box-shadow: var(--shadow-20);
}

.has-shadow-level-21,
.box-shadow-21 {
	box-shadow: var(--shadow-21);
}

.has-shadow-level-22,
.box-shadow-22 {
	box-shadow: var(--shadow-22);
}

.has-shadow-level-23,
.box-shadow-23 {
	box-shadow: var(--shadow-23);
}

.has-shadow-level-24,
.box-shadow-24 {
	box-shadow: var(--shadow-24);
}

@media only screen and (min-width: 600px) {

	.box-shadow-600-none {
		box-shadow: none;
	}

}

@media only screen and (min-width: 1280px) {

	.box-shadow-1280-none {
		box-shadow: none;
	}

}




















/*--------------------------------------------------------------
# 0.0 CLASSES: GRID
--------------------------------------------------------------*/

.has-fixed-grid {
	border: 1px solid red !important;
}

.has-fluid-grid {
	border: 1px solid green;
	max-width: calc( 100% );
}

.has-entry-content-margin {
	border-right: var(--entry-content-margin) solid rgb(246, 36, 89, 0.1) !important;
	border-left: var(--entry-content-margin) solid rgba(246, 36, 89, 0.1) !important;
}

.has-entry-content-max-width {
	max-width: calc( 100% ) !important;
}















:root {
	--entry-content-max-width: 800px;
}

:root {
	--icon-font: Material Icons;
}

:root {
	--side-sheet-width: 320px !important;
}




/*--------------------------------------------------------------
# 1.0 Color: Dark Theme
--------------------------------------------------------------*/

.has-dark-theme {
	--theme-primary-color:         var(--dark-theme-primary-red),var(--dark-theme-primary-green),var(--dark-theme-primary-blue);
	--theme-primary-red:           var(--dark-theme-primary-red);
	--theme-primary-blue:          var(--dark-theme-primary-blue);
	--theme-primary-green:         var(--dark-theme-primary-green);
	--theme-on-primary-color:      calc(((((var(--dark-theme-primary-red) * 299) + (var(--dark-theme-primary-green) * 587) + (var(--dark-theme-primary-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--theme-secondary-color:       var(--dark-theme-secondary-red),var(--dark-theme-secondary-green),var(--dark-theme-secondary-blue);
	--theme-secondary-red:         var(--dark-theme-secondary-red);
	--theme-secondary-blue:        var(--dark-theme-secondary-blue);
	--theme-secondary-green:       var(--dark-theme-secondary-green);
	--theme-on-secondary-color:    calc(((((var(--dark-theme-secondary-red) * 299) + (var(--dark-theme-secondary-green) * 587) + (var(--dark-theme-secondary-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--theme-background-color:      var(--dark-theme-background-red),var(--dark-theme-background-green),var(--dark-theme-background-blue);
	--theme-background-red:        var(--dark-theme-background-red);
	--theme-background-blue:       var(--dark-theme-background-blue);
	--theme-background-green:      var(--dark-theme-background-green);
	--theme-on-background-color:   calc(((((var(--dark-theme-background-red) * 299) + (var(--dark-theme-background-green) * 587) + (var(--dark-theme-background-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--theme-surface-color:         var(--dark-theme-surface-red),var(--dark-theme-surface-green),var(--dark-theme-surface-blue);
	--theme-surface-red:           var(--dark-theme-surface-red);
	--theme-surface-blue:          var(--dark-theme-surface-blue);
	--theme-surface-green:         var(--dark-theme-surface-green);
	--theme-on-surface-color:      calc(((((var(--dark-theme-surface-red) * 299) + (var(--dark-theme-surface-green) * 587) + (var(--dark-theme-surface-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--theme-error-color:           var(--dark-theme-error-red),var(--dark-theme-error-green),var(--dark-theme-error-blue);
	--theme-error-red:             var(--dark-theme-error-red);
	--theme-error-blue:            var(--dark-theme-error-blue);
	--theme-error-green:           var(--dark-theme-error-green);
	--theme-on-error-color:        calc(((((var(--dark-theme-error-red) * 299) + (var(--dark-theme-error-green) * 587) + (var(--dark-theme-error-blue) * 114)) / 1000 ) - 128 ) * -1000 );
}

/*--------------------------------------------------------------
# 1.0 Color: Light Theme
--------------------------------------------------------------*/

.has-light-theme {
	--theme-primary-color:         var(--light-theme-primary-red),var(--light-theme-primary-green),var(--light-theme-primary-blue);
	--theme-primary-red:           var(--light-theme-primary-red);
	--theme-primary-blue:          var(--light-theme-primary-blue);
	--theme-primary-green:         var(--light-theme-primary-green);
	--theme-on-primary-color:      calc(((((var(--light-theme-primary-red) * 299) + (var(--light-theme-primary-green) * 587) + (var(--light-theme-primary-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--theme-secondary-color:       var(--light-theme-secondary-red),var(--light-theme-secondary-green),var(--light-theme-secondary-blue);
	--theme-secondary-red:         var(--light-theme-secondary-red);
	--theme-secondary-blue:        var(--light-theme-secondary-blue);
	--theme-secondary-green:       var(--light-theme-secondary-green);
	--theme-on-secondary-color:    calc(((((var(--light-theme-secondary-red) * 299) + (var(--light-theme-secondary-green) * 587) + (var(--light-theme-secondary-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--theme-background-color:      var(--light-theme-background-red),var(--light-theme-background-green),var(--light-theme-background-blue);
	--theme-background-red:        var(--light-theme-background-red);
	--theme-background-blue:       var(--light-theme-background-blue);
	--theme-background-green:      var(--light-theme-background-green);
	--theme-on-background-color:   calc(((((var(--light-theme-background-red) * 299) + (var(--light-theme-background-green) * 587) + (var(--light-theme-background-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--theme-surface-color:         var(--light-theme-surface-red),var(--light-theme-surface-green),var(--light-theme-surface-blue);
	--theme-surface-red:           var(--light-theme-surface-red);
	--theme-surface-blue:          var(--light-theme-surface-blue);
	--theme-surface-green:         var(--light-theme-surface-green);
	--theme-on-surface-color:      calc(((((var(--light-theme-surface-red) * 299) + (var(--light-theme-surface-green) * 587) + (var(--light-theme-surface-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--theme-error-color:           var(--light-theme-error-red),var(--light-theme-error-green),var(--light-theme-error-blue);
	--theme-error-red:             var(--light-theme-error-red);
	--theme-error-blue:            var(--light-theme-error-blue);
	--theme-error-green:           var(--light-theme-error-green);
	--theme-on-error-color:        calc(((((var(--light-theme-error-red) * 299) + (var(--light-theme-error-green) * 587) + (var(--light-theme-error-blue) * 114)) / 1000 ) - 128 ) * -1000 );
}

/*--------------------------------------------------------------
# 1.0 Background colors vars
--------------------------------------------------------------*/

.btn-contained:not([class*=background-color]):not(:disabled),
.flat-chip.selected,
.flat-chip input[type="checkbox"]:checked ~ label,
.flat-chip input[type="radio"]:checked ~ label,
.flat-chip.pressed,
.has-primary-background-color {
	--red:                         var(--theme-primary-red);
	--green:                       var(--theme-primary-green);
	--blue:                        var(--theme-primary-blue);
	--theme-primary-color:         var(--theme-primary-red),var(--theme-primary-green),var(--theme-primary-blue);
	--accessible-color:            calc(((((var(--theme-primary-red) * 299) + (var(--theme-primary-green) * 587) + (var(--theme-primary-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--on-color:                    var(--accessible-color),var(--accessible-color),var(--accessible-color);

	--enabled-background:          rgb(var(--theme-primary-red),var(--theme-primary-green),var(--theme-primary-blue));
	--hover-background:            linear-gradient(to top,var(--hover-overlay),var(--hover-overlay)) rgb(var(--red),var(--green),var(--blue));
	--focus-background:            linear-gradient(to top,var(--focus-overlay),var(--focus-overlay)) rgb(var(--red),var(--green),var(--blue));
	--selected-background:         linear-gradient(to top,var(--selected-overlay),var(--selected-overlay)) rgb(var(--red),var(--green),var(--blue));
	--activated-background:        linear-gradient(to top,var(--activated-overlay),var(--activated-overlay)) rgb(var(--red),var(--green),var(--blue));
	--pressed-background:          linear-gradient(to top,var(--pressed-overlay),var(--pressed-overlay)) rgb(var(--red),var(--green),var(--blue));
	--dragged-background:          linear-gradient(to top,var(--dragged-overlay),var(--dragged-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-hover-background:     linear-gradient(to top,var(--active-hover-overlay),var(--active-hover-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-focused-background:   linear-gradient(to top,var(--active-focused-overlay),var(--active-focused-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-pressed-background:   linear-gradient(to top,var(--active-pressed-overlay),var(--active-pressed-overlay)) rgb(var(--red),var(--green),var(--blue));

	--primary-text-opacity:        0.87; /* calc( 12 / 100 ) */
	--secondary-text-opacity:      0.60; /* calc( 60 / 100 ) */
	--tertiary-text-opacity:       0.32; /* calc( 32 / 100 ) */
	--quaternary-text-opacity:     0.12; /* calc( 12 / 100 ) */

	--primary-text-color:          rgba(var(--on-color),var(--primary-text-opacity));
	--secondary-text-color:        rgba(var(--on-color),var(--secondary-text-opacity));
	--tertiary-text-color:         rgba(var(--on-color),var(--tertiary-text-opacity));
	--quaternary-text-color:       rgba(var(--on-color),var(--quaternary-text-opacity));

	--enabled-overlay-opacity:     0.12; /* calc( 12 / 100 ) */
	--disabled-overlay-opacity:    0.38; /* calc( 38 / 100 ) */
	--hover-overlay-opacity:       0.08; /* calc( 8 / 100 )  */
	--focus-overlay-opacity:       0.24; /* calc( 24 / 100 ) */
	--selected-overlay-opacity:    0.16; /* calc( 16 / 100 ) */
	--activated-overlay-opacity:   0.24; /* calc( 24 / 100 ) */
	--pressed-overlay-opacity:     0.32; /* calc( 32 / 100 ) */
	--dragged-overlay-opacity:     0.16; /* calc( 16 / 100 ) */

	--inactive-overlay:            var(--inactive-overlay-on-primary);
	--hover-overlay:               var(--hover-overlay-on-primary);
	--focus-overlay:               var(--focus-overlay-on-primary);
	--selected-overlay:            var(--selected-overlay-on-primary);
	--activated-overlay:           var(--activated-overlay-on-primary);
	--pressed-overlay:             var(--pressed-overlay-on-primary);
	--dragged-overlay:             var(--dragged-overlay-on-primary);

	--active-hover-overlay:        var(--active-hover-overlay-on-primary);
	--active-focused-overlay:      var(--active-focused-overlay-on-primary);
	--active-pressed-overlay:      var(--active-pressed-overlay-on-primary);

	--active-focused-icon-color:   var(--active-focused-icon-on-primary);
	--active-unfocused-icon-color: var(--active-unfocused-icon-on-primary);
	--inactive-icon-color:         var(--inactive-icon-on-primary);
	--disabled-icon-color:         var(--todo);

	/* Checked Checkboxes and Radios */
	--checked-hover-overlay:       var(--checked-hover-overlay-on-primary);
	--checked-focus-overlay:       var(--checked-focus-overlay-on-primary);
	--checked-pressed-overlay:     var(--checked-pressed-overlay-on-primary);
}

.has-secondary-background-color {
	--red:                         var(--theme-secondary-red);
	--green:                       var(--theme-secondary-green);
	--blue:                        var(--theme-secondary-blue);
	--theme-secondary-color:       var(--theme-secondary-red),var(--theme-secondary-green),var(--theme-secondary-blue);
	--accessible-color:            calc(((((var(--theme-secondary-red) * 299) + (var(--theme-secondary-green) * 587) + (var(--theme-secondary-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--on-color:                    var(--accessible-color),var(--accessible-color),var(--accessible-color);

	--enabled-background:          rgb(var(--theme-secondary-red),var(--theme-secondary-green),var(--theme-secondary-blue));
	--hover-background:            linear-gradient(to top,var(--hover-overlay),var(--hover-overlay)) rgb(var(--red),var(--green),var(--blue));
	--focus-background:            linear-gradient(to top,var(--focus-overlay),var(--focus-overlay)) rgb(var(--red),var(--green),var(--blue));
	--selected-background:         linear-gradient(to top,var(--selected-overlay),var(--selected-overlay)) rgb(var(--red),var(--green),var(--blue));
	--activated-background:        linear-gradient(to top,var(--activated-overlay),var(--activated-overlay)) rgb(var(--red),var(--green),var(--blue));
	--pressed-background:          linear-gradient(to top,var(--pressed-overlay),var(--pressed-overlay)) rgb(var(--red),var(--green),var(--blue));
	--dragged-background:          linear-gradient(to top,var(--dragged-overlay),var(--dragged-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-hover-background:     linear-gradient(to top,var(--active-hover-overlay),var(--active-hover-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-focused-background:   linear-gradient(to top,var(--active-focused-overlay),var(--active-focused-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-pressed-background:   linear-gradient(to top,var(--active-pressed-overlay),var(--active-pressed-overlay)) rgb(var(--red),var(--green),var(--blue));

	--primary-text-opacity:        0.87; /* calc( 12 / 100 ) */
	--secondary-text-opacity:      0.60; /* calc( 60 / 100 ) */
	--tertiary-text-opacity:       0.32; /* calc( 32 / 100 ) */
	--quaternary-text-opacity:     0.12; /* calc( 12 / 100 ) */

	--primary-text-color:          rgba(var(--on-color),var(--primary-text-opacity));
	--secondary-text-color:        rgba(var(--on-color),var(--secondary-text-opacity));
	--tertiary-text-color:         rgba(var(--on-color),var(--tertiary-text-opacity));
	--quaternary-text-color:       rgba(var(--on-color),var(--quaternary-text-opacity));

	--enabled-overlay-opacity:     0.12; /* calc( 12 / 100 ) */
	--disabled-overlay-opacity:    0.38; /* calc( 38 / 100 ) */
	--hover-overlay-opacity:       0.08; /* calc( 8 / 100 )  */
	--focus-overlay-opacity:       0.24; /* calc( 24 / 100 ) */
	--selected-overlay-opacity:    0.16; /* calc( 16 / 100 ) */
	--activated-overlay-opacity:   0.24; /* calc( 24 / 100 ) */
	--pressed-overlay-opacity:     0.32; /* calc( 32 / 100 ) */
	--dragged-overlay-opacity:     0.16; /* calc( 16 / 100 ) */

	--inactive-overlay:            var(--inactive-overlay-on-secondary);
	--hover-overlay:               var(--hover-overlay-on-secondary);
	--focus-overlay:               var(--focus-overlay-on-secondary);
	--selected-overlay:            var(--selected-overlay-on-secondary);
	--activated-overlay:           var(--activated-overlay-on-secondary);
	--pressed-overlay:             var(--pressed-overlay-on-secondary);
	--dragged-overlay:             var(--dragged-overlay-on-secondary);

	--active-hover-overlay:        var(--active-hover-overlay-on-secondary);
	--active-focused-overlay:      var(--active-focused-overlay-on-secondary);
	--active-pressed-overlay:      var(--active-pressed-overlay-on-secondary);

	--active-focused-icon-color:   var(--active-focused-icon-on-secondary);
	--active-unfocused-icon-color: var(--active-unfocused-icon-on-secondary);
	--inactive-icon-color:         var(--inactive-icon-on-secondary);
	--disabled-icon-color:         var(--todo);

	/* Checked Checkboxes and Radios */
	--checked-hover-overlay:       var(--checked-hover-overlay-on-secondary);
	--checked-focus-overlay:       var(--checked-focus-overlay-on-secondary);
	--checked-pressed-overlay:     var(--checked-pressed-overlay-on-secondary);
}

.has-background-background-color {
	--red:                         var(--theme-background-red);
	--green:                       var(--theme-background-green);
	--blue:                        var(--theme-background-blue);
	--theme-background-color:      var(--theme-background-red),var(--theme-background-green),var(--theme-background-blue);
	--accessible-color:            calc(((((var(--theme-background-red) * 299) + (var(--theme-background-green) * 587) + (var(--theme-background-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--on-color:                    var(--accessible-color),var(--accessible-color),var(--accessible-color);

	--enabled-background:          rgb(var(--theme-background-red),var(--theme-background-green),var(--theme-background-blue));
	--hover-background:            linear-gradient(to top,var(--hover-overlay),var(--hover-overlay)) rgb(var(--red),var(--green),var(--blue));
	--focus-background:            linear-gradient(to top,var(--focus-overlay),var(--focus-overlay)) rgb(var(--red),var(--green),var(--blue));
	--selected-background:         linear-gradient(to top,var(--selected-overlay),var(--selected-overlay)) rgb(var(--red),var(--green),var(--blue));
	--activated-background:        linear-gradient(to top,var(--activated-overlay),var(--activated-overlay)) rgb(var(--red),var(--green),var(--blue));
	--pressed-background:          linear-gradient(to top,var(--pressed-overlay),var(--pressed-overlay)) rgb(var(--red),var(--green),var(--blue));
	--dragged-background:          linear-gradient(to top,var(--dragged-overlay),var(--dragged-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-hover-background:     linear-gradient(to top,var(--active-hover-overlay),var(--active-hover-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-focused-background:   linear-gradient(to top,var(--active-focused-overlay),var(--active-focused-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-pressed-background:   linear-gradient(to top,var(--active-pressed-overlay),var(--active-pressed-overlay)) rgb(var(--red),var(--green),var(--blue));

	--primary-text-opacity:        0.87; /* calc( 12 / 100 ) */
	--secondary-text-opacity:      0.60; /* calc( 60 / 100 ) */
	--tertiary-text-opacity:       0.32; /* calc( 32 / 100 ) */
	--quaternary-text-opacity:     0.12; /* calc( 12 / 100 ) */

	--primary-text-color:          rgba(var(--on-color),var(--primary-text-opacity));
	--secondary-text-color:        rgba(var(--on-color),var(--secondary-text-opacity));
	--tertiary-text-color:         rgba(var(--on-color),var(--tertiary-text-opacity));
	--quaternary-text-color:       rgba(var(--on-color),var(--quaternary-text-opacity));

	--enabled-overlay-opacity:     0.12; /* calc( 12 / 100 ) */
	--disabled-overlay-opacity:    0.38; /* calc( 38 / 100 ) */
	--hover-overlay-opacity:       0.08; /* calc( 8 / 100 )  */
	--focus-overlay-opacity:       0.24; /* calc( 24 / 100 ) */
	--selected-overlay-opacity:    0.16; /* calc( 16 / 100 ) */
	--activated-overlay-opacity:   0.24; /* calc( 24 / 100 ) */
	--pressed-overlay-opacity:     0.32; /* calc( 32 / 100 ) */
	--dragged-overlay-opacity:     0.16; /* calc( 16 / 100 ) */

	--inactive-overlay:            var(--inactive-overlay-on-background);
	--hover-overlay:               var(--hover-overlay-on-background);
	--focus-overlay:               var(--focus-overlay-on-background);
	--selected-overlay:            var(--selected-overlay-on-background);
	--activated-overlay:           var(--activated-overlay-on-background);
	--pressed-overlay:             var(--pressed-overlay-on-background);
	--dragged-overlay:             var(--dragged-overlay-on-background);

	--active-hover-overlay:        var(--active-hover-overlay-on-background);
	--active-focused-overlay:      var(--active-focused-overlay-on-background);
	--active-pressed-overlay:      var(--active-pressed-overlay-on-background);

	--active-focused-icon-color:   var(--active-focused-icon-on-background);
	--active-unfocused-icon-color: var(--active-unfocused-icon-on-background);
	--inactive-icon-color:         var(--inactive-icon-on-background);
	--disabled-icon-color:         var(--todo);

	/* Checked Checkboxes and Radios */
	--checked-hover-overlay:       var(--checked-hover-overlay-on-background);
	--checked-focus-overlay:       var(--checked-focus-overlay-on-background);
	--checked-pressed-overlay:     var(--checked-pressed-overlay-on-background);
}

.has-surface-background-color {
	--red:                         var(--theme-surface-red);
	--green:                       var(--theme-surface-green);
	--blue:                        var(--theme-surface-blue);
	--theme-surface-color:         var(--theme-surface-red),var(--theme-surface-green),var(--theme-surface-blue);
	--accessible-color:            calc(((((var(--theme-surface-red) * 299) + (var(--theme-surface-green) * 587) + (var(--theme-surface-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--on-color:                    var(--accessible-color),var(--accessible-color),var(--accessible-color);

	--enabled-background:          rgb(var(--red),var(--green),var(--blue));
	--hover-background:            var(--hover-overlay);
	--focus-background:            var(--focus-overlay);
	--selected-background:         var(--selected-overlay);
	--activated-background:        var(--activated-overlay);
	--pressed-background:          var(--pressed-overlay);
	--dragged-background:          var(--dragged-overlay);
	--active-hover-background:     var(--active-hover-overlay);
	--active-focused-background:   var(--active-focused-overlay);
	--active-pressed-background:   var(--active-pressed-overlay);

	--primary-text-opacity:        0.87; /* calc( 12 / 100 ) */
	--secondary-text-opacity:      0.60; /* calc( 60 / 100 ) */
	--tertiary-text-opacity:       0.32; /* calc( 32 / 100 ) */
	--quaternary-text-opacity:     0.12; /* calc( 12 / 100 ) */

	--primary-text-color:          rgba(var(--on-color),var(--primary-text-opacity));
	--secondary-text-color:        rgba(var(--on-color),var(--secondary-text-opacity));
	--tertiary-text-color:         rgba(var(--on-color),var(--tertiary-text-opacity));
	--quaternary-text-color:       rgba(var(--on-color),var(--quaternary-text-opacity));

	--enabled-overlay-opacity:     0.12; /* calc( 12 / 100 ) */
	--disabled-overlay-opacity:    0.38; /* calc( 38 / 100 ) */
	--hover-overlay-opacity:       0.08; /* calc( 8 / 100 )  */
	--focus-overlay-opacity:       0.24; /* calc( 24 / 100 ) */
	--selected-overlay-opacity:    0.16; /* calc( 16 / 100 ) */
	--activated-overlay-opacity:   0.24; /* calc( 24 / 100 ) */
	--pressed-overlay-opacity:     0.32; /* calc( 32 / 100 ) */
	--dragged-overlay-opacity:     0.16; /* calc( 16 / 100 ) */

	--inactive-overlay:            var(--inactive-overlay-on-surface);
	--hover-overlay:               var(--hover-overlay-on-surface);
	--focus-overlay:               var(--focus-overlay-on-surface);
	--selected-overlay:            var(--selected-overlay-on-surface);
	--activated-overlay:           var(--activated-overlay-on-surface);
	--pressed-overlay:             var(--pressed-overlay-on-surface);
	--dragged-overlay:             var(--dragged-overlay-on-surface);

	--active-hover-overlay:        var(--active-hover-overlay-on-surface);
	--active-focused-overlay:      var(--active-focused-overlay-on-surface);
	--active-pressed-overlay:      var(--active-pressed-overlay-on-surface);

	--active-focused-icon-color:   var(--active-focused-icon-on-surface);
	--active-unfocused-icon-color: var(--active-unfocused-icon-on-surface);
	--inactive-icon-color:         var(--inactive-icon-on-surface);
	--disabled-icon-color:         var(--todo);

	/* Checked Checkboxes and Radios */
	--checked-hover-overlay:       var(--checked-hover-overlay-on-surface);
	--checked-focus-overlay:       var(--checked-focus-overlay-on-surface);
	--checked-pressed-overlay:     var(--checked-pressed-overlay-on-surface);
}

.has-error-background-color {
	--red:                         var(--theme-error-red);
	--green:                       var(--theme-error-green);
	--blue:                        var(--theme-error-blue);
	--theme-error-color:           var(--theme-error-red),var(--theme-error-green),var(--theme-error-blue);
	--accessible-color:            calc(((((var(--theme-error-red) * 299) + (var(--theme-error-green) * 587) + (var(--theme-error-blue) * 114)) / 1000 ) - 128 ) * -1000 );
	--on-color:                    var(--accessible-color),var(--accessible-color),var(--accessible-color);

	--enabled-background:          rgb(var(--theme-error-red),var(--theme-error-green),var(--theme-error-blue));
	--hover-background:            linear-gradient(to top,var(--hover-overlay),var(--hover-overlay)) rgb(var(--red),var(--green),var(--blue));
	--focus-background:            linear-gradient(to top,var(--focus-overlay),var(--focus-overlay)) rgb(var(--red),var(--green),var(--blue));
	--selected-background:         linear-gradient(to top,var(--selected-overlay),var(--selected-overlay)) rgb(var(--red),var(--green),var(--blue));
	--activated-background:        linear-gradient(to top,var(--activated-overlay),var(--activated-overlay)) rgb(var(--red),var(--green),var(--blue));
	--pressed-background:          linear-gradient(to top,var(--pressed-overlay),var(--pressed-overlay)) rgb(var(--red),var(--green),var(--blue));
	--dragged-background:          linear-gradient(to top,var(--dragged-overlay),var(--dragged-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-hover-background:     linear-gradient(to top,var(--active-hover-overlay),var(--active-hover-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-focused-background:   linear-gradient(to top,var(--active-focused-overlay),var(--active-focused-overlay)) rgb(var(--red),var(--green),var(--blue));
	--active-pressed-background:   linear-gradient(to top,var(--active-pressed-overlay),var(--active-pressed-overlay)) rgb(var(--red),var(--green),var(--blue));

	--primary-text-opacity:        0.87; /* calc( 12 / 100 ) */
	--secondary-text-opacity:      0.60; /* calc( 60 / 100 ) */
	--tertiary-text-opacity:       0.32; /* calc( 32 / 100 ) */
	--quaternary-text-opacity:     0.12; /* calc( 12 / 100 ) */

	--primary-text-color:          rgba(var(--on-color),var(--primary-text-opacity));
	--secondary-text-color:        rgba(var(--on-color),var(--secondary-text-opacity));
	--tertiary-text-color:         rgba(var(--on-color),var(--tertiary-text-opacity));
	--quaternary-text-color:       rgba(var(--on-color),var(--quaternary-text-opacity));

	--enabled-overlay-opacity:     0.12; /* calc( 12 / 100 ) */
	--disabled-overlay-opacity:    0.38; /* calc( 38 / 100 ) */
	--hover-overlay-opacity:       0.08; /* calc( 8 / 100 )  */
	--focus-overlay-opacity:       0.24; /* calc( 24 / 100 ) */
	--selected-overlay-opacity:    0.16; /* calc( 16 / 100 ) */
	--activated-overlay-opacity:   0.24; /* calc( 24 / 100 ) */
	--pressed-overlay-opacity:     0.32; /* calc( 32 / 100 ) */
	--dragged-overlay-opacity:     0.16; /* calc( 16 / 100 ) */

	--inactive-overlay:            var(--inactive-overlay-on-error);
	--hover-overlay:               var(--hover-overlay-on-error);
	--focus-overlay:               var(--focus-overlay-on-error);
	--selected-overlay:            var(--selected-overlay-on-error);
	--activated-overlay:           var(--activated-overlay-on-error);
	--pressed-overlay:             var(--pressed-overlay-on-error);
	--dragged-overlay:             var(--dragged-overlay-on-error);

	--active-hover-overlay:        var(--active-hover-overlay-on-error);
	--active-focused-overlay:      var(--active-focused-overlay-on-error);
	--active-pressed-overlay:      var(--active-pressed-overlay-on-error);

	--active-focused-icon-color:   var(--active-focused-icon-on-error);
	--active-unfocused-icon-color: var(--active-unfocused-icon-on-error);
	--inactive-icon-color:         var(--inactive-icon-on-error);
	--disabled-icon-color:         var(--todo);

	/* Checked Checkboxes and Radios */
	--checked-hover-overlay:       var(--checked-hover-overlay-on-error);
	--checked-focus-overlay:       var(--checked-focus-overlay-on-error);
	--checked-pressed-overlay:     var(--checked-pressed-overlay-on-error);
}

/*--------------------------------------------------------------
# 1.3 Color: Elevation overlay transparencies
--------------------------------------------------------------*/ 

.has-dark-theme .has-elevation-level-00 {
	background: linear-gradient(to top,rgba(255,255,255,0.00),rgba(255,255,255,0.00)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-01 {
	background: linear-gradient(to top,rgba(255,255,255,0.05),rgba(255,255,255,0.05)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-02 {
	background: linear-gradient(to top,rgba(255,255,255,0.07),rgba(255,255,255,0.07)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-03 {
	background: linear-gradient(to top,rgba(255,255,255,0.08),rgba(255,255,255,0.08)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-04 {
	background: linear-gradient(to top,rgba(255,255,255,0.09),rgba(255,255,255,0.09)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-05 {
	background: linear-gradient(to top,rgba(255,255,255,0.10),rgba(255,255,255,0.10)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-06 {
	background: linear-gradient(to top,rgba(255,255,255,0.11),rgba(255,255,255,0.11)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-08 {
	background: linear-gradient(to top,rgba(255,255,255,0.12),rgba(255,255,255,0.12)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-12 {
	background: linear-gradient(to top,rgba(255,255,255,0.14),rgba(255,255,255,0.14)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-16 {
	background: linear-gradient(to top,rgba(255,255,255,0.15),rgba(255,255,255,0.15)) rgb(var(--red),var(--green),var(--blue));
}

.has-dark-theme .has-elevation-level-24 {
	background: linear-gradient(to top,rgba(255,255,255,0.16),rgba(255,255,255,0.16)) rgb(var(--red),var(--green),var(--blue));
}

/*--------------------------------------------------------------
# 1.3 Color: Background colors
--------------------------------------------------------------*/ 

.has-primary-background-color {
	background: rgb(var(--theme-primary-color));
	color: var(--primary-text-color);
}

.has-secondary-background-color {
	background: rgb(var(--theme-secondary-color));
	color: var(--primary-text-color);
}

.has-background-background-color {
	background: rgb(var(--theme-background-color));
	color: var(--primary-text-color);
}

.has-surface-background-color {
	background: rgb(var(--theme-surface-color));
	color: var(--primary-text-color);
}

.has-error-background-color {
	background: rgb(var(--theme-error-color));
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# 1.3 Color: Text colors
--------------------------------------------------------------*/ 

.has-primary-color,
.has-high-emphasis-text-color {
	color: var(--primary-text-color);
}

.has-secondary-color,
.has-medium-emphasis-text-color,
.overline,
.overline a {
	color: var(--secondary-text-color);
}

.has-tertiary-color,
.has-disabled-text-color {
	color: var(--tertiary-text-color);
}

.has-quaternary-color,
.has-disabled-text-color {
	color: var(--quaternary-text-color);
}

/*--------------------------------------------------------------
# 1.4 Color: Icon colors
--------------------------------------------------------------*/

/* remove
.has-inactive-icon-color {
	color: var(--inactive-icon-color);
}

.has-active-unfocused-icon-color {
	color: var(--active-unfocused-icon-color);
}

.has-active-focused-icon-color {
	color: var(--active-focused-icon-color);
}
*/

/*--------------------------------------------------------------
# 1.5 Color: Elevation shadow
--------------------------------------------------------------*/ 

:root {
	--shadow-00: none;
	--shadow-01: 0 2px 1px -1px rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 1px 3px 0 rgba(0,0,0,0.12);
	--shadow-02: 0 3px 1px -2px rgba(0,0,0,0.2), 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12);
	--shadow-03: 0 3px 3px -2px rgba(0,0,0,0.2), 0 3px 4px 0 rgba(0,0,0,0.14), 0 1px 8px 0 rgba(0,0,0,0.12);
	--shadow-04: 0 2px 4px -1px rgba(0,0,0,0.2), 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12);
	--shadow-05: 0 3px 5px -1px rgba(0,0,0,0.2), 0 5px 8px 0 rgba(0,0,0,0.14), 0 1px 14px 0 rgba(0,0,0,0.12);
	--shadow-06: 0 3px 5px -1px rgba(0,0,0,0.2), 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12);
	--shadow-07: 0 4px 5px -2px rgba(0,0,0,0.2), 0 7px 10px 1px rgba(0,0,0,0.14), 0 2px 16px 1px rgba(0,0,0,0.12);
	--shadow-08: 0 5px 5px -3px rgba(0,0,0,0.2), 0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12);
	--shadow-09: 0 5px 6px -3px rgba(0,0,0,0.2), 0 9px 12px 1px rgba(0,0,0,0.14), 0 3px 16px 2px rgba(0,0,0,0.12);
	--shadow-10: 0 6px 6px -3px rgba(0,0,0,0.2), 0 10px 14px 1px rgba(0,0,0,0.14), 0 4px 18px 3px rgba(0,0,0,0.12);
	--shadow-11: 0 6px 7px -4px rgba(0,0,0,0.2), 0 11px 15px 1px rgba(0,0,0,0.14), 0 4px 20px 3px rgba(0,0,0,0.12);
	--shadow-12: 0 7px 8px -4px rgba(0,0,0,0.2), 0 12px 17px 2px rgba(0,0,0,0.14), 0 5px 22px 4px rgba(0,0,0,0.12);
	--shadow-13: 0 7px 8px -4px rgba(0,0,0,0.2), 0 13px 19px 2px rgba(0,0,0,0.14), 0 5px 24px 4px rgba(0,0,0,0.12);
	--shadow-14: 0 7px 9px -4px rgba(0,0,0,0.2), 0 14px 21px 2px rgba(0,0,0,0.14), 0 5px 26px 4px rgba(0,0,0,0.12);
	--shadow-15: 0 8px 9px -5px rgba(0,0,0,0.2), 0 15px 22px 2px rgba(0,0,0,0.14), 0 6px 28px 5px rgba(0,0,0,0.12);
	--shadow-16: 0 8px 10px -5px rgba(0,0,0,0.2), 0 16px 24px 2px rgba(0,0,0,0.14), 0 6px 30px 5px rgba(0,0,0,0.12);
	--shadow-17: 0 8px 11px -5px rgba(0,0,0,0.2), 0 17px 26px 2px rgba(0,0,0,0.14), 0 6px 32px 5px rgba(0,0,0,0.12);
	--shadow-18: 0 9px 11px -5px rgba(0,0,0,0.2), 0 18px 28px 2px rgba(0,0,0,0.14), 0 7px 34px 6px rgba(0,0,0,0.12);
	--shadow-19: 0 9px 12px -6px rgba(0,0,0,0.2), 0 19px 29px 2px rgba(0,0,0,0.14), 0 7px 36px 6px rgba(0,0,0,0.12);
	--shadow-20: 0 10px 13px -6px rgba(0,0,0,0.2), 0 20px 31px 3px rgba(0,0,0,0.14), 0 8px 38px 7px rgba(0,0,0,0.12);
	--shadow-21: 0 10px 13px -6px rgba(0,0,0,0.2), 0 21px 33px 3px rgba(0,0,0,0.14), 0 8px 40px 7px rgba(0,0,0,0.12);
	--shadow-22: 0 10px 14px -6px rgba(0,0,0,0.2), 0 22px 35px 3px rgba(0,0,0,0.14), 0 8px 42px 7px rgba(0,0,0,0.12);
	--shadow-23: 0 11px 14px -7px rgba(0,0,0,0.2), 0 23px 36px 3px rgba(0,0,0,0.14), 0 9px 44px 8px rgba(0,0,0,0.12);
	--shadow-24: 0 11px 15px -7px rgba(0,0,0,0.2), 0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12);
}

/* Text button */
/* Standard side sheet */
/* Top app bar (resting elevation) 0 or 4 */
.has-elevation-level-00 {
	box-shadow: var(--shadow-00);
	z-index: 100;
}

/* Search bar (resting elevation) */
/* Card (resting elevation) */
/* Switch */
.has-elevation-level-01,
.scannable-cards ul li,
ul.scannable-cards li,
.card {
	box-shadow: var(--shadow-01);
	z-index: 101;
}

/* Contained button (resting elevation) */
.has-elevation-level-02 {
	box-shadow: var(--shadow-02);
	z-index: 102;
}

/* Refresh indicator */
/* Search bar (scrolled state) */
.has-elevation-level-03 {
	box-shadow: var(--shadow-03);
	z-index: 103;
}

/* Top app bar (scrolled state) */
/* Top app bar (resting elevation) 0 or 4 */
.has-elevation-level-04,
.app-bar-top:last-child:not(.has-elevation-level-00):not(.has-shadow-level-00)
/* .nav-tabs-scrollable:last-child */ {
	/* box-shadow: var(--shadow-04); */
	z-index: 104;
}

/* Floating action button (FAB - resting elevation) */
/* Snackbar */
.has-elevation-level-06,
.btn-float,
.snackbar {
	box-shadow: var(--shadow-06);
	z-index: 106;
}

/* Standard bottom sheet */
/* Standard side sheet */
/* Bottom navigation bar */
/* Bottom app bar */
/* Menus and sub menus */
/* Card (when picked up) */
/* Contained button (pressed state) */
.has-elevation-level-08,
.app-bar-bottom,
.bottom-navigation-bar,
.dropdown-menu::before {
	box-shadow: var(--shadow-08);
	z-index: 108;
}

/* Floating action button (FAB - pressed) */
.has-elevation-level-12 {
	box-shadow: var(--shadow-12);
	z-index: 112;
}

/* Modal bottom sheet */
/* Modal side sheet */
/* Navigation drawer */
.has-elevation-level-16 {
	box-shadow: var(--shadow-16);
	z-index: 116;
}

/* Dialog */
.has-elevation-level-24,
#yith-wacp-popup .yith-wacp-main {
	box-shadow: var(--shadow-24);
	z-index: 124;
}

/*--------------------------------------------------------------
# 1.6 Color: Ripple
--------------------------------------------------------------*/

.waves-effect {
	position: relative;
	cursor: pointer;
	/* display: inline-block; */
	overflow: hidden;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	-webkit-tap-highlight-color: transparent;
}

.waves-effect .waves-ripple {
	position: absolute;
	border-radius: 50%;
	width: 100px;
	height: 100px;
	margin-top: -50px;
	margin-left: -50px;
	opacity: 0;
	background: rgba(0, 0, 0, 0.2);
	background: -webkit-radial-gradient(rgba(0,0,0,0.2) 0, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.5) 60%, rgba(255,255,255,0) 70%);
	background: -o-radial-gradient(rgba(0,0,0,0.2) 0, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.5) 60%, rgba(255,255,255,0) 70%);
	background: -moz-radial-gradient(rgba(0,0,0,0.2) 0, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.5) 60%, rgba(255,255,255,0) 70%);
	background: radial-gradient(rgba(0,0,0,0.2) 0, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.5) 60%, rgba(255,255,255,0) 70%);
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	-o-transition-property: -o-transform, opacity;
	transition-property: transform, opacity;
	-webkit-transform: scale(0) translate(0, 0);
	-moz-transform: scale(0) translate(0, 0);
	-ms-transform: scale(0) translate(0, 0);
	-o-transform: scale(0) translate(0, 0);
	transform: scale(0) translate(0, 0);
	pointer-events: none;
}

.waves-effect.waves-light .waves-ripple {
	background: rgba(255,255,255,0.4);
	background: -webkit-radial-gradient(rgba(255,255,255,0.2) 0, rgba(255,255,255,0.3) 40%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0.5) 60%, rgba(255,255,255, 0) 70%);
	background: -o-radial-gradient(rgba(255,255,255,0.2) 0, rgba(255,255,255,0.3) 40%, rgba(255,255,255,0.4) 50%, rgba(255, 255,255, 0.5) 60%, rgba(255,255,255,0) 70%);
	background: -moz-radial-gradient(rgba(255,255,255,0.2) 0, rgba(255,255,255,0.3) 40%, rgba(255,255,255,0.4) 50%, rgba(255,255,255, 0.5) 60%, rgba(255,255,255,0) 70%);
	background: radial-gradient(rgba(255,255,255,0.2) 0, rgba(255,255,255,0.3) 40%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0.5) 60%, rgba(255,255,255,0) 70%);
}

.waves-effect.waves-classic .waves-ripple {
	background: rgba(0,0,0,0.2);
}

.waves-effect.waves-classic.waves-light .waves-ripple {
	background: rgba(255,255,255,0.4);
}

.waves-notransition {
	-webkit-transition: none !important;
	-moz-transition: none !important;
	-o-transition: none !important;
	transition: none !important;
}

.waves-button,
.waves-circle {
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	/* -webkit-mask-image: -webkit-radial-gradient(circle, #ffffff 100%, #000000 100%); */
}

/*
.waves-button,
.waves-button:hover,
.waves-button:visited,
.waves-button-input {
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  border: none;
  outline: none;
  color: inherit;
  background-color: rgba(0, 0, 0, 0);
  font-size: 1em;
  line-height: 1em;
  text-align: center;
  text-decoration: none;
  z-index: 1;
}
*/

/*
.waves-button {
  padding: 0.85em 1.1em;
  border-radius: 0.2em;
}
*/

.waves-button-input {
  margin: 0;
  padding: 0.85em 1.1em;
}

.waves-input-wrapper {
  border-radius: 0.2em;
  vertical-align: bottom;
}

.waves-input-wrapper.waves-button {
  padding: 0;
}

.waves-input-wrapper .waves-button-input {
	position: relative;
	top: 0;
	left: 0;
	z-index: 1;
}

.waves-circle {
	text-align: center;
	width: 2.5em;
	height: 2.5em;
	line-height: 2.5em;
	border-radius: 50%;
}

.waves-float {
	-webkit-mask-image: none;
	-webkit-box-shadow: 0px 1px 1.5px 1px rgba(0, 0, 0, 0.12);
	box-shadow: 0px 1px 1.5px 1px rgba(0, 0, 0, 0.12);
	-webkit-transition: all 300ms;
	-moz-transition: all 300ms;
	-o-transition: all 300ms;
	transition: all 300ms;
}

.waves-float:active {
	-webkit-box-shadow: 0px 8px 20px 1px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 8px 20px 1px rgba(0, 0, 0, 0.3);
}

.waves-block {
	display: block;
}

/*--------------------------------------------------------------
# X:X Layout: Component height
--------------------------------------------------------------*/

:root,
.demo-mobile {
	--app-bar-height: 56px;
}

@media only screen and (min-width: 600px) {
	:root,
	.demo-tablet {
		--app-bar-height: 64px;
	}
}

.has-app-bar-height {
	height: var(--app-bar-height);
}

/*--------------------------------------------------------------
# 3.1 Layout: Margin
--------------------------------------------------------------*/

:root,
.demo-mobile {
	--entry-content-margin: 16px;
}

@media only screen and (min-width: 600px) {
	:root,
	.demo-tablet {
		--entry-content-margin: 24px;
	}
}

@media only screen and (min-width: 1280px) {
	:root,
	.demo-desktop {
		--entry-content-margin: 80px;
	}
}

/* alignnone width */

xxx.entry-content > *:not(.tab-content) {
	width: calc( 100% - ( 2 * var(--entry-content-margin) ) );
	max-width: calc( var(--entry-content-max-width) );
}

.tab-content {
    width: calc( 100% - ( 2 * var(--entry-content-margin) ) );
}

.tab-content .entry-content > :not(.tab-content) {
    width: calc( 100% - ( 2 * var(--entry-content-margin) ) );
    max-width: calc( 1280px );
}

/* alignfull width */

.entry-content > .alignfull,
.entry-content > form,
.entry-content > ul.single-line-list,
.entry-content > ul.two-line-list,
.entry-content > ul.three-line-list,
.entry-content > .sheet,
.entry-content > .scrollable-chips {
	width: calc( 100% );
	max-width: calc( 100% );
}

/* alignwide width */

.entry-content > .alignwide-wrapper {
	width: calc( 100% - ( 2 * var(--entry-content-margin) ) + ( 2 * var(--entry-content-margin-wide) ) );
	max-width: calc( var(--entry-content-max-width) + ( 2 * var(--entry-content-margin-wide) ) );
}

/* alignright width */

.alignright {
	/* width: var(--floated-items-width); */
	max-width: var(--floated-items-max-width);
}

/* alignleft width */

.alignleft {
	/* width: var(--floated-items-width); */
	max-width: var(--floated-items-max-width);
}

/*--------------------------------------------------------------
# 3.1 Layout: Alignment
--------------------------------------------------------------*/

@media (min-width: 600px) {

	:root {
		--gutter:                      40px !important;
		--entry-content-margin-wide:   40px;
		--alignwide-margin-right:      0;
		--alignwide-margin-left:       0;
		--alignright-margin-right:     0px;
		--alignright-margin-left:      var(--gutter);
		--alignleft-margin-right:      var(--gutter);
		--alignleft-margin-left:       0px;
		--figure-margin-top:           24px;
		--figure-margin-bottom:        24px;

		--floated-items-margin-top:    0.33em;
		--floated-items-margin-bottom: 1.5rem;

		--floated-items-margin-top:    24px;
		--floated-items-margin-bottom: 24px;

		--floated-items-width:         300px;
		--floated-items-max-width:     300px;
		--spacer:                      64px;
		--separator:                   64px;
		--gallery-gutter:              8px;
	}

}

/*--------------------------------------------------------------
# X:X Layout: Horizontal margins
--------------------------------------------------------------*/

.has-entry-content-margin {
	border-right: var(--entry-content-margin) solid rgb(246, 36, 89, 0.1) !important;
	border-left: var(--entry-content-margin) solid rgba(246, 36, 89, 0.1) !important;
}

.entry-content {
	border-right: var(--entry-content-margin) solid rgb(246, 36, 89, 0.1) !important;
	border-left: var(--entry-content-margin) solid rgba(246, 36, 89, 0.1) !important;
	width: 100%;
	height: 100%;
	max-width: calc( var(--entry-content-max-width) + 2 * var(--entry-content-margin) );
	margin-right: auto;
	margin-left: auto;
}

.entry-content > .alignfull {
	width: calc( 100% + 2 * var(--entry-content-margin) ) !important;
	max-width: calc( 100% + 2 * var(--entry-content-margin) ) !important;
	margin-left: calc( -1 * var(--entry-content-margin) ) !important;
	margin-right: calc( -1 * var(--entry-content-margin) ) !important;
	border: 1px solid red;
}

/*--------------------------------------------------------------
# X:X Layout: Gutter
--------------------------------------------------------------*/

.alignright {
	margin-right: var(--alignright-margin-right);
	margin-left: var(--alignright-margin-left) !important; /* gutenberg bug: .wp-block-image .alignright */
	border: 1px solid blue;
}

.alignleft {
	margin-right: var(--alignleft-margin-right) !important; /* gutenberg bug: .wp-block-image .alignleft */
	margin-left: var(--alignleft-margin-left);
	border: 1px solid blue;
}

/*--------------------------------------------------------------
# X:X Layout: Margin top
--------------------------------------------------------------*/

.entry-content > h1,
.entry-content > h2,
.entry-content > h3,
.entry-content > h4,
.entry-content > h5,
.entry-content > h6 {
	margin-top: 56px;
}


/*--------------------------------------------------------------
# X:X Layout: Margin bottom
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# 3.1 Floatings
--------------------------------------------------------------*/

@media (max-width: 599px) {

	.alignright {
		float: none !important; /* gutenberg bug: .wp-block-image .alignleft */
		max-width: calc( 100% );
	}

	.alignleft {
		float: none !important; /* gutenberg bug: .wp-block-image .alignleft */
		max-width: calc( 100% );
	}

}

@media (min-width: 600px) {

	.alignleft {
		float: left;
	}

	.alignright {
		float: right;
	}

}

nav,
.entry-content::before,
.entry-content::after {
	clear: both;
}

/*-----------------------------------------------------------------------------------------
## X.X Imagery: Aspect-Ratio
-----------------------------------------------------------------------------------------*/

.has-aspect-ratio,
.aspect-ratio {
	position: relative;
}

a.has-aspect-ratio,
a.aspect-ratio {
	position: unset;
}

.has-aspect-ratio::after,
.aspect-ratio::after {
	content: "";
	display: block;
	padding-top: 100%;
}

.has-aspect-ratio-21by9::after,
.aspect-ratio-21by9::after {
	padding-top: 42.85%;
}

.has-aspect-ratio-2by1::after,
.has-aspect-ratio-18by9::after,
.aspect-ratio-2by1::after,
.aspect-ratio-18by9::after {
	padding-top: 50%;
}

.has-aspect-ratio-1by2::after,
.has-aspect-ratio-9by18::after,
.aspect-ratio-1by2::after,
.aspect-ratio-9by18::after {
	padding-top: 200%;
}

.has-aspect-ratio-16by9::after,
.aspect-ratio-16by9::after {
	padding-top: 56.25%;
}

.has-aspect-ratio-9by16::after,
.aspect-ratio-9by16::after {
	padding-top: 177.777777%;
}

.has-aspect-ratio-8by5::after,
.aspect-ratio-8by5::after {
	padding-top: 62.5%;
}

.has-aspect-ratio-3by2::after,
.has-aspect-ratio-9by6::after,
.aspect-ratio-3by2::after,
.aspect-ratio-9by6::after {
	padding-top: 66.66%;
}

.has-aspect-ratio-2by3::after,
.has-aspect-ratio-6by9::after,
.aspect-ratio-2by3::after,
.aspect-ratio-6by9::after {
	padding-top: 150%;
}

.has-aspect-ratio-4by3::after,
.aspect-ratio-4by3::after {
	padding-top: 75%;
}

.has-aspect-ratio-3by4::after,
.aspect-ratio-3by4::after {
	padding-top: 133.34%;
}

.has-aspect-ratio-1by1::after,
.aspect-ratio-1by1::after {
	padding-top: 100%;
}

.wp-block-embed .wp-block-embed__wrapper iframe,
.wp-block-embed .aspect-ratio iframe {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.wp-block-media-text [class*="aspect-ratio"] > img,
.wp-block-gallery[class*="aspect-ratio"] img,
.wp-block-image [class*="aspect-ratio"] img,
.image-wrapper[class*="aspect-ratio"] > img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	object-fit: cover;
	border: 1px solid red;
}

/*--------------------------------------------------------------
# Border and Dividers
--------------------------------------------------------------*/

.has-no-border {
	border: unset;
}

.has-border {
	border: 1px solid var(--quaternary-text-color);
}

.has-border-top {
	border-top: 1px solid var(--quaternary-text-color);
}

.has-border-right {
	border-right: 1px solid var(--quaternary-text-color);
}

.has-border-bottom {
	border-bottom: 1px solid var(--quaternary-text-color);
}

.has-border-left {
	border-left: 1px solid var(--quaternary-text-color);
}

/*--------------------------------------------------------------
# 0.0 TYPOGRAPHY
--------------------------------------------------------------*/

/* Text meant only for screen readers */
.screen-reader-text,
[class*="screen-reader-text"] {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* text alignment classes */

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

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

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

/*--------------------------------------------------------------
# 0.0 ICONOGRAPHY
--------------------------------------------------------------*/















































/*--------------------------------------------------------------
# 2.0 HTML-Tags
--------------------------------------------------------------*/

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

/*--------------------------------------------------------------
## 2.1 <a> Anchor/Links
--------------------------------------------------------------*/

a {
	color: var(--primary-text-color);
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	outline: 0;
	text-decoration: none;
	cursor: pointer;
}

a:hover,
a:focus {
	color: var(--secondary-text-color);
	text-decoration: none;
}

p a,
label a {
	color: #cd2653;
	text-decoration: underline;
}

/*--------------------------------------------------------------
## 2.2 <abbr> Abbreviation
--------------------------------------------------------------*/

abbr[title],
abbr[data-original-title] {
	text-decoration: underline;
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted;
	cursor: help;
	border-bottom: 0;
	-webkit-text-decoration-skip-ink: none;
	text-decoration-skip-ink: none;
}

/*--------------------------------------------------------------
## 2.3 <address>
--------------------------------------------------------------*/

address {
	margin-bottom: 1em !important; /* default: 1em */
	font-style: normal;
	line-height: inherit;
}

/*--------------------------------------------------------------
## 2.4 <article>
--------------------------------------------------------------*/

article {
	display: block;
	position: relative;
}

/*--------------------------------------------------------------
## 2.5 <aside>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 2.6 <audio>
--------------------------------------------------------------*/

audio {
	vertical-align: top;
	background-color: var(--quaternary-text-color);
	border: 1px solid var(--quaternary-text-color);
	width: 100%;
}

/*--------------------------------------------------------------
## 2.7 <b>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 2.8 <big>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 2.8 <body>
--------------------------------------------------------------*/

body {
	min-height: 100%;
}

/*--------------------------------------------------------------
## 2.9 <blockquote>
--------------------------------------------------------------*/

blockquote {
	display: block; /* default: block */
	/* default: margin-top: 1em */
	/* default: margin-bottom: 1em */
	margin-left: 0; /* default: 40px */
	margin-right: 0; /* default: 40px */
}

blockquote p::before {
	content: open-quote;
	position: relative;
	left: -0.33em;
	margin-right: -0.33em;
	width: 1em;
}

blockquote p::after {
	content: close-quote;
	position: relative;
	right: -0.33em;
	margin-left: -0.33em;
	width: 1em;
}

/*--------------------------------------------------------------
## 2.10 <button>
--------------------------------------------------------------*/

button,
[type="button"], /* 1 */
[type="reset"],
[type="submit"] {
	-webkit-appearance: button; /* 2 */
	cursor: pointer; /* 3 */
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none; /* Remove the inner border and padding in Firefox. */   
	padding: 0; /* Remove the inner border and padding in Firefox. */   
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText; /* Restore the focus styles unset by the previous rule. */  
}

/*--------------------------------------------------------------
## 2.11 <caption>
--------------------------------------------------------------*/

.caption:not(figcaption) {
	margin-top: unset;
}

.caption.helper-text {
	margin-top: 4px;
}

span.woocommerce-input-wrapper,
.form-control {
	width: 100%;
}

caption a {
	text-decoration: underline;
}

/*--------------------------------------------------------------
## 2.12 <cite>
--------------------------------------------------------------*/

/*
cite::before {
	position: relative;
	left: -1.6em;
	margin-right: -0.8em;
	width: 0.8em;
	content: '—';
	color: red;
}
*/

cite br:first-child,
cite br:last-child {
	display: none;
}

cite a {
	text-decoration: underline;
}

/*--------------------------------------------------------------
## 2.13 <code>
--------------------------------------------------------------*/

code {
	font-family: var(--monospace-font-family, monospace);
	font-size: var(--monospace-font-size, inherit);
	font-style: var(--monospace-font-style, inherit);
	font-weight: var(--monospace-font-weight, inherit);
	line-height: var(--monospace-line-height, inherit);
	letter-spacing: var(--monospace-letter-spacing, normal);

	display: inline-block;
	/* todo: background-color, color padding in em */
	background-color: #000;
	color: #FFF;
	padding: 0.01em 0.25em !important;
}

pre code {
	/* todo: background-color, color padding in em */
	background-color: #000;
	color: #FFF;
}

p code {
	/* todo: background-color, color padding in em */
}

/*--------------------------------------------------------------
## 2.14 <dd> Description list
--------------------------------------------------------------*/

dd {
	margin-bottom: 0.5rem;
	margin-left: 0;
}

/*--------------------------------------------------------------
## 5.15 <del> Deleted text
--------------------------------------------------------------*/

del {

}

/*--------------------------------------------------------------
## 2.16 <details>
--------------------------------------------------------------*/

details {
	display: block; /* Add the correct display in Edge, IE 10+, and Firefox. */
}

/*--------------------------------------------------------------
## 2.17 <dfn> Definition
--------------------------------------------------------------*/

dfn {

}

/*--------------------------------------------------------------
## 2.18 <dialog>
--------------------------------------------------------------*/

dialog {

}

/*--------------------------------------------------------------
# 2.18.X <dialog> Tooltip
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 2.19 <div> 
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 2.20 <dl> Description list
--------------------------------------------------------------*/

dl {

}

dl:empty {
	display: none;
}

/*--------------------------------------------------------------
## 2.21 <dt> Description list
--------------------------------------------------------------*/

dt:empty {
	display: none;
}

/*--------------------------------------------------------------
## 2.22 <em> Emphasized text
--------------------------------------------------------------*/

em {

}

/*--------------------------------------------------------------
## 2.23 <embed> defines a container for external content
--------------------------------------------------------------*/

embed {

}

/*--------------------------------------------------------------
## 2.24 <fieldset>
--------------------------------------------------------------*/

fieldset {
	position: relative;
	display: block;
	margin-left: unset; /* default: 2px */
	margin-right: unset; /* default: 2px */
	padding-top: unset; /* default: 0.35em */
	padding-bottom: unset; /* default: 0.625em */
	padding-left: unset; /* default: 0.75em */
	padding-right: unset; /* default: 0.75em */
	border: unset; /* default: 2px groove (internal value) */
	margin-top: 24px; /* reset: <p> margin-bottom */
	margin-bottom: unset; /* reset: <p> margin-bottom */
}

/*--------------------------------------------------------------
## 2.25 <figcaption>
--------------------------------------------------------------*/

figcaption a {
	text-decoration: underline;
}

/*--------------------------------------------------------------
## 2.26 <figure>
--------------------------------------------------------------*/

figure {
	max-width: 100%;
}






TODOfigure:not(.gallery-item) {
	position: relative; /* aspect ratio */
	width: auto;
	max-width: 100%;
	display: table;
	margin-left: auto;
	margin-right: auto;
	clear: both; /* test classic markup */
}

figure.wp-block-gallery {
	display: block;
}

figure.wp-block-gallery figure {
	display: inline-block;
	margin: 0;
	width: 100%;
}

figure.wp-block-gallery figure img {
	margin: 0;
}

figure.avatar {
	margin-top: 8px; /* default: 1em */
	margin-bottom: 8px; /* default: 1em */
	margin-left: 0; /* default: 40px */
	margin-right: 8px; /* default: 40px */
}

/*--------------------------------------------------------------
## 2.27 <footer>
--------------------------------------------------------------*/

footer {

}

/*--------------------------------------------------------------
## 5.28 <form>
--------------------------------------------------------------*/

form {
	position: relative;
}

/*--------------------------------------------------------------
## 2.29 <html>
--------------------------------------------------------------*/

html {
	line-height: 1.15; /* Correct the line height in all browsers. */
	-webkit-text-size-adjust: 100%; /* Prevent adjustments of font size after orientation changes in iOS. */
	-webkit-tap-highlight-color: rgba(0,0,0,0); /* reboot */
}

html {
	margin: 0;
	padding: 0;
	height: 100%;
}

/*--------------------------------------------------------------
## 2.30 <h1-h6>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## <h1>
--------------------------------------------------------------*/

h1:not([class*="headline"]):not([class*="title"]):not(.screen-reader-text),
.headline-1,
.is-style-headline-1,
.has-h-1-font-size {
	word-wrap: break-word;
	word-break: break-all;
}

[class*="headline-1"].has-background {
	padding: 0.25em 20px;
}

/*--------------------------------------------------------------
## <h2>
--------------------------------------------------------------*/

h2:not([class*="headline"]):not([class*="title"]):not(.screen-reader-text),
.headline-2,
.is-style-headline-2,
.has-h-2-font-size {
	word-wrap: break-word;
	word-break: break-all;
}

.headline-2.has-background,
[class*="headline-2"].has-background {
	padding: 0.25em 20px;
}

/*--------------------------------------------------------------
## <h3>
--------------------------------------------------------------*/

h3:not([class*="headline"]):not([class*="title"]):not(.screen-reader-text),
.headline-3,
.is-style-headline-3,
.has-h-3-font-size,
.single h1:not([class*="headline"]) {
	word-wrap: break-word;
	word-break: break-all;
}

.headline-3.has-background,
[class*="headline-3"].has-background {
	padding: 0.25em 20px;
}

/*--------------------------------------------------------------
## <h4>
--------------------------------------------------------------*/

h4:not([class*="headline"]):not([class*="title"]):not(.screen-reader-text),
.headline-4,
.is-style-headline-4,
.has-h-4-font-size,
.single h2:not([class*="headline"]) {
	word-wrap: break-word;
	word-break: break-all;
}

.headline-4.has-background,
[class*="headline-4"].has-background {
	padding: 0.25em 20px;
}

/*--------------------------------------------------------------
## <h5>
--------------------------------------------------------------*/

h5:not([class*="headline"]):not([class*="title"]):not(.screen-reader-text),
.headline-5,
.is-style-headline-5,
.has-h-5-font-size,
h1.site-title {
	word-wrap: break-word;
	word-break: break-all;
}

.headline-5.has-background,
[class*="headline-5"].has-background {
	padding: 0.25em 20px;
}

/*--------------------------------------------------------------
## <h6>
--------------------------------------------------------------*/

h6:not([class*="headline"]):not([class*="title"]):not(.screen-reader-text),
.headline-6,
.is-style-headline-6,
.has-h-6-font-size,
.scannable-cards h2:not([class*="headline"]),
li.card h2:not([class*="headline"]) {
	word-wrap: break-word;
	word-break: break-all;
}

.headline-6.has-background,
[class*="headline-6"].has-background {
	padding: 0.25em 20px;
}

/*--------------------------------------------------------------
## <h1-h6> Subtitle
--------------------------------------------------------------*/

.single-line-list h2,
.two-line-list h2,
.three-line-list h2 {
	margin-top: unset;
	margin-bottom: unset;
}

/*--------------------------------------------------------------
## 2.31 <header>
--------------------------------------------------------------*/

header {

}

/*--------------------------------------------------------------
## 2.32 <hr>
--------------------------------------------------------------*/

hr {
	display: block !important;
	border: 0;
	border-bottom: 1px solid var(--quaternary-text-color);
	overflow: visible; /* Show the overflow in Edge and IE. */
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	clear: both; /* takes care of floated elements */
	width: auto; /* if is flex-child */
}

/*--------------------------------------------------------------
## 2.33 <i> Defines a part of text in an alternate voice or mood
--------------------------------------------------------------*/

i:not([class*=icon]) {
	font-style: italic;
}

/*--------------------------------------------------------------
## 2.34 <iframe> An inline frame is used to embed another document within the current HTML document.
--------------------------------------------------------------*/

iframe {
	border: 1px solid var(--quaternary-text-color);
	max-width: 100%;
}

/*--------------------------------------------------------------
## 2.35 <img>
--------------------------------------------------------------*/

img {
	display: inline-block; /* browser-default need in flexbox */
	border-style: none; /* Remove the border on images inside links in IE 10. */
	max-width: 100%;
	height: auto;
	vertical-align: top;
	position: relative; /* overlay */
}

img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.rounded > img,
img.rounded {
	border-radius: 50%;
}

/* States */

/* Link */

a img::before,
.waves-image::before {
	content: ""; /* ::before and ::after both require content */
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	z-index: 1;
	border: 2px solid red;
}

a img::after,
.waves-image::after {
	content: ""; /* ::before and ::after both require content */
}

/* Hover */

a:hover img::before,
a:hover .waves-image::before,
a.hover .waves-image::before {
	background-color: rgba(0,0,0,0.16);
}

/* Focus */

a:focus img::before,
a.focus img::before {
	background-color: rgba(0,0,0,0.16);
}

/* Activated */

a:active img::before,
a.active img::before {
	background-color: rgba(0,0,0,0.16);
}

/* Pressed */

a.waves-effect .waves-ripple img::before {
	background-color: rgba(0,0,0,0.16);
}

/*--------------------------------------------------------------
## 2.36 <input>
--------------------------------------------------------------*/

input:not([type="checkbox"]):not([type="radio"]),
textarea,
select {
	background: transparent;
	color: var(--primary-text-color);
	border: 1px solid var(--quaternary-text-color);
	caret-color: rgb(var(--theme-primary-color)) !important;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="week"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="color"]
input[type="search"],
textarea,
select {
	display: block;
	font-size: 1em;
	background: transparent;
	border-radius: 0;
	box-shadow: none;
	margin: 0;
	padding: 0.5em;
	max-width: 100%;
	width: 100%;
	min-height: 48px; /* density: 32px 48px 56px */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

/*--------------------------------------------------------------
## 5.37 <kbd>
--------------------------------------------------------------*/

kbd {
	font-family: var(--monospace-font-family, monospace);
	font-size: var(--monospace-font-size, inherit);
	font-style: var(--monospace-font-style, inherit);
	font-weight: var(--monospace-font-weight, inherit);
	line-height: var(--monospace-line-height, inherit);
	letter-spacing: var(--monospace-letter-spacing, normal);
}

/*--------------------------------------------------------------
## 5.38 <label>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.39 <legend>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.40 <li>
--------------------------------------------------------------*/

li {
	position: relative; /* test */
}

/*--------------------------------------------------------------
## 5.40.X <li> Single-line Lists, Two-line Lists and Three-line Lists
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.40.X <li> Comments List
--------------------------------------------------------------*/

li.depth-1 {
	
}

li.depth-2 {
	padding-left: calc( 2 * 8px );
}

li.depth-3 {
	padding-left: calc( 3 * 8px );
}

li.depth-4 {
	padding-left: calc( 4 * 8px );
}

li.depth-5 {
	padding-left: calc( 5 * 8px );
}

li.depth-6 {
	padding-left: calc( 6 * 8px );
}

li.depth-7 {
	padding-left: calc( 7 * 8px );
}

li.depth-8 {
	padding-left: calc( 8 * 8px );
}

li.depth-9 {
	padding-left: calc( 9 * 8px );
}

li.depth-10 {
	padding-left: calc( 10 * 8px );
}

/*--------------------------------------------------------------
## 5.41 <main>
--------------------------------------------------------------*/

main {
	display: block;
}

/*--------------------------------------------------------------
## 5.42 <menu>
--------------------------------------------------------------*/

.dropdown,
.dropleft,
.dropright,
.dropup {
	position: relative;
}

.dropdown-menu {
	border-radius: 2px;
	text-align: left;
	text-align: start;
	/* background-color: transparent; */
	color: inherit;
	display: none;
	float: left;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5rem;
	list-style: none;
	margin: 0;
	min-width: 7rem;
	padding: .5rem 0;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 80
}

[dir=rtl] .dropdown-menu {
	text-align: right;
	text-align: start
}

.dropdown-menu.show {
	display: block
}

.dropdown-menu.show::before,
.dropdown-menu.show > * {
	-webkit-animation-duration: .3s;
	animation-duration: .3s;
	-webkit-animation-timing-function: cubic-bezier(.4, 0, .2, 1);
	animation-timing-function: cubic-bezier(.4, 0, .2, 1)
}

@media (min-width:576px) {
	.dropdown-menu.show::before,
	.dropdown-menu.show>* {
		-webkit-animation-duration: .39s;
		animation-duration: .39s
	}
}

@media (min-width:992px) {
	.dropdown-menu.show::before,
	.dropdown-menu.show > * {
		-webkit-animation-duration: .2s;
		animation-duration: .2s
	}
}

@media screen and (prefers-reduced-motion:reduce) {
	.dropdown-menu.show::before,
	.dropdown-menu.show > * {
		-webkit-animation: none;
		animation: none
	}
}

.dropdown-menu.show::before {
	-webkit-animation-name: dropdown-menu-show;
	animation-name: dropdown-menu-show
}

.dropdown-menu.show > * {
	-webkit-animation-name: dropdown-item-show;
	animation-name: dropdown-item-show
}

.dropdown-menu.show > :first-child {
	-webkit-animation-name: dropdown-item-show-1;
	animation-name: dropdown-item-show-1
}

.dropdown-menu.show > :nth-child(2) {
	-webkit-animation-name: dropdown-item-show-2;
	animation-name: dropdown-item-show-2
}

.dropdown-menu.show > :nth-child(3) {
	-webkit-animation-name: dropdown-item-show-3;
	animation-name: dropdown-item-show-3
}

.dropdown-menu::before {
	border-radius: 2px;
	/* background-color: #fff; */
	/* box-shadow: 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 3px rgba(0, 0, 0, .12), 0 4px 15px 0 rgba(0, 0, 0, .2); */
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	z-index: -1
}

.nav:not(.flex-column):not(.flex-column-reverse) .dropdown-menu {
	min-width: 100%;
}

.menu {
	margin-top: -3.125rem;
}

.menu::before {
	-webkit-transform-origin: 0 2rem;
	transform-origin: 0 2rem;
}

.show > a {
	outline: 0
}

.dropdown-menu-right:not([x-placement]) {
	right: 0;
	left: auto;
}

.dropdown-menu-right:not([x-placement]).menu::before {
	-webkit-transform-origin: 100% 2rem;
	transform-origin: 100% 2rem;
}

.dropdown-menu-right:not([x-placement])::before {
	-webkit-transform-origin: 100% 0;
	transform-origin: 100% 0;
}

.dropleft .dropdown-menu:not([x-placement]) {
	top: 0;
	right: 100%;
	left: auto;
}

.dropleft .dropdown-menu:not([x-placement]).menu {
	margin-top: 0
}

.dropleft .dropdown-menu:not([x-placement])::before {
	-webkit-transform-origin: 100% 0;
	transform-origin: 100% 0;
}

.dropright .dropdown-menu:not([x-placement]) {
	top: 0;
	left: 100%;
}

.dropright .dropdown-menu:not([x-placement]).menu {
	margin-top: 0;
}

.dropright .dropdown-menu:not([x-placement])::before {
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
}

.dropup .dropdown-menu:not([x-placement]) {
	top: auto;
	bottom: 100%;
}

.dropup .dropdown-menu:not([x-placement]).menu {
	margin-top: 0;
	margin-bottom: -3.125rem;
}

.dropup .dropdown-menu:not([x-placement]).menu::before {
	-webkit-transform-origin: 0 calc( 100% - 2rem );
	transform-origin: 0 calc( 100% - 2rem )
}

.dropup .dropdown-menu:not([x-placement])::before {
	-webkit-transform-origin: 0 100%;
	transform-origin: 0 100%;
}

.dropup .dropdown-menu:not([x-placement])>:first-child,
.dropup .dropdown-menu:not([x-placement])>:nth-child(2),
.dropup .dropdown-menu:not([x-placement])>:nth-child(3) {
	-webkit-animation-name: dropdown-item-show;
	animation-name: dropdown-item-show;
}

.dropup .dropdown-menu:not([x-placement])>:last-child {
	-webkit-animation-name: dropdown-item-show-1;
	animation-name: dropdown-item-show-1;
}

.dropup .dropdown-menu:not([x-placement])>:nth-last-child(2) {
	-webkit-animation-name: dropdown-item-show-2;
	animation-name: dropdown-item-show-2;
}

.dropup .dropdown-menu:not([x-placement])>:nth-last-child(3) {
	-webkit-animation-name: dropdown-item-show-3;
	animation-name: dropdown-item-show-3;
}

.dropup .dropdown-menu-right:not([x-placement]).menu::before {
	-webkit-transform-origin: 100% calc( 100% - 2rem );
	transform-origin: 100% calc( 100% - 2rem );
}

.dropup .dropdown-menu-right:not([x-placement])::before {
	-webkit-transform-origin: 100% 100%;
	transform-origin: 100% 100%;
}

.dropdown-menu[x-placement=bottom-end]::before,
.dropdown-menu[x-placement=left-start]::before {
	-webkit-transform-origin: 100% 0;
	transform-origin: 100% 0;
}

.dropdown-menu[x-placement=top-end].show > :first-child,
.dropdown-menu[x-placement=top-end].show > :nth-child(2),
.dropdown-menu[x-placement=top-end].show > :nth-child(3),
.dropdown-menu[x-placement=top-start].show > :first-child,
.dropdown-menu[x-placement=top-start].show > :nth-child(2),
.dropdown-menu[x-placement=top-start].show > :nth-child(3) {
	-webkit-animation-name: dropdown-item-show;
	animation-name: dropdown-item-show;
}

.dropdown-menu[x-placement=top-end].show > :last-child,
.dropdown-menu[x-placement=top-start].show > :last-child {
	-webkit-animation-name: dropdown-item-show-1;
	animation-name: dropdown-item-show-1;
}

.dropdown-menu[x-placement=top-end].show > :nth-last-child(2),
.dropdown-menu[x-placement=top-start].show > :nth-last-child(2) {
	-webkit-animation-name: dropdown-item-show-2;
	animation-name: dropdown-item-show-2;
}

.dropdown-menu[x-placement=top-end].show > :nth-last-child(3),
.dropdown-menu[x-placement=top-start].show > :nth-last-child(3) {
	-webkit-animation-name: dropdown-item-show-3;
	animation-name: dropdown-item-show-3
}

.dropdown-menu[x-placement=top-end]::before {
	-webkit-transform-origin: 100% 100%;
	transform-origin: 100% 100%;
}

.dropdown-menu[x-placement=top-start]::before {
	-webkit-transform-origin: 0 100%;
	transform-origin: 0 100%;
}

.menu[x-placement=bottom-end]::before {
	-webkit-transform-origin: 100% 2rem;
	transform-origin: 100% 2rem;
}

.menu[x-placement=left-start],
.menu[x-placement=right-start] {
	margin-top: 0;
}

.menu[x-placement=left-start]::before {
	-webkit-transform-origin: 100% 0;
	transform-origin: 100% 0;
}

.menu[x-placement=right-start]::before {
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
}

.menu[x-placement=top-end],
.menu[x-placement=top-start] {
	margin-top: 0;
	margin-bottom: -3.125rem;
}

.menu[x-placement=top-end]::before {
	-webkit-transform-origin: 100% calc( 100% - 2rem );
	transform-origin: 100% calc( 100% - 2rem );
}

.menu[x-placement=top-start]::before {
	-webkit-transform-origin: 0 calc( 100% - 2rem );
	transform-origin: 0 calc( 100% - 2rem );
}

@-webkit-keyframes dropdown-item-show {
	0% {
		opacity: 0
	}
	99% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes dropdown-item-show {
	0% {
		opacity: 0
	}
	99% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@-webkit-keyframes dropdown-item-show-1 {
	0% {
		opacity: 0
	}
	40% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes dropdown-item-show-1 {
	0% {
		opacity: 0
	}
	40% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@-webkit-keyframes dropdown-item-show-2 {
	0% {
		opacity: 0
	}
	60% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes dropdown-item-show-2 {
	0% {
		opacity: 0
	}
	60% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@-webkit-keyframes dropdown-item-show-3 {
	0% {
		opacity: 0
	}
	80% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes dropdown-item-show-3 {
	0% {
		opacity: 0
	}
	80% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@-webkit-keyframes dropdown-menu-show {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0)
	}
	20% {
		-webkit-transform: scale(.333333, 0);
		transform: scale(.333333, 0)
	}
	40% {
		-webkit-transform: scale(.666667, .25);
		transform: scale(.666667, .25)
	}
	60% {
		-webkit-transform: scaleY(.5);
		transform: scaleY(.5)
	}
	80% {
		-webkit-transform: scaleY(.75);
		transform: scaleY(.75)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes dropdown-menu-show {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0)
	}
	20% {
		-webkit-transform: scale(.333333, 0);
		transform: scale(.333333, 0)
	}
	40% {
		-webkit-transform: scale(.666667, .25);
		transform: scale(.666667, .25)
	}
	60% {
		-webkit-transform: scaleY(.5);
		transform: scaleY(.5)
	}
	80% {
		-webkit-transform: scaleY(.75);
		transform: scaleY(.75)
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@-webkit-keyframes menu-animation {
	0% {
		margin-top: -3.5rem
	}
	to {
		margin-top: 0
	}
}

@keyframes menu-animation {
	0% {
		margin-top: -3.5rem
	}
	to {
		margin-top: 0
	}
}

.dropdown-menu-sm,
.menu-cascading {
	font-size: .9375rem;
	line-height: 1.5rem;
	padding-top: 1rem;
	padding-bottom: 1rem
}

@media (min-width:576px) {
	.dropdown-menu-sm,
	.menu-cascading {
		min-width: 20rem
	}
}

.menu-cascading {
	margin-top: -2.75rem
}

.menu-cascading[x-placement=top-end],
.menu-cascading[x-placement=top-start] {
	margin-top: 0;
	margin-bottom: -2.75rem
}

.menu-cascading[x-placement=top-end]::before {
	-webkit-transform-origin: 100% calc( 100% - 2rem );
	transform-origin: 100% calc( 100% - 2rem );
}

.menu-cascading[x-placement=top-start]::before {
	-webkit-transform-origin: 0 calc( 100% - 2rem );
	transform-origin: 0 calc( 100% - 2rem );
}

.dropdown-header {
	color: rgba(0, 0, 0, .87);
	display: block;
	font-size: 1rem;
	font-weight: bolder;
	line-height: 1.5rem;
	margin: 0;
	padding: .75rem 1rem;
	white-space: nowrap
}

.dropdown-menu-sm .dropdown-header,
.menu-cascading .dropdown-header {
	font-size: .9375rem;
	line-height: 1.5rem;
	padding: .25rem 1.5rem
}

.dropdown-item {
	transition-duration: .3s;
	transition-property: background-color, color;
	transition-timing-function: cubic-bezier(.4, 0, .2, 1);
	background: none;
	border: 0;
	clear: both;
	/* color: rgba(0, 0, 0, .87); */
	display: block;
	font-weight: inherit;
	padding: .75rem 1rem;
	position: relative;
	text-align: inherit;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	white-space: nowrap;
	width: 100%
}

@media (min-width:576px) {
	.dropdown-item {
		transition-duration: .39s
	}
}

@media (min-width:992px) {
	.dropdown-item {
		transition-duration: .2s
	}
}

@media screen and (prefers-reduced-motion:reduce) {
	.dropdown-item {
		transition: none
	}
}

/*
.dropdown-item:active,
.dropdown-item:focus,
.dropdown-item:hover {
	background-color: #f5f5f5;
	color: rgba(0, 0, 0, .87);
	text-decoration: none
}

.dropdown-item.active {
	background-color: #f5f5f5
}

.dropdown-item.disabled,
.dropdown-item:disabled {
	background-color: transparent;
	color: rgba(0, 0, 0, .38);
	pointer-events: none
}
*/

.dropdown-menu-sm .dropdown-item,
.menu-cascading .dropdown-item {
	padding: .25rem 1.5rem
}

.dropdown-item-text {
	color: rgba(0, 0, 0, .87);
	display: block;
	font-weight: inherit;
	padding: .75rem 1rem;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0
}

.dropdown-menu-sm .dropdown-item-text,
.menu-cascading .dropdown-item-text {
	padding: .25rem 1.5rem
}

:not(.btn-icon).dropdown-toggle::after {
	font-size: 1.714286em;
	line-height: .583333em;
	vertical-align: -.302198em;
	font-family: Material Icons;
	-webkit-font-feature-settings: "liga";
	font-feature-settings: "liga";
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	text-transform: none;
	white-space: nowrap;
	word-wrap: normal;
	content: "expand_more";
	display: inline-block;
	margin-right: -.2em;
	margin-left: .2em;
	vertical-align: top
}

.dropright .dropdown-toggle::after {
	content: "keyboard_arrow_right"
}

.dropup .dropdown-toggle::after {
	content: "expand_less"
}

.dropdown-toggle:empty::after {
	margin-left: -.2em
}

.dropleft .dropdown-toggle::after {
	display: none
}

.dropleft .dropdown-toggle::before {
	font-size: 1.714286em;
	line-height: .583333em;
	vertical-align: -.302198em;
	font-family: Material Icons;
	-webkit-font-feature-settings: "liga";
	font-feature-settings: "liga";
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	text-transform: none;
	white-space: nowrap;
	word-wrap: normal;
	content: "keyboard_arrow_left";
	display: inline-block;
	margin-right: .2em;
	margin-left: -.2em
}

.dropdown-divider {
	height: 1px;
	margin: 0.5rem 0;
	overflow: hidden;
	background-color: var(--quaternary-text-color);
}

/*--------------------------------------------------------------
## 5.43 <nav>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# 5.43.X <nav> Pagination
--------------------------------------------------------------*/

nav[class*="pagination"] {
	display: flex;
	justify-content: center;
}

nav[class*="pagination"] ul {
	display: flex;
	column-gap: 8px;
	align-content: center;
	align-items: center;
}

nav[class*="pagination"] ul li {
	height: 48px;
}

nav[class*="pagination"] ul li > a,
nav[class*="pagination"] ul li > span {
	display: inline-flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	height: 48px;
	width: 48px;
}

/* States */

nav[class*="pagination"] ul li a span[aria-current="page"] {

}

/*--------------------------------------------------------------
## 5.44 <ol>
--------------------------------------------------------------*/

ol:not([class]) {
	display: block;
	list-style-type: decimal;
	margin-top: 1em;
	margin-bottom: 1em;
	margin-left: 0;
	margin-right: 0;
	padding-left: 40px;
}

/*--------------------------------------------------------------
## 5.45 <optgroup>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.46 <option>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.47 <output>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.48 <p>
--------------------------------------------------------------*/

p {
	position: relative;
	margin-top: 1em;
	margin-bottom: 1em;
	background-color: rgba(255,252,96,0.3);
}

p:empty {
	display: none;
}


/*--------------------------------------------------------------
## 5.49 <picture>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.50 <pre>
--------------------------------------------------------------*/

pre {
	border: 1px solid var(--quaternary-text-color);
	overflow: auto;
	padding: 3rem 2rem;
}

pre code {
	background: transparent;
	padding: 0;
}

/*--------------------------------------------------------------
## 5.51 <progress>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.52 <q> Mark up a short quotation
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.53 <s> Mark up text that is no longer correct
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.54 <samp> Sample output from a computer program
--------------------------------------------------------------*/

samp {
	font-family: var(--monospace-font-family, monospace);
	font-size: var(--monospace-font-size, inherit);
	font-style: var(--monospace-font-style, inherit);
	font-weight: var(--monospace-font-weight, inherit);
	line-height: var(--monospace-line-height, inherit);
	letter-spacing: var(--monospace-letter-spacing, normal);
}

/*--------------------------------------------------------------
## 5.55 <section>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.56 <select>
--------------------------------------------------------------*/

select {
	width: 100%;
	max-width: 25vw;
	background: transparent;
}

/*--------------------------------------------------------------
## 5.57 <small>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.57.X <small> Helper text
--------------------------------------------------------------*/

.helper-text {
	display: block;
	padding-right: 16px;
	padding-left: 16px;
}

.has-error .helper-text {
	color: rgba(var(--theme-error-color));
}

/*--------------------------------------------------------------
## 5.58 <source>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.59 <span>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.60 <strong>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.61 <sub> Subscript text
--------------------------------------------------------------*/

sub {
	line-height: 0; /* Zero out the line-height so that it doesn't interfere with the positioning that follows */
}

/*--------------------------------------------------------------
## 5.62 <summary>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.63 <sup> Superscript text
--------------------------------------------------------------*/

sup {
	line-height: 0; /* Zero out the line-height so that it doesn't interfere with the positioning that follows */
}

/*--------------------------------------------------------------
## 5.64 <svg>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.65 <table>
--------------------------------------------------------------*/

table {
	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
	font-size: 1em;
	max-width: 100%;
	overflow: hidden;
	width: 100%;
	max-width: 100%;
}

.alignleft > table {
	margin: 0;
}

.alignright > table {
	margin: 0;
}

th,
td {
	border: 1px solid var(--quaternary-text-color);
	line-height: 1.4;
	margin: 0;
	overflow: visible;
	padding: 0.5em;
}

/*
caption {
	background: #dcd7ca;
	font-weight: 600;
	padding: 0.5em;
	text-align: center;
}
*/

thead {
	vertical-align: bottom;
	white-space: nowrap;
}

/* woocommerce */

table.variations {

}

table.variations th,
table.variations td {
	border: 0;
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: 0;
}

table.variations td .choice-chip {
	margin-top: 8px
}

/*--------------------------------------------------------------
## 5.66 <tbody>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.67 <td> Table cell
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.68 <template> The template element holds HTML code without displaying it
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.69 <textarea> An HTML text area
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.70 <tfoot>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.71 <th>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.72 <thead>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.73 <time>
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.74 <tr> Table row
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## 5.75 <ul> An unordered HTML list
--------------------------------------------------------------*/

ul:not([class]),
.unordered-list { /* classic */
	list-style-type: disc; /* default: disc */
	padding-left: 1em; /* default: 40px */
	/* default: margin-top: 1em */
	/* default: margin-bottom: 1em */
}

ul:not([class]),
.unordered-list {
	display: block;
	list-style-type: disc; /* default: disc */
	margin-top: 1em; /* default: margin-top: 1em */
	margin-bottom: 1em; /* default: margin-top: 1em */
	margin-left: 0;
	margin-right: 0;
	padding-left: 40px; /* default: 40px */
}

ul:not([class]) ul,
ol:not([class]) ul {
	list-style-type: circle;
}

ul:not([class]) ul ul,
ul:not([class]) ol ul,
ol:not([class]) ul ul,
ol:not([class]) ol ul {
	list-style-type: square;
}














.widget ul:not([class]) {
	list-style-type: none; /* default: disc */
	padding-left: 0; /* default: 40px */
	margin-top: 1em; /* default: 1em */
	margin-bottom: 1em; /* default: 1em */
}

figure ul {
	list-style-type: none; /* default: disc */
	padding: unset; /* default: padding-left 40px */
	margin: unset; /* default: 1em */
	padding-top: 8px;
	padding-bottom: 8px;
}

ul.children {
	list-style-type: none; /* default: disc */
	padding-left: 24px; /* default: padding-left 40px */
	margin: unset; /* default: 1em */
	padding-top: 1em;
	padding-bottom: 1em;
}

nav ul {
	list-style-type: none; /* default: disc */
	padding-left: 0; /* default: 40px */
	margin-top: 0; /* default: 1em */
	margin-bottom: 0; /* default: 1em */
	padding-top: 8px; /* test global */
	padding-bottom: 8px; /* test global */
}

ul.page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
}

/*--------------------------------------------------------------
## 5.75.X <ul> Dropdown menu
--------------------------------------------------------------*/

ul.dropdown-menu {
	border-radius: 2px;
	text-align: left;
	color: inherit;
	display: none;
	float: left;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5rem;
	list-style: none;
	margin: unset;
	margin-top: unset;
	min-width: 10rem;
	padding: .5rem 0;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	position: absolute;
	top: 100%;
	right: 0;
	left: auto;
	z-index: 108;
}

ul.dropdown-menu.show {
	display: flex;
	flex-direction: column;
}

ul.dropdown-menu-right {
	right: auto !important;
	left: 0 !important;
}

ul.menu {
	margin-top: -3.125rem;
}

.app-bar ul.dropdown-menu {
	position: static;
	float: none;
}

/*-------------------------------------------------------------- 
## 5.76 <video>
--------------------------------------------------------------*/

video {
	max-width: 100%;
}



































/*--------------------------------------------------------------
# 6.6 Buttons
--------------------------------------------------------------*/

.btn + .btn {
	margin-left: 8px; /* spacing */
}

/*-----------------------------------------------------------------------------------------
## Motion: Fade
-----------------------------------------------------------------------------------------*/

.fade {
	transition-duration: .3s;
	transition-property: opacity;
	transition-timing-function: cubic-bezier(.4,0,.2,1);
	opacity: 0;
}

.fade.show {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.fade {
		transition: none;
	}
}

/*-----------------------------------------------------------------------------------------
## Motion: Collapse
-----------------------------------------------------------------------------------------*/

.collapse:not(.show) {
	display: none !important;
}

.collapsing {
	height: 0;
	overflow: hidden;
	transition: height 0.35s ease;
}

@media (prefers-reduced-motion: reduce) {
	.collapsing {
		transition: none;
	}
}

.collapse .related.products > h2 {
	display: none !important;
}

[role="tabpanel"] > :first-child {
	margin-top: 0 !important;
}

[role="tabpanel"] > :last-child {
	margin-bottom: 56px !important;
}










/*-----------------------------------------------------------------------------------------
## Display Classes
-----------------------------------------------------------------------------------------*/

.d-flex {
	display: -ms-flexbox;
	display: flex;
}

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

.d-block {
	display: block;
}

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

.d-none {
	display: none;
}

@media (min-width: 600px) {

	.d-flex-600 {
		display: -ms-flexbox;
		display: flex;
	}

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

	.d-block-600 {
		display: block;
	}

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

	.d-none-600 {
		display: none;
	}

}

@media (min-width: 1280px) {

	.d-flex-1280 {
		display: -ms-flexbox;
		display: flex;
	}

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

	.d-block-1280 {
		display: block;
	}

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

	.d-none-1280 {
		display: none;
	}

}

/*-----------------------------------------------------------------------------------------
## Flex-Box Classes
-----------------------------------------------------------------------------------------*/

.flex-row,
.child-flex-row > * {
	flex-direction: row;
}

.flex-column,
.child-flex-column > * {
	flex-direction: column;
}

.flex-row-reverse,
.child-flex-row-reverse > * {
	flex-direction: row-reverse;
}

.flex-column-reverse,
.child-flex-column-reverse > * {
	flex-direction: column-reverse;
}

.flex-wrap,
.child-flex-wrap > * {
	flex-wrap: wrap;
}

.flex-nowrap,
.child-flex-nowrap > * {
	flex-wrap: nowrap;
}

.flex-wrap-reverse,
.child-flex-wrap-reverse > * {
	flex-wrap: wrap-reverse;
}

.flex-fill,
.child-flex-fill > * {
	flex: 1 1 auto;
}

.flex-grow-0,
.child-flex-grow-0 > * {
	flex-grow: 0;
}

.flex-grow-1,
.child-flex-grow-1 > * {
	flex-grow: 1;
}

.flex-shrink-0,
.child-flex-shrink-0 > * {
	flex-shrink: 0;
}

.flex-shrink-1,
.child-flex-shrink-1 > * {
	flex-shrink: 1;
}

.justify-content-start,
.child-justify-content-start > * {
	justify-content: flex-start;
}

.justify-content-end,
.child-justify-content-end > * {
	justify-content: flex-end;
}

.justify-content-center,
.child-justify-content-center > * {
	justify-content: center; 
}

.justify-content-between,
.child-justify-content-between > * {
	justify-content: space-between;
}

.justify-content-around,
.child-justify-content-around > * {
	justify-content: space-around;
}

.align-items-start,
.child-align-items-start > * {
	align-items: flex-start;
}

.align-items-end,
.child-align-items-end > * {
	align-items: flex-end;
}

.align-items-center,
.child-align-items-center > * {
	align-items: center;
}

.align-items-baseline,
.child-align-items-baseline > * {
	align-items: baseline;
}

.align-items-stretch,
.child-align-items-stretch > * {
	align-items: stretch;
}

.align-content-start,
.child-align-content-start > * {
	align-content: flex-start;
}

.align-content-end,
.child-align-content-end > * {
	align-content: flex-end;
}

.align-content-center,
.child-align-content-center > * {
	align-content: center; 
}

.align-content-between,
.child-align-content-between > * { 
	align-content: space-between;
}

.align-content-around,
.child-align-content-around > * {
	align-content: space-around;
}

.align-content-stretch,
.child-align-content-stretch > * {
	align-content: stretch;
}

.align-self-auto,
.child-align-self-auto > * {
	align-self: auto;
}

.align-self-start,
.child-align-self-start > * {
	align-self: flex-start;
}

.align-self-end,
.child-align-self-end > * {
	align-self: flex-end;
}

.align-self-center,
.child-align-self-center > * {
	align-self: center;
}

.align-self-baseline,
.child-align-self-baseline > * {
	align-self: baseline;
}

.align-self-stretch,
.child-align-self-stretch > * {
	align-self: stretch;
}


.w-100,
.child-w-100 > *  {
	width: 100%;
}





.height-100 {
	height: 100%;
}

.min-height-100vh {
	min-height: 100vh;
}


.width-100 {
	width: 100% !important; /* wp-block-cover _inner */
}




/* Loop */
.sticky {

}

/* Comments */
.bypostauthor {

}











/*--------------------------------------------------------------
# BLOCKS
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block archives
--------------------------------------------------------------*/

ul.wp-block-archives.wp-block-archives-list {
	display: flex;
	flex-direction: column;
	list-style: none;
}

ul.wp-block-archives.wp-block-archives-list li a {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
}

/* States */

ul.wp-block-archives.wp-block-archives-list li a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

ul.wp-block-archives.wp-block-archives-list li a {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color);
}

/* Hover */

ul.wp-block-archives.wp-block-archives-list li a:hover {
	background-color: var(--hover-overlay);
	color: var(--primary-text-color);
}

/* Focus */

ul.wp-block-archives.wp-block-archives-list li a:focus {
	background-color: var(--focus-overlay);
	color: var(--primary-text-color);
}

/* Selected */

ul.wp-block-archives.wp-block-archives-list li.current-menu-item > a {
	background-color: var(--selected-overlay);
	color: var(--primary-text-color);
}

/* Activated */

ul.wp-block-archives.wp-block-archives-list li a:active {
	background-color: var(--activated-overlay);
	color: var(--primary-text-color);
}

/* Pressed */

ul.wp-block-archives.wp-block-archives-list li a.waves-effect .waves-ripple {
	background-color: var(--pressed-overlay);
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# Block Audio
--------------------------------------------------------------*/

.wp-block-audio audio {
	width: 100%;
}

/*--------------------------------------------------------------
# Block button
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block buttons
--------------------------------------------------------------*/

.wp-block-buttons {
	display: flex;
	align-items: center;
	align-content: center;
	min-height: 48px; /* components height */
}

/*--------------------------------------------------------------
# Block calendar
--------------------------------------------------------------*/

.wp-block-calendar {
	margin-top: 1.5em; /* TODO figure vertical spacing */
	margin-bottom: 1.5em; /* TODO figure vertical spacing */
}

/*--------------------------------------------------------------
# Block categories
--------------------------------------------------------------*/

ul.wp-block-categories.wp-block-categories-list {
	display: flex;
	flex-direction: column;
	list-style: none;
}

ul.wp-block-categories.wp-block-categories-list li a {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
}

/* States */

ul.wp-block-categories.wp-block-categories-list li a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

ul.wp-block-categories.wp-block-categories-list li a {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color);
}

/* Hover */

ul.wp-block-categories.wp-block-categories-list li a:hover {
	background-color: var(--hover-overlay);
	color: var(--primary-text-color);
}

/* Focus */

ul.wp-block-categories.wp-block-categories-list li a:focus {
	background-color: var(--focus-overlay);
	color: var(--primary-text-color);
}

/* Selected */

ul.wp-block-categories.wp-block-categories-list li.current-menu-item > a {
	background-color: var(--selected-overlay);
	color: var(--primary-text-color);
}

/* Activated */

ul.wp-block-categories.wp-block-categories-list li a:active {
	background-color: var(--activated-overlay);
	color: var(--primary-text-color);
}

/* Pressed */

ul.wp-block-categories.wp-block-categories-list li a.waves-effect .waves-ripple {
	background-color: var(--pressed-overlay);
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# Block classic
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block code
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block column
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block columns
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block cover
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block embed
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block file
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block gallery
--------------------------------------------------------------*/

figure.wp-block-gallery {
	
}

h1 + figure.wp-block-gallery:not(.alignfull),
h2 + figure.wp-block-gallery:not(.alignfull),
h3 + figure.wp-block-gallery:not(.alignfull),
h4 + figure.wp-block-gallery:not(.alignfull),
h5 + figure.wp-block-gallery:not(.alignfull),
h6 + figure.wp-block-gallery:not(.alignfull),
p + figure.wp-block-gallery:not(.alignfull) {
	margin-top: var(--figure-margin-top-NEU, -0.5em);
}

.wp-block-gallery ul {
	list-style-type: none; /* default: disc */
	padding-left: 0; /* default: 40px */
	padding-top: 0;
	padding-bottom: 0;
	margin-top: 0; /* default: 1em */
	margin-bottom: 0; /* default: 1em */
}

.wp-block-gallery ul {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 24px;
	row-gap: 24px;
	width: 100%;
}

.wp-block-gallery.columns-2 ul {
	grid-template-columns: repeat(2, 1fr);
}

.wp-block-gallery.columns-3 ul {
	grid-template-columns: repeat(3, 1fr);
}

.wp-block-gallery.columns-4 ul {
	grid-template-columns: repeat(4, 1fr);
}

.wp-block-gallery.columns-5 ul {
	grid-template-columns: repeat(5, 1fr);
}

.wp-block-gallery.columns-6 ul {
	grid-template-columns: repeat(6, 1fr);
}

.wp-block-gallery.columns-7 ul {
	grid-template-columns: repeat(7, 1fr);
}

.wp-block-gallery.columns-8 ul {
	grid-template-columns: repeat(7, 1fr);
}

.wp-block-gallery figure {
	margin: 0;
}

.wp-block-gallery figure a {
	display: inline-block;
}

.wp-block-gallery.is-cropped figure a {
	display: block;
	width: 100%;
}

.wp-block-gallery figure img {
	position: relative;
}

.wp-block-gallery.is-cropped figure img {
	width: 100%;
}

/* Cropped default aspect-ratio */

.wp-block-gallery.is-cropped .monolith-image-wrapper {
	position: relative;
}

.wp-block-gallery.is-cropped .monolith-image-wrapper {
	padding-top: 66.66%;
}

.wp-block-gallery.is-cropped .monolith-image-wrapper img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	object-fit: cover;
	border: 1px solid red;
}

/* States */

/* Link */

.wp-block-gallery a img::after {
	content: ""; /* ::before and ::after both require content */
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.wp-block-gallery a img::before {
	content: ""; /* ::before and ::after both require content */
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.80);
	z-index: 1;
	border: 10px solid green;
}

/* Hover */

.wp-block-gallery a:hover img::before {
	background-color: rgba(0,0,0,0.16);
}

/* Focus */

.wp-block-gallery a:focus img::before {

}

/* Activated */

.wp-block-gallery a:active img::before {

}

/* Pressed */

.wp-block-gallery a.waves-effect .waves-ripple img::before {

}

/* Gallery Caption */

.wp-block-gallery figcaption.blocks-gallery-caption {
	margin-top: 1em;
	font-size: 16px;
	color: red !important;
}

/*--------------------------------------------------------------
# Block group
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block heading
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block html
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block image
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block latest-comments
--------------------------------------------------------------*/

ol.wp-block-latest-comments {
	padding-left: 0;
}

ol.wp-block-latest-comments {
	display: flex;
	flex-direction: column;
	list-style: none;
}

ol.wp-block-latest-comments li.wp-block-latest-comments__comment {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
	margin-bottom: 0;
}

/*--------------------------------------------------------------
# Block latest-posts
--------------------------------------------------------------*/

ul.wp-block-latest-posts.wp-block-latest-posts__list.has-dates {
	display: flex;
	flex-direction: column;
	list-style: none;
}

ul.wp-block-latest-posts.wp-block-latest-posts__list.has-dates li {
	display: flex;
	flex-direction: column;
	align-content: center;
	min-height: 56px;
}

ul.wp-block-latest-posts.is-grid {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(1, 1fr);
}

ul.wp-block-latest-posts.is-grid.columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

ul.wp-block-latest-posts.is-grid.columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

/*--------------------------------------------------------------
# Block legacy-widget
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block list
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block media-image
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block more
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block navigation
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block navigation-link
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block next-page
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block paragraph
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block preformatted
--------------------------------------------------------------*/

.wp-block-preformatted {
	margin-top: 1em;
	margin-bottom: 1em;
}

/*--------------------------------------------------------------
# Block post-author
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-comments
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-comments-count
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-comments-form
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-content
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-date
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-excerpt
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-featured-image
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-tags
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block post-title
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block preformatted
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block pullquote
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block query
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block query-loop
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block query-pagination
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block quote
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block rss
--------------------------------------------------------------*/

ul.wp-block-rss {
	display: flex;
	flex-direction: column;
	list-style: none;
}

ul.wp-block-rss li a {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
}

/* States */

ul.wp-block-rss li a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

ul.wp-block-rss li a {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color);
}

/* Hover */

ul.wp-block-rss li a:hover {
	background-color: var(--hover-overlay);
	color: var(--primary-text-color);
}

/* Focus */

ul.wp-block-rss li a:focus {
	background-color: var(--focus-overlay);
	color: var(--primary-text-color);
}

/* Selected */

ul.wp-block-rss li.current-menu-item > a {
	background-color: var(--selected-overlay);
	color: var(--primary-text-color);
}

/* Activated */

ul.wp-block-rss li a:active {
	background-color: var(--activated-overlay);
	color: var(--primary-text-color);
}

/* Pressed */

ul.wp-block-rss li a.waves-effect .waves-ripple {
	background-color: var(--pressed-overlay);
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# Block search
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block separator
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block shortcode
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block site-logo
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block site-tagline
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block site-title
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block social-link
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block social-links
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block spacer
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block subhead
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block table
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block tag-cloud
--------------------------------------------------------------*/

.wp-block-tag-cloud {
	font-size: 0 !important; /* remove the space between inline-block elements */
	margin-bottom: calc( -8px ) !important;
}

.wp-block-tag-cloud a {
	display: inline-flex;
	margin: 0 8px 8px 0 !important;
}

/*--------------------------------------------------------------
# Block text-columns
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block verse
--------------------------------------------------------------*/

pre.wp-block-verse {
	margin-top: 1em;
	margin-bottom: 1em;
}

/*--------------------------------------------------------------
# Block video
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Block widget-area
--------------------------------------------------------------*/





































































/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X App bar: bottom
-----------------------------------------------------------------------------------------*/

.app-bar-bottom {
	display: -ms-flexbox;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	flex-shrink: 0;

	position: absolute;
	/* top: unset; */
	/* top: auto; */
	/* right: 0; */
	bottom: 0;
	/* left: 0; */

	padding-right: 4px;
	padding-left: 4px;
	width: 100%;
	height: 56px; /* --app-bar-height */
}

@media only screen and (min-width: 600px) {
	.app-bar-bottom .content {
		padding-right: 12px;
		padding-left: 12px;
	}
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X App bar: top
-----------------------------------------------------------------------------------------*/

.app-bar-top {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition-duration: 0.3s;
	transition-property: background-color, color, box-shadow;
	transition-timing-function: var(--standard-curve);
}

.app-bar-top h1,
.app-bar-top h2,
.app-bar-top .custom-logo-link {
	margin-left: 20px;
}

.wp-block-cover + .app-bar-top {
	position: absolute !important;
}

.app-bar-top .content {
	padding-top: 4px;
	padding-right: 4px;
	padding-bottom: 4px;
	padding-left: 4px;
}

@media only screen and (min-width: 600px) {
	.app-bar-top .content {
		padding-right: 12px;
		padding-left: 12px;
	}
}

.waterfall {
	box-shadow: var(--shadow-01);
	border-color: transparent;
	transition-duration: 0.3s;
	transition-property: background-color, color, box-shadow;
	transition-timing-function: var(--standard-curve);
}

@media only screen and (min-width: 600px) {
	.waterfall {
		transition-duration: 0.39s;
	}
}

@media only screen and (min-width: 1280px) {
	.waterfall {
		transition-duration: 0.2s;
	}
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X App bar: vertical
-----------------------------------------------------------------------------------------*/

@media (min-width: 600px) {

	.has-vertical-app-bar-600 {
		padding-left: var(--vertical-app-bar-width, 64px );
	}

	.app-bar.vertical-app-bar-600 {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		width: var(--vertical-app-bar-width, 64px ); 
		padding-top: 4px;
	}

}

@media (min-width: 1280px) {

	.has-vertical-app-bar-1280 {
		padding-left: var(--vertical-app-bar-width, 64px );
	}

	.app-bar.vertical-app-bar-600 {
		position: fixed;
		top: 0; 
		left: 0; 
		bottom: 0;
		width: var(--vertical-app-bar-width, 64px ); 
		padding-top: 4px;
	}

}

/*--------------------------------------------------------------
# COMPONENTS X.X BANNERS
--------------------------------------------------------------*/

.woocommerce-notices-wrapper {
	display: flex;
	flex-direction: column;
	padding-right: 16px;
	padding-left: 16px;
	min-height: 54px;
	border-bottom: 1px solid #ccc;
}

.woocommerce-notices-wrapper:empty {
	display: none;
}

@media (min-width: 600px) {
	.woocommerce-notices-wrapper {
		padding-right: 24px;
		padding-left: 24px;
	}
}

.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message {
	flex-shrink: 0;
	font-weight: 500;
	width: 100%;
	padding-top: 16px;
	padding-bottom: 16px;
}

/*--------------------------------------------------------------
## COMPONENTS X.X Bottom navigation
--------------------------------------------------------------*/

.bottom-navigation-bar {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
}

.bottom-navigation-bar ul {
	display: flex;
	justify-content: space-between;
	list-style: none;
	margin: unset;
	padding: unset;
}

.bottom-navigation-bar li {
	min-width: 80px;
	max-width: 168px;
}

.bottom-navigation-bar li a {
	font-family: var(--caption-font-family);
	font-size: var(--caption-font-size);
	font-style: var(--caption-font-style);
	font-weight: var(--caption-font-weight);
	letter-spacing: var(--caption-letter-spacing);
	line-height: var(--caption-line-height);
	text-align: center;
	text-transform: uppercase;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	width: 100%;
	padding-right: 12px;
	padding-left: 12px;
	height: 56px; /* components-height */
}

.bottom-navigation-bar li a .material-icons {
	vertical-align: unset;
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Buttons
-----------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Buttons: Contained Button
-----------------------------------------------------------------------------------------*/

button.button:not(.btn), /* default */
.btn-contained {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	white-space: nowrap;
	display: -ms-inline-flexbox;
	display: inline-flex !important;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	min-width: 64px;
	height: 36px;
	position: relative;
	padding: 0 15px; /* 16px - border-width */
	margin: unset;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	cursor: pointer;
	border: 0;
	border-radius: 4px; /* shape */
	transition: all 15ms var(--acceleration-curve);
}

/* COLOR */

.btn-contained {
	--on-color: calc(((((var(--theme-primary-red) * 299) + (var(--theme-primary-green) * 587) + (var(--theme-primary-blue) * 114)) / 1000 ) - 128 ) * -1000 );
}

/* Contained button enabled state */

.btn-contained {
	background: rgb(var(--theme-primary-color));
	box-shadow: var(--shadow-04); /* todo check elevation level */
	color: rgb(var(--on-color));
}


/* Contained button hover state */

.btn-contained.hover,
.btn-contained:hover {
	background: linear-gradient(to top,rgba(var(--on-color),0.08),rgba(var(--on-color),0.08)) rgb(var(--theme-primary-color));
	color: rgb(var(--on-color));
}

/* Contained button focus state */

.btn-contained.focus,
.btn-contained:focus {
	background: linear-gradient(to top,rgba(var(--on-color),0.24),rgba(var(--on-color),0.24)) rgb(var(--theme-primary-color));
	color: rgb(var(--on-color));
}

/* NO Contained button selected state */

/* NO Contained button activated state */

/* Contained button pressed state */

.btn-contained.pressed {
	background: linear-gradient(to top,rgba(var(--on-color),0.32),rgba(var(--on-color),0.32)) rgb(var(--theme-primary-color));
	color: rgb(var(--on-color));
}

.btn-contained:active {
	background: rgb(var(--theme-primary-color));
}

.btn-contained.waves-effect .waves-ripple {
	background: rgba(var(--on-color),0.32);
	color: rgb(var(--theme-on-primary-color));
}

/* Contained button disabled state */

.btn-contained.disabled,
.btn-contained:disabled {
	background: var(--quaternary-text-color) !important; /* :hover */
	box-shadow: none !important; /* :hover */
	color: var(--tertiary-text-color) !important; /* :hover */
	cursor: default;
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Buttons: Text Button
-----------------------------------------------------------------------------------------*/

.btn-text {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	white-space: nowrap;
	display: -ms-inline-flexbox;
	display: inline-flex !important;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	min-width: 64px;
	height: 36px;
	position: relative;
	padding: 0 15px; /* 16px - border-width */
	margin: 8px 0 !important;
	box-shadow: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	cursor: pointer;
	border: 0;
	border-radius: 4px; /* shape */
	transition: all 15ms var(--acceleration-curve);
}

/* Text button enabled state */

.btn-text {
	background: transparent;
	color: rgb(var(--theme-primary-color));
	border: 0;
}

/* Text button disabled state */

.btn-text.disabled,
.btn-text:disabled {
	background: transparent !important; /* :hover */
	color: var(--tertiary-text-color) !important; /* :hover */
	cursor: default;
}

/* Text button hover state */

.btn-text.hover,
.btn-text:hover {
	background: rgba(var(--theme-primary-color),var(--hover-overlay-opacity));
}

/* Text button focus state */

.btn-text.focus,
.btn-text:focus {
	background: rgba(var(--theme-primary-color),var(--focus-overlay-opacity));
}

/* NO Text button selected state */

/* NO Text button activated state */

/* Text button pressed state */

.btn-text.pressed {
	background: rgba(var(--theme-primary-color),var(--pressed-overlay-opacity));
}

.btn-text.active,
.btn-text:active {
	background: transparent;
}

.btn-text.waves-effect .waves-ripple {
	background: rgba(var(--theme-primary-color),var(--pressed-overlay-opacity));
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Buttons: Outlined Button
-----------------------------------------------------------------------------------------*/

.btn-outline {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	white-space: nowrap;
	display: -ms-inline-flexbox;
	display: inline-flex !important;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	min-width: 64px;
	height: 36px;
	position: relative;
	padding: 0 15px; /* 16px - border-width */
	margin: 8px 0 !important;
	border: 0;
	box-shadow: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	cursor: pointer;
	border: 0;
	border-radius: 4px; /* shape */
	transition: all 15ms var(--acceleration-curve);
}

/* Outlined button enabled state */

.btn-outline {
	background: transparent;
	color: rgb(var(--theme-primary-color));
	border: 1px solid var(--quaternary-text-color);
}

/* Outlined button disabled state */

.btn-outline.disabled,
.btn-outline:disabled {
	background: transparent !important; /* :hover */
	color: var(--tertiary-text-color) !important; /* :hover */
	cursor: default;
}

/* Outlined button hover state */

.btn-outline.hover,
.btn-outline:hover {
	background: rgba(var(--theme-primary-color),var(--hover-overlay-opacity));
}

/* Outlined button focus state */

.btn-outline.focus,
.btn-outline:focus {
	background: rgba(var(--theme-primary-color),var(--focus-overlay-opacity));
}

/* NO Outlined button selected state */

/* NO Outlined button activated state */

/* Outlined button pressed state */

.btn-outline.pressed {
	background: rgba(var(--theme-primary-color),var(--pressed-overlay-opacity));
}

.btn-outline:active {
	background: transparent;
}

.btn-outline.waves-effect .waves-ripple {
	background: rgba(var(--theme-primary-color),var(--pressed-overlay-opacity));
}

/*--------------------------------------------------------------
## COMPONENTS X.X Buttons: Icon toggle
--------------------------------------------------------------*/

.btn-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	flex-grow: 0;
	border: 0;
	box-shadow: none;
	padding: unset;
	text-decoration: none !important; /* a */
	width: 48px;
	height: 48px;
	border-radius: 50%;
	transition: all 280ms linear;
}

/* States */

/* Link */

.btn-icon {
	background-color: transparent;
	color: var(--inactive-icon-color);
}

/* Hover */

.btn-icon.hover,
.btn-icon:hover {
	background-color: rgba(var(--on-color),var(--hover-overlay-opacity));
	color: var(--active-unfocused-icon-color);
}

/* Focus */

.btn-icon.focus,
.btn-icon:focus {
	background-color: rgba(var(--on-color),var(--focus-overlay-opacity));
	color: var(--active-unfocused-icon-color);
}

/* Activated */

.btn-icon.active,
.btn-icon:active {
	background-color: rgba(var(--on-color),var(--activated-overlay-opacity));
	color: var(--active-unfocused-icon-color);
}

/* Activated + Focused */

.btn-icon.active.focus,
.btn-icon:active:focus {
	background-color: rgba(var(--on-color),var(--activated-overlay-opacity)); /* TODO */
	color: var(--active-focused-icon-color);
}

/* Pressed */

.btn-icon.waves-effect .waves-ripple {
	background-color: var(--pressed-overlay);
	color: var(--active-focused-icon-color);
}

/*--------------------------------------------------------------
# COMPONENTS X.X Buttons: Floating action button
--------------------------------------------------------------*/

.btn-float-dropdown  {
	display: flex;
}

.btn-float-dropdown .dropdown-menu::before {
	display: none;
}

.btn-float-dropdown .dropdown-menu {
	border-radius: 0;
	margin-top: 1rem;
	min-width: 3.5rem;
	padding: unset;
	text-align: center;
}

.btn-float {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	width: 56px;
	height: 56px;
	min-width: unset;
	padding: unset;
}

.dropdown-menu .btn-float {
	margin-right: auto;
	margin-left: auto;
	width: 40px;
	height: 40px;
	margin-bottom: 16px;
}

/* States */

.btn-float {
	transition-duration: 0.2s;
	transition-property: box-shadow;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
}

/* enabled */

.btn-float {
	box-shadow: var(--shadow-06);
	box-shadow: 0 6px 10px 0 rgba(0,0,0,.14),0 1px 18px 0 rgba(0,0,0,.12),0 3px 5px 0 rgba(0,0,0,.2);
	color: var(--secondary-text-color);
}

/* Hover */

.btn-float:hover,
.btn-float.hover {
	box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2),0px 8px 10px 1px rgba(0, 0, 0, 0.14),0px 3px 14px 2px rgba(0,0,0,.12);
	color: var(--primary-text-color);
}

/* Focus */

.btn-float:focus,
.btn-float.focus {
	box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2),0px 8px 10px 1px rgba(0, 0, 0, 0.14),0px 3px 14px 2px rgba(0,0,0,.12);
	color: var(--primary-text-color);
}

/* Selected */

/* Activated */

.btn-float:active,
.btn-float.active {
	box-shadow: var(--shadow-04);
	color: var(--primary-text-color);
}

/* Pressed */

.btn-float.waves-effect .waves-ripple {
	box-shadow: var(--shadow-12);
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# COMPONENTS X.X Cards
--------------------------------------------------------------*/

.card {
	border-radius: 4px;
	overflow: hidden;
}

.card figure {
	border-top-right-radius: 4px;
	border-top-left-radius: 4px;
	margin-top: 0;
	margin-right: -16px;
	margin-bottom: 0;
	margin-left: -16px;
	min-width: calc( 100% + 2 * 16px );
	overflow: hidden;
}

.card > a {
	display: flex;
	flex-direction: column;
	padding-right: 16px;
	padding-left: 16px;
}

.card > a > h2 {
	margin: unset;
	margin-top: 16px;
	margin-bottom: 16px;
}












/* Scannable cards */

.scannable-cards > ul,
ul.scannable-cards {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	column-gap: 8px;
	row-gap: 8px;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
	margin-top: 0;
	margin-bottom: 0;
}

.scannable-cards.mobile-2-columns > ul,
ul.scannable-cards.mobile-2-columns {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 16px;
	row-gap: 16px;
}

@media only screen and (min-width: 600px) {
	.scannable-cards > ul,
	ul.scannable-cards {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		column-gap: 24px;
		row-gap: 24px;
	}
}

@media only screen and (min-width: 1024px) {
	.scannable-cards > ul,
	ul.scannable-cards {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		column-gap: 24px;
		row-gap: 24px;
	}
}

@media only screen and (min-width: 1280px) {
	.scannable-cards > ul,
	ul.scannable-cards {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		column-gap: 24px;
		row-gap: 24px;
	}
}

/*
.scannable-cards ul.columns-2,
ul.scannable-cards.columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.scannable-cards ul.columns-3,
ul.scannable-cards.columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.scannable-cards ul.columns-4,
ul.scannable-cards.columns-4 {
	grid-template-columns: repeat(4, 1fr);
}
*/

.scannable-cards figure img {
	border-top-right-radius: 4px;
	border-top-left-radius: 4px;
}

/* Cards: Dashboard */

.dashboard {
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	column-gap: 8px;
	padding-top: unset;
	padding-right: 0;
	padding-bottom: unset;
	padding-left: 0;
}

.dashboard.columns-2 {
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
}

.dashboard.columns-3 {
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
}

.dashboard.columns-4 {
	-webkit-column-count: 4;
	-moz-column-count: 4;
	column-count: 4;
}

.dashboard > * {
	-webkit-column-break-inside: avoid; /* Chrome, Safari */
	page-break-inside: avoid;           /* Theoretically FF 20+ */
	break-inside: avoid-column;         /* IE 11 */
	margin-bottom: 8px;
}

/* Cards: Asymmetric grid */

.asymmetric-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 8px;
	row-gap: 24px;
	align-items: center;
	padding-top: 0;
	padding-bottom: 0;
}

/*--------------------------------------------------------------
# COMPONENTS X.X Chips
--------------------------------------------------------------*/

.scrollable-chips {
	height: 48px;
	overflow: hidden;
}

.scrollable-chips ul {
	display: flex;
	-ms-flex-wrap: nowrap !important;
	flex-wrap: nowrap !important;
	overflow-x: auto;
	overflow-y: hidden;
	padding-bottom: 3rem;
}

.scrollable-chips ul::-webkit-scrollbar {
	display: none;
}

/*--------------------------------------------------------------
# COMPONENTS X.X Chips: Action chips
--------------------------------------------------------------*/

.action-chip::before {
	display: block;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-feature-settings: "liga";
	-webkit-font-smoothing: antialiased;
	font-family: Material Icons;
	font-size: 24px;
	line-height: 1;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	font-feature-settings: "liga";
	text-transform: none;
	white-space: nowrap;
	word-wrap: normal;
	transition-duration: 0.3s;
	transition-property: background-color, border-color, color;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
	margin-right: 3px;
	margin-left: -8px;
	background-color: transparent;
	color: currentColor;
}

.action-chip::before {
	content: "done";
}

.action-chip::after {
	display: block;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-feature-settings: "liga";
	-webkit-font-smoothing: antialiased;
	font-family: Material Icons;
	font-size: 24px;
	line-height: 1;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	font-feature-settings: "liga";
	text-transform: none;
	vertical-align: middle;
	white-space: nowrap;
	word-wrap: normal;
	transition-duration: 0.3s;
	transition-property: background-color, border-color, color;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
	margin-right: -8px;
	margin-left: 3px;
	background-color: transparent;
	color: currentColor;
}

.action-chip::after {
	content: "cancel";
	color: currentColor;
}

/*--------------------------------------------------------------
# COMPONENTS X.X Chips: Choice chips (radio)
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# COMPONENTS X.X Chips: Filter chips (checkbox or radio)
--------------------------------------------------------------*/

a.filter-chip::before,
button.filter-chip::before,
.filter-chip input[type="checkbox"]:checked ~ label::before,
.filter-chip input[type="radio"]:checked ~ label::before {
	margin-left: -100%;
}

a.filter-chip.selected::before,
button.filter-chip.selected::before,
.filter-chip input[type="checkbox"]:checked ~ label::before,
.filter-chip input[type="radio"]:checked ~ label::before {
	display: block;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-feature-settings: "liga";
	-webkit-font-smoothing: antialiased;
	font-family: Material Icons;
	font-size: 24px;
	line-height: 1;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	font-feature-settings: "liga";
	text-transform: none;
	white-space: nowrap;
	word-wrap: normal;
	transition-duration: 0.3s;
	transition-property: background-color, border-color, color, margin-left;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
	margin-right: 3px;
	margin-left: -8px;
	background-color: transparent;
	content: "done";
	color: currentColor;
}

/*--------------------------------------------------------------
# COMPONENTS X.X Chips: Input chips
--------------------------------------------------------------*/

.input-chip::after {
	display: block;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-feature-settings: "liga";
	-webkit-font-smoothing: antialiased;
	font-family: Material Icons;
	font-size: 24px;
	line-height: 1;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	font-feature-settings: "liga";
	text-transform: none;
	vertical-align: middle;
	white-space: nowrap;
	word-wrap: normal;
	transition-duration: 0.3s;
	transition-property: background-color, border-color, color;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
	margin-right: -8px;
	margin-left: 3px;
}

.input-chip::after {
	content: "cancel";
	color: currentColor;
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Chips: Flat Chips
-----------------------------------------------------------------------------------------*/

ul.flat-chips,
ol.flat-chips {
	list-style: none;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 0;
	margin: 0;
}

div.flat-chip {
	position: relative;
	display: inline-flex !important;
}

.flat-chip input[type="checkbox"],
.flat-chip input[type="radio"],
.flat-chip input::after,
.flat-chip input::before {
	display: none !important;
}

.flat-chip label::after,
.flat-chip label::before {
	display: none !important;
}

a.flat-chip,
button.flat-chip,
.flat-chip input[type="checkbox"] ~ label,
.flat-chip input[type="radio"] ~ label {
	font-family: var(--chip-font-family);
	font-size: var(--chip-font-size, 14px) !important; /* .tag-cloud-link inline style */
	font-style: var(--chip-font-style);
	font-weight: var(--chip-font-weight, 400) !important; /* .woocommerce div.product form.cart .variations label */
	line-height: var(--chip-line-height, 1) !important; /* .woocommerce div.product form.cart .variations th */
	letter-spacing: var(--chip-letter-spacing);
	text-transform: var(--chip-text-transform);
	text-decoration: none !important; /* a */
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	text-decoration: none;
	text-align: center;
	white-space: nowrap;

	display: -ms-inline-flexbox;
	display: inline-flex !important;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;

	min-height: 32px !important; /* */
	height: 32px !important; /* */

	position: relative;
	padding: 0 12px !important; /* */
	margin: unset;
	margin-right: 8px;
	margin-bottom: 8px;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	cursor: pointer;
	border: 0;
	border-radius: 16px; /* shape */
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	-ms-transition: all .5s ease;
	transition: all .5s ease;
}

/* chip counter */

.chip .counter {
	margin-left: 8px;
	margin-right: -8px;
	min-width: 24px;
	height: 24px;
	padding-right: 4px;
	padding-left: 4px;
	background-color: #000; /* todo */
	color: #FFF; /* todo */
	border-radius: 16px;
	line-height: 24px;
}

/* Flat chip enabled state */

.flat-chips a,
.flat-chips button,
a.flat-chip,
button.flat-chip,
.flat-chip input[type="radio"] ~ label {
	background: rgba(var(--on-color),0.12);
	color: var(--primary-text-color);
}

/* Flat chip disabled state */

.flat-chips a.disabled,
.flat-chips a:disabled,
.flat-chips button.disabled,
.flat-chips button:disabled,
a.flat-chip.disabled,
a.flat-chip:disabled,
button.flat-chip.disabled,
button.flat-chip:disabled,
.flat-chip input[type="radio"].disabled ~ label,
.flat-chip input[type="radio"]:disabled ~ label {
	background: rgba(var(--on-color),0.06) !important; /* :hover */
	color: var(--tertiary-text-color) !important; /* :hover */
	cursor: default;
}

/* Flat chip hover state */

.flat-chips a.hover,
.flat-chips a:hover,
.flat-chips button.hover,
.flat-chips button:hover,
a.flat-chip.hover,
a.flat-chip:hover,
button.flat-chip.hover,
button.flat-chip:hover,
.flat-chip input[type="radio"] ~ label.hover,
.flat-chip input[type="radio"] ~ label:hover {
	background: rgba(var(--on-color),0.08);
	color: var(--primary-text-color);
}

/* Flat chip focus state */

.flat-chips a.focus,
.flat-chips a:focus,
.flat-chips button.focus,
.flat-chips button:focus,
a.flat-chip.focus,
a.flat-chip:focus,
button.flat-chip.focus,
button.flat-chip:focus,
.flat-chip input[type="radio"] ~ label.focus,
.flat-chip input[type="radio"] ~ label:focus {
	background: rgba(var(--on-color),0.24);
	color: var(--primary-text-color);
}

/* Flat chip selected state */

.flat-chips a.selected,
.flat-chips button.selected,
a.flat-chip.selected,
button.flat-chip.selected,
.flat-chip input[type="radio"].checked ~ label,
.flat-chip input[type="radio"]:checked ~ label {
	background: rgba(var(--theme-primary-color),1.00);
	color: var(--primary-text-color);
}

/* Flat chip activated state? */

.flat-chips a.active,
.flat-chips a:active,
.flat-chips button.active,
.flat-chips button:active,
a.flat-chip.active,
a.flat-chip:active,
button.flat-chip.active,
button.flat-chip:active,
.flat-chip input[type="radio"] ~ label.active,
.flat-chip input[type="radio"] ~ label:active {
	box-shadow: var(--shadow-12) !important; /* todo check elevation level */
}

/* Flat chip pressed state */

.flat-chips a.pressed,
.flat-chips button.pressed,
a.flat-chip.pressed,
button.flat-chip.pressed,
.flat-chip input[type="radio"] ~ label.pressed {
	background: rgba(var(--theme-primary-color),0.24);
	box-shadow: var(--shadow-04); /* todo check elevation level */
	color: var(--primary-text-color);
}

.flat-chips a.waves-effect .waves-ripple,
.flat-chips button.waves-effect .waves-ripple,
a.flat-chip.waves-effect .waves-ripple,
button.flat-chip.waves-effect .waves-ripple,
.flat-chip input[type="radio"] ~ label.waves-effect .waves-ripple {
	background: rgba(var(--theme-primary-color),0.24);
}


/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Chips: Outlined Chips
-----------------------------------------------------------------------------------------*/

ul.outlined-chips,
ol.outlined-chips {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
	margin: 0;
}

div.outlined-chip {
	position: relative;
	display: inline-flex !important;
}

.outlined-chip input,
.outlined-chip input::after,
.outlined-chip input::before {
	display: none;
}

.outlined-chip label::after,
.outlined-chip label::before {
	display: none;
}

a.outlined-chip,
button.outlined-chip,
.outlined-chip input[type="radio"] ~ label {
	font-family: var(--chip-font-family);
	font-size: var(--chip-font-size, 14px) !important; /* .tag-cloud-link inline style */
	font-style: var(--chip-font-style);
	font-weight: var(--chip-font-weight, 400) !important; /* .woocommerce div.product form.cart .variations label */
	line-height: var(--chip-line-height, 1) !important; /* .woocommerce div.product form.cart .variations th */
	letter-spacing: var(--chip-letter-spacing);
	text-transform: var(--chip-text-transform);
	text-decoration: none !important; /* a */
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	text-decoration: none;
	text-align: center;
	white-space: nowrap;
	display: -ms-inline-flexbox;
	display: inline-flex !important;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	height: 32px;
	position: relative;
	padding: 0 12px;
	margin: unset;
	margin-right: 8px;
	margin-bottom: 8px;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	cursor: pointer;
	border: 0;
	border-radius: 16px; /* shape */
	transition: all 15ms var(--acceleration-curve);
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	-ms-transition: all .5s ease;
	transition: all .5s ease;
}

/* chip counter */

.chip .counter {
	margin-left: 8px;
	margin-right: -8px;
	min-width: 24px;
	height: 24px;
	padding-right: 4px;
	padding-left: 4px;
	background-color: #000; /* */
	color: #FFF; /* */
	border-radius: 16px;
	line-height: 24px;
}

/* Outlined chip enabled state */

.outlined-chips a,
.outlined-chips button,
a.outlined-chip,
button.outlined-chip,
.outlined-chip input[type="checkbox"] ~ label,
.outlined-chip input[type="radio"] ~ label {
	background: transparent;
	color: var(--secondary-text-color);
	border: 1px solid currentColor;
}

/* Outlined chip disabled state */

.outlined-chips a.disabled,
.outlined-chips a:disabled,
.outlined-chips button.disabled,
.outlined-chips button:disabled,
a.outlined-chip.disabled,
a.outlined-chip:disabled,
button.outlined-chip.disabled,
button.outlined-chip:disabled,
.outlined-chip input[type="checkbox"].disabled ~ label,
.outlined-chip input[type="radio"].disabled ~ label,
.outlined-chip input[type="checkbox"]:disabled ~ label,
.outlined-chip input[type="radio"]:disabled ~ label {
	background: transparent !important; /* :hover */
	color: var(--tertiary-text-color) !important; /* :hover */
	cursor: default;
}

/* Outlined chip hover state */

.outlined-chips a.hover,
.outlined-chips a:hover,
.outlined-chips button.hover,
.outlined-chips button:hover,
a.outlined-chip.hover,
a.outlined-chip:hover,
button.outlined-chip.hover,
button.outlined-chip:hover,
.outlined-chip input[type="checkbox"] ~ label.hover,
.outlined-chip input[type="radio"] ~ label.hover,
.outlined-chip input[type="checkbox"] ~ label:hover,
.outlined-chip input[type="radio"] ~ label:hover {
	background: rgba(var(--on-color),var(--hover-overlay-opacity));
	color: var(--primary-text-color);
}

/* Outlined chip focus state */

.outlined-chips a.focus,
.outlined-chips a:focus,
.outlined-chips button.focus,
.outlined-chips button:focus,
a.outlined-chip.focus,
a.outlined-chip:focus,
button.outlined-chip.focus,
button.outlined-chip:focus,
.outlined-chip input[type="checkbox"] ~ label.focus,
.outlined-chip input[type="radio"] ~ label.focus,
.outlined-chip input[type="checkbox"] ~ label:focus,
.outlined-chip input[type="radio"] ~ label:focus {
	background: rgba(var(--on-color),var(--focus-overlay-opacity));
	color: var(--primary-text-color);
}

/* Chip (outlined) selected state */

.outlined-chips a.selected,
.outlined-chips button.selected,
a.outlined-chip.selected,
button.outlined-chip.selected {
	background: rgba(var(--theme-primary-color),var(--selected-overlay-opacity));
	color: rgb(var(--theme-primary-color));
}

/* Outlined chip activated state */

/*
BUG !!!

.outlined-chip input[type="checkbox"]:checked ~ label:active,
.outlined-chip input[type="radio"]:checked ~ label:active {
	background: rgba(var(--theme-primary-color, var(--activated-overlay-opacity));
	color: rgb(var(--theme-primary-color));
}
*/

/* Outlined chip pressed state */

.outlined-chips a.active,
.outlined-chips a:active,
.outlined-chips button.active,
.outlined-chips button:active,
a.outlined-chip.active,
a.outlined-chip:active,
button.outlined-chip.active,
button.outlined-chip:active,
.outlined-chip input[type="checkbox"]:checked ~ label:active,
.outlined-chip input[type="radio"]:checked ~ label:active {
	background: transparent;
	box-shadow: var(--shadow-04); /* todo check elevation level */
	color: var(--primary-text-color);
}

.outlined-chips a.pressed,
.outlined-chips button.pressed,
a.outlined-chip.pressed,
button.outlined-chip.pressed,
.outlined-chip input[type="checkbox"] ~ label.pressed,
.outlined-chip input[type="radio"] ~ label.pressed {
	background: rgba(var(--theme-primary-color),var(--pressed-overlay-opacity));
	box-shadow: var(--shadow-04); /* todo check elevation level */
	color: var(--primary-text-color);
}

.outlined-chips a.waves-effect .waves-ripple,
.outlined-chips button.waves-effect .waves-ripple,
a.outlined-chip.waves-effect .waves-ripple,
button.outlined-chip.waves-effect .waves-ripple,
.outlined-chip input[type="checkbox"] ~ label.waves-effect .waves-ripple,
.outlined-chip input[type="radio"] ~ label.waves-effect .waves-ripple {
	background: rgba(var(--theme-primary-color),var(--pressed-overlay-opacity));
}


/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Sheets
-----------------------------------------------------------------------------------------*/

.sheet {
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;

	z-index: 160;
	overflow-y: auto;
	background-color: var(--backdrop-background-color, rgba(0,0,0,0.32));
}

.sheet.show,
.sheet.open /* YITH */ {
	display: block;
	visibility: visible; /* YITH */
	opacity: 1; /* YITH */
}

@media (max-width: 599px) {
	.sheet {
		width: calc( 100% ) !important;
		max-width: calc( 100% ) !important;
	}
}


:root {
	--sheet-content-margin: 16px;
}

@media (min-width: 600px) {
	:root {
		--sheet-content-margin: 16px;
	}
}

.sheet .content {
	border-right: var(--sheet-content-margin) solid rgb(246, 36, 89, 0.1) !important;
	border-left: var(--sheet-content-margin) solid rgba(246, 36, 89, 0.1) !important;
	/*
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	position: fixed;
	top: 0;
	right: auto;
	bottom: 0;
	left: 0;
	*/
	/* width: var(--sidenav-width); */
}

@media only screen and (max-width: 599px) {
	.sheet .content {
		max-width: calc( 100% - var(--app-bar-height) );
	}
}

/*--------------------------------------------------------------
# 2.31.X <header> Sheet header
--------------------------------------------------------------*/

.sheet .content header {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	flex: 0 0 auto;
	flex-direction: row;
	min-height: var(--app-bar-height);
}

.sheet .content header > * {
	margin: unset;
	padding: unset;
}

.sheet .content header > .wp-block-cover {
	margin-right: -16px;
	margin-left: -16px;
	width: calc( 100% + 16px + 16px );
}

.sheet[class*="modal-navdrawer"] .content header {
	min-height: var(--app-bar-height);
}

.sheet[class*="modal-side-sheet"] .content header {
	height: var(--app-bar-height);
}

.sheet[class*="bottom-navigation-drawer"] .content header {
	height: 56px;
}





.navdrawer-header.aspect-ratio {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.navdrawer-header.aspect-ratio :first-child {
	order: 1;
}

.navdrawer-header.aspect-ratio :last-child {
	order: 2;
}


/*--------------------------------------------------------------
# 5.55.X <Section> Side sheet (Persistent clipped)
--------------------------------------------------------------*/

.sheet[class*="persistent-clipped-side-sheet"] {
	position: absolute;
	top: var(--app-bar-height, 56px);
	right: 0;
	bottom: 0;
	left: auto;
	width: calc( var(--side-sheet-width, 400px) );
	max-width: calc( var(--side-sheet-width, 400px) );
	z-index: 103; /* app-bar-top 104 */
	overflow: hidden;
	background: transparent;
}

.sheet[class*="persistent-clipped-side-sheet"] .content {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: auto;
	width: calc( var(--side-sheet-width, 320px) );
	max-width: calc( var(--side-sheet-width, 320px) );
	box-shadow: none;
	border-left: 1px solid var(--quaternary-text-color);
}

.sheet[class*="persistent-clipped-side-sheet"]:not(.show) .content {
	transform: translateX( 100% ) !important;
	transition-duration: 0.225s; /* PERSISTENT OUT */
	transition-timing-function: linear; /* PERSISTENT OUT */
	transition-property: transform;
}

.sheet[class*="persistent-clipped-side-sheet"].show .content {
	transform: translateX( 0 ) !important;
	transition-duration: 0.225s; /* PERSISTENT IN */
	transition-timing-function: linear; /* PERSISTENT IN */
	transition-property: transform;
}

/*--------------------------------------------------------------
# 5.55.X <Section> Side sheet (Modal)
--------------------------------------------------------------*/

.sheet[class*="modal-side-sheet"] {
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 160;
	overflow-y: auto;
	background-color: var(--backdrop-background-color, rgba(0,0,0,0.32));
}

.sheet[class*="modal-side-sheet"] .content {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	position: absolute;
	top: 0;
	right: 0;
	bottom: auto;
	left: auto;
	padding: 0;
	width: var(--side-sheet-width);
	max-width: calc( 100% - var(--app-bar-height) );
	min-height: 100%;
	box-shadow: var(--shadow-16);
}

/* States */

/* Closed */

.sheet[class*="modal-side-sheet"] .content {
	transform: translate3d(100%,0,0);
	transition-duration: 0.225s; /* PERSISTENT OUT */
	transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1); /* PERSISTENT OUT */
	transition-property: transform;
}

/* Open */

.sheet[class*="modal-side-sheet"].show .content {
	transform: translate3d(0,0,0);
	transition-duration: 0.225s; /* PERSISTENT IN */
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1); /* PERSISTENT IN */
	transition-property: transform;
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Tabs
-----------------------------------------------------------------------------------------*/

.nav-tabs-scrollable ul,
.nav-tabs {
	list-style: none;
	position: relative;
	display: flex;
	order: 1;
	padding: 0;
	margin: unset;
	box-shadow: inset 0 -2px 0 -1px var(--quaternary-text-color);
	z-index: 40;
}

.nav-tabs-scrollable {
	position: relative;
	height: 48px;
	overflow: hidden;
}

.nav-tabs-scrollable .nav-tabs,
.nav-tabs-scrollable ul {
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
	padding-bottom: 3rem;
	padding-left: calc( 80px - 12px );
}

.nav-tabs-scrollable .nav-tabs::-webkit-scrollbar,
.nav-tabs-scrollable ul::-webkit-scrollbar {
	display: none;
}

.nav-tabs-scrollable .nav-tabs-material .nav-tabs-indicator {
	bottom: 3rem;
}

ul.fixed-tabs .nav-item,
ul.nav-justified .nav-item {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	text-align: center;
}

ul.fixed-tabs.align-center {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	align-items: center;
	justify-content: center;
}

.nav-tabs-scrollable ul,
.nav-tabs ul {
	display: flex;
	flex-direction: row;
	/* padding: unset; */
}

.nav-tabs-scrollable li,
.nav-tabs li {
	/* min-width: 90px; BUG TODO */
	max-width: 360px;
}

.nav-tabs-scrollable li a::before,
.nav-tabs li a::before,
.nav-tabs li .nav-link::before {
	background-color: var(--primary-text-color);
	background-color: #ff4081;
	content: "";
	display: block;
	height: 2px;
	opacity: 0;
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	transition-duration: 0.3s;
	transition-property: opacity;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
}

.nav-tabs-scrollable li a.active::before,
.nav-tabs li a.active::before,
.nav-tabs li .nav-link.active::before {
	opacity: 1;
}

.nav-tabs-scrollable li a,
.nav-tabs li a,
.nav-tabs li .nav-link {
	font-family: Roboto, sans-serif;
	font-size: .875rem;
	line-height: 2.25rem;
	font-weight: 500;
	letter-spacing: .0892857143em;
	text-transform: uppercase;
	text-align: center;
	white-space: nowrap;
	cursor: pointer;
	position: relative;
	display: block;
	line-height: 1;
	height: 48px; /* new */
	min-height: 3rem;
	padding-right: 0.75rem;
	padding-left: 0.75rem;
	padding-top: 1.0625rem;
	padding-bottom: 1.0625rem;
	text-transform: uppercase;
	transition-duration: .3s;
	transition-property: background-color, color, opacity;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
	word-break: keep-all; /* new */
}

/* States */


/* Tabs States */

.nav-tabs > li > a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

.nav-tabs > li > a {
	background: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color);
}

/* Hover */

.nav-tabs > li > a.hover,
.nav-tabs > li > a:hover {
	background: rgba(var(--on-color),var(--hover-overlay-opacity));
	color: var(--primary-text-color);
}

/* Focus */

.nav-tabs > li > a.focus,
.nav-tabs > li > a:focus {
	background: rgba(var(--on-color),var(--focus-overlay-opacity));
	color: var(--primary-text-color);
}

/* Selected */

.nav-tabs > li > a.selected {
	background: rgba(var(--on-color),var(--selected-overlay-opacity));
	color: var(--primary-text-color);
}

/* Activated */

.nav-tabs > li > a.active,
.nav-tabs > li > a.activated,
.nav-tabs > li > a:active {
	background: rgba(var(--on-color),var(--activated-overlay-opacity));
	color: var(--primary-text-color);
}

/* Pressed */

.nav-tabs > li > a.pressed,
.nav-tabs > li > a.waves-effect .waves-ripple {
	background: rgba(var(--on-color),var(--pressed-overlay-opacity));
	color: var(--primary-text-color);
}

/* Dragged */

.nav-tabs > li > a.dragged {
	background: rgba(var(--on-color),var(--dragged-overlay-opacity));
	color: var(--primary-text-color);
}

/* Activated Hover */

.nav-tabs > li > a.active:hover,
.nav-tabs > li > a:active:hover {
	/* background-color: var(--activated-hover-overlay, --hover-overlay); */
	color: var(--primary-text-color);
}

/* Activated Focus */

.nav-tabs > li > a.active:focus,
.nav-tabs > li > a:active:focus {
	/* background-color: var(--activated-focus-overlay, --focus-overlay); */
	color: var(--primary-text-color);
}

/* Activated Pressed */

.nav-tabs > li > a.active.pressed,
.nav-tabs > li > a:active.pressed {
	/* background-color: var(--activated-pressed-overlay, --pressed-overlay); */
	color: var(--primary-text-color);
}

/* Tabs indicator */

.nav-tabs-material {
	position: relative;
}

.nav-tabs-material.animate a::before,
.nav-tabs-material.animate .nav-link::before {
	opacity: 0;
}

.nav-tabs-material .nav-tabs-indicator {
	background-color: #ff4081; /* todo */
	height: 0.125rem;
	position: absolute;
	bottom: 0;
}

.nav-tabs-material.animate .nav-tabs-indicator {
	transition-duration: 0.3s;
	transition-property: left, right;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

@media (min-width: 576px) {
	.nav-tabs-material.animate .nav-tabs-indicator {
		transition-duration: 0.39s;
	}
}

@media (min-width: 992px) {
	.nav-tabs-material.animate .nav-tabs-indicator {
		transition-duration: 0.2s;
	}
}

@media screen and (prefers-reduced-motion: reduce) {
	.nav-tabs-material.animate .nav-tabs-indicator {
		transition: none;
	}
}

.nav-tabs-material a::before,
.nav-tabs-material .nav-link::before {
	transition: none;
}

.nav-tabs-material .nav-tabs-indicator {
	background-color: #ff4081; /* todo color tab-indicator default secondary-color */
	display: none;
	height: 0.125rem;
	position: absolute;
	bottom: 0;
}

.nav-tabs-material .nav-tabs-indicator.show {
	display: block;
}

/* Tab pane */

.tab-content > .tab-pane {
	display: none;
}

.tab-content > .active {
	display: block;
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Lists
-----------------------------------------------------------------------------------------*/

[class*="line-list"] .caption,
[class*="line-list"] .overline {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}


ul[class*="line-list"] {
	font-family: var(--subtitle-1-font-family);
	font-size: var(--subtitle-1-font-size);
	font-style: var(--subtitle-1-font-style);
	font-weight: var(--subtitle-1-font-weight);
	line-height: var(--subtitle-1-line-height);
	text-align: var(--subtitle-1-text-align);
	letter-spacing: var(--subtitle-1-letter-spacing);
	text-transform: var(--subtitle-1-text-transform);
	color: var(--primary-text-color);
}

ul[class*="line-list"] {
	display: flex;
	flex-direction: column;
	margin: 0; /* reset */
	padding: 0; /* reset */
	list-style: none; /* reset */
	padding-top: 8px;
	padding-bottom: 8px;
}

/* Submenu */

[class*="line-list"] ul {
	width: 100%;
	margin: 0; /* reset */
	padding: 0; /* reset */
	list-style: none; /* reset */
	padding-top: 8px;
	padding-bottom: 8px;
}

/* Lists listitem */ 

[class*="line-list"] li {
	display: flex;
	align-items: center;
	min-height: 48px;
	margin: 0; /* reset */
	padding: 0; /* reset */
}

[class*="line-list"] li[class*="has-child"] { /* .has-child / .menu-item-has-children */
	background: yellow;
	display: flex;
	flex-direction: column;
}

[class*="line-list"].has-16by9-images li {
	margin-left: -16px;
	width: calc( 100% + 16px );
}

/* LIST item dividers */

[class*="line-list"].has-inset-dividers li:not(:first-child):not(.no-border)::after {
	content: ""; /* ::after and ::after both require content */
	position: absolute;
	top: 0;
	left: calc( 72px - 16px ); /* TODO RESPONSIVE */
	width: 100%;
	height: 1px;
	background-color: var(--quaternary-text-color);
	z-index: 1;
}

.three-line-list.has-inset-dividers.has-16by9-images li:not(:first-child)::after {
	left: calc( 100px ); /* image width + image margin-right */
}

/* Lists link */ 

[class*="line-list"] li > a {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	min-height: 48px;
}

[class*="two-line-list"] li a {
	min-height: 64px;
}

[class*="two-line-list"][class*="has-"] li a {
	align-items: flex-start;
	padding-top: 16px;
	min-height: 72px;
}

[class*="three-line-list"] li a {
	min-height: 88px;
}

[class*="three-line-list"] li a {
	align-items: flex-start;
	padding-top: 16px;
}



/* Lists States */

[class*="line-list"] li > a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

[class*="line-list"] li > a {
	background: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--primary-text-color);
}

/* Hover */

[class*="line-list"] li > a.hover,
[class*="line-list"] li > a:hover {
	background: rgba(var(--on-color),var(--hover-overlay-opacity));
	color: var(--primary-text-color);
}

/* Focus */

[class*="line-list"] li > a.focus,
[class*="line-list"] li > a:focus {
	background: rgba(var(--on-color),var(--focus-overlay-opacity));
	color: var(--primary-text-color);
}

/* Selected */

[class*="line-list"] li > a.selected,
[class*="line-list"] li.current-menu-item > a {
	background: rgba(var(--on-color),var(--selected-overlay-opacity));
	color: var(--primary-text-color);
}

/* Activated */

[class*="line-list"] li a.active,
[class*="line-list"] li a.activated,
[class*="line-list"] li a:active {
	background: rgba(var(--on-color),var(--activated-overlay-opacity));
	color: rgb(var(--theme-primary-color));
	font-weight: bold;
}

/* Pressed */

[class*="line-list"] li a.pressed,
[class*="line-list"] li a.waves-effect .waves-ripple {
	background: rgba(var(--on-color),var(--pressed-overlay-opacity));
	color: var(--primary-text-color);
}

/* Dragged */

[class*="line-list"] li a.dragged {
	background: rgba(var(--on-color),var(--dragged-overlay-opacity));
	color: var(--primary-text-color);
}

/* Lists figure */

[class*="line-list"] figure {
	display: flex;
	flex-direction: row;
	flex-shrink: 0;
	align-items: center;
	margin-top: 8px;
	margin-right: 16px;
	margin-bottom: 8px;
	margin-left: unset;
}

[class*="line-list"] figure {
	width: 40px;
	height: 40px;
}

.two-line-list figure {
	margin-top: 0;
	margin-bottom: 0;
}

.three-line-list figure {
	margin-top: 0;
	margin-bottom: 0;
}

/* has-icons */

[class*="line-list"].has-icons figure {
	width: 24px;
	height: 24px;
	margin-right: 32px;
}

.single-line-list.has-icons figure {
	margin-top: 16px;
	margin-bottom: 16px;
}

.two-line-list.has-icons figure {

}

/* has-avatars */

[class*="line-list"].has-avatars figure {
	width: 40px;
	height: 40px;
	border-radius: 50%;
}

/* has-images */

.single-line-list.has-images figure {
	width: 56px;
	height: 56px;
	margin-top: 8px;
	margin-right: 16px;
	margin-bottom: 8px;
}

.single-line-list.has-images figure {
	margin-bottom: 16px;
}

.three-line-list.has-images figure {
	width: 40px;
	height: 40px;
	margin-top: 16px;
	margin-right: 16px;
	margin-bottom: 16px;
}

.three-line-list.has-images figure {
	width: 40px;
	height: 40px;
	margin-top: 0px;
	margin-right: 16px;
	margin-bottom: 16px;
}

/* has-16by9-images */

[class*="line-list"].has-16by9-images figure {
	width: 100px;
	height: 56px;
	margin-top: 0px;
	margin-right: 16px;
	margin-bottom: 8px;
	margin-left: -16px;
}

.two-line-list.has-16by9-images figure {
	margin-top: -8px;
}

.three-line-list.has-16by9-images figure {
	margin-top: 0px;
	margin-right: 20px;
	margin-bottom: 16px;
}

/* Text wrapper */

.two-line-list.has-icons span:first-child {
	margin-top: -4px;
}

.three-line-list span:first-child {
margin-top: -3px;
}

.three-line-list:not(.has-icons):not(.has-avatars):not(.has-images):not(.has-16by9-images) span:first-child {
	margin-top: 0;
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Selection controls
-----------------------------------------------------------------------------------------*/

:not([class~=chip]) > input[type="checkbox"],
:not([class~=chip]) > input[type="radio"] {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	vertical-align: middle;
	width: 48px;
	height: 48px;
	outline: none;
	border: none;
	cursor: pointer;
	outline: 0;
	border-radius: 50%;
	padding: unset; /* Remove the padding in IE 10. */
	margin: unset; /* important */
	box-sizing: border-box; /* Add the correct box sizing in IE 10. */
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
}

:not([class~=chip]) > input[type="checkbox"]::before,
:not([class~=chip]) > input[type="radio"]::before {
	content: ""; 
	background-color: transparent;
	border-radius: 50%;
	display: block;
	margin-top: -0.875rem; /* (($font-size-base * $line-height-base - $selection-control-indicator-size) / 2 + $selection-control-indicator-size / -2); */
	margin-left: -0.75rem; /* ($selection-control-indicator-size / -2); */
	position: absolute;
	top: 14px; /* (($font-size-base * $line-height-base - $selection-control-indicator-size) / 2); */
	left: 0;
	-webkit-transform: scale(0.87) translateZ(0);
	transform: scale(0.87) translateZ(0);
	width: 48px; /* ($selection-control-indicator-size * 2); */
	height: 48px;
	transition-duration: 0.3s;
	transition-property: background-color,-webkit-transform;
	transition-property: background-color,transform;
	transition-property: background-color,transform,-webkit-transform;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
}

:not([class~=chip]) > input[type="checkbox"]::after,
:not([class~=chip]) > input[type="radio"]::after {
	content: ""; 
	position: relative;
	display: block;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-feature-settings: "liga";
	-webkit-font-smoothing: antialiased;
	font-family: Material Icons;
	font-size: 24px;
	line-height: 48px;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	font-feature-settings: "liga";
	text-transform: none;
	vertical-align: middle;
	white-space: nowrap;
	word-wrap: normal;
	transition-duration: 0.3s;
	transition-property: background-color, border-color, color;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
}

/* States */

/* Unchecked */

:not([class~=chip]) > input[type="checkbox"]::after,
:not([class~=chip]) > input[type="radio"]::after {
	color: var(--secondary-text-color);
}

/* Unchecked Hover */

:not([class~=chip]) > input[type="checkbox"].hover::after,
:not([class~=chip]) > input[type="radio"].hover::after,
:not([class~=chip]) > input[type="checkbox"]:hover::after,
:not([class~=chip]) > input[type="radio"]:hover::after {
	color: var(--primary-text-color);
}

:not([class~=chip]) > input[type="checkbox"].hover::before,
:not([class~=chip]) > input[type="radio"].hover::before,
:not([class~=chip]) > input[type="checkbox"]:hover::before,
:not([class~=chip]) > input[type="radio"]:hover::before {
	background: rgba(var(--on-color),var(--hover-overlay-opacity));
	transform: scale(1, 1) translateZ(0);
}

/* Unchecked Focus */

:not([class~=chip]) > input[type="checkbox"].focus::after,
:not([class~=chip]) > input[type="radio"].focus::after,
:not([class~=chip]) > input[type="checkbox"]:focus::after,
:not([class~=chip]) > input[type="radio"]:focus::after {
	color: var(--primary-text-color);
}

:not([class~=chip]) > input[type="checkbox"].focus::before,
:not([class~=chip]) > input[type="radio"].focus::before,
:not([class~=chip]) > input[type="checkbox"]:focus::before,
:not([class~=chip]) > input[type="radio"]:focus::before {
	background: rgba(var(--on-color),var(--focus-overlay-opacity));
	transform: scale(1, 1) translateZ(0);
}

/* Unchecked Pressed */

:not([class~=chip]) > input[type="checkbox"].pressed::before,
:not([class~=chip]) > input[type="radio"].pressed::before {
		background: rgba(var(--on-color),var(--pressed-overlay-opacity));
	transform: scale(1, 1) translateZ(0);
}

/* Unchecked Disabled */

:not([class~=chip]) > input[type="checkbox"].disabled,
:not([class~=chip]) > input[type="radio"].disabled,
:not([class~=chip]) > input[type="checkbox"]:disabled,
:not([class~=chip]) > input[type="radio"]:disabled,
:not([class~=chip]) > input[type="checkbox"].disabled::after,
:not([class~=chip]) > input[type="radio"].disabled::after,
:not([class~=chip]) > input[type="checkbox"]:disabled::after,
:not([class~=chip]) > input[type="radio"]:disabled::after,
:not([class~=chip]) > input[type="checkbox"].disabled ~ label,
:not([class~=chip]) > input[type="radio"].disabled ~ label,
:not([class~=chip]) > input[type="checkbox"]:disabled ~ label,
:not([class~=chip]) > input[type="radio"]:disabled ~ label {
	color: var(--tertiary-text-color) !important;
	cursor: default;
}

:not([class~=chip]) > input[type="checkbox"].disabled::before,
:not([class~=chip]) > input[type="radio"].disabled::before,
:not([class~=chip]) > input[type="checkbox"]:disabled::before,
:not([class~=chip]) > input[type="radio"]:disabled::before {
	background: transparent;
}

/* Checked */

:not([class~=chip]) > input[type="checkbox"]:checked::after,
:not([class~=chip]) > input[type="radio"]:checked::after {
	color: rgba(var(--theme-secondary-color));
}

/* Checked Hover */

:not([class~=chip]) > input[type="checkbox"]:checked.hover::before,
:not([class~=chip]) > input[type="radio"]:checked.hover::before,
:not([class~=chip]) > input[type="checkbox"]:checked:hover::before,
:not([class~=chip]) > input[type="radio"]:checked:hover::before {
	background: rgba(var(--theme-secondary-color),var(--hover-overlay-opacity));
	transform: scale(1, 1) translateZ(0);
}

/* Checked Focus */

:not([class~=chip]) > input[type="checkbox"]:checked.focus::before,
:not([class~=chip]) > input[type="radio"]:checked.focus::before,
:not([class~=chip]) > input[type="checkbox"]:checked:focus::before,
:not([class~=chip]) > input[type="radio"]:checked:focus::before {
	background: rgba(var(--theme-secondary-color),var(--focus-overlay-opacity));
	transform: scale(1, 1) translateZ(0);
}

/* Checked Pressed */

:not([class~=chip]) > input[type="checkbox"]:checked.pressed::before,
:not([class~=chip]) > input[type="radio"]:checked.pressed::before {
	background: rgba(var(--theme-secondary-color),var(--pressed-overlay-opacity));
	transform: scale(1, 1) translateZ(0);
}

/* Checked Disabled */

:not([class~=chip]) > input[type="checkbox"]:checked.disabled,
:not([class~=chip]) > input[type="radio"]:checked.disabled,
:not([class~=chip]) > input[type="checkbox"]:checked:disabled,
:not([class~=chip]) > input[type="radio"]:checked:disabled,
:not([class~=chip]) > input[type="checkbox"]:checked.disabled::after,
:not([class~=chip]) > input[type="radio"]:checked.disabled::after,
:not([class~=chip]) > input[type="checkbox"]:checked:disabled::after,
:not([class~=chip]) > input[type="radio"]:checked:disabled::after,
:not([class~=chip]) > input[type="checkbox"]:checked.disabled ~ label,
:not([class~=chip]) > input[type="radio"]:checked.disabled ~ label,
:not([class~=chip]) > input[type="checkbox"]:checked:disabled ~ label,
:not([class~=chip]) > input[type="radio"]:checked:disabled ~ label {
	color: var(--tertiary-text-color) !important;
	cursor: default;
}

:not([class~=chip]) > input[type="checkbox"]:checked.disabled::before,
:not([class~=chip]) > input[type="radio"]:checked.disabled::before,
:not([class~=chip]) > input[type="checkbox"]:checked:disabled::before,
:not([class~=chip]) > input[type="radio"]:checked:disabled::before {
	background: transparent;
}

/* Checkbox label */

:not([class~=chip]) > input[type="checkbox"] ~ label,
:not([class~=chip]) > input[type="radio"] ~ label {
	line-height: 1.2; /* important */
	min-height: 48px;
	padding-top: 14px;
	padding-left: calc( 48px + 8px );
	display: inline-flex;
	vertical-align: middle;
	cursor: pointer;
}

/* States */

/* Unchecked */

:not([class~=chip]) > input[type="checkbox"] ~ label,
:not([class~=chip]) > input[type="radio"] ~ label {
	color: var(--primary-text-color);
}

/* Unchecked Hover */

:not([class~=chip]) > input[type="checkbox"]:hover ~ label,
:not([class~=chip]) > input[type="radio"]:hover ~ label {
	color: var(--primary-text-color);
}

/* Checked */

:not([class~=chip]) > input[type="checkbox"]:checked ~ label,
:not([class~=chip]) > input[type="radio"]:checked ~ label {
	color: var(--primary-text-color);
}

/* Checked Hover */

:not([class~=chip]) > input[type="checkbox"]:checked:hover ~ label,
:not([class~=chip]) > input[type="radio"]:checked:hover ~ label {
	color: var(--primary-text-color);
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Selection controls: Checkbox
-----------------------------------------------------------------------------------------*/

/* Unchecked Checkbox */

:not([class~=chip]) > input[type="checkbox"]::after {
	content: "check_box_outline_blank";
}
/* Checked Checkbox */

:not([class~=chip]) > input[type="checkbox"]:checked::after {
	content: "check_box";
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Selection controls: Radio
-----------------------------------------------------------------------------------------*/

/* Unchecked Radio */

:not([class~=chip]) > input[type="radio"]::after {
	content: "radio_button_unchecked";
}

/* Checked Radio */

:not([class~=chip]) > input[type="radio"]:checked::after {
	content: "radio_button_checked";
}

/*--------------------------------------------------------------
## 2.36.X input[type="checkbox"] Styled as Switch
--------------------------------------------------------------*/

.custom-switch {
	display: flex;
	align-items: center;
	position: relative;
	padding-left: 3.5rem /* 3.75rem */;
	min-height: 48px;
	margin-bottom: 8px;
}

.custom-switch input[type="checkbox"],
.custom-switch input[type="radio"] {
	position: absolute;
	box-sizing: border-box;
	padding: 0;
	opacity: 0;
	z-index: -1;
	width: 68px;
	height: 48px;
}

/* Track */

.custom-switch .track {
	display: block;
	position: absolute;
	top: 16px /* -0.125rem */;
	left: 2px;
	border: 0.25rem solid transparent;
	box-sizing: border-box;
	border-radius: 1rem;
	content: "";
	height: 14px /* 1.5rem */;
	width: 32px !important;
	transition-duration: 0.3s;
	transition-property: background-color;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
}

/* States */

/* Off */

.custom-switch .track {
	background-color: rgba(var(--contrast),0.38);
}

/* Off Hover */


/* Off Focus */


/* Off Pressed */


/* Off Disabled */

.custom-switch input:checked:disabled ~ .track {
	background-color: rgba(var(--contrast),0.16);
}

/* On */

.custom-switch input:checked ~ .track {
	background-color: rgba(var(--theme-primary-color),0.38);
}

/* On Hover */


/* On Focus */


/* On Pressed */


/* On Disabled */

.custom-switch input:checked:disabled ~ .track {
	background-color: rgba(var(--theme-primary-color),0.16);
}

/* Thumb */

.custom-switch label::after {
	display: block;
	position: absolute;
	top: 13px; /* top: (($font-size-base * $line-height-base - $selection-control-indicator-size) / 2); */
	left: 2px;
	border-radius: 50%;
	box-shadow: var(--shadow-01);
	content: "";
	width: 20px /* 1.5rem */;
	height: 20px /* 1.5rem */;
	transition-duration: 0.3s;
	transition-property: background-color,-webkit-transform;
	transition-property: background-color,transform;
	transition-property: background-color,transform,-webkit-transform;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
}

/* States */

/* Off */

.custom-switch input ~ label::after {
	background: var(--elevation-level-01-overlay);
}

/* Off Hover */


/* Off Focus */


/* Off Pressed */


/* Off Disabled */

.custom-switch input:disabled ~ label::after {
	background-color: rgba(var(--theme-surface-color),var(--disabled-opacity)); /* TODO */
}

/* On */

.custom-switch input:checked ~ label::after {
	background-color: rgba(var(--theme-primary-color));
}

.custom-switch input:checked ~ label::after {
	-webkit-transform: translateX(16px);
	transform: translateX(16px);
}


/* On Hover */


/* On Focus */


/* On Pressed */


/* On Disabled */

.custom-switch input:checked:disabled ~ label::after {
	background-color: rgba(var(--theme-surface-color),var(--disabled-opacity)); /* TODO */
}

/* Thumb Indicator */

.custom-switch label::before {
	content: ""; 
	border-radius: 50%;
	display: block;
	margin-top: -0.875rem; /* (($font-size-base * $line-height-base - $selection-control-indicator-size) / 2 + $selection-control-indicator-size / -2); */
	margin-left: -0.75rem; /* ($selection-control-indicator-size / -2); */
	position: absolute;
	top: 14px; /* top: (($font-size-base * $line-height-base - $selection-control-indicator-size) / 2); */
	left: 0;
	width: 48px; /* ($selection-control-indicator-size * 2); */
	height: 48px;
	transition-duration: 0.3s;
	transition-property: background-color,-webkit-transform;
	transition-property: background-color,transform;
	transition-property: background-color,transform,-webkit-transform;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
}

/* States */

/* Off */

.custom-switch label::before,
.custom-switch label::before {
	background-color: transparent;
}

/* Off Hover */

.custom-switch input.hover ~ label::before,
.custom-switch input:hover ~ label::before {
	background: rgba(var(--contrast),var(--hover-opacity));
}

/* Off Focus */

.custom-switch input.focus ~ label::before,
.custom-switch input:focus ~ label::before {
	background: rgba(var(--contrast),var(--focus-opacity));
}

/* Off Pressed */

.custom-switch input.pressed ~ label::before {
	background: rgba(var(--contrast),var(--pressed-opacity));
}

/* Off Disabled */

.custom-switch input.disabled ~ label::before 
.custom-switch input:disabled ~ label::before {
	background-color: transparent !important;
}

/* On */

.custom-switch input:checked ~ label::before {
	background-color: transparent;
	-webkit-transform: translateX(16px);
	transform: translateX(16px);
}

/* On Hover */

.custom-switch input:checked.hover ~ label::before,
.custom-switch input:checked:hover ~ label::before {
	background: var(--checked-hover-overlay);
}

/* On Focus */

.custom-switch input:checked.focus ~ label::before,
.custom-switch input:checked:focus ~ label::before {
	background: var(--checked-focus-overlay);
}

/* On Pressed */

.custom-switch input:checked.pressed ~ label::before {
	background: var(--checked-pressed-overlay);
}

/* On Disabled */

.custom-switch input:checked.disabled ~ label::before 
.custom-switch input:checked:disabled ~ label::before {
	background-color: transparent !important;
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Text fields: Filled text field
-----------------------------------------------------------------------------------------*/

.filled-text-field {
	display: flex;
	flex-direction: column;
	align-items: start;
	border-radius: 4px 4px 0 0;
	margin-top: 0px;border-top: 24px solid yellow;
	margin-bottom: 0;
}

.filled-text-field input:not([type="checkbox"]):not([type="radio"]),
.filled-text-field select,
.filled-text-field textarea {
	border-width: 0 0 1px 0;
	padding: unset;
	padding-right: 16px;
	padding-left: 16px;
	width: 100%;
	min-height: 56px; /* density: 32px 48px 56px */
	caret-color: var(--theme-primary-color);
}

.filled-text-field.floating-label input:not([type="checkbox"]):not([type="radio"]),
.filled-text-field.floating-label select,
.filled-text-field.floating-label textarea {
	padding-top: 20px;
	padding-right: 16px;
	padding-bottom: 6px;
	padding-left: 16px;
}

/* States */

/* Inactive */

.filled-text-field input:not([type="checkbox"]):not([type="radio"]),
.filled-text-field select,
.filled-text-field textarea {
	background: var(--inactive-overlay);
	background: rgba(var(--on-color), 0.12);
	border-color: rgba(0,0,0,0.42); /* todo */
	border-width: 0 0 1px 0;
	color: var(--primary-text-color);
}

/* Hover */

.filled-text-field.is-hovered input:not([type="checkbox"]):not([type="radio"]),
.filled-text-field.is-hovered select,
.filled-text-field.is-hovered textarea,
.filled-text-field input:not([type="checkbox"]):not([type="radio"]).hover,
.filled-text-field select.hover,
.filled-text-field textarea.hover,
.filled-text-field input:not([type="checkbox"]):not([type="radio"]):hover,
.filled-text-field select:hover,
.filled-text-field textarea:hover {
	background: var(--hover-overlay);
	background: rgba(var(--on-color), var(--hover-overlay-opacity));
	border-color: var(--secondary-text-color);
	border-width: 0 0 1px 0;
}

/* Focused */

.filled-text-field.is-focused input:not([type="checkbox"]):not([type="radio"]),
.filled-text-field.is-focused select,
.filled-text-field.is-focused textarea,
.filled-text-field input:not([type="checkbox"]):not([type="radio"]).focus,
.filled-text-field select.focus,
.filled-text-field textarea.focus,
.filled-text-field input:not([type="checkbox"]):not([type="radio"]):focus,
.filled-text-field select:focus,
.filled-text-field textarea:focus {
	background: var(--inactive-overlay);
	background: rgba(var(--on-color), var(--focus-overlay-opacity));
	border-color: rgb(var(--theme-primary-color));
	border-width: 0 0 2px 0;
}

/* Activated */

/*
.filled-text-field.has-value input,
.filled-text-field input.active,
.filled-text-field input:active {
	border-color: var(--primary-text-color);
	border-width: 0 0 1px 0;
}
*/

/* Error */

.filled-text-field.has-error input:not([type="checkbox"]):not([type="radio"]),
.filled-text-field.has-error select,
.filled-text-field.has-error textarea {
	border-color: rgba(var(--theme-error-color));
	border-width: 0 0 2px 0;
}

/* Error Icon */

.filled-text-field.has-error::after {
	font-size: 24px;
	line-height: 56px; /* input min-height / density */
	font-family: Material Icons;
	-webkit-font-feature-settings: "liga";
	font-feature-settings: "liga";
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	text-transform: none;
	white-space: nowrap;
	word-wrap: normal;
	content: "error";
	vertical-align: middle;
	position: absolute;
	top: 0px;
	right: 10px;
	bottom: 0px;
	z-index: 3;
	color: rgba(var(--theme-error-color));
	height: 100%;
}

/* Pressed */

.filled-text-field input:not([type="checkbox"]):not([type="radio"]).waves-effect .waves-ripple,
.filled-text-field select.waves-effect .waves-ripple,
.filled-text-field textarea.waves-effect .waves-ripple {
	background: var(--inactive-overlay);
}

/* Disabled */

.filled-text-field.disabled input:not([type="checkbox"]):not([type="radio"]),
.filled-text-field.disabled select,
.filled-text-field.disabled textarea,
.filled-text-field input:not([type="checkbox"]):not([type="radio"]).disabled,
.filled-text-field select.disabled,
.filled-text-field textarea.disabled,
.filled-text-field input:not([type="checkbox"]):not([type="radio"]):disabled,
.filled-text-field select:disabled,
.filled-text-field textarea:disabled {
	background: var(--inactive-overlay);
	border-color: transparent; 
	border-width: 0 0 1px 0;
	color: var(--tertiary-text-color);
	cursor: default;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
}

/* Placeholder text */

.filled-text-field.floating-label input::-webkit-input-placeholder {
	color: transparent;
}

.filled-text-field.floating-label input:-ms-input-placeholder {
	color: transparent;
}

.filled-text-field.floating-label input::placeholder {
	color: transparent;
}

.filled-text-field.floating-label.is-focused input::-webkit-input-placeholder,
.filled-text-field.floating-label input:focus::-webkit-input-placeholder {
	color: var(--secondary-text-color);
}

.filled-text-field.floating-label.is-focused input:-ms-input-placeholder,
.filled-text-field.floating-label input:focus:-ms-input-placeholder {
	color: var(--secondary-text-color);
}

.filled-text-field.floating-label.is-focused input::placeholder,
.filled-text-field.floating-label input:focus::placeholder {
	color: var(--secondary-text-color);
}

/* Label */

.filled-text-field.floating-label label {
	position: absolute;
	left: 16px;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	transition-duration: 0.180s;
	transition-property: color,top,-webkit-transform;
	transition-property: color,top,transform;
	transition-property: color,top,transform,-webkit-transform;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
	background-color: transparent;
	pointer-events: none;
}

/* States */

/* Inactive */

.filled-text-field.floating-label label {
	top: 14px; /* height 48px */
	top: 18px; /* height 56px */
	color: var(--secondary-text-color);
}

/* Focused */

.filled-text-field.floating-label.is-focused label {
	top: 8px;
	transform: scale(0.75);
	z-index: 1;
	color: var(--secondary-text-color);
}

/* Activated */

.filled-text-field.floating-label.has-value label {
	top: 8px;
	transform: scale(0.75);
	z-index: 1;
	color: var(--secondary-text-color);
}

/* Error */

.filled-text-field.floating-label.has-error label {
	top: 8px;
	transform: scale(0.75);
	z-index: 1;
	color: rgba(var(--theme-error-color));
}

/*-----------------------------------------------------------------------------------------
## COMPONENTS X.X Text fields: Outlined text field
-----------------------------------------------------------------------------------------*/

.outlined-text-field { /* todo form p margin */
	display: flex;
	flex-direction: column;
	align-items: start;
	margin-top: 0px;border-top: 24px solid yellow;
	margin-bottom: 0;
}

.outlined-text-field input:not([type="checkbox"]):not([type="radio"]),
.outlined-text-field select,
.outlined-text-field textarea {
	display: block;
	padding-top: 12px;
	padding-bottom: 14px;
	padding-right: 15px;
	padding-left: 15px;
	background-color: transparent;
	border: unset;
	border-radius: 4px !important;
	box-sizing: border-box;
	width: 100%;
	min-height: 56px; /* density: 32px 48px 56px */
	z-index: 1;
	-webkit-appearance: none; /* remove inset-shadow on safari */
	appearance: none;
}

/* States: Outlined text field (baseline) */

/* Inactive */

.outlined-text-field input:not([type="checkbox"]):not([type="radio"]),
.outlined-text-field select,
.outlined-text-field textarea {
	box-shadow: inset 0 0 0 1px var(--quaternary-text-color);
}

/* Hover */

.outlined-text-field.is-hovered input:not([type="checkbox"]):not([type="radio"]),
.outlined-text-field.is-hovered select,
.outlined-text-field.is-hovered textarea,
.outlined-text-field input:not([type="checkbox"]):not([type="radio"]).hover,
.outlined-text-field select.hover,
.outlined-text-field textarea.hover,
.outlined-text-field input:not([type="checkbox"]):not([type="radio"]):hover,
.outlined-text-field select:hover,
.outlined-text-field textarea:hover {
	box-shadow: inset 0 0 0 1px var(--tertiary-text-color);
}

/* Activated */

/*
.outlined-text-field.has-value input,
.outlined-text-field.has-value input,
.outlined-text-field input.active,
.outlined-text-field input:active {
	box-shadow: inset 0 0 0 1px var(--secondary-text-color);
}
*/

/* Focused */

.outlined-text-field.is-focused input:not([type="checkbox"]):not([type="radio"]),
.outlined-text-field.is-focused select,
.outlined-text-field.is-focused textarea,
.outlined-text-field input:not([type="checkbox"]):not([type="radio"]).focus,
.outlined-text-field select.focus,
.outlined-text-field textarea.focus,
.outlined-text-field input:not([type="checkbox"]):not([type="radio"]):focus,
.outlined-text-field select:focus,
.outlined-text-field textarea:focus {
	box-shadow: inset 0 0 0 2px rgba(var(--theme-primary-color));
}

/* Error */

.outlined-text-field.has-error input:not([type="checkbox"]):not([type="radio"]),
.outlined-text-field.has-error select,
.outlined-text-field.has-error textarea {
	box-shadow: inset 0 0 0 2px rgba(var(--theme-error-color));
}

/* Error Icon */

.outlined-text-field.has-error::after {
	font-size: 24px;
	line-height: 56px; /* input min-height / density */
	font-family: Material Icons;
	-webkit-font-feature-settings: "liga";
	font-feature-settings: "liga";
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	text-transform: none;
	white-space: nowrap;
	word-wrap: normal;
	content: "error";
	vertical-align: middle;
	position: absolute;
	top: 0;
	right: 10px;
	bottom: 0;
	z-index: 3;
	color: rgba(var(--theme-error-color));
	height: 100%;
}

/* Disabled */

.outlined-text-field.disabled input:not([type="checkbox"]):not([type="radio"]),
.outlined-text-field.disabled select,
.outlined-text-field.disabled textarea,
.outlined-text-field input:not([type="checkbox"]):not([type="radio"]).disabled,
.outlined-text-field select.disabled,
.outlined-text-field textarea.disabled,
.outlined-text-field input:not([type="checkbox"]):not([type="radio"]):disabled,
.outlined-text-field select:disabled,
.outlined-text-field textarea:disabled {
	box-shadow: inset 0 0 0 1px var(--quaternary-text-color);
	color: var(--tertiary-text-color); /* todo disabled-text-color */
	cursor: default;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
}

/* PLACEHOLDER TEXT */

/* Unfocused Placeholder text */

/* Applying style *just* to placeholder */
input::placeholder { color: blue !important; }

/* Applying style to input when placeholder is shown */
input:placeholder-shown { color: yellow !important; }

.outlined-text-field.floating-label input::-moz-placeholder {
	color: var(--secondary-text-color);
}

.outlined-text-field.floating-label input::-webkit-input-placeholder {
	color: var(--secondary-text-color);
}

.outlined-text-field.floating-label input:-ms-input-placeholder {
	color: var(--secondary-text-color);
}

.outlined-text-field.floating-label input::placeholder {
	color: var(--secondary-text-color);
}

/* Focused Placeholder text */

.outlined-text-field.floating-label.is-focused input::-moz-placeholder,
.outlined-text-field.floating-label input:focus::-moz-placeholder {
	opacity: 1;
	z-index: 1;
}

.outlined-text-field.floating-label.is-focused input::-webkit-input-placeholder,
.outlined-text-field.floating-label input:focus::-webkit-input-placeholder {
	opacity: 1;
	z-index: 1;
}

.outlined-text-field.floating-label.is-focused input:-ms-input-placeholder,
.outlined-text-field.floating-label input:focus:-ms-input-placeholder {
	opacity: 1;
		z-index: 1;
}

.outlined-text-field.floating-label.is-focused input::placeholder,
.outlined-text-field.floating-label input:focus::placeholder {
	opacity: 1;
		z-index: 1;
}

/* Label */

.outlined-text-field label {
	position: absolute;
	left: 12px;
	padding-right: 4px;
	padding-left: 4px;
	background: rgb(var(--theme-surface-color));
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	transition-duration: 0.180s;
	transition-property: color,top,-webkit-transform;
	transition-property: color,top,transform;
	transition-property: color,top,transform,-webkit-transform;
	transition-timing-function: cubic-bezier(0.4,0,0.2,1);
	z-index: 2;
	pointer-events: none;
}

/* States */

/* Inactive */

.outlined-text-field.floating-label label {
	top: 15px;
	color: var(--secondary-text-color);
}

/* Hover */

/* Focused */

.outlined-text-field.floating-label.is-focused label {
	top: -9px;
	transform: scale(0.75);
	color: var(--secondary-text-color);
}

/* Activated */

.outlined-text-field.floating-label.has-value label {
	top: -9px;
	transform: scale(0.75);
	color: var(--secondary-text-color);
}

/* Error */

.outlined-text-field.floating-label.has-error label {
	top: -9px;
	transform: scale(0.75);
	color: rgba(var(--theme-error-color));
}

/* Disabled */

.outlined-text-field.floating-label.disabled label {
	color: transparent;
}


















/*--------------------------------------------------------------
# 5.43.X <nav> Navdrawer (Permanent clipped)
--------------------------------------------------------------*/

@media (min-width: 1280px) {

	.has-permanent-clipped-sidenav-1280 {
		padding-left: var(--sidenav-width);
	}

	.sheet.permanent-clipped-sidenav-1280 {
		border-right: 1px solid var(--quaternary-text-color);
		margin-top: var(--app-bar-height, 64px);

		border-right: 1px solid var(--quaternary-text-color);
		z-index: 1;
		overflow-y: hidden;
	}

	.sheet.permanent-clipped-sidenav-1280 .content {
		position: absolute;
		top: 0;
		right: auto;
		bottom: 0;
		left: 0;

		box-shadow: none !important;
		transform: translateX( 0px ) !important;
		transition-duration: 0s;
	}

	.sheet.permanent-clipped-sidenav-1280 .sidenav-header {
		display: none;
	}

}

/*--------------------------------------------------------------
# 5.43.X <nav> Navdrawer (Permanent full-height)
--------------------------------------------------------------*/

@media (min-width: 1280px) {

	.has-permanent-full-height-sidenav-1280 {
		padding-left: var(--sidenav-width);
	}

	.sheet.permanent-full-height-sidenav-1280 {
		border-right: 1px solid var(--quaternary-text-color);
		z-index: 1;
	}

	.sheet.permanent-full-height-sidenav-1280 .content {
		box-shadow: none !important;
	}

}

/*--------------------------------------------------------------
# 5.43.X <nav> Navdrawer (Persistent clipped)
--------------------------------------------------------------*/

@media (min-width: 1280px) {

	.sheet.persistent-clipped-sidenav-1280 {
		border-right: 1px solid var(--quaternary-text-color);
		margin-top: var(--app-bar-height, 56px);

		z-index: 1;
		overflow: hidden;
	}

	.sheet.persistent-clipped-sidenav-1280 .content {
		/*
		position: absolute;
		top: 0;
		right: auto;
		bottom: 0;
		left: 0;
		*/
		box-shadow: none;
		border-right: 1px solid var(--quaternary-text-color);
	}

	.sheet.persistent-clipped-sidenav-1280 .sidenav-header {
		display: none;
	}

	.sheet.persistent-clipped-sidenav-1280 {
		transform: translateX( -100% );
		transition-duration: 0.225s; /* PERSISTENT OUT */
		transition-timing-function: linear; /* PERSISTENT OUT */
		transition-property: transform;
	}

	.sheet.persistent-clipped-sidenav-1280.show {
		transform: translateX( 0px );
		transition-duration: 0.225s; /* PERSISTENT IN */
		transition-timing-function: linear; /* PERSISTENT IN */
		transition-property: transform;
	}

}

/*--------------------------------------------------------------
# 5.43.X <nav> Navigation (Modal)
--------------------------------------------------------------*/

.sheet[class*="modal-navdrawer"] {

	/*
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	*/
	z-index: 160;
	overflow-y: auto;
	background-color: var(--backdrop-background-color, rgba(0,0,0,0.32));
}

.sheet[class*="modal-navdrawer"] .content {
	/*
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	position: absolute;
	top: 0;
	right: auto;
	bottom: auto;
	left: 0;
	*/
	min-height: 100%;
}

/* States */

/* Closed */

.sheet[class*="modal-navdrawer"] .content {
	transform: translateX(-100%);
	transition-duration: 0.225s; /* PERSISTENT OUT */
	transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1); /* PERSISTENT OUT */
	transition-property: transform;
}

/* Open */

.sheet[class*="modal-navdrawer"].show .content {
	transform: translateX(0px);
	transition-duration: 0.225s; /* PERSISTENT IN */
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1); /* PERSISTENT IN */
	transition-property: transform;
}


/*--------------------------------------------------------------
# COMPONENTS: Navdrawer
--------------------------------------------------------------*/
/*
ul.navdrawer {
	display: flex; 
	flex-direction: column; 
	width: calc( 100% + 16px + 16px );
	margin-right: -16px;
	margin-left: -16px;
}

.navdrawer li a {
	font-family: var(--subtitle-1-font-family);
	font-size: var(--subtitle-1-font-size);
	font-style: var(--subtitle-1-font-style);
	font-weight: 500;
	letter-spacing: var(--subtitle-1-letter-spacing);
	line-height: var(--subtitle-1-line-height);
	text-align: left;
	text-transform: none;
	display: inline-flex;
	align-items: center;
	width: calc( 100% - 16px );
	height: 40px;
	margin-top: 4px;
	margin-right: 8px;
	margin-left: 8px;
	margin-bottom: 4px;
	padding-right: 8px;
	padding-left: 8px;
	border-radius: 4px;
}
*/

.navdrawer li a {
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
}

/* States */

/* Link */

.navdrawer li a {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--primary-text-color);
}

/* Hover */

.navdrawer li a:hover,
.navdrawer li a.hover {

	color: var(--primary-text-color);
}

/* Focus */

.navdrawer li a:focus,
.navdrawer li a.focus {

	color: var(--primary-text-color);
}

/* Activated */

.navdrawer li > a.selected,
.navdrawer li.current-menu-item > a {
	background-color: rgba(var(--theme-primary-color),var(--activated-opacity)); /* Activated overlay opacity */
	color: rgba(var(--theme-primary-color),1.00);
}

/* Pressed */

.navdrawer li a.pressed,
.navdrawer li a.waves-effect .waves-ripple {

	color: var(--primary-text-color);
}

/* Navdrawer Destination icons */

.navdrawer li a i.material-icons {
	margin-right: 16px;
}

/* States */

/* Link */

.navdrawer li a i.material-icons {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color)
}

/* Hover */

.navdrawer li a:hover i.material-icons,
.navdrawer li a.hover i.material-icons {
	color: var(--secondary-text-color);
}

/* Focus */

.navdrawer li a:focus i.material-icons,
.navdrawer li a.focus i.material-icons {
	color: var(--secondary-text-color);
}

/* Activated */

.navdrawer li > a.selected i.material-icons,
.navdrawer li.current-menu-item > a i.material-icons {
	color: rgba(var(--theme-primary-color),1.00); /* Activated icon opacity */
}

/* Pressed */

.navdrawer li a.pressed i.material-icons,
.navdrawer li a.waves-effect .waves-ripple i.material-icons {
	color: var(--secondary-text-color);
}

/* Navdrawer Submenu indicator */

.navdrawer li[class*="has-child"] > a::after { /* .has-child / .menu-item-has-children */
	font-size: 1.714286em;
	line-height: .583333em;
	vertical-align: -0.302198em;
	font-family: Material Icons;
	-webkit-font-feature-settings: "liga";
	font-feature-settings: "liga";
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	text-transform: none;
	white-space: nowrap;
	word-wrap: normal;
	display: inline-block;
	margin-right: -0.2em;
	margin-left: 0.2em;
	vertical-align: top;
	position: absolute;
	right: calc( 4px + 16px );
}

/* States */

/* Closed */

.navdrawer li[class*="has-child"] > a::after { /* .has-child / .menu-item-has-children */
	color: var(--secondary-text-color);
	content: "expand_more";
}

/* Open */

.navdrawer li[class*="has-child"].active > a::after { /* .has-child / .menu-item-has-children */
	content: "expand_less";
}

/* Activated */

.navdrawer li[class*="has-child"].current-menu-item > a::after { /* .has-child / .menu-item-has-children */
	color: rgba(var(--theme-primary-color),1.00);
}

/* Navdrawer Submenu */

ul.navdrawer ul {
	padding-top: unset;
	padding-bottom: unset;
	padding-left: 1em;
}

/*--------------------------------------------------------------
## 2.36.X input[type="search"] Expandable search
--------------------------------------------------------------*/

.sheet[class*="expandable-search"] {
	position: absolute; /* demo */
	bottom: auto;
	min-height: var(--app-bar-height, 56px);
}

.sheet[class*="expandable-search"] .content {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction: row;

	position: absolute; /* demo */
	top: 0;
	right: 0;
	bottom: auto;
	left: 0;

	padding-top: unset;
	padding-right: 4px;
	padding-bottom: unset;
	padding-left: 4px;

	width: 100%;
	max-width: calc( 100% );
	height: var(--app-bar-height, 56px);

	box-shadow: var(--shadow-0);
	z-index: 41;
}

@media only screen and (min-width: 600px) {
	.sheet[class*="expandable-search"] .content {
		padding-right: 12px;
		padding-left: 12px;
	}
}

.sheet[class*="expandable-search"] .content {
	opacity: 0;
	transition-duration: 0.225s; /* PERSISTENT OUT */
	transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1); /* PERSISTENT OUT */
	transition-property: opacity;
}

.sheet[class*="expandable-search"].show .content {
	opacity: 1;
	transition-duration: 0.225s; /* PERSISTENT IN */
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1); /* PERSISTENT IN */
	transition-property: opacity;
}

.sheet[class*="expandable-search"] input[type="search"] {
	font-family: var(--headline-6-font-family);
	font-size: var(--headline-6-font-size);
	font-style: var(--headline-6-font-style);
	font-weight: var(--headline-6-font-weight);
	line-height: var(--headline-6-line-height);
	text-align: var(--headline-6-text-align);
	letter-spacing: var(--headline-6-letter-spacing);
	text-transform: var(--headline-6-text-transform);

	border: unset;
	margin: unset;
	padding: unset;
	width: 100%;
}

.expandable-search {
	position: relative;
	display: flex;
	align-items: center;
	background: yellow;
	min-height: 56px; /* components height */
}

.expandable-search form {
	margin-left: 8px;
	width: calc( 100% - 48px - 8px );
}









/*--------------------------------------------------------------
## 5.41.X <main> persistent-clipped-sidenav
--------------------------------------------------------------*/

.sheet.persistent-clipped-sidenav:not(.show) ~ .main {
	margin-left: 0;
	transition-duration: 0.225s; /* PERSISTENT OUT */
	transition-timing-function: linear; /* PERSISTENT OUT */
	transition-property: margin-left;
}

.sheet.persistent-clipped-sidenav.show ~ .main {
	margin-left: var(--sidenav-width);
	transition-duration: 0.225s; /* PERSISTENT IN */
	transition-timing-function: linear; /* PERSISTENT IN */
	transition-property: margin-left;
}

/*--------------------------------------------------------------
## 5.41.X <main> has-persistent-clipped-side-sheet
--------------------------------------------------------------*/

.has-persistent-clipped-side-sheet .main {
	margin-right: 0;
	transition-duration: 0.225s; /* PERSISTENT OUT */
	transition-timing-function: linear; /* PERSISTENT OUT */
	transition-property: margin-right;
}

[class*="open-persistent-clipped-side-sheet"] .has-persistent-clipped-side-sheet .main {
	margin-right: var(--side-sheet-width, 400px);
	transition-duration: 0.225s; /* PERSISTENT IN */
	transition-timing-function: linear; /* PERSISTENT IN */
	transition-property: transform;
	transition-property: margin-right;
}










/*--------------------------------------------------------------
# COMPONENTS: Bottom navigation drawer (Mobile only)
--------------------------------------------------------------*/

	.sheet[class*="bottom-navigation-drawer"] {
		display: none;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 160;
		overflow-y: hidden;
		background-color: var(--backdrop-background-color, rgba(0,0,0,0.32));
	}

	.sheet[class*="bottom-navigation-drawer"] .content {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		flex-direction: column;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		padding: 0;
		width: 100% !important;
		overflow-y: hidden !important;
		max-width: calc( 100% ) !important;
		box-shadow: var(--shadow-16);
	}

	.sheet[class*="bottom-navigation-drawer"] .content .navdrawer {
		overflow-y: auto;
	}

	/* States */

	/* Closed */

	.sheet[class*="bottom-navigation-drawer"] .content {
		transform: translate3d(0,100%,0);
		transition-duration: 0.225s; /* PERSISTENT OUT */
		transition-timing-function: cubic-bezier(0.4,0,0.6,1); /* PERSISTENT OUT */
		transition-property: transform;
	}

	/* Open */

	.sheet[class*="bottom-navigation-drawer"].show .content {
		transform: translate3d(0,0,0);
		transition-duration: 0.225s; /* PERSISTENT IN */
		transition-timing-function: cubic-bezier(0,0,0.2,1); /* PERSISTENT IN */
		transition-property: transform;
	}

	.sheet[class*="bottom-navigation-drawer"] .content .navdrawer-header {
		display: none;
	}

	.sheet[class*="bottom-navigation-drawer"] .content .bottom-navigation-drawer-header {
		position: sticky;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		flex-shrink: 0;
		height: var(--app-bar-height);
		padding-right: 4px;
		padding-left: 4px;
		border-bottom: 1px solid var(--quaternary-text-color);
	}

@media (max-width: 599px) and (orientation: portrait) {
	.bottom-navigation-drawer {
		
	}
}

/* A bottom drawer opens to full-screen mode on mobile in a landscape orientation. */

	/* States */

	/* Closed */

	/* Open */

	.sheet[class*="modal-navdrawer"][class*="bottom-navigation-drawer"] .content .navdrawer-header {
		display: none !important;
	}













/*--------------------------------------------------------------
# WIDGETS
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget archive
--------------------------------------------------------------*/

.widget_archive ul {
	display: flex;
	flex-direction: column;
	list-style: none;
	border: 1px solid red;
}

.widget_archive ul li a {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
}

/* States */

.widget_archive ul li a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

.widget_archive ul li a {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color);
}

/* Hover */

.widget_archive ul li a:hover {
	background-color: var(--hover-overlay);
	color: var(--primary-text-color);
}

/* Focus */

.widget_archive ul li a:focus {
	background-color: var(--focus-overlay);
	color: var(--primary-text-color);
}

/* Selected */

.widget_archive ul li.current-menu-item > a {
	background-color: var(--selected-overlay);
	color: var(--primary-text-color);
}

/* Activated */

.widget_archive ul li a:active {
	background-color: var(--activated-overlay);
	color: var(--primary-text-color);
}

/* Pressed */

.widget_archive ul li a.waves-effect .waves-ripple {
	background-color: var(--pressed-overlay);
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# Widget calendar
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget categories
--------------------------------------------------------------*/

.widget_categories ul {
	display: flex;
	flex-direction: column;
	list-style: none;
	border: 1px solid red;
}

.widget_categories ul li a {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
}

/* States */

.widget_categories ul li a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

.widget_categories ul li a {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color);
}

/* Hover */

.widget_categories ul li a:hover {
	background-color: var(--hover-overlay);
	color: var(--primary-text-color);
}

/* Focus */

.widget_categories ul li a:focus {
	background-color: var(--focus-overlay);
	color: var(--primary-text-color);
}

/* Selected */

.widget_categories ul li.current-menu-item > a {
	background-color: var(--selected-overlay);
	color: var(--primary-text-color);
}

/* Activated */

.widget_categories ul li a:active {
	background-color: var(--activated-overlay);
	color: var(--primary-text-color);
}

/* Pressed */

.widget_categories ul li a.waves-effect .waves-ripple {
	background-color: var(--pressed-overlay);
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# Widget custom_html
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget links
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget media_audio
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget media_audio
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget media_image
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget media_video
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget meta
--------------------------------------------------------------*/

.widget_meta ul {
	display: flex;
	flex-direction: column;
	list-style: none;
	border: 1px solid red;
}

.widget_meta ul li a {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
}

/* States */

.widget_meta ul li a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

.widget_meta ul li a {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color);
}

/* Hover */

.widget_meta ul li a:hover {
	background-color: var(--hover-overlay);
	color: var(--primary-text-color);
}

/* Focus */

.widget_meta ul li a:focus {
	background-color: var(--focus-overlay);
	color: var(--primary-text-color);
}

/* Selected */

.widget_meta ul li.current-menu-item > a {
	background-color: var(--selected-overlay);
	color: var(--primary-text-color);
}

/* Activated */

.widget_meta ul li a:active {
	background-color: var(--activated-overlay);
	color: var(--primary-text-color);
}

/* Pressed */

.widget_meta ul li a.waves-effect .waves-ripple {
	background-color: var(--pressed-overlay);
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# Widget nav_menu
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget pages
--------------------------------------------------------------*/

.widget_pages ul {
	display: flex;
	flex-direction: column;
	list-style: none;
	border: 1px solid red;
}

.widget_pages ul li a {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
}

/* States */

.widget_pages ul li a {
	-webkit-transition: all 150ms linear;
	-ms-transition: all 150ms linear;
	transition: all 150ms linear;
}

/* Link */

.widget_pages ul li a {
	background-color: transparent; /* Remove the gray background on active links in IE 10. */
	color: var(--secondary-text-color);
}

/* Hover */

.widget_pages ul li a:hover {
	background-color: var(--hover-overlay);
	color: var(--primary-text-color);
}

/* Focus */

.widget_pages ul li a:focus {
	background-color: var(--focus-overlay);
	color: var(--primary-text-color);
}

/* Selected */

.widget_pages ul li.current-menu-item > a {
	background-color: var(--selected-overlay);
	color: var(--primary-text-color);
}

/* Activated */

.widget_pages ul li a:active {
	background-color: var(--activated-overlay);
	color: var(--primary-text-color);
}

/* Pressed */

.widget_pages ul li a.waves-effect .waves-ripple {
	background-color: var(--pressed-overlay);
	color: var(--primary-text-color);
}

/*--------------------------------------------------------------
# Widget recent-comments
--------------------------------------------------------------*/

.widget_recent_comments ul {
	display: flex;
	flex-direction: column;
	list-style: none;
	border: 1px solid red;
}

.widget_recent_comments ul li {
	display: flex;
	align-content: center;
	align-items: center;
	min-height: 32px;
}

/*--------------------------------------------------------------
# Widget recent-posts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget rss
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget search
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Widget tag_cloud
--------------------------------------------------------------*/

.widget_tag_cloud {
	margin-top: 1em !important;
	margin-bottom: calc( 1em - 8px ) !important;
	border: 1px solid red;
}

/*--------------------------------------------------------------
# Widget text
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Shortcode [audio]
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Shortcode [caption]
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Shortcode [embed]
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Shortcode [gallery] / Post-Format: Gallery
--------------------------------------------------------------*/

.gallery {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 24px;
	row-gap: 24px;
}

.gallery-columns-1 { /* optional */
	grid-template-columns: repeat(1, 1fr);
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 { /* optional */
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 { /* optional */
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 { /* optional */
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 { /* optional */
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 { /* optional */
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 { /* optional */
	grid-template-columns: repeat(9, 1fr);
}

.gallery img {
	width: 100%;
	border: 1px solid white;
	background: #f2f2f2;
}

.gallery img:hover {
	border: 1px solid red;
	background: white;
}

/*
.gallery-columns-2 .attachment-medium {
	max-width: 92%;
	height: auto;
}

.gallery-columns-4 .attachment-thumbnail {
	max-width: 84%;
	height: auto;
}
*/

.gallery figcaption.gallery-caption {

}

.gallery dl,
.gallery dt {
	margin: 0;
}

.gallery br + br {
	display: none;
}

/*--------------------------------------------------------------
# Shortcode [playlist]
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Shortcode [video]
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# 0.0 RESET block-libary
--------------------------------------------------------------*/

a.tag-cloud-link {
	margin: 0 8px 8px 0 !important;
	display: inline-flex;
	line-height: 1.2;
}

li.wp-social-link {
	display: block;
	width: auto; /* block-libary: width: 36px; */
	height: auto; /* block-libary: height: 36px; */
	border-radius: 48px; /* block-libary: border-radius: 36px; */
	margin-right: 8px;
	transition: transform .1s ease;
}

.wp-block-social-links.is-style-pill-shape .wp-social-link {
    width: 64px; /* block-libary: width: auto; */
	height: 32px; /* block-libary: height: 36px; */
}

.wp-block-social-links.is-style-pill-shape .wp-social-link a {
	width: 64px; /* block-libary: width: auto; */
	height: 32px; /* block-libary: height: 36px; */
	padding-left: unset; /* block-libary: padding-left: 16px; */
	padding-right: unset; /* block-libary: padding-right: 16px; */
}

.wp-social-link a {
	width: 48px;
	height: 48px;
	border-radius: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wp-social-link:hover {
	transform: none; /* block-libary: transform: scale(1.1); */
}

.wp-block-social-links.is-style-logos-only .wp-social-link {
	padding: unset; /* block-libary: padding: 4px; */
}

.wp-block-media-text .wp-block-media-text__content {
	padding: 0 8%; /* block-libary: padding: 0 8%; */
}


p  {
background-color: transparent;
}


.wp-block-cover, 
.wp-block-cover-image {
    min-height: var(--app-bar-height);
	max-height: 256px;
}

header .wp-block-cover, 
header .wp-block-cover-image {
    min-height: 256px;
}



































/* Navdrawer Submenu indicator */

[data-toggle="collapse"]::after { /* .has-child / .menu-item-has-children */
	font-family: Material Icons;
	-webkit-font-feature-settings: "liga";
	font-feature-settings: "liga";
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	font-weight: 400;
	letter-spacing: normal;
	text-rendering: optimizeLegibility;
	text-transform: none;
	white-space: nowrap;
	word-wrap: normal;

	border: 1px dotted #CCC;
}

/* States */

/* Closed */

[data-toggle="collapse"]::after { /* .has-child / .menu-item-has-children */
	color: var(--primary-text-color);
	content: "expand_more";
}

/* Open */

[data-toggle="collapse"][aria-expanded="true"]::after { /* .has-child / .menu-item-has-children */
	content: "expand_less";
}