:root {
--color-1: rgb(0,0,0);
--color-a-1-1: rgba(0,0,0,0.2);
--color-a-1-2: rgba(0,0,0,0.3);
--color-a-1-3: rgba(0,0,0,0.8);
--color-a-1-4: rgba(0,0,0,0.1);
--color-a-1-5: rgba(0,0,0,0.5);

--color-2: rgb(255,255,255);
--color-a-2-1: rgba(255,255,255,0.9);
--color-a-2-2: rgba(255,255,255,0.8);
--color-a-2-3: rgba(255,255,255,0.6);
--color-a-2-4: rgba(255,255,255,0.3);
--color-a-2-5: rgba(255,255,255,0.7);

--color-3: rgb(200,0,0);

--color-4: rgb(15,65,60);
--color-a-4-1: rgba(15,65,60,0.5);

--color-5: rgb(130,190,65);
--color-a-5-1: rgba(130,190,65,0.8);
--color-6: rgb(120,180,55);
--color-7: rgb(100,160,35);

--color-8: rgb(244,241,237);
--color-9: rgb(130,190,65);
--color-10: rgb(210,220,200);
--color-11: rgb(100,100,100);


--tone-1: var(--color-1);
--tone-2: var(--color-2);
--tone-3: var(--color-4);
--tone-4: var(--color-9);
--tone-5: var(--color-8);
--tone-6: var(--color-10);
--tone-7: var(--color-3);
--tone-8: var(--color-1);


--font-family-1: "Open Sans", sans-serif;
--font-family-2: "Source Serif 4", serif;
--min-width: 320px;
--transition-duration: 0.3s;
--transition-timing: ease;


--font-s: 18px;
--font-low-s: 14px;
--h1-font-s: 72px;
--h2-font-s: 48px;
--h3-font-s: 38px;
--h4-font-s: 30px;
--h5-font-s: 24px;
--h6-font-s: 22px;

--text-margin: 20px;

--icon-width: 30px;
}

@media (min-width: 1500px){
:root {
--cont-width: 1450px;

--space-main: 130px;
--space-big: 80px;
--space-mid: 50px;
--space-low: 30px;

--font-size: var(--font-s);
--font-low-size: var(--font-low-s);
--h1-font-size: var(--h1-font-s);
--h2-font-size: var(--h2-font-s);
--h3-font-size: var(--h3-font-s);
--h4-font-size: var(--h4-font-s);
--h5-font-size: var(--h5-font-s);
--h6-font-size: var(--h6-font-s);

--text-p-align: left;
--text-h-align: left;
--text-li-align: left;

--margin-add: 100px;

--social-icon-width: 30px;

--address-icon-width: 25px;

--main-ratio: 1;
}
}

@media (min-width: 1200px) and (max-width: 1499px){
:root {
--cont-width: 1160px;

--space-main: 120px;
--space-big: 70px;
--space-mid: 45px;
--space-low: 25px;

--font-size: calc(var(--font-s) - 0px);
--font-low-size: var(--font-low-s);
--h1-font-size: calc(var(--h1-font-s) - 6px);
--h2-font-size: calc(var(--h2-font-s) - 5px);
--h3-font-size: calc(var(--h3-font-s) - 2px);
--h4-font-size: calc(var(--h4-font-s) - 2px);
--h5-font-size: calc(var(--h5-font-s) - 1px);
--h6-font-size: calc(var(--h6-font-s) - 1px);

--text-p-align: left;
--text-h-align: left;
--text-li-align: left;

--margin-add: 0px;

--social-icon-width: 30px;

--address-icon-width: 25px;

--main-ratio: 1.1;
}
}

