@font-face
{
	font-family: "Arvo";
	src: url("index.woff2") format("woff2");
}
@-webkit-keyframes fade
{
	from
	{
		opacity: 0;
	}
	to
	{
		opacity: 1;
	}
}
@keyframes fade
{
	from
	{
		opacity: 0;
	}
	to
	{
		opacity: 1;
	}
}
*
{
	box-sizing: border-box;
	margin: 0;
}
:root
{
	--accent-text: #ff9933;
	--navigation-background: #ff9933;
	--navigation-text: #ffffff;
	--separator-end: #ffffff00;
	--separator-middle: #ffffff80;
	--shadow: #808080;
}
@media (prefers-color-scheme: light)
{
	:root
	{
		--dim-background: #00000080;
		--main-background: #ffffff;
		--main-text: #555555;
	}
}
@media (prefers-color-scheme: dark)
{
	:root
	{
		--dim-background: #ffffff80;
		--main-background: #000000;
		--main-text: #aaaaaa;
	}
}
body, .container li li::marker
{
	color: var(--main-text);
}
body, #alert
{
	background-color: var(--main-background);
}
body
{
	accent-color: var(--accent-text);
	font-family: "Arvo", serif;
	font-size: 1.13rem;
	font-style: italic;
}
.hash, #dropdown, .hash:not(#home):target ~ #container-home, #products:not(:target) ~ #container-products, #contacts:not(:target) ~ #container-contacts, #vague:not(:target) ~ #container-vague, #dim:not(.active), #alert-close:not(.active)
{
	display: none;
}
label[for="dropdown"], #navigation, .container, .container input[type="button"], #alert, #alert-ok, #copyright
{
	box-shadow: 0 0 0.19rem 0 var(--shadow);
}
label[for="dropdown"], #navigation, .container textarea, #alert, #copyright
{
	border-radius: 0.75rem;
}
label[for="dropdown"], #navigation, #copyright
{
	background-color: var(--navigation-background);
	margin: 0.5rem;
}
label[for="dropdown"], .tab, .container h1, .container input[type="checkbox"], #alert, #copyright
{
	text-align: center;
}
label[for="dropdown"], .tab, #copyright
{
	color: var(--navigation-text);
	padding: 1rem;
}
label[for="dropdown"], #tab-home, #products:target ~ #navigation #tab-products, #contacts:target ~ #navigation #tab-contacts, .container b, .container strong, #alert-text strong
{
	font-weight: bold;
}
@media (orientation: portrait)
{
	label[for="dropdown"]
	{
		display: block;
	}
}
@media (orientation: landscape)
{
	label[for="dropdown"]
	{
		display: none;
	}
}
label[for="dropdown"]::before, .tab
{
	display: block;
}
@media (orientation: portrait)
{
	label[for="dropdown"]::before, #navigation
	{
		position: absolute;
	}
	#dropdown:checked ~ label[for="dropdown"]::before
	{
		content: "\25b2";
	}
	#dropdown:not(:checked) ~ label[for="dropdown"]::before
	{
		content: "\25bc";
	}
}
#navigation, #dim
{
	-webkit-animation: fade 250ms ease-in;
	animation: fade 250ms ease-in;
}
@media (orientation: portrait)
{
	#navigation
	{
		flex-direction: column;
		margin: 0 0.5rem 0.5rem 0.5rem;
		width: calc(100% - 1rem);
		z-index: 1;
	}
	#navigation:checked
	{
		display: flex;
	}
	#dropdown:not(:checked) ~ #navigation
	{
		display: none;
	}
}
@media (orientation: landscape)
{
	#navigation
	{
		display: flex;
		flex-direction: row;
	}
}
.tab, .link
{
	text-decoration: none;
}
.tab
{
	flex-grow: 1;
}
.tab:not(:last-child)
{
	border-image-slice: 1;
	border-style: solid;
}
@media (orientation: portrait)
{
	.tab:not(:last-child)
	{
		border-image-source: linear-gradient(to right, var(--separator-end), var(--separator-middle), var(--separator-end));
		border-width: 0 0 0.13rem 0;
	}
}
@media (orientation: landscape)
{
	.tab:not(:last-child)
	{
		border-image-source: linear-gradient(to bottom, var(--separator-end), var(--separator-middle), var(--separator-end));
		border-width: 0 0.13rem 0 0;
	}
}
.hash:not(#home):target ~ #navigation #tab-home, .container h1
{
	font-weight: normal;
}
.container, #alert
{
	border-radius: 1.13rem;
	margin: 1rem auto 1rem auto;
	padding: 1.5rem;
}
.container
{
	-webkit-animation: fade 500ms ease-in;
	animation: fade 500ms ease-in;
	position: relative;
}
@media (orientation: portrait)
{
	.container
	{
		width: 83%;
	}
}
@media (orientation: landscape)
{
	.container
	{
		width: 75%;
	}
}
.container h1
{
	font-size: 1.25rem;
}
.container b, .container strong, .container li::marker, .container input[type="button"], .container input[type="checkbox"], #alert-text strong, #alert-ok
{
	color: var(--accent-text);
}
.container p
{
	text-indent: 1rem;
}
.container ul
{
	list-style: disc;
	padding-left: 1rem;
}
.link, .container input[type="text"], .container textarea
{
	color: inherit;
}
.container label, .container input[type="checkbox"], .container input[type="checkbox"]::after
{
	display: inline-block;
}
.container label
{
	margin: 0 0 0.25rem 0.5rem;
}
.container input[type="text"], .container input[type="button"], .container textarea, #dim, #alert-ok
{
	width: 100%;
}
.container input[type="text"], .container input[type="button"], .container textarea, .container input[type="checkbox"], #alert-ok
{
	background-color: inherit;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
}
.container input[type="text"], .container input[type="button"], .container textarea, #alert-ok
{
	border-width: 0;
	font-style: inherit;
	padding: 0.5rem;
}
.container input[type="text"], .container input[type="button"], #alert-ok
{
	border-radius: 0.5rem;
}
.container input[type="text"], .container textarea, .container input[type="checkbox"]::after
{
	box-shadow: 0 0 0.19rem 0 var(--shadow) inset;
}
.submit:disabled
{
	cursor: wait;
}
.container textarea
{
	field-sizing: content;
	min-height: 14.88rem;
	resize: none;
}
.container input[type="checkbox"], .container input[type="checkbox"]::after
{
	height: 1.5rem;
	width: 1.5rem;
}
.container input[type="checkbox"]
{
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	font-style: normal;
}
.container input[type="checkbox"]::after
{
	border-radius: 0.38rem;
	line-height: 1.5rem;
}
.container input[type="checkbox"]:not(:checked)::after
{
	content: "\00a0";
}
.container input[type="checkbox"]:checked::after
{
	content: "\2714";
}
.watermark
{
	bottom: 1.5rem;
	opacity: 0.33;
	position: absolute;
	right: 1.5rem;
	z-index: -1;
}
@media (orientation: portrait)
{
	.watermark
	{
		max-height: 20%;
		max-width: 33.33%;
	}
}
@media (orientation: landscape)
{
	.watermark
	{
		max-height: 33.33%;
		max-width: 20%;
	}
}
#dim, #alert
{
	position: fixed;
}
#dim
{
	align-items: center;
	background-color: var(--dim-background);
	height: 100%;
	justify-content: center;
	left: 0;
	top: 0;
	z-index: 2;
}
#dim.active
{
	display: flex;
}
@media (orientation: portrait)
{
	#alert
	{
		width: 67%;
	}
}
@media (orientation: landscape)
{
	#alert
	{
		width: 50%;
	}
}