﻿@import url('https://fonts.googleapis.com/css?family=Open+Sans');

a
{
	color: black;
}

body
{
	font-family: 'Open Sans', sans-serif;
	margin: 0;
}

fieldset
{
	border: 1px solid rgb(0, 119, 113);
	border-radius: 8px;
	margin: 8px;
}

input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], select, textarea
{
	border: 1px solid lightgray;
	border-radius: 8px;
	box-sizing: border-box;
	margin: 8px 0;
	outline: none;
	padding: 12px;
	width: 100%;
}

	input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=tel]:focus, input[type=text]:focus, select:focus, textarea:focus
	{
		border-color: rgb(0, 119, 113);
	}

input[type=submit]
{
	border: 1px solid rgb(0, 119, 113);
	background-color: rgb(0, 119, 113);
	border-radius: 8px;
	color: white;
	cursor: pointer;
	outline: none;
	padding: 12px;
	width: 100%;
}

	input[type=submit]:focus
	{
		border-color: black;
	}

	input[type=submit].highlighted
	{
		background-color: yellow;
		border-color: red;
		color: black;
	}

textarea
{
	resize: none;
}

.alternateBackground
{
	background-color: white;
	color: black;
}

	.alternateBackground .left
	{
		float: left;
		width: 25%;
	}

	.alternateBackground .right
	{
		margin-left: 30%;
		width: 70%;
	}

	.alternateBackground:nth-child(even)
	{
		background-color: rgb(240, 240, 240);
	}

		.alternateBackground:nth-child(even) .left
		{
			float: right;
		}

		.alternateBackground:nth-child(even) .right
		{
			margin-left: 0;
			margin-right: 30%;
		}

.alternateBackgroundTransparent
{
	background-color: rgba(255, 255, 255, 0.5);
	color: black;
}

	.alternateBackgroundTransparent:nth-child(even)
	{
		background-color: rgba(192, 192, 192, 0.5);
	}

.border
{
	border: 2px solid;
	margin: 8px;
}

.branch
{
	border: 1px solid rgb(0, 119, 113);
	border-radius: 8px;
	margin: 8px;
}

.branchCaption
{
	margin: 16px;
}

.button
{
	background-color: rgb(0, 119, 113);
	border-radius: 8px;
	color: white;
	cursor: pointer;
	display: block;
	padding: 12px;
	text-align: center;
}

.center
{
	text-align: center;
}

.company a
{
	text-decoration: none;
}

.company #header1
{
	font-size: 3em;
	margin-bottom: 0;
}

.company #header3
{
	font-size: 3em;
	margin-top: 64px;
}

.company #words
{
	margin-top: 16px;
}

	.company #words span
	{
		font-size: 2em;
		margin: 32px;
	}

.content
{
	padding-top: 64px;
}

.download
{
	background-color: lightgray;
	line-height: 32px;
	padding-left: 8px;
	padding-right: 8px;
}

	.download:nth-child(odd)
	{
		background-color: lightsteelblue;
	}

	.download img
	{
		height: 32px;
		padding-left: 16px;
		padding-right: 16px;
		vertical-align: middle;
	}

	.download .description
	{
		display: inline-block;
		width: 540px;
	}

	.download .previous
	{
		cursor: pointer;
	}

		.download .previous img
		{
			height: 16px;
		}

	.download .spacer
	{
		display: inline-block;
		width: 64px;
	}

.download-block
{
	display: none;
}

.download-header
{
	cursor: pointer;
}

.flexContainer
{
	text-align: center;
}

.flexElement
{
	padding: 0 8px;
}

	.flexElement a
	{
		text-decoration: none;
	}

.footer
{
	background-color: black;
	color: white;
	font-size: 0.8em;
	left: 0;
	line-height: 32px;
	position: fixed;
	right: 0;
}

	.footer a
	{
		color: white;
		text-decoration: none;
	}

	.footer img
	{
		vertical-align: middle;
	}

	.footer #designed
	{
		border-top: 1px solid rgb(61, 110, 103);
	}

	.footer .logo
	{
		height: 48px;
	}