@media (min-width: 992px) and (max-width: 1199px){
:root {
--cont-width: 950px;

--space-main: 110px;
--space-big: 60px;
--space-mid: 40px;
--space-low: 20px;

--font-size: calc(var(--font-s) - 1px);
--font-low-size: calc(var(--font-low-s) - 1px);
--h1-font-size: calc(var(--h1-font-s) - 12px);
--h2-font-size: calc(var(--h2-font-s) - 8px);
--h3-font-size: calc(var(--h3-font-s) - 4px);
--h4-font-size: calc(var(--h4-font-s) - 3px);
--h5-font-size: calc(var(--h5-font-s) - 2px);
--h6-font-size: calc(var(--h6-font-s) - 2px);

--text-p-align: left;
--text-h-align: left;
--text-li-align: left;

--margin-add: 0px;

--social-icon-width: 25px;

--address-icon-width: 23px;

--main-ratio: 1.2;
}
}

@media (min-width: 768px) and (max-width: 991px){
:root {
--cont-width: 730px;

--space-main: 100px;
--space-big: 50px;
--space-mid: 35px;
--space-low: 15px;

--font-size: calc(var(--font-s) - 1px);
--font-low-size: calc(var(--font-low-s) - 1px);
--h1-font-size: calc(var(--h1-font-s) - 18px);
--h2-font-size: calc(var(--h2-font-s) - 12px);
--h3-font-size: calc(var(--h3-font-s) - 6px);
--h4-font-size: calc(var(--h4-font-s) - 5px);
--h5-font-size: calc(var(--h5-font-s) - 4px);
--h6-font-size: calc(var(--h6-font-s) - 2px);

--text-p-align: center;
--text-h-align: center;
--text-li-align: left;

--margin-add: 0px;

--social-icon-width: 25px;

--address-icon-width: 23px;

--main-ratio: 1.3;
}
}

@media (min-width: 576px) and (max-width: 767px){
:root {
--cont-width: 550px;

--space-main: 90px;
--space-big: 45px;
--space-mid: 30px;
--space-low: 10px;

--font-size: calc(var(--font-s) - 2px);
--font-low-size: calc(var(--font-low-s) - 1px);
--h1-font-size: calc(var(--h1-font-s) - 24px);
--h2-font-size: calc(var(--h2-font-s) - 16px);
--h3-font-size: calc(var(--h3-font-s) - 8px);
--h4-font-size: calc(var(--h4-font-s) - 6px);
--h5-font-size: calc(var(--h5-font-s) - 5px);
--h6-font-size: calc(var(--h6-font-s) - 3px);

--text-p-align: center;
--text-h-align: center;
--text-li-align: left;

--margin-add: 0px;

--social-icon-width: 25px;

--address-icon-width: 23px;

--main-ratio: 1.4;
}
}

@media (max-width: 575px){
:root {
--cont-width: 95%;
--cont-margin: 2.5%;

--space-main: 80px;
--space-big: 40px;
--space-mid: 25px;
--space-low: 10px;

--font-size: calc(var(--font-s) - 2px);
--font-low-size: calc(var(--font-low-s) - 1px);
--h1-font-size: calc(var(--h1-font-s) - 30px);
--h2-font-size: calc(var(--h2-font-s) - 20px);
--h3-font-size: calc(var(--h3-font-s) - 10px);
--h4-font-size: calc(var(--h4-font-s) - 8px);
--h5-font-size: calc(var(--h5-font-s) - 6px);
--h6-font-size: calc(var(--h6-font-s) - 4px);

--text-p-align: center;
--text-h-align: center;
--text-li-align: center;

--margin-add: 0px;

--social-icon-width: 25px;

--address-icon-width: 22px;

--main-ratio: 1.5;
}
}



@media (min-width: 576px){
:root {
--cont-margin: calc(50% - (var(--cont-width) / 2));
}
}