.formElement, .inlineElement
{
	padding: 8px;
}

	.formElement a
	{
		color: rgb(0, 119, 113);
		text-decoration: none;
	}

	.inlineElement a
	{
		text-decoration: none;
	}

	.inlineElement span :not(button)
	{
		display: inline-block;
	}

	.inlineElement .action
	{
		float: right;
	}

		.inlineElement .action a
		{
			color: rgb(0, 119, 113);
		}

	.inlineElement:after
	{
		clear: both;
		content: "";
		display: table;
	}

.header
{
	background-color: white;
	height: 64px;
	left: 0;
	line-height: 64px;
	position: fixed;
	right: 0;
	text-align: center;
}

	.header a
	{
		font-size: 1.2em;
		line-height: 63px;
		text-decoration: none;
	}

	.header img
	{
		height: 60px;
		vertical-align: middle;
	}

	.header #flag
	{
		height: 32px;
		padding-bottom: 16px;
		padding-top: 16px;
	}

.highlightedElement
{
	background: yellow;
	border: 3px solid red;
	border-radius: 8px;
}

.justify
{
	text-align: justify;
}

.legendContainer a, .legendContainer span
{
	font-weight: bold;
	margin-left: 16px;
}

.legendContainer a
{
	color: rgb(0, 119, 113);
	text-decoration: none;
}

.legendList
{
	cursor: pointer;
	padding: 0 4px;
}

.sealingElement
{
	border: 1px solid rgb(0, 119, 113);
	border-radius: 8px;
	cursor: grab;
	padding: 8px;
}

.spacedBox
{
	padding: 32px 8px;
}

	.spacedBox h1
	{
		font-weight: normal;
		margin-top: 0;
	}

.sizing
{
	padding: 8px;
}

	.sizing:nth-child(even)
	{
		background-color: rgb(240, 240, 240);
	}

	.sizing a
	{
		color: rgb(0, 119, 113);
		text-decoration: none;
	}

	.sizing img
	{
		vertical-align: middle;
	}

.teamSection img, .teamSection .placeholder
{
	background-color: rgb(208, 208, 208);
	border: 2px solid black;
	height: 200px;
	width: 200px;
}

#contacts a
{
	text-decoration: none;
}

#contacts img
{
	padding-right: 16px;
	vertical-align: middle;
}

#cookiePolicyClose
{
	cursor: pointer;
	height: 32px;
	margin-left: 32px;
}

#fullBody
{
	background-color: rgb(0, 119, 113);
	color: white;
}

#sealingElementBox
{
	max-width: 200px;
}