* {
	padding: 0;
	margin: 0;
	outline: 0;
	border: 0;
	box-sizing: border-box;
	word-wrap: normal;
}
*:last-child {
	margin-bottom: 0;
}
*:first-child {
	margin-top: 0;
}
body {
	background-color: var(--color-8);
	color: var(--color-4);
	font-family: var(--font-family-1);
	font-size: var(--font-size);
	font-weight: 400;
	font-style: normal;
	line-height: 0;
	min-width: var(--min-width);
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	scroll-behavior: smooth;
}
a {
	color: var(--color-4);
	font-weight: 500;
	text-decoration: none;
	transition: all var(--transition-duration) var(--transition-timing) 0s;
	cursor: pointer;
}
a:hover {
	color: var(--color-3);
	text-decoration: none;
}
.font-1, [font="1"] {
	font-family: var(--font-family-1);
}
.font-2, [font="2"] {
	font-family: var(--font-family-2);
}
b, strong {
	font-weight: 700;
}
.f-w-100, *[f-w="100"] {
	font-weight: 100;
}
.f-w-200, *[f-w="200"] {
	font-weight: 200;
}
.f-w-300, *[f-w="300"] {
	font-weight: 300;
}
.f-w-400, *[f-w="400"] {
	font-weight: 400;
}
.f-w-500, *[f-w="500"] {
	font-weight: 500;
}
.f-w-600, *[f-w="600"] {
	font-weight: 600;
}
.f-w-700, *[f-w="700"] {
	font-weight: 700;
}
.f-w-800, *[f-w="800"] {
	font-weight: 800;
}
.f-w-900, *[f-w="900"] {
	font-weight: 900;
}
.f-w-1000, *[f-w="1000"] {
	font-weight: 1000;
}
img {
	line-height: 0;
	border: 0;
	max-width: 100%;
}
svg {
	line-height: 0;
	border: 0;
}
button {
	cursor: pointer;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
input:-webkit-autofill, 
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
	transition: background-color 86400s step-end 0s;
	border: none;
}


p {
	text-align: var(--text-p-align);
	line-height: 1.5em;
	margin-bottom: calc(var(--text-margin) / var(--main-ratio));
}
p.m-3, p[m-3] {
	margin-bottom: calc((var(--text-margin) / 3) / var(--main-ratio));
}


h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-family-1);
	line-height: 1.4em;
	margin-bottom: calc(var(--text-margin) / var(--main-ratio));
	font-weight: 400;
	text-align: var(--text-h-align);
}
h1.m-3, h1[m-3], h2.m-3, h2[m-3], h3.m-3, h3[m-3], h4.m-3, h4[m-3], h5.m-3, h5[m-3], h6.m-3, h6[m-3] {
	margin-bottom: calc((var(--text-margin) / 3) / var(--main-ratio));
}
h1 {
	font-size: var(--h1-font-size);
	font-weight: 400;
}
h2 {
	font-size: var(--h2-font-size);
	font-weight: 400;
}
h3 {
	font-size: var(--h3-font-size);
	font-weight: 400;
}
h4 {
	font-size: var(--h4-font-size);
	font-weight: 400;
}
h5 {
	font-size: var(--h5-font-size);
	font-weight: 400;
}
h6 {
	font-size: var(--h6-font-size);
	font-weight: 400;
}


span[class*="tlo"], span[tlo] {
	padding: 0.3em 0.5em 0.3em 0.5em;
}


hr {
	height: 1px;
	margin: calc((var(--text-margin) *1.5) / var(--main-ratio)) 0 calc((var(--text-margin) *1.5) / var(--main-ratio)) 0;
	background-color: var(--color-4);
	padding: 0 !important;
}
hr.kolor-1, hr[kolor="1"] {
	background-color: var(--tone-1);
}
hr.kolor-2, hr[kolor="2"] {
	background-color: var(--tone-2);
}
hr.kolor-3, hr[kolor="3"] {
	background-color: var(--tone-3);
}
hr.kolor-4, hr[kolor="4"] {
	background-color: var(--tone-4);
}
hr.kolor-5, hr[kolor="5"] {
	background-color: var(--tone-5);
}
hr.kolor-6, hr[kolor="6"] {
	background-color: var(--tone-6);
}
hr.kolor-7, hr[kolor="7"] {
	background-color: var(--tone-7);
}
hr.kolor-8, hr[kolor="8"] {
	background-color: var(--tone-8);
}


ul, ol {
	line-height: 1.5em;
	margin-bottom: 0.7em;
	counter-reset: count 0;
	list-style-position: outside;
	margin-left: 2em;
}
ul {
	list-style-type: disc;
}
ul > li::marker {
	content: '\25CF    ';
}
ol {
	list-style-type: decimal;
}
ol > li::marker {
	content: counter(count, decimal) '.   ';
}
ul > ul, ul > ol, ol > ol, ol > ul, li > ul, li > ol {
	font-size: calc(var(--font-size) - 1px);
	margin-left: 1.5em;
	margin-top: 0.7em;
}
ul.kropka, ol.kropka, ul[kropka], ol[kropka] {
	list-style-type: disc;
}
ul.kropka > li::marker, ol.kropka > li::marker, [kropka] > li::marker, ol[kropka] > li::marker {
	content: '\25CF    ';
}
ul.dysk, ol.dysk, ul[dysk], ol[dysk] {
	list-style-type: circle;
}
ul.dysk > li::marker, ol.dysk > li::marker, [dysk] > li::marker, ol[dysk] > li::marker {
	content: '\25CB    ';
}
ul.cyfra, ol.cyfra, ul[cyfra], ol[cyfra] {
	list-style-type: decimal;
}
ul.cyfra > li::marker, ol.cyfra > li::marker, [cyfra] > li::marker, ol[cyfra] > li::marker {
	content: counter(count, decimal) '.   ';
}
ul.litera, ol.litera, ul[litera], ol[litera] {
	list-style-type: lower-alpha;
}
ul.litera > li::marker, ol.litera > li::marker, [litera] > li::marker, ol[litera] > li::marker {
	content: counter(count, lower-alpha) ')   ';
}
ul.rzym, ol.rzym, ul[rzym], ol[rzym] {
	list-style-type: upper-roman;
}
ul.rzym > li::marker, ol.rzym > li::marker, [rzym] > li::marker, ol[rzym] > li::marker {
	content: counter(count, upper-roman) '   ';
}
ul.h1 > li::marker, ol.h1 > li::marker {
	font-size: var(--h1-font-size);
	font-weight: 900;
}
ul.h2 > li::marker, ol.h2 > li::marker {
	font-size: var(--h2-font-size);
	font-weight: 900;
}
ul.h3 > li::marker, ol.h3 > li::marker {
	font-size: var(--h3-font-size);
	font-weight: 800;
}
ul.h4 > li::marker, ol.h4 > li::marker {
	font-size: var(--h4-font-size);
	font-weight: 700;
}
ul.h5 > li::marker, ol.h5 > li::marker {
	font-size: var(--h5-font-size);
	font-weight: 700;
}
ul.h6 > li::marker, ol.h6 > li::marker {
	font-size: var(--h6-font-size);
	font-weight: 700;
}
li {
	text-align: var(--text-li-align);
	counter-increment: count 1;
	margin-bottom: 1em;
}
li::marker {
	font-size: calc(var(--font-size) + 2px);
	color: var(--color-4);
	font-weight: 800;
}
ul > ul > li::marker, ul > ol > li::marker, ol > ol > li::marker, ol > ul > li::marker, li > ul > li::marker, li > ol > li::marker {
	font-size: calc(var(--font-size) + 1px);
	color: var(--color-9);
	font-weight: 700;
}
*.marker-1, *[marker="1"] > li::marker {
	color: var(--tone-1);
}
*.marker-2, *[marker="2"] > li::marker {
	color: var(--tone-2);
}
*.marker-3, *[marker="3"] > li::marker {
	color: var(--tone-3);
}
*.marker-4, *[marker="4"] > li::marker {
	color: var(--tone-4);
}
*.marker-5, *[marker="5"] > li::marker {
	color: var(--tone-5);
}
*.marker-6, *[marker="6"] > li::marker {
	color: var(--tone-6);
}
*.marker-7, *[marker="7"] > li::marker {
	color: var(--tone-7);
}
*.marker-8, *[marker="8"] > li::marker {
	color: var(--tone-8);
}