@media only screen and (min-width:65em)
{
	.background1, .background2
	{
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}

	.background1
	{
		background-image: url('sede.jpg');
	}

	.background2
	{
		background-image: url('home.png');
	}

	.company
	{
		margin-top: 128px;
	}

	.content
	{
		padding-bottom: 160px;
	}

	.flexColumn
	{
		width: 100%;
	}

	.flexContainer
	{
		align-content: stretch;
		display: flex;
	}

	.flexElement
	{
		align-items: center;
		display: flex;
	}

		.flexElement div, .flexElement input, .flexElement label, .flexElement textarea
		{
			margin: 8px;
			width: 100%;
		}

		.flexElement .flexElementValue
		{
			align-items: center;
			display: flex;
			margin: 0;
		}

			.flexElement .flexElementValue div
			{
				margin: 0 8px 0 8px;
				max-width: 75px;
			}

			.flexElement .flexElementValue img
			{
				cursor: pointer;
			}

			.flexElement .flexElementValue input
			{
				margin: 8px 0 8px -8px;
			}

			.flexElement .flexElementValue select
			{
				margin: 0 0 0 8px;
				max-width: 150px;
			}

			.flexElement .flexElementValue .upDown
			{
				margin-left: 8px;
				width: auto;
			}

	.footer
	{
		height: 160px;
		bottom: 0;
	}

		.footer .column2
		{
			float: left;
			width: 50%;
		}

		.footer .column3
		{
			float: left;
			width: 33%;
		}

		.footer .footerBox
		{
			margin: auto;
			overflow: hidden;
			width: 924px;
		}

		.footer #partner
		{
			line-height: 96px;
		}

		.footer #designedBy
		{
			line-height: 64px;
		}

	.header
	{
		z-index: 1;
	}

		.header a
		{
			padding-left: 12px;
			padding-right: 12px;
		}

		.header #hamburger
		{
			display: none;
		}

	.product
	{
		min-height: 400px;
	}

		.product img
		{
			float: right;
			height: 400px;
			margin-left: 16px;
		}

	.productBox
	{
		overflow: hidden;
		width: 924px;
	}

	.products
	{
		float: left;
		margin: 4px;
	}

		.products a
		{
			text-decoration: none;
		}

		.products div
		{
			height: 2.5em;
			text-align: center;
			width: 300px;
		}

		.products img
		{
			height: 200px;
			width: 300px;
		}

	.teamSection
	{
		min-height: 200px;
	}

		.teamSection img, .teamSection .placeholder
		{
			float: left;
			margin-bottom: 16px;
			margin-right: 16px;
		}

	#contactLeft
	{
		float: left;
		padding: 0 16px 16px 0;
		width: 560px;
	}

	#contactRight
	{
		float: right;
		padding-top: 5em;
		width: 384px;
	}

	#contentWithCookiePolicy
	{
		padding-bottom: 192px;
	}

	#fixedBody .content, #fullBody .fixedBox
	{
		margin-left: auto;
		margin-right: auto;
		width: 960px;
	}

	#footerWithCookiePolicy
	{
		height: 192px;
	}
}

@media not screen and (min-width:65em)
{
	.alternateBackground .left, .alternateBackground:nth-child(even) .left
	{
		float: none;
		width: auto;
	}

	.alternateBackground .right, .alternateBackground:nth-child(even) .right
	{
		margin-left: 0;
		margin-right: 0;
		width: auto;
	}

	.branch
	{
		min-height: 128px;
	}

	.company #words span
	{
		display: block;
	}

	.download img
	{
		padding-right: 0;
	}

	.download .description, .download .spacer
	{
		display: inline;
	}

	.flexElement
	{
		margin: 8px 0;
	}

	.footer, .header
	{
		position: absolute;
	}

		.footer .footerBox
		{
			padding: 0 8px;
		}

		.footer #designed span
		{
			display: block;
			margin: 0;
		}

			.footer #designed span span
			{
				display: inline;
			}

		.footer #partner
		{
			line-height: 64px;
		}


		.header #account
		{
			position: absolute;
			right: 92px;
			top: 0;
		}

		.header #flag
		{
			position: absolute;
			right: 60px;
			top: 0;
		}

		.header #hamburger
		{
			cursor: pointer;
			position: absolute;
			right: 0;
			top: 0;
		}

		.header #links
		{
			display: none;
			left: 0;
			position: absolute;
			right: 0;
			top: 64px;
			z-index: 1;
		}

			.header #links a
			{
				background-color: white;
				display: block;
				font-size: 2em;
			}

		.header #logo
		{
			left: 0;
			position: absolute;
			top: 0;
		}

	.product img
	{
		width: 100%;
	}

	.productBlock
	{
		margin: 8px;
	}

	.products
	{
		text-align: center;
	}

		.products div
		{
			margin-bottom: 16px;
		}

		.products img
		{
			width: 95%;
		}

	#contactLeft h1
	{
		margin: 64px 0 -16px 0;
	}

	#footerBox
	{
		margin: 0 8px;
	}
}