@media (max-width: 575px){
ul, ol {
	list-style-position: inside;
	margin-left: 0;
}
}

ul.check, ol.check {
	list-style: none;
	margin-left: 0;
}
ul.check > li::marker, ol.check > li::marker {
	content: none !important;
}
ul.check > li, ol.check > li {
	padding-left: 2.5em;
	position: relative;
}
ul.check > li::before, ol.check > li::before {
	content: '';
	width: 1.5em;
	height: 1.5em;
	display: inline-block;
	background-image: var(--ul-icon-check);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	position: absolute;
	left: 0px;
	top: 0.2em;
}


table {
	border-collapse: collapse;
	table-layout: fixed;
	width: auto;
	text-align: left;
	background-color: transparent;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}
table td {
	line-height: 1.2em;
	padding: 0.75em 2em 0.75em 0;
	border-bottom: solid 1px var(--color-4);
	vertical-align: baseline;
}
table tr:first-child:not([tlo]):not([class*="tlo"]) > td {
	padding-top: 0;
}
table td:last-child {
	padding-right: 0;
}
table tr[tlo] > td, table tr[class*="tlo"] > td {
	border-bottom: none;
	font-weight: 600;
}
table:has([tlo]) tr > td, table:has([class*="tlo"]) tr > td {
	padding: 0.75em 1em 0.75em 1em;
}
*.kolor-1 > td, *[kolor="1"] > td {
	color: var(--tone-1);
}
*.kolor-2 > td, *[kolor="2"] > td {
	color: var(--tone-2);
}
*.kolor-3 > td, *[kolor="3"] > td {
	color: var(--tone-3);
}
*.kolor-4 > td, *[kolor="4"] > td {
	color: var(--tone-4);
}
*.kolor-5 > td, *[kolor="5"] > td {
	color: var(--tone-5);
}
*.kolor-6 > td, *[kolor="6"] > td {
	color: var(--tone-6);
}
*.kolor-7 > td, *[kolor="7"] > td {
	color: var(--tone-7);
}
*.kolor-8 > td, *[kolor="8"] > td {
	color: var(--tone-8);
}
*.tlo-1 > td, *[tlo="1"] > td {
	background-color: var(--tone-1);
}
*.tlo-2 > td, *[tlo="2"] > td {
	background-color: var(--tone-2);
}
*.tlo-3 > td, *[tlo="3"] > td {
	background-color: var(--tone-3);
}
*.tlo-4 > td, *[tlo="4"] > td {
	background-color: var(--tone-4);
}
*.tlo-5 > td, *[tlo="5"] > td {
	background-color: var(--tone-5);
}
*.tlo-6 > td, *[tlo="6"] > td {
	background-color: var(--tone-6);
}
*.tlo-7 > td, *[tlo="7"] > td {
	background-color: var(--tone-7);
}
*.tlo-8 > td, *[tlo="8"] > td {
	background-color: var(--tone-8);
}



*.kolor-1, *[kolor="1"], *.kolor-aktyw-1:hover, *[kolor-aktyw="1"]:hover {
	color: var(--tone-1);
}
*.kolor-2, *[kolor="2"], *.kolor-aktyw-2:hover, *[kolor-aktyw="2"]:hover {
	color: var(--tone-2);
}
*.kolor-3, *[kolor="3"], *.kolor-aktyw-3:hover, *[kolor-aktyw="3"]:hover {
	color: var(--tone-3);
}
*.kolor-4, *[kolor="4"], *.kolor-aktyw-4:hover, *[kolor-aktyw="4"]:hover {
	color: var(--tone-4);
}
*.kolor-5, *[kolor="5"], *.kolor-aktyw-5:hover, *[kolor-aktyw="5"]:hover {
	color: var(--tone-5);
}
*.kolor-6, *[kolor="6"], *.kolor-aktyw-6:hover, *[kolor-aktyw="6"]:hover {
	color: var(--tone-6);
}
*.kolor-7, *[kolor="7"], *.kolor-aktyw-7:hover, *[kolor-aktyw="7"]:hover {
	color: var(--tone-7);
}
*.kolor-8, *[kolor="8"], *.kolor-aktyw-8:hover, *[kolor-aktyw="8"]:hover {
	color: var(--tone-8);
}
*.tlo-1, *[tlo="1"], *.tlo-aktyw-1:hover, *[tlo-aktyw="1"]:hover {
	background-color: var(--tone-1);
	padding: 2em;
}
*.tlo-2, *[tlo="2"], *.tlo-aktyw-2:hover, *[tlo-aktyw="2"]:hover  {
	background-color: var(--tone-2);
	padding: 2em;
}
*.tlo-3, *[tlo="3"], *.tlo-aktyw-3:hover, *[tlo-aktyw="3"]:hover  {
	background-color: var(--tone-3);
	padding: 2em;
}
*.tlo-4, *[tlo="4"], *.tlo-aktyw-4:hover, *[tlo-aktyw="4"]:hover  {
	background-color: var(--tone-4);
	padding: 2em;
}
*.tlo-5, *[tlo="5"], *.tlo-aktyw-5:hover, *[tlo-aktyw="5"]:hover  {
	background-color: var(--tone-5);
	padding: 2em;
}
*.tlo-6, *[tlo="6"], *.tlo-aktyw-6:hover, *[tlo-aktyw="6"]:hover  {
	background-color: var(--tone-6);
	padding: 2em;
}
*.tlo-7, *[tlo="7"], *.tlo-aktyw-7:hover, *[tlo-aktyw="7"]:hover  {
	background-color: var(--tone-7);
	padding: 2em;
}
*.tlo-8, *[tlo="8"], *.tlo-aktyw-8:hover, *[tlo-aktyw="8"]:hover  {
	background-color: var(--tone-8);
	padding: 2em;
}


.text-low, *[text-low] {
	font-size: var(--font-low-size);
}


.container {
	margin-left: var(--cont-margin);
	margin-right: var(--cont-margin);
	width: var(--cont-width);
}
.margin-add {
	margin: 0 var(--margin-add) 0 var(--margin-add);
}
.m-b-main {
	margin-bottom: var(--space-main) !important;
}
.m-b-big {
	margin-bottom: var(--space-big) !important;
}
.m-b-mid {
	margin-bottom: var(--space-mid) !important;
}
.m-b-low {
	margin-bottom: var(--space-low) !important;
}
.m-t-main {
	margin-top: var(--space-main) !important;
}
.m-t-big {
	margin-top: var(--space-big) !important;
}
.m-t-mid {
	margin-top: var(--space-mid) !important;
}
.m-t-low {
	margin-top: var(--space-low) !important;
}
.p-b-main {
	padding-bottom: var(--space-main) !important;
}
.p-b-big {
	padding-bottom: var(--space-big) !important;
}
.p-b-mid {
	padding-bottom: var(--space-mid) !important;
}
.p-b-low {
	padding-bottom: var(--space-low) !important;
}
.p-t-main {
	padding-top: var(--space-main) !important;
}
.p-t-big {
	padding-top: var(--space-big) !important;
}
.p-t-mid {
	padding-top: var(--space-mid) !important;
}
.p-t-low {
	padding-top: var(--space-low) !important;
}
.align-l, .lewo, *[lewo] {
	text-align: left !important;
}
.align-c, .centrum, *[centrum] {
	text-align: center !important;
}
.align-r, .prawo, *[prawo] {
	text-align: right !important;
}
.align-j, .lewo-prawo, *[lewo-prawo] {
	text-align: justify;
}
@media (max-width: 575px){
.align-l {
	text-align: center !important;
}
.align-j {
	text-align: center !important;
}
}


.ikonka, [ikonka] {
	display: inline-grid;
	grid-template: auto / calc(var(--icon-width) / var(--main-ratio)) auto;
	place-items: center start;
	justify-content: start;
	column-gap: 1em;
	row-gap: 1em;
}
.ikonka > *, [ikonka] > * {
	margin: 0 !important;
}
.ikonka p:has(img), [ikonka] p:has(img) {
	line-height: 0;
}

.icon-circle {
	display: inline-grid;
	grid-template: calc(100px / var(--main-ratio)) / calc(100px / var(--main-ratio));
	place-items: center center;
	background-color: var(--color-4);
	border-radius: 100%;
}
.icon-circle > img {
	width: 50%;
}


.plakietka, [plakietka] {
	display: inline-block;
	padding: 0.3em;
	border-radius: calc(15px / var(--main-ratio));
}
.plakietka > *, [plakietka] > * {
	margin-bottom: 0;
	text-align: center;
}


.grab1 * {
	cursor: grab !important;
}
.grab2 * {
	cursor: grabbing !important;
}


.zoom {
	overflow: hidden;
}
.zoom > img {
	cursor: zoom-in;
	transition: transform var(--transition-duration) var(--transition-timing) 0s;
}
.zoom > img:hover{
	transform: scale(1.1);
}


.prop-1x1, [prop="1x1"] {
--aspect-ratio: 100%;
}
.prop-2x3, [prop="2x3"] {
--aspect-ratio: 150%;
}
.prop-3x2, [prop="3x2"] {
--aspect-ratio: 66.66667%;
}
.prop-3x4, [prop="3x4"] {
--aspect-ratio: 133.33333%;
}
.prop-4x3, [prop="4x3"] {
--aspect-ratio: 75%;
}
.prop-9x16, [prop="9x16"] {
--aspect-ratio: 177.77778%;
}
.prop-16x9, [prop="16x9"] {
--aspect-ratio: 56.25%;
}

.cursor-pointer, [cursor="pointer"] {
	cursor: pointer;
}
.cursor-text, [cursor="text"] {
	cursor: text;
}
.cursor-default, [cursor="default"] {
	cursor: default;
}

.sign {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	text-align: center;
}
.sign > * {
	line-height: 1.2em;
	cursor: default;
	text-align: center;
}
.sign > p {
	font-size: calc(var(--font-size) - 1px);
	font-style: italic;
}


:root {
--io-transition-duration: 0.5s;
--io-transition-timing: ease;
--io-transition-delay: 0.3s;
--io-scale: 50%;
--io-left: -50%;
--io-right: 50%;
--io-up: -50px;
--io-down: 50px;
--io-blur: 10px;
}
.io-anim {
	transition: transform var(--io-transition-duration) var(--io-transition-timing) var(--io-transition-delay), opacity var(--io-transition-duration) var(--io-transition-timing) var(--io-transition-delay), filter var(--io-transition-duration) var(--io-transition-timing) var(--io-transition-delay);
}
.io-scale {
	transform: scale(var(--io-scale));
	opacity: 0;
}
.io-left {
	transform: translateX(var(--io-left));
	opacity: 0;
}
.io-right {
	transform: translateX(var(--io-right));
	opacity: 0;
}
.io-up {
	transform: translateY(var(--io-up));
	opacity: 0;
}
.io-down {
	transform: translateY(var(--io-down));
	opacity: 0;
}
.io-opacity {
	opacity: 0;
}
.io-blur {
	filter: blur(var(--io-blur));
}
.io-gray {
	filter: grayscale(100%);
}


aside.measurement {
	height: 0px;
	opacity: 0;
	line-height: 0;
	position: relative;
	min-width: var(--min-width);
}
aside.measurement > * {
	line-height: 0;
}

main.main {
	flex-grow: 1;
	background-color: transparent;
	min-width: var(--min-width);
	margin-top: 0;
	display: block;
